@withlayers/mixins 0.2.2 → 0.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.css +1 -1
- package/package.json +2 -2
package/dist/index.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@define-mixin is-visually-hidden{border: 0; clip: rect(1px,1px,1px,1px); clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; word-wrap: normal !important;}@define-mixin is-style-link-default{color: var(--l--theme--link--default--color--content--default); text-decoration-line: underline; text-decoration-style: solid; &:hover {color: var(--l--theme--link--default--color--content--hover); text-decoration-line: none;} &:focus-visible {color: var(--l--theme--link--default--color--content--focus); text-decoration-line: none;} &:active {color: var(--l--theme--link--default--color--content--active); text-decoration-line: none;} &:visited {color: var(--l--theme--link--default--color--content--visited);}}@define-mixin is-style-link-knockout{color: var(--l--theme--link--knockout--color--content--knockout); text-decoration-line: underline; text-decoration-style: solid; &:hover {color: var(--l--theme--link--knockout--color--content--hover); text-decoration-line: none;} &:focus-visible {color: var(--l--theme--link--knockout--color--content--focus); text-decoration-line: none;} &:active {color: var(--l--theme--link--knockout--color--content--active); text-decoration-line: none;} &:visited {color: var(--l--theme--link--knockout--color--content--visited);}}@define-mixin is-style-link-subtle{color: var(--l--theme--link--subtle--color--content--default); text-decoration-line: underline; text-decoration-style: solid; &:hover {color: var(--l--theme--link--subtle--color--content--hover); text-decoration-line: none;} &:focus-visible {color: var(--l--theme--link--subtle--color--content--focus); text-decoration-line: none;} &:active {color: var(--l--theme--link--subtle--color--content--active); text-decoration-line: none;} &:visited {color: var(--l--theme--link--subtle--color--content--visited);}}@define-mixin has-no-initial-underline{text-decoration-line: none; &:hover,&:focus-visible,&:active {text-decoration-line: underline; text-decoration-style: solid;}}@define-mixin is-style-body-md{font-family: var(--l--theme--typography--body--md--font-family); font-size: var(--l--theme--typography--body--md--font-size); font-style: var(--l--theme--typography--body--md--font-style); font-variant-caps: var(--l--theme--typography--body--md--font-variant-caps); font-weight: var(--l--theme--typography--body--md--font-weight); letter-spacing: var(--l--theme--typography--body--md--letter-spacing); line-height: var(--l--theme--typography--body--md--line-height); text-transform: var(--l--theme--typography--body--md--text-transform);}@define-mixin is-style-body-sm{font-family: var(--l--theme--typography--body--sm--font-family); font-size: var(--l--theme--typography--body--sm--font-size); font-style: var(--l--theme--typography--body--sm--font-style); font-variant-caps: var(--l--theme--typography--body--sm--font-variant-caps); font-weight: var(--l--theme--typography--body--sm--font-weight); letter-spacing: var(--l--theme--typography--body--sm--letter-spacing); line-height: var(--l--theme--typography--body--sm--line-height); text-transform: var(--l--theme--typography--body--sm--text-transform);}@define-mixin is-style-caption{font-family: var(--l--theme--typography--caption--font-family); font-size: var(--l--theme--typography--caption--font-size); font-style: var(--l--theme--typography--caption--font-style); font-variant-caps: var(--l--theme--typography--caption--font-variant-caps); font-weight: var(--l--theme--typography--caption--font-weight); letter-spacing: var(--l--theme--typography--caption--letter-spacing); line-height: var(--l--theme--typography--caption--line-height); text-transform: var(--l--theme--typography--caption--text-transform);}@define-mixin is-style-caption-attribution{font-family: var(--l--theme--typography--caption-attribution--font-family); font-size: var(--l--theme--typography--caption-attribution--font-size); font-style: var(--l--theme--typography--caption-attribution--font-style); font-variant-caps: var(--l--theme--typography--caption-attribution--font-variant-caps); font-weight: var(--l--theme--typography--caption-attribution--font-weight); letter-spacing: var(--l--theme--typography--caption-attribution--letter-spacing); line-height: var(--l--theme--typography--caption-attribution--line-height); text-transform: var(--l--theme--typography--caption-attribution--text-transform);}@define-mixin is-style-code{font-family: var(--l--theme--typography--code--font-family); font-size: var(--l--theme--typography--code--font-size); font-style: var(--l--theme--typography--code--font-style); font-variant-caps: var(--l--theme--typography--code--font-variant-caps); font-weight: var(--l--theme--typography--code--font-weight); letter-spacing: var(--l--theme--typography--code--letter-spacing); line-height: var(--l--theme--typography--code--line-height); text-transform: var(--l--theme--typography--code--text-transform);}@define-mixin is-style-h1{font-family: var(--l--theme--typography--h1--font-family); font-size: var(--l--theme--typography--h1--font-size); font-style: var(--l--theme--typography--h1--font-style); font-variant-caps: var(--l--theme--typography--h1--font-variant-caps); font-weight: var(--l--theme--typography--h1--font-weight); letter-spacing: var(--l--theme--typography--h1--letter-spacing); line-height: var(--l--theme--typography--h1--line-height); text-transform: var(--l--theme--typography--h1--text-transform);}@define-mixin is-style-h2{font-family: var(--l--theme--typography--h2--font-family); font-size: var(--l--theme--typography--h2--font-size); font-style: var(--l--theme--typography--h2--font-style); font-variant-caps: var(--l--theme--typography--h2--font-variant-caps); font-weight: var(--l--theme--typography--h2--font-weight); letter-spacing: var(--l--theme--typography--h2--letter-spacing); line-height: var(--l--theme--typography--h2--line-height); text-transform: var(--l--theme--typography--h2--text-transform);}@define-mixin is-style-h3{font-family: var(--l--theme--typography--h3--font-family); font-size: var(--l--theme--typography--h3--font-size); font-style: var(--l--theme--typography--h3--font-style); font-variant-caps: var(--l--theme--typography--h3--font-variant-caps); font-weight: var(--l--theme--typography--h3--font-weight); letter-spacing: var(--l--theme--typography--h3--letter-spacing); line-height: var(--l--theme--typography--h3--line-height); text-transform: var(--l--theme--typography--h3--text-transform);}@define-mixin is-style-h4{font-family: var(--l--theme--typography--h4--font-family); font-size: var(--l--theme--typography--h4--font-size); font-style: var(--l--theme--typography--h4--font-style); font-variant-caps: var(--l--theme--typography--h4--font-variant-caps); font-weight: var(--l--theme--typography--h4--font-weight); letter-spacing: var(--l--theme--typography--h4--letter-spacing); line-height: var(--l--theme--typography--h4--line-height); text-transform: var(--l--theme--typography--h4--text-transform);}@define-mixin is-style-h5{font-family: var(--l--theme--typography--h5--font-family); font-size: var(--l--theme--typography--h5--font-size); font-style: var(--l--theme--typography--h5--font-style); font-variant-caps: var(--l--theme--typography--h5--font-variant-caps); font-weight: var(--l--theme--typography--h5--font-weight); letter-spacing: var(--l--theme--typography--h5--letter-spacing); line-height: var(--l--theme--typography--h5--line-height); text-transform: var(--l--theme--typography--h5--text-transform);}@define-mixin is-style-h6{font-family: var(--l--theme--typography--h6--font-family); font-size: var(--l--theme--typography--h6--font-size); font-style: var(--l--theme--typography--h6--font-style); font-variant-caps: var(--l--theme--typography--h6--font-variant-caps); font-weight: var(--l--theme--typography--h6--font-weight); letter-spacing: var(--l--theme--typography--h6--letter-spacing); line-height: var(--l--theme--typography--h6--line-height); text-transform: var(--l--theme--typography--h6--text-transform);}@define-mixin is-style-overline{font-family: var(--l--theme--typography--overline--font-family); font-size: var(--l--theme--typography--overline--font-size); font-style: var(--l--theme--typography--overline--font-style); font-variant-caps: var(--l--theme--typography--overline--font-variant-caps); font-weight: var(--l--theme--typography--overline--font-weight); letter-spacing: var(--l--theme--typography--overline--letter-spacing); line-height: var(--l--theme--typography--overline--line-height); text-transform: var(--l--theme--typography--overline--text-transform);}@define-mixin is-style-subhead{font-family: var(--l--theme--typography--subhead--font-family); font-size: var(--l--theme--typography--subhead--font-size); font-style: var(--l--theme--typography--subhead--font-style); font-variant-caps: var(--l--theme--typography--subhead--font-variant-caps); font-weight: var(--l--theme--typography--subhead--font-weight); letter-spacing: var(--l--theme--typography--subhead--letter-spacing); line-height: var(--l--theme--typography--subhead--line-height); text-transform: var(--l--theme--typography--subhead--text-transform);}
|
|
1
|
+
@define-mixin is-visually-hidden{border: 0; clip: rect(1px,1px,1px,1px); clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; word-wrap: normal !important;}@define-mixin is-link-on-default{color: var(--l--theme--link--on-default--color--content--default); &:hover {color: var(--l--theme--link--on-default--color--content--hover);} &:focus-visible {color: var(--l--theme--link--on-default--color--content--focus);} &:active {color: var(--l--theme--link--on-default--color--content--active);} &:visited {color: var(--l--theme--link--on-default--color--content--visited);}}@define-mixin is-link-on-knockout{color: var(--l--theme--link--on-knockout--color--content--default); &:hover {color: var(--l--theme--link--on-knockout--color--content--hover);} &:focus-visible {color: var(--l--theme--link--on-knockout--color--content--focus);} &:active {color: var(--l--theme--link--on-knockout--color--content--active);} &:visited {color: var(--l--theme--link--on-knockout--color--content--visited);}}@define-mixin is-link-on-subtle{color: var(--l--theme--link--on-subtle--color--content--default); &:hover {color: var(--l--theme--link--on-subtle--color--content--hover);} &:focus-visible {color: var(--l--theme--link--on-subtle--color--content--focus);} &:active {color: var(--l--theme--link--on-subtle--color--content--active);} &:visited {color: var(--l--theme--link--on-subtle--color--content--visited);}}@define-mixin is-link-on-default-muted{color: var(--l--theme--link--on-default-muted--color--content--default); &:hover {color: var(--l--theme--link--on-default-muted--color--content--hover);} &:focus-visible {color: var(--l--theme--link--on-default-muted--color--content--focus);} &:active {color: var(--l--theme--link--on-default-muted--color--content--active);} &:visited {color: var(--l--theme--link--on-default-muted--color--content--visited);}}@define-mixin is-link-on-knockout-muted{color: var(--l--theme--link--on-knockout-muted--color--content--default); &:hover {color: var(--l--theme--link--on-knockout-muted--color--content--hover);} &:focus-visible {color: var(--l--theme--link--on-knockout-muted--color--content--focus);} &:active {color: var(--l--theme--link--on-knockout-muted--color--content--active);} &:visited {color: var(--l--theme--link--on-knockout-muted--color--content--visited);}}@define-mixin is-link-on-subtle-muted{color: var(--l--theme--link--on-subtle-muted--color--content--default); &:hover {color: var(--l--theme--link--on-subtle-muted--color--content--hover);} &:focus-visible {color: var(--l--theme--link--on-subtle-muted--color--content--focus);} &:active {color: var(--l--theme--link--on-subtle-muted--color--content--active);} &:visited {color: var(--l--theme--link--on-subtle-muted--color--content--visited);}}@define-mixin has-no-initial-underline{text-decoration-line: none; &:hover,&:active {text-decoration-line: underline; text-decoration-style: solid;}}@define-mixin is-style-body-md{font-family: var(--l--theme--typography--body--md--font-family); font-size: var(--l--theme--typography--body--md--font-size); font-style: var(--l--theme--typography--body--md--font-style); font-variant-caps: var(--l--theme--typography--body--md--font-variant-caps); font-weight: var(--l--theme--typography--body--md--font-weight); letter-spacing: var(--l--theme--typography--body--md--letter-spacing); line-height: var(--l--theme--typography--body--md--line-height); text-transform: var(--l--theme--typography--body--md--text-transform);}@define-mixin is-style-body-sm{font-family: var(--l--theme--typography--body--sm--font-family); font-size: var(--l--theme--typography--body--sm--font-size); font-style: var(--l--theme--typography--body--sm--font-style); font-variant-caps: var(--l--theme--typography--body--sm--font-variant-caps); font-weight: var(--l--theme--typography--body--sm--font-weight); letter-spacing: var(--l--theme--typography--body--sm--letter-spacing); line-height: var(--l--theme--typography--body--sm--line-height); text-transform: var(--l--theme--typography--body--sm--text-transform);}@define-mixin is-style-caption{font-family: var(--l--theme--typography--caption--font-family); font-size: var(--l--theme--typography--caption--font-size); font-style: var(--l--theme--typography--caption--font-style); font-variant-caps: var(--l--theme--typography--caption--font-variant-caps); font-weight: var(--l--theme--typography--caption--font-weight); letter-spacing: var(--l--theme--typography--caption--letter-spacing); line-height: var(--l--theme--typography--caption--line-height); text-transform: var(--l--theme--typography--caption--text-transform);}@define-mixin is-style-caption-attribution{font-family: var(--l--theme--typography--caption-attribution--font-family); font-size: var(--l--theme--typography--caption-attribution--font-size); font-style: var(--l--theme--typography--caption-attribution--font-style); font-variant-caps: var(--l--theme--typography--caption-attribution--font-variant-caps); font-weight: var(--l--theme--typography--caption-attribution--font-weight); letter-spacing: var(--l--theme--typography--caption-attribution--letter-spacing); line-height: var(--l--theme--typography--caption-attribution--line-height); text-transform: var(--l--theme--typography--caption-attribution--text-transform);}@define-mixin is-style-code{font-family: var(--l--theme--typography--code--font-family); font-size: var(--l--theme--typography--code--font-size); font-style: var(--l--theme--typography--code--font-style); font-variant-caps: var(--l--theme--typography--code--font-variant-caps); font-weight: var(--l--theme--typography--code--font-weight); letter-spacing: var(--l--theme--typography--code--letter-spacing); line-height: var(--l--theme--typography--code--line-height); text-transform: var(--l--theme--typography--code--text-transform);}@define-mixin is-style-h1{font-family: var(--l--theme--typography--h1--font-family); font-size: var(--l--theme--typography--h1--font-size); font-style: var(--l--theme--typography--h1--font-style); font-variant-caps: var(--l--theme--typography--h1--font-variant-caps); font-weight: var(--l--theme--typography--h1--font-weight); letter-spacing: var(--l--theme--typography--h1--letter-spacing); line-height: var(--l--theme--typography--h1--line-height); text-transform: var(--l--theme--typography--h1--text-transform);}@define-mixin is-style-h2{font-family: var(--l--theme--typography--h2--font-family); font-size: var(--l--theme--typography--h2--font-size); font-style: var(--l--theme--typography--h2--font-style); font-variant-caps: var(--l--theme--typography--h2--font-variant-caps); font-weight: var(--l--theme--typography--h2--font-weight); letter-spacing: var(--l--theme--typography--h2--letter-spacing); line-height: var(--l--theme--typography--h2--line-height); text-transform: var(--l--theme--typography--h2--text-transform);}@define-mixin is-style-h3{font-family: var(--l--theme--typography--h3--font-family); font-size: var(--l--theme--typography--h3--font-size); font-style: var(--l--theme--typography--h3--font-style); font-variant-caps: var(--l--theme--typography--h3--font-variant-caps); font-weight: var(--l--theme--typography--h3--font-weight); letter-spacing: var(--l--theme--typography--h3--letter-spacing); line-height: var(--l--theme--typography--h3--line-height); text-transform: var(--l--theme--typography--h3--text-transform);}@define-mixin is-style-h4{font-family: var(--l--theme--typography--h4--font-family); font-size: var(--l--theme--typography--h4--font-size); font-style: var(--l--theme--typography--h4--font-style); font-variant-caps: var(--l--theme--typography--h4--font-variant-caps); font-weight: var(--l--theme--typography--h4--font-weight); letter-spacing: var(--l--theme--typography--h4--letter-spacing); line-height: var(--l--theme--typography--h4--line-height); text-transform: var(--l--theme--typography--h4--text-transform);}@define-mixin is-style-h5{font-family: var(--l--theme--typography--h5--font-family); font-size: var(--l--theme--typography--h5--font-size); font-style: var(--l--theme--typography--h5--font-style); font-variant-caps: var(--l--theme--typography--h5--font-variant-caps); font-weight: var(--l--theme--typography--h5--font-weight); letter-spacing: var(--l--theme--typography--h5--letter-spacing); line-height: var(--l--theme--typography--h5--line-height); text-transform: var(--l--theme--typography--h5--text-transform);}@define-mixin is-style-h6{font-family: var(--l--theme--typography--h6--font-family); font-size: var(--l--theme--typography--h6--font-size); font-style: var(--l--theme--typography--h6--font-style); font-variant-caps: var(--l--theme--typography--h6--font-variant-caps); font-weight: var(--l--theme--typography--h6--font-weight); letter-spacing: var(--l--theme--typography--h6--letter-spacing); line-height: var(--l--theme--typography--h6--line-height); text-transform: var(--l--theme--typography--h6--text-transform);}@define-mixin is-style-overline{font-family: var(--l--theme--typography--overline--font-family); font-size: var(--l--theme--typography--overline--font-size); font-style: var(--l--theme--typography--overline--font-style); font-variant-caps: var(--l--theme--typography--overline--font-variant-caps); font-weight: var(--l--theme--typography--overline--font-weight); letter-spacing: var(--l--theme--typography--overline--letter-spacing); line-height: var(--l--theme--typography--overline--line-height); text-transform: var(--l--theme--typography--overline--text-transform);}@define-mixin is-style-subhead{font-family: var(--l--theme--typography--subhead--font-family); font-size: var(--l--theme--typography--subhead--font-size); font-style: var(--l--theme--typography--subhead--font-style); font-variant-caps: var(--l--theme--typography--subhead--font-variant-caps); font-weight: var(--l--theme--typography--subhead--font-weight); letter-spacing: var(--l--theme--typography--subhead--letter-spacing); line-height: var(--l--theme--typography--subhead--line-height); text-transform: var(--l--theme--typography--subhead--text-transform);}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@withlayers/mixins",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.3.0",
|
|
4
4
|
"description": "Mixins layer",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"author": "Dmitry Mayorov",
|
|
@@ -19,6 +19,6 @@
|
|
|
19
19
|
"lint:css:fix": "stylelint \"src/**/*.css\" --fix"
|
|
20
20
|
},
|
|
21
21
|
"dependencies": {
|
|
22
|
-
"@withlayers/tokens": "0.
|
|
22
|
+
"@withlayers/tokens": "0.5.0"
|
|
23
23
|
}
|
|
24
24
|
}
|