Skip to content

Commit

Permalink
v0.9.5
Browse files Browse the repository at this point in the history
  • Loading branch information
@wilsonpage
wilsonpage committed Oct 12, 2015
1 parent c41c725 commit 63d9c3f
Show file tree
Hide file tree
Showing 4 changed files with 5 additions and 5 deletions.
2 changes: 1 addition & 1 deletion bower.json
View file
@@ -1,6 +1,6 @@
{
"name": "gaia-header",
"version": "0.9.4",
"version": "0.9.5",
"homepage": "https://github.com/gaia-components/gaia-header",
"authors": [
"Wilson Page <wilsonpage@me.com>"
Expand Down
2 changes: 1 addition & 1 deletion dist/gaia-header-es5.js
View file
Expand Up @@ -1442,7 +1442,7 @@
}
},

template: "<div class=\"inner\">\n <button class=\"action-button\">\n <content select=\"[l10n-action]\"></content>\n </button>\n <content></content>\n </div>\n\n <style>\n\n :host {\n display: block;\n -moz-user-select: none;\n\n --gaia-header-button-color:\n var(--header-button-color,\n var(--header-color,\n var(--link-color,\n inherit)));\n }\n\n /**\n * [hidden]\n */\n\n :host[hidden] {\n display: none;\n }\n\n /** Reset\n ---------------------------------------------------------*/\n\n ::-moz-focus-inner { border: 0; }\n\n /** Inner\n ---------------------------------------------------------*/\n\n .inner {\n display: flex;\n min-height: 50px;\n -moz-user-select: none;\n\n background:\n var(--header-background,\n var(--background,\n #fff));\n }\n\n /** Action Button\n ---------------------------------------------------------*/\n\n /**\n * 1. Hidden by default\n */\n\n .action-button {\n position: relative;\n\n display: none; /* 1 */\n width: 50px;\n font-size: 30px;\n margin: 0;\n padding: 0;\n border: 0;\n outline: 0;\n\n align-items: center;\n background: none;\n cursor: pointer;\n transition: opacity 200ms 280ms;\n color:\n var(--header-action-button-color,\n var(--header-icon-color,\n var(--gaia-header-button-color)));\n }\n\n /**\n * [action=back]\n * [action=menu]\n * [action=close]\n *\n * 1. For icon vertical-alignment\n */\n\n [action=back] .action-button,\n [action=menu] .action-button,\n [action=close] .action-button {\n display: flex; /* 1 */\n }\n\n /**\n * :active\n */\n\n .action-button:active {\n transition: none;\n opacity: 0.2;\n }\n\n /** Action Button Icon\n ---------------------------------------------------------*/\n\n .action-button:before {\n font-family: 'gaia-icons';\n font-style: normal;\n text-rendering: optimizeLegibility;\n font-weight: 500;\n }\n\n [action=close] .action-button:before { content: 'close' }\n [action=menu] .action-button:before { content: 'menu' }\n\n [action=back]:-moz-dir(ltr) .action-button:before { content: 'back' }\n [action=back]:-moz-dir(rtl) .action-button:before { content: 'forward' }\n\n /** Action Button Icon\n ---------------------------------------------------------*/\n\n /**\n * 1. To enable vertical alignment.\n */\n\n .action-button:before {\n display: block;\n }\n\n /** Action Button Text\n ---------------------------------------------------------*/\n\n /**\n * To provide custom localized content for\n * the action-button, we allow the user\n * to provide an element with the class\n * .l10n-action. This node is then\n * pulled inside the real action-button.\n *\n * Example:\n *\n * <gaia-header action=\"back\">\n * <span l10n-action aria-label=\"Back\">Localized text</span>\n * <h1>title</h1>\n * </gaia-header>\n */\n\n ::content [l10n-action] {\n position: absolute;\n left: 0;\n top: 0;\n width: 100%;\n height: 100%;\n font-size: 0;\n }\n\n /** Title\n ---------------------------------------------------------*/\n\n /**\n * 1. Vertically center text. We can't use flexbox\n * here as it breaks text-overflow ellipsis\n * without an inner div.\n */\n\n ::content h1 {\n flex: 1;\n margin: 0;\n padding: 0;\n overflow: hidden;\n\n white-space: nowrap;\n text-overflow: ellipsis;\n text-align: center;\n line-height: 50px; /* 1 */\n font-weight: 300;\n font-style: italic;\n font-size: 24px;\n\n color:\n var(--header-title-color,\n var(--header-color,\n var(--title-color,\n var(--text-color,\n inherit))));\n }\n\n /**\n * [ignore-dir]\n *\n * When the <gaia-header> component has an [ignore-dir] attribute, header\n * direction is forced to LTR but we still want the <h1> text to be reversed\n * so that strings like '1 selected' become 'selected 1'.\n *\n * When we're happy for <gaia-header> to be fully RTL responsive we won't need\n * these rules anymore, but this depends on all Gaia apps being ready.\n *\n * This should be safe to remove when bug 1179459 lands.\n */\n\n :host[ignore-dir] {\n direction: ltr;\n }\n\n :host[ignore-dir]:-moz-dir(rtl) h1 {\n direction: rtl;\n }\n\n /** Buttons\n ---------------------------------------------------------*/\n\n ::content a,\n ::content button {\n position: relative;\n z-index: 1;\n box-sizing: border-box;\n display: flex;\n width: auto;\n height: auto;\n min-width: 50px;\n margin: 0;\n padding: 0 10px;\n outline: 0;\n border: 0;\n\n font-size: 14px;\n line-height: 1;\n align-items: center;\n justify-content: center;\n text-decoration: none;\n text-align: center;\n background: none;\n border-radius: 0;\n font-style: italic;\n cursor: pointer;\n transition: opacity 200ms 280ms;\n color: var(--gaia-header-button-color);\n }\n\n /**\n * :active\n */\n\n ::content a:active,\n ::content button:active {\n transition: none;\n opacity: 0.2;\n }\n\n /**\n * [hidden]\n */\n\n ::content a[hidden],\n ::content button[hidden] {\n display: none;\n }\n\n /**\n * [disabled]\n */\n\n ::content a[disabled],\n ::content button[disabled] {\n pointer-events: none;\n color: var(--header-disabled-button-color);\n }\n\n /** Icon Buttons\n ---------------------------------------------------------*/\n\n /**\n * Icons are a different color to text\n */\n\n ::content .icon,\n ::content [data-icon] {\n color:\n var(--header-icon-color,\n var(--gaia-header-button-color));\n }\n\n /**\n * If users want their action button\n * to be in the component's light-dom\n * they can add an .action class\n * to make it look like the\n * shadow action button.\n */\n\n ::content .action {\n color:\n var(--header-action-button-color,\n var(--header-icon-color,\n var(--gaia-header-button-color)));\n }\n\n /**\n * [data-icon]:empty\n *\n * Icon buttons with no textContent,\n * should always be 50px.\n *\n * This is to prevent buttons being\n * larger than they should be before\n * icon-font has loaded.\n */\n\n ::content [data-icon]:empty {\n width: 50px;\n }\n\n </style>",
template: "<div class=\"inner\">\n <button class=\"action-button\">\n <content select=\"[l10n-action]\"></content>\n </button>\n <content></content>\n </div>\n\n <style>\n\n :host {\n display: block;\n -moz-user-select: none;\n\n --gaia-header-button-color:\n var(--header-button-color,\n var(--header-color,\n var(--link-color,\n inherit)));\n }\n\n /**\n * [hidden]\n */\n\n :host[hidden] {\n display: none;\n }\n\n /** Reset\n ---------------------------------------------------------*/\n\n ::-moz-focus-inner { border: 0; }\n\n /** Inner\n ---------------------------------------------------------*/\n\n .inner {\n display: flex;\n min-height: 50px;\n -moz-user-select: none;\n\n background:\n var(--header-background,\n var(--background,\n #fff));\n }\n\n /** Action Button\n ---------------------------------------------------------*/\n\n /**\n * 1. Hidden by default\n */\n\n .action-button {\n position: relative;\n\n display: none; /* 1 */\n width: 50px;\n font-size: 30px;\n margin: 0;\n padding: 0;\n border: 0;\n outline: 0;\n\n align-items: center;\n background: none;\n cursor: pointer;\n transition: opacity 200ms 280ms;\n color:\n var(--header-action-button-color,\n var(--header-icon-color,\n var(--gaia-header-button-color)));\n }\n\n /**\n * [action=back]\n * [action=menu]\n * [action=close]\n *\n * 1. For icon vertical-alignment\n */\n\n [action=back] .action-button,\n [action=menu] .action-button,\n [action=close] .action-button {\n display: flex; /* 1 */\n }\n\n /**\n * :active\n */\n\n .action-button:active {\n transition: none;\n opacity: 0.2;\n }\n\n /** Action Button Icon\n ---------------------------------------------------------*/\n\n .action-button:before {\n font-family: 'gaia-icons';\n font-style: normal;\n text-rendering: optimizeLegibility;\n font-weight: 500;\n }\n\n [action=close] .action-button:before { content: 'close' }\n [action=menu] .action-button:before { content: 'menu' }\n\n [action=back]:-moz-dir(ltr) .action-button:before { content: 'left' }\n [action=back]:-moz-dir(rtl) .action-button:before { content: 'right' }\n\n /** Action Button Icon\n ---------------------------------------------------------*/\n\n /**\n * 1. To enable vertical alignment.\n */\n\n .action-button:before {\n display: block;\n }\n\n /** Action Button Text\n ---------------------------------------------------------*/\n\n /**\n * To provide custom localized content for\n * the action-button, we allow the user\n * to provide an element with the class\n * .l10n-action. This node is then\n * pulled inside the real action-button.\n *\n * Example:\n *\n * <gaia-header action=\"back\">\n * <span l10n-action aria-label=\"Back\">Localized text</span>\n * <h1>title</h1>\n * </gaia-header>\n */\n\n ::content [l10n-action] {\n position: absolute;\n left: 0;\n top: 0;\n width: 100%;\n height: 100%;\n font-size: 0;\n }\n\n /** Title\n ---------------------------------------------------------*/\n\n /**\n * 1. Vertically center text. We can't use flexbox\n * here as it breaks text-overflow ellipsis\n * without an inner div.\n */\n\n ::content h1 {\n flex: 1;\n margin: 0;\n padding: 0;\n overflow: hidden;\n\n white-space: nowrap;\n text-overflow: ellipsis;\n text-align: center;\n line-height: 50px; /* 1 */\n font-weight: 300;\n font-style: italic;\n font-size: 24px;\n\n color:\n var(--header-title-color,\n var(--header-color,\n var(--title-color,\n var(--text-color,\n inherit))));\n }\n\n /**\n * [ignore-dir]\n *\n * When the <gaia-header> component has an [ignore-dir] attribute, header\n * direction is forced to LTR but we still want the <h1> text to be reversed\n * so that strings like '1 selected' become 'selected 1'.\n *\n * When we're happy for <gaia-header> to be fully RTL responsive we won't need\n * these rules anymore, but this depends on all Gaia apps being ready.\n *\n * This should be safe to remove when bug 1179459 lands.\n */\n\n :host[ignore-dir] {\n direction: ltr;\n }\n\n :host[ignore-dir]:-moz-dir(rtl) h1 {\n direction: rtl;\n }\n\n /** Buttons\n ---------------------------------------------------------*/\n\n ::content a,\n ::content button {\n position: relative;\n z-index: 1;\n box-sizing: border-box;\n display: flex;\n width: auto;\n height: auto;\n min-width: 50px;\n margin: 0;\n padding: 0 10px;\n outline: 0;\n border: 0;\n\n font-size: 14px;\n line-height: 1;\n align-items: center;\n justify-content: center;\n text-decoration: none;\n text-align: center;\n background: none;\n border-radius: 0;\n font-style: italic;\n cursor: pointer;\n transition: opacity 200ms 280ms;\n color: var(--gaia-header-button-color);\n }\n\n /**\n * :active\n */\n\n ::content a:active,\n ::content button:active {\n transition: none;\n opacity: 0.2;\n }\n\n /**\n * [hidden]\n */\n\n ::content a[hidden],\n ::content button[hidden] {\n display: none;\n }\n\n /**\n * [disabled]\n */\n\n ::content a[disabled],\n ::content button[disabled] {\n pointer-events: none;\n color: var(--header-disabled-button-color);\n }\n\n /** Icon Buttons\n ---------------------------------------------------------*/\n\n /**\n * Icons are a different color to text\n */\n\n ::content .icon,\n ::content [data-icon] {\n color:\n var(--header-icon-color,\n var(--gaia-header-button-color));\n }\n\n /**\n * If users want their action button\n * to be in the component's light-dom\n * they can add an .action class\n * to make it look like the\n * shadow action button.\n */\n\n ::content .action {\n color:\n var(--header-action-button-color,\n var(--header-icon-color,\n var(--gaia-header-button-color)));\n }\n\n /**\n * [data-icon]:empty\n *\n * Icon buttons with no textContent,\n * should always be 50px.\n *\n * This is to prevent buttons being\n * larger than they should be before\n * icon-font has loaded.\n */\n\n ::content [data-icon]:empty {\n width: 50px;\n }\n\n </style>",

// Test hook
nextTick: nextTick
Expand Down
4 changes: 2 additions & 2 deletions dist/gaia-header.js
View file
Expand Up @@ -1418,8 +1418,8 @@ module.exports = component.register('gaia-header', {
[action=close] .action-button:before { content: 'close' }
[action=menu] .action-button:before { content: 'menu' }
[action=back]:-moz-dir(ltr) .action-button:before { content: 'back' }
[action=back]:-moz-dir(rtl) .action-button:before { content: 'forward' }
[action=back]:-moz-dir(ltr) .action-button:before { content: 'left' }
[action=back]:-moz-dir(rtl) .action-button:before { content: 'right' }
/** Action Button Icon
---------------------------------------------------------*/
Expand Down
2 changes: 1 addition & 1 deletion package.json
View file
@@ -1,6 +1,6 @@
{
"name": "gaia-header",
"version": "0.9.4",
"version": "0.9.5",
"homepage": "https://github.com/gaia-components/gaia-header",
"license": "MIT",
"main": "gaia-header.js",
Expand Down

0 comments on commit 63d9c3f

Please sign in to comment.