New Case Study:See how Anthropic automated 95% of dependency reviews with Socket.Learn More →
@flourish/header
Advanced tools
@flourish/header - npm Package Compare versions
Comparing version 1.0.0-alpha to 1.0.0-alpha2
| (function (global, factory) { | ||
| typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports) : | ||
| typeof define === 'function' && define.amd ? define(['exports'], factory) : | ||
| (factory((global.header = global.header || {}))); | ||
| }(this, (function (exports) { 'use strict'; | ||
| typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() : | ||
| typeof define === 'function' && define.amd ? define(factory) : | ||
| (global.header = factory()); | ||
| }(this, (function () { 'use strict'; | ||
| var state; | ||
| var title_el; | ||
| var subtitle_el; | ||
| var styles_appended = false; | ||
@@ -24,35 +22,10 @@ var DEFAULTS = { | ||
| function initHeader(obj, el) { | ||
| state = obj; | ||
| for (var key in DEFAULTS) { | ||
| if (state[key] === undefined) state[key] = DEFAULTS[key]; | ||
| } | ||
| exports.header_el = document.createElement("div"); | ||
| exports.header_el.className = "flourish-header"; | ||
| title_el = document.createElement("h1"); | ||
| subtitle_el = document.createElement("h2"); | ||
| exports.header_el.appendChild(title_el); | ||
| exports.header_el.appendChild(subtitle_el); | ||
| if (el) el.appendChild(exports.header_el); | ||
| appendStyles(); | ||
| function appendStyles() { | ||
| var css = document.createElement("style"); | ||
| css.type = "text/css"; | ||
| css.innerHTML = ".flourish-header {margin-bottom: 0; } .flourish-header h1, .flourish-header h2 {margin:0; } .flourish-header h1 {font-weight: 700; margin: 0; font-size: 21px; line-height: 24px; } .flourish-header h2 {font-weight: 400; font-size: 18px; line-height: 21px; opacity: 0.75; } @media(min-width: 480px) {.flourish-header h1 {font-size: 24px; line-height: 30px; } .flourish-header h2 {font-size: 21px; line-height: 27px; } }"; | ||
| document.head.appendChild(css); | ||
| } | ||
| function updateHeader() { | ||
| exports.header_el.style.color = state.color; | ||
| exports.header_el.style.padding = updateHeaderMargins(); | ||
| exports.header_el.style.textAlign = state.align; | ||
| title_el.innerHTML = state.title ? state.title : ""; | ||
| subtitle_el.innerHTML = state.subtitle ? state.subtitle : ""; | ||
| title_el.style.padding = !state.title ? 0 : null; | ||
| subtitle_el.style.padding = !state.subtitle ? 0 : null; | ||
| } | ||
| function updateHeaderMargins() { | ||
| function updateHeaderMargins(state) { | ||
| if (!state.title && !state.subtitle) { | ||
@@ -71,19 +44,42 @@ if (state.margin_advanced) return "0 " + state.margin_right + "px 0 " + state.margin_left + "px"; | ||
| function appendStyles() { | ||
| var css = document.createElement("style"); | ||
| css.type = "text/css"; | ||
| css.innerHTML = ".flourish-header {margin-bottom: 0; } .flourish-header h1, .flourish-header h2 {margin:0; } .flourish-header h1 {font-weight: 700; margin: 0; font-size: 21px; line-height: 24px; } .flourish-header h2 {font-weight: 400; font-size: 18px; line-height: 21px; opacity: 0.75; } @media(min-width: 480px) {.flourish-header h1 {font-size: 24px; line-height: 30px; } .flourish-header h2 {font-size: 21px; line-height: 27px; } }"; | ||
| document.head.appendChild(css); | ||
| } | ||
| function init(state) { | ||
| if (!styles_appended) appendStyles(); | ||
| for (var key in DEFAULTS) { | ||
| if (state[key] === undefined) state[key] = DEFAULTS[key]; | ||
| } | ||
| function getHeaderHeight() { | ||
| return exports.header_el.getBoundingClientRect().height; | ||
| var header_el = document.createElement("div"); | ||
| header_el.className = "flourish-header"; | ||
| var title_el = document.createElement("h1"); | ||
| var subtitle_el = document.createElement("h2"); | ||
| header_el.appendChild(title_el); | ||
| header_el.appendChild(subtitle_el); | ||
| var update = function() { | ||
| header_el.style.color = state.color; | ||
| header_el.style.padding = updateHeaderMargins(state); | ||
| header_el.style.textAlign = state.align; | ||
| title_el.innerHTML = state.title ? state.title : ""; | ||
| subtitle_el.innerHTML = state.subtitle ? state.subtitle : ""; | ||
| title_el.style.padding = !state.title ? 0 : null; | ||
| subtitle_el.style.padding = !state.subtitle ? 0 : null; | ||
| }; | ||
| var getHeight = function() { | ||
| return header_el.getBoundingClientRect().height; | ||
| }; | ||
| return { | ||
| update: update, | ||
| getHeight: getHeight, | ||
| element: header_el | ||
| }; | ||
| } | ||
| exports.initHeader = initHeader; | ||
| exports.updateHeader = updateHeader; | ||
| exports.getHeaderHeight = getHeaderHeight; | ||
| return init; | ||
| Object.defineProperty(exports, '__esModule', { value: true }); | ||
| }))); |
| { | ||
| "name": "@flourish/header", | ||
| "version": "1.0.0-alpha", | ||
| "version": "1.0.0-alpha2", | ||
| "description": "Adds header", | ||
@@ -5,0 +5,0 @@ "main": "header.js", |
@@ -1,3 +0,2 @@ | ||
| var state; | ||
| var header_el, title_el, subtitle_el; | ||
| var styles_appended = false; | ||
@@ -17,5 +16,25 @@ var DEFAULTS = { | ||
| function initHeader(obj, el) { | ||
| state = obj; | ||
| function appendStyles() { | ||
| var css = document.createElement("style"); | ||
| css.type = "text/css"; | ||
| css.innerHTML = ".flourish-header {margin-bottom: 0; } .flourish-header h1, .flourish-header h2 {margin:0; } .flourish-header h1 {font-weight: 700; margin: 0; font-size: 21px; line-height: 24px; } .flourish-header h2 {font-weight: 400; font-size: 18px; line-height: 21px; opacity: 0.75; } @media(min-width: 480px) {.flourish-header h1 {font-size: 24px; line-height: 30px; } .flourish-header h2 {font-size: 21px; line-height: 27px; } }"; | ||
| document.head.appendChild(css); | ||
| } | ||
| function updateHeaderMargins(state) { | ||
| if (!state.title && !state.subtitle) { | ||
| if (state.margin_advanced) return "0 " + state.margin_right + "px 0 " + state.margin_left + "px"; | ||
| else return "0 " + state.margin + "px"; | ||
| } | ||
| else if (state.margin_advanced) { | ||
| return state.margin_top + "px " + state.margin_right + "px " + state.margin_bottom + "px " + state.margin_left + "px "; | ||
| } | ||
| else { | ||
| return state.margin + "px"; | ||
| } | ||
| } | ||
| function init(state) { | ||
| if (!styles_appended) appendStyles(); | ||
| for (var key in DEFAULTS) { | ||
@@ -25,7 +44,7 @@ if (state[key] === undefined) state[key] = DEFAULTS[key]; | ||
| header_el = document.createElement("div"); | ||
| var header_el = document.createElement("div"); | ||
| header_el.className = "flourish-header"; | ||
| title_el = document.createElement("h1"); | ||
| subtitle_el = document.createElement("h2"); | ||
| var title_el = document.createElement("h1"); | ||
| var subtitle_el = document.createElement("h2"); | ||
@@ -35,43 +54,26 @@ header_el.appendChild(title_el); | ||
| if (el) el.appendChild(header_el); | ||
| appendStyles(); | ||
| } | ||
| var update = function() { | ||
| header_el.style.color = state.color; | ||
| header_el.style.padding = updateHeaderMargins(state); | ||
| header_el.style.textAlign = state.align; | ||
| function updateHeader() { | ||
| header_el.style.color = state.color; | ||
| header_el.style.padding = updateHeaderMargins(); | ||
| header_el.style.textAlign = state.align; | ||
| title_el.innerHTML = state.title ? state.title : ""; | ||
| subtitle_el.innerHTML = state.subtitle ? state.subtitle : ""; | ||
| title_el.innerHTML = state.title ? state.title : ""; | ||
| subtitle_el.innerHTML = state.subtitle ? state.subtitle : ""; | ||
| title_el.style.padding = !state.title ? 0 : null; | ||
| subtitle_el.style.padding = !state.subtitle ? 0 : null; | ||
| }; | ||
| title_el.style.padding = !state.title ? 0 : null; | ||
| subtitle_el.style.padding = !state.subtitle ? 0 : null; | ||
| } | ||
| var getHeight = function() { | ||
| return header_el.getBoundingClientRect().height; | ||
| }; | ||
| function updateHeaderMargins() { | ||
| if (!state.title && !state.subtitle) { | ||
| if (state.margin_advanced) return "0 " + state.margin_right + "px 0 " + state.margin_left + "px"; | ||
| else return "0 " + state.margin + "px"; | ||
| } | ||
| else if (state.margin_advanced) { | ||
| return state.margin_top + "px " + state.margin_right + "px " + state.margin_bottom + "px " + state.margin_left + "px "; | ||
| } | ||
| else { | ||
| return state.margin + "px"; | ||
| } | ||
| return { | ||
| update: update, | ||
| getHeight: getHeight, | ||
| element: header_el | ||
| }; | ||
| } | ||
| function appendStyles() { | ||
| var css = document.createElement("style"); | ||
| css.type = "text/css"; | ||
| css.innerHTML = ".flourish-header {margin-bottom: 0; } .flourish-header h1, .flourish-header h2 {margin:0; } .flourish-header h1 {font-weight: 700; margin: 0; font-size: 21px; line-height: 24px; } .flourish-header h2 {font-weight: 400; font-size: 18px; line-height: 21px; opacity: 0.75; } @media(min-width: 480px) {.flourish-header h1 {font-size: 24px; line-height: 30px; } .flourish-header h2 {font-size: 21px; line-height: 27px; } }"; | ||
| document.head.appendChild(css); | ||
| } | ||
| function getHeaderHeight() { | ||
| return header_el.getBoundingClientRect().height; | ||
| } | ||
| export { initHeader, updateHeader, getHeaderHeight, header_el }; | ||
| export default init; |
Fixed alerts
New author
Supply chain riskA new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.
Found 1 instance in 1 package
Improved metrics
- Number of medium supply chain risk alerts
- decreased by-100%
0
Worsened metrics
- Total package byte prevSize
- decreased by-2.52%
7350
No dependency changes