From 1b10fd4bb5d4f19d037a3765ed6fe4581168e662 Mon Sep 17 00:00:00 2001 From: Wesley Bomar Date: Fri, 16 Dec 2022 20:08:50 -0600 Subject: [PATCH] fix(demo): replace demo-message with c-message Usign @extend is not leriable when it must extend after extending. Example: the irregular linsk were not working. --- dist/components/demo.css | 2 +- dist/core-styles.demo.css | 2 +- dist/elements/demo.css | 2 +- src/lib/_imports/components/demo.css | 20 +++----------------- src/lib/_imports/settings/font/font.hbs | 2 +- 5 files changed, 7 insertions(+), 21 deletions(-) diff --git a/dist/components/demo.css b/dist/components/demo.css index 6ae1993cd..47cb5692b 100644 --- a/dist/components/demo.css +++ b/dist/components/demo.css @@ -1 +1 @@ -/*! @tacc/core-styles 1.0.0+ | MIT | github.com/TACC/Core-Styles */.c-message .c-button--as-link,.c-message a,.x-link,.x-link--irregular{color:var(--global-color-link-on-light--normal);text-decoration:none;text-decoration-thickness:var(--global-border-width--normal);text-underline-offset:.2em}.c-message .c-button--as-link:hover,.c-message a:hover,.x-link--hover,.x-link--irregular--hover{color:var(--global-color-link-on-light--normal);text-decoration-line:underline;text-decoration-style:solid;text-decoration-thickness:var(--global-border-width--normal)}.c-message .c-button--as-link:active,.c-message a:active,.x-link--active,.x-link--irregular--active{text-decoration-line:underline;text-decoration-style:dotted}.c-message .c-button--as-link,.c-message a,.x-link--irregular{text-decoration-line:underline}.c-message .c-button--as-link:hover,.c-message a:hover,.x-link--irregular--hover{text-decoration-style:dashed}.c-message .c-button--as-link:active,.c-message a:active,.x-link--irregular--active{text-decoration-style:dotted}.c-message .c-button--as-link,.c-message a{color:inherit!important}.c-message--scope-inline,.c-message--scope-section{font-size:var(--global-font-size--small)}.c-message--scope-global,.c-message--scope-section,.demo-message{border:var(--global-border--thick);padding:15px 20px}.c-message--scope-global,.demo-message{text-align:center}.c-message--type-info{color:var(--global-color-info--dark)}.c-message--type-success{color:var(--global-color-success--dark)}.c-message--type-warning{color:var(--global-color-warning--dark)}.c-message--type-error{color:var(--global-color-danger--dark)}.c-message--scope-section.c-message--type-info{background-color:var(--global-color-info--x-light);border-color:var(--global-color-info--normal)}.c-message--scope-section.c-message--type-success{background-color:var(--global-color-success--x-light);border-color:var(--global-color-success--normal)}.c-message--scope-section.c-message--type-warning{background-color:var(--global-color-warning--x-light);border-color:var(--global-color-warning--normal)}.c-message--scope-section.c-message--type-error{background-color:var(--global-color-danger--x-light);border-color:var(--global-color-danger--normal)}.c-message--scope-global,.demo-message{background-color:var(--global-color-accent--secondary);border-color:var(--global-color-primary--dark);color:var(--global-color-primary--xx-light)}.demo-grid{display:grid;gap:10px}.demo-grid>figure{margin:unset}.demo-grid--boxes>*{border:var(--global-border--normal);padding:10px;text-align:center}.demo-grid--square{--size:115px;grid-template-columns:repeat(auto-fill,var(--size))}.demo-grid--square:before{content:"";grid-column:1/1;grid-row:1/1;padding-bottom:100%;width:0}.demo-grid--square>:first-child{grid-column:1/1;grid-row:1/1}.demo-message{font-family:var(--global-font-family--sans);position:sticky;top:0} \ No newline at end of file +/*! @tacc/core-styles 1.0.0+ | MIT | github.com/TACC/Core-Styles */.c-message .c-button--as-link,.c-message a,.x-link,.x-link--irregular{color:var(--global-color-link-on-light--normal);text-decoration:none;text-decoration-thickness:var(--global-border-width--normal);text-underline-offset:.2em}.c-message .c-button--as-link:hover,.c-message a:hover,.x-link--hover,.x-link--irregular--hover{color:var(--global-color-link-on-light--normal);text-decoration-line:underline;text-decoration-style:solid;text-decoration-thickness:var(--global-border-width--normal)}.c-message .c-button--as-link:active,.c-message a:active,.x-link--active,.x-link--irregular--active{text-decoration-line:underline;text-decoration-style:dotted}.c-message .c-button--as-link,.c-message a,.x-link--irregular{text-decoration-line:underline}.c-message .c-button--as-link:hover,.c-message a:hover,.x-link--irregular--hover{text-decoration-style:dashed}.c-message .c-button--as-link:active,.c-message a:active,.x-link--irregular--active{text-decoration-style:dotted}.c-message .c-button--as-link,.c-message a{color:inherit!important}.c-message--scope-inline,.c-message--scope-section{font-size:var(--global-font-size--small)}.c-message--scope-global,.c-message--scope-section{border:var(--global-border--thick);padding:15px 20px}.c-message--scope-global{text-align:center}.c-message--type-info{color:var(--global-color-info--dark)}.c-message--type-success{color:var(--global-color-success--dark)}.c-message--type-warning{color:var(--global-color-warning--dark)}.c-message--type-error{color:var(--global-color-danger--dark)}.c-message--scope-section.c-message--type-info{background-color:var(--global-color-info--x-light);border-color:var(--global-color-info--normal)}.c-message--scope-section.c-message--type-success{background-color:var(--global-color-success--x-light);border-color:var(--global-color-success--normal)}.c-message--scope-section.c-message--type-warning{background-color:var(--global-color-warning--x-light);border-color:var(--global-color-warning--normal)}.c-message--scope-section.c-message--type-error{background-color:var(--global-color-danger--x-light);border-color:var(--global-color-danger--normal)}.c-message--scope-global{background-color:var(--global-color-accent--secondary);border-color:var(--global-color-primary--dark);color:var(--global-color-primary--xx-light)}.demo-grid{display:grid;gap:10px}.demo-grid>figure{margin:unset}.demo-grid--boxes>*{border:var(--global-border--normal);padding:10px;text-align:center}.demo-grid--square{--size:115px;grid-template-columns:repeat(auto-fill,var(--size))}.demo-grid--square:before{content:"";grid-column:1/1;grid-row:1/1;padding-bottom:100%;width:0}.demo-grid--square>:first-child{grid-column:1/1;grid-row:1/1} \ No newline at end of file diff --git a/dist/core-styles.demo.css b/dist/core-styles.demo.css index b32dee1c0..15c08fd49 100644 --- a/dist/core-styles.demo.css +++ b/dist/core-styles.demo.css @@ -1,2 +1,2 @@ /*! @tacc/core-styles 1.0.0+ | MIT | github.com/TACC/Core-Styles */ -/*! core-styles.demo.css */:root{--global-font-family--sans:"-apple-system","BlinkMacSystemFont","Segoe UI","Helvetica","Arial",sans-serif,"Apple Color Emoji","Segoe UI Emoji";--sans:var(--global-font-family--sans)}html{font-size:62.5%}body{font-size:1.6rem}body>dl dl{margin-block:0;padding-left:unset}body>dl dd,body>dl dt{color:#484848;font-family:var(--global-font-family--sans);line-height:normal}body>dl dt{font-size:1.6rem;font-weight:var(--medium);margin-bottom:10px;text-transform:capitalize}body>dl>dt{font-weight:var(--bold)}body>dl dt:not(:first-of-type){margin-top:20px}body>dl dd{margin-bottom:10px;margin-left:25px}body>dl dd:not(.demo-grid)>*{margin-right:5px;vertical-align:middle}body>details:last-of-type{background-color:#222;color:lime;direction:rtl;font-family:var(--global-font-family--mono);padding:1em;position:fixed;right:0;text-align:right;top:0;z-index:1}body>details[open]:last-of-type{opacity:1}body>details:not([open]):last-of-type{opacity:.5}body>details:last-of-type summary{font-weight:700}body>details:last-of-type dt{font-weight:400}body>details:last-of-type dd{font-weight:700}body>details:last-of-type dd{line-height:1.4;min-height:1.4em;width:4ch}.c-message .c-button--as-link,.c-message a,.x-link,.x-link--irregular{color:var(--global-color-link-on-light--normal);text-decoration:none;text-decoration-thickness:var(--global-border-width--normal);text-underline-offset:.2em}.c-message .c-button--as-link:hover,.c-message a:hover,.x-link--hover,.x-link--irregular--hover{color:var(--global-color-link-on-light--normal);text-decoration-line:underline;text-decoration-style:solid;text-decoration-thickness:var(--global-border-width--normal)}.c-message .c-button--as-link:active,.c-message a:active,.x-link--active,.x-link--irregular--active{text-decoration-line:underline;text-decoration-style:dotted}.c-message .c-button--as-link,.c-message a,.x-link--irregular{text-decoration-line:underline}.c-message .c-button--as-link:hover,.c-message a:hover,.x-link--irregular--hover{text-decoration-style:dashed}.c-message .c-button--as-link:active,.c-message a:active,.x-link--irregular--active{text-decoration-style:dotted}.c-message .c-button--as-link,.c-message a{color:inherit!important}.c-message--scope-inline,.c-message--scope-section{font-size:var(--global-font-size--small)}.c-message--scope-global,.c-message--scope-section,.demo-message{border:var(--global-border--thick);padding:15px 20px}.c-message--scope-global,.demo-message{text-align:center}.c-message--type-info{color:var(--global-color-info--dark)}.c-message--type-success{color:var(--global-color-success--dark)}.c-message--type-warning{color:var(--global-color-warning--dark)}.c-message--type-error{color:var(--global-color-danger--dark)}.c-message--scope-section.c-message--type-info{background-color:var(--global-color-info--x-light);border-color:var(--global-color-info--normal)}.c-message--scope-section.c-message--type-success{background-color:var(--global-color-success--x-light);border-color:var(--global-color-success--normal)}.c-message--scope-section.c-message--type-warning{background-color:var(--global-color-warning--x-light);border-color:var(--global-color-warning--normal)}.c-message--scope-section.c-message--type-error{background-color:var(--global-color-danger--x-light);border-color:var(--global-color-danger--normal)}.c-message--scope-global,.demo-message{background-color:var(--global-color-accent--secondary);border-color:var(--global-color-primary--dark);color:var(--global-color-primary--xx-light)}.demo-grid{display:grid;gap:10px}.demo-grid>figure{margin:unset}.demo-grid--boxes>*{border:var(--global-border--normal);padding:10px;text-align:center}.demo-grid--square{--size:115px;grid-template-columns:repeat(auto-fill,var(--size))}.demo-grid--square:before{content:"";grid-column:1/1;grid-row:1/1;padding-bottom:100%;width:0}.demo-grid--square>:first-child{grid-column:1/1;grid-row:1/1}.demo-message{font-family:var(--global-font-family--sans);position:sticky;top:0}.demo-narrow-paragraphs p{margin:10px;max-width:40ch} \ No newline at end of file +/*! core-styles.demo.css */:root{--global-font-family--sans:"-apple-system","BlinkMacSystemFont","Segoe UI","Helvetica","Arial",sans-serif,"Apple Color Emoji","Segoe UI Emoji";--sans:var(--global-font-family--sans)}html{font-size:62.5%}body{font-size:1.6rem}body>dl dl{margin-block:0;padding-left:unset}body>dl dd,body>dl dt{color:#484848;font-family:var(--global-font-family--sans);line-height:normal}body>dl dt{font-size:1.6rem;font-weight:var(--medium);margin-bottom:10px;text-transform:capitalize}body>dl>dt{font-weight:var(--bold)}body>dl dt:not(:first-of-type){margin-top:20px}body>dl dd{margin-bottom:10px;margin-left:25px}body>dl dd:not(.demo-grid)>*{margin-right:5px;vertical-align:middle}.c-message .c-button--as-link,.c-message a,.x-link,.x-link--irregular{color:var(--global-color-link-on-light--normal);text-decoration:none;text-decoration-thickness:var(--global-border-width--normal);text-underline-offset:.2em}.c-message .c-button--as-link:hover,.c-message a:hover,.x-link--hover,.x-link--irregular--hover{color:var(--global-color-link-on-light--normal);text-decoration-line:underline;text-decoration-style:solid;text-decoration-thickness:var(--global-border-width--normal)}.c-message .c-button--as-link:active,.c-message a:active,.x-link--active,.x-link--irregular--active{text-decoration-line:underline;text-decoration-style:dotted}.c-message .c-button--as-link,.c-message a,.x-link--irregular{text-decoration-line:underline}.c-message .c-button--as-link:hover,.c-message a:hover,.x-link--irregular--hover{text-decoration-style:dashed}.c-message .c-button--as-link:active,.c-message a:active,.x-link--irregular--active{text-decoration-style:dotted}.c-message .c-button--as-link,.c-message a{color:inherit!important}.c-message--scope-inline,.c-message--scope-section{font-size:var(--global-font-size--small)}.c-message--scope-global,.c-message--scope-section{border:var(--global-border--thick);padding:15px 20px}.c-message--scope-global{text-align:center}.c-message--type-info{color:var(--global-color-info--dark)}.c-message--type-success{color:var(--global-color-success--dark)}.c-message--type-warning{color:var(--global-color-warning--dark)}.c-message--type-error{color:var(--global-color-danger--dark)}.c-message--scope-section.c-message--type-info{background-color:var(--global-color-info--x-light);border-color:var(--global-color-info--normal)}.c-message--scope-section.c-message--type-success{background-color:var(--global-color-success--x-light);border-color:var(--global-color-success--normal)}.c-message--scope-section.c-message--type-warning{background-color:var(--global-color-warning--x-light);border-color:var(--global-color-warning--normal)}.c-message--scope-section.c-message--type-error{background-color:var(--global-color-danger--x-light);border-color:var(--global-color-danger--normal)}.c-message--scope-global{background-color:var(--global-color-accent--secondary);border-color:var(--global-color-primary--dark);color:var(--global-color-primary--xx-light)}.demo-grid{display:grid;gap:10px}.demo-grid>figure{margin:unset}.demo-grid--boxes>*{border:var(--global-border--normal);padding:10px;text-align:center}.demo-grid--square{--size:115px;grid-template-columns:repeat(auto-fill,var(--size))}.demo-grid--square:before{content:"";grid-column:1/1;grid-row:1/1;padding-bottom:100%;width:0}.demo-grid--square>:first-child{grid-column:1/1;grid-row:1/1}.demo-narrow-paragraphs p{margin:10px;max-width:40ch} \ No newline at end of file diff --git a/dist/elements/demo.css b/dist/elements/demo.css index caa567fad..da92911c4 100644 --- a/dist/elements/demo.css +++ b/dist/elements/demo.css @@ -1 +1 @@ -/*! @tacc/core-styles 1.0.0+ | MIT | github.com/TACC/Core-Styles */html{font-size:62.5%}body{font-size:1.6rem}body>dl dl{margin-block:0;padding-left:unset}body>dl dd,body>dl dt{color:#484848;font-family:var(--global-font-family--sans);line-height:normal}body>dl dt{font-size:1.6rem;font-weight:var(--medium);margin-bottom:10px;text-transform:capitalize}body>dl>dt{font-weight:var(--bold)}body>dl dt:not(:first-of-type){margin-top:20px}body>dl dd{margin-bottom:10px;margin-left:25px}body>dl dd:not(.demo-grid)>*{margin-right:5px;vertical-align:middle}body>details:last-of-type{background-color:#222;color:lime;direction:rtl;font-family:var(--global-font-family--mono);padding:1em;position:fixed;right:0;text-align:right;top:0;z-index:1}body>details[open]:last-of-type{opacity:1}body>details:not([open]):last-of-type{opacity:.5}body>details:last-of-type summary{font-weight:700}body>details:last-of-type dt{font-weight:400}body>details:last-of-type dd{font-weight:700}body>details:last-of-type dd{line-height:1.4;min-height:1.4em;width:4ch} \ No newline at end of file +/*! @tacc/core-styles 1.0.0+ | MIT | github.com/TACC/Core-Styles */html{font-size:62.5%}body{font-size:1.6rem}body>dl dl{margin-block:0;padding-left:unset}body>dl dd,body>dl dt{color:#484848;font-family:var(--global-font-family--sans);line-height:normal}body>dl dt{font-size:1.6rem;font-weight:var(--medium);margin-bottom:10px;text-transform:capitalize}body>dl>dt{font-weight:var(--bold)}body>dl dt:not(:first-of-type){margin-top:20px}body>dl dd{margin-bottom:10px;margin-left:25px}body>dl dd:not(.demo-grid)>*{margin-right:5px;vertical-align:middle} \ No newline at end of file diff --git a/src/lib/_imports/components/demo.css b/src/lib/_imports/components/demo.css index 5b88ea193..3c1f119c8 100644 --- a/src/lib/_imports/components/demo.css +++ b/src/lib/_imports/components/demo.css @@ -1,4 +1,7 @@ @import url('../components/c-message.css'); +@import url('../tools/x-link.css'); + + /* Grid */ @@ -10,8 +13,6 @@ margin: unset; /* undo browser & Bootstrap */ } - - /* Grid: Boxes */ .demo-grid--boxes > * { @@ -42,18 +43,3 @@ grid-row: 1 / 1; grid-column: 1 / 1; } - - - - - -/* Message */ - -.demo-message { - @extend .c-message--scope-global; - - position: sticky; - top: 0; - - font-family: var(--global-font-family--sans); -} diff --git a/src/lib/_imports/settings/font/font.hbs b/src/lib/_imports/settings/font/font.hbs index f4e5d54cb..ebcb24f57 100644 --- a/src/lib/_imports/settings/font/font.hbs +++ b/src/lib/_imports/settings/font/font.hbs @@ -1,5 +1,5 @@ {{#if shouldShowSizeMessage}} -

+

There are currently no default font sizes nor default font families. A client must load CMS styles or Portal styles or their own custom font sizes.

{{/if}}