@luz-ds/cms 0.1.0 → 0.2.1
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/README.md +14 -14
- package/dist/classes.json +1 -1
- package/dist/cms.css +2 -2
- package/dist/cms.min.css +1 -1
- package/dist/components/article-header.css +1 -1
- package/dist/components/article-header.min.css +1 -1
- package/dist/components/article.css +1 -1
- package/dist/components/article.min.css +1 -1
- package/dist/components/footer.css +1 -1
- package/dist/components/footer.min.css +1 -1
- package/dist/components/header.css +1 -1
- package/dist/components/header.min.css +1 -1
- package/dist/components/page-header.css +1 -1
- package/dist/components/page-header.min.css +1 -1
- package/package.json +8 -8
package/README.md
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
# @luz-ds/cms
|
|
2
2
|
|
|
3
|
-
The page structure of one kind of site, a blog, a newspaper or any site of articles, built with any CMS and any stack: the header (a bar or a newspaper's masthead), the page header, the article header, the table of contents beside the text, and the footer. Each is a class on a native element, laid out in the markup by `@luz-ds/core`'s objects (`.o-page`, `.o-sticky`, `.o-container`, `.o-row`, `.o-stack`) and its navbar; cms adds only its skin. `@luz-ds/
|
|
3
|
+
The page structure of one kind of site, a blog, a newspaper or any site of articles, built with any CMS and any stack: the header (a bar or a newspaper's masthead), the page header, the article header, the table of contents beside the text, and the footer. Each is a class on a native element, laid out in the markup by `@luz-ds/core`'s objects (`.o-page`, `.o-sticky`, `.o-container`, `.o-row`, `.o-stack`) and its navbar; cms adds only its skin. `@luz-ds/catalog` is optional: its search and language switch go in the header's actions.
|
|
4
4
|
|
|
5
|
-
> **Beta, version 0.x.** CMS has a version of its own, apart from tokens, core and
|
|
5
|
+
> **Beta, version 0.x.** CMS has a version of its own, apart from tokens, core and catalog, and grows in minor versions while it is 0.x: any of them may change a class. Pin an exact version and read the changelog before you upgrade.
|
|
6
6
|
|
|
7
7
|
## When to use it
|
|
8
8
|
|
|
@@ -13,12 +13,12 @@ The classes go on any element, so a template of any CMS can write them (in a blo
|
|
|
13
13
|
|
|
14
14
|
## Prerequisites
|
|
15
15
|
|
|
16
|
-
Requires `@luz-ds/tokens` and `@luz-ds/core`, version `^0.1.0`, declared as peer dependencies, loaded in that order before this package. `@luz-ds/
|
|
16
|
+
Requires `@luz-ds/tokens` and `@luz-ds/core`, version `^0.1.0 || ^0.2.0`, declared as peer dependencies, loaded in that order before this package. `@luz-ds/catalog` (`^0.1.0 || ^0.2.0`) is an optional peer: load it before this package if you use its pieces; the patterns work without it.
|
|
17
17
|
|
|
18
18
|
## Installation
|
|
19
19
|
|
|
20
20
|
```bash
|
|
21
|
-
npm install @luz-ds/tokens @luz-ds/core @luz-ds/
|
|
21
|
+
npm install @luz-ds/tokens @luz-ds/core @luz-ds/catalog @luz-ds/cms
|
|
22
22
|
```
|
|
23
23
|
|
|
24
24
|
## Usage
|
|
@@ -28,17 +28,17 @@ npm install @luz-ds/tokens @luz-ds/core @luz-ds/site @luz-ds/cms
|
|
|
28
28
|
```js
|
|
29
29
|
import '@luz-ds/tokens/css'
|
|
30
30
|
import '@luz-ds/core/css'
|
|
31
|
-
import '@luz-ds/
|
|
31
|
+
import '@luz-ds/catalog/css'
|
|
32
32
|
import '@luz-ds/cms/css'
|
|
33
33
|
```
|
|
34
34
|
|
|
35
35
|
### Via CDN
|
|
36
36
|
|
|
37
37
|
```html
|
|
38
|
-
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@luz-ds/tokens@0.1
|
|
39
|
-
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@luz-ds/core@0.1
|
|
40
|
-
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@luz-ds/
|
|
41
|
-
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@luz-ds/cms@0.1
|
|
38
|
+
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@luz-ds/tokens@0.2.1/dist/luz-tokens.min.css">
|
|
39
|
+
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@luz-ds/core@0.2.1/dist/luz.min.css">
|
|
40
|
+
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@luz-ds/catalog@0.2.1/dist/catalog.min.css">
|
|
41
|
+
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@luz-ds/cms@0.2.1/dist/cms.min.css">
|
|
42
42
|
```
|
|
43
43
|
|
|
44
44
|
There is no script: the header's menu is a native popover. Core's script is optional: with it, the table of contents marks the section in view (core's scroll spy, on the in-page links inside an element with `data-luz-spy`).
|
|
@@ -47,7 +47,7 @@ The body of a story is core's `.luz-prose` (line length and the space between bl
|
|
|
47
47
|
|
|
48
48
|
## Package exports
|
|
49
49
|
|
|
50
|
-
- **`./css`** → `cms.css` — the patterns, in the cascade layer `luz.cms`, after `luz.
|
|
50
|
+
- **`./css`** → `cms.css` — the patterns, in the cascade layer `luz.cms`, after `luz.catalog` (`./css/min` for the minified twin)
|
|
51
51
|
- **`./components/*`** → `dist/components/` — one stylesheet per pattern, `<name>.css` and `<name>.min.css`, each in `luz.cms`, for a page that loads only what it uses
|
|
52
52
|
|
|
53
53
|
## Classes included
|
|
@@ -62,11 +62,11 @@ The body of a story is core's `.luz-prose` (line length and the space between bl
|
|
|
62
62
|
<!-- luz:ai-agents:start -->
|
|
63
63
|
## For AI agents
|
|
64
64
|
|
|
65
|
-
`@luz-ds/cms` 0.1
|
|
65
|
+
`@luz-ds/cms` 0.2.1 is in beta: any release may break anything. Read the breaking changes below before you update, and use only what the files under "Read first" list.
|
|
66
66
|
|
|
67
67
|
### Breaking changes
|
|
68
68
|
|
|
69
|
-
|
|
69
|
+
No breaking changes in 0.2.1.
|
|
70
70
|
|
|
71
71
|
Older versions: https://github.com/nandovejer/luz/blob/main/packages/cms/CHANGELOG.md
|
|
72
72
|
|
|
@@ -81,11 +81,11 @@ Older versions: https://github.com/nandovejer/luz/blob/main/packages/cms/CHANGEL
|
|
|
81
81
|
|
|
82
82
|
This package needs `@luz-ds/tokens` and `@luz-ds/core` loaded first.
|
|
83
83
|
|
|
84
|
-
`@luz-ds/
|
|
84
|
+
`@luz-ds/catalog` is optional: the CSS of this package works with the packages above alone.
|
|
85
85
|
|
|
86
86
|
### Check what you write
|
|
87
87
|
|
|
88
|
-
Run `npx @luz-ds/check <files>` on every HTML and CSS file you write, and fix what it reports. To copy the accessibility reviewer into your project: `npx @luz-ds/check agent > .claude/agents/luz-accessibility-reviewer.md`.
|
|
88
|
+
Run `npx @luz-ds/check@0.2.1 <files>` on every HTML and CSS file you write, and fix what it reports. To copy the accessibility reviewer into your project: `npx @luz-ds/check@0.2.1 agent > .claude/agents/luz-accessibility-reviewer.md`.
|
|
89
89
|
|
|
90
90
|
<!-- luz:ai-agents:end -->
|
|
91
91
|
|
package/dist/classes.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"schema": 1,
|
|
3
3
|
"package": "@luz-ds/cms",
|
|
4
|
-
"version": "0.1
|
|
4
|
+
"version": "0.2.1",
|
|
5
5
|
"classes": [
|
|
6
6
|
{ "name": "luz-cms-article", "kind": "pattern", "layer": "luz.cms", "files": ["components/article.css"], "defined": true, "block": "luz-cms-article" },
|
|
7
7
|
{ "name": "luz-cms-article-header", "kind": "pattern", "layer": "luz.cms", "files": ["components/article-header.css"], "defined": true, "block": "luz-cms-article-header" },
|
package/dist/cms.css
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
@layer luz.tokens, luz.themes, luz.settings, luz.generic, luz.elements, luz.objects, luz.components, luz.utilities, luz.
|
|
1
|
+
@layer luz.tokens, luz.themes, luz.settings, luz.generic, luz.elements, luz.objects, luz.components, luz.utilities, luz.catalog, luz.landing, luz.cms, luz.app, luz.docs, luz.print;
|
|
2
2
|
@layer luz.cms {
|
|
3
3
|
/* ==========================================================================
|
|
4
4
|
LUZ CMS
|
|
@@ -8,7 +8,7 @@
|
|
|
8
8
|
markup by core's objects (.o-page, .o-sticky, .o-container, .o-row,
|
|
9
9
|
.o-stack). Any stack: the classes go on any element, so a template of
|
|
10
10
|
any CMS can emit them.
|
|
11
|
-
Requires: @luz-ds/tokens and @luz-ds/core loaded first; @luz-ds/
|
|
11
|
+
Requires: @luz-ds/tokens and @luz-ds/core loaded first; @luz-ds/catalog
|
|
12
12
|
optional, loaded before this file.
|
|
13
13
|
========================================================================== */
|
|
14
14
|
|
package/dist/cms.min.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@layer luz.tokens,luz.themes,luz.settings,luz.generic,luz.elements,luz.objects,luz.components,luz.utilities,luz.
|
|
1
|
+
@layer luz.tokens,luz.themes,luz.settings,luz.generic,luz.elements,luz.objects,luz.components,luz.utilities,luz.catalog,luz.landing,luz.cms,luz.app,luz.docs,luz.print;@layer luz.cms{.luz-cms-header{padding-block:var(--luz-space-2xs);border-block-end:1px solid var(--luz-divider);background:var(--luz-surface-page)}.luz-cms-header>.o-row{gap:var(--luz-space-xs) var(--luz-space-md)}.luz-cms-header__brand{display:inline-flex;align-items:center;min-block-size:var(--luz-control-lg);margin-inline-end:auto;color:var(--luz-text-primary);font-family:var(--luz-font-heading);font-size:var(--luz-text-xl);font-weight:600;text-decoration:none}.luz-cms-header__brand:hover{text-decoration:underline}.luz-cms-header__brand :where(img){block-size:var(--luz-control-lg);inline-size:auto}.luz-cms-header__actions{gap:var(--luz-space-xs)}.luz-cms-header :where(luz-lang-switch){--luz-lang-switch-top: var(--luz-bar-h)}.luz-cms-header--masthead{padding-block:var(--luz-space-md);border-block-end:0}.luz-cms-header__top{flex-wrap:nowrap;justify-content:space-between}.luz-cms-header__date{flex:1 1 0;min-inline-size:0;margin:0;color:var(--luz-text-secondary);font-family:var(--luz-font-sans);font-size:var(--luz-text-sm)}.luz-cms-header--masthead .luz-cms-header__brand{display:block;margin:0;font-size:var(--luz-text-4xl);line-height:1.1;text-align:center}.luz-cms-header--masthead .luz-cms-header__brand :where(img){block-size:calc(var(--luz-control-lg) * 2)}.luz-cms-header__sections{padding-block:var(--luz-space-2xs);border-block:1px solid var(--luz-divider)}@media(min-width:769px){.luz-cms-header>.o-row{column-gap:var(--luz-space-lg)}.luz-cms-header__sections{justify-content:center}}@media(max-width:768px){.luz-cms-header>.o-row>.luz-cms-header__brand{flex:1 1 0}}@media(max-width:1023px){.luz-cms-header--masthead .luz-cms-header__brand{font-size:var(--luz-text-3xl)}}@media(max-width:640px){.luz-cms-header__brand{font-size:var(--luz-text-lg)}.luz-cms-header--masthead .luz-cms-header__brand{font-size:var(--luz-text-2xl)}}@supports (anchor-name: --luz-bar){.luz-cms-header,.luz-cms-header__sections{anchor-name:--luz-bar;anchor-scope:--luz-bar}.luz-cms-header :where(luz-lang-switch){--luz-lang-switch-top: anchor(--luz-bar end, var(--luz-bar-h))}}.luz-cms-page-header{margin-block-end:var(--luz-space-xl)}.luz-cms-page-header__title{margin-block-end:var(--luz-space-2xs);color:var(--luz-text-primary);font-family:var(--luz-font-heading);font-size:var(--luz-text-3xl);font-weight:300;letter-spacing:-1px}.luz-cms-page-header__lead{max-inline-size:600px;color:var(--luz-text-secondary);font-size:var(--luz-text-base)}@media(max-width:640px){.luz-cms-page-header__title{font-size:var(--luz-text-2xl);letter-spacing:-.5px}}.luz-cms-page-header__title:lang(ar){letter-spacing:0}.luz-cms-article-header{display:grid;gap:var(--luz-space-sm);margin-block-end:var(--luz-space-xl)}.luz-cms-article-header__kicker{font-family:var(--luz-font-mono);font-size:var(--luz-text-xs);font-weight:500;line-height:1.5;letter-spacing:.1em;text-transform:uppercase;color:var(--luz-text-secondary)}.luz-cms-article-header__kicker:lang(ar){font-family:var(--luz-font-sans)}.luz-cms-article-header__kicker:lang(ar),.luz-cms-article-header__title:lang(ar){letter-spacing:0}.luz-cms-article-header__title{font-family:var(--luz-font-heading);font-size:var(--luz-text-3xl);font-weight:300;line-height:1.15;letter-spacing:-.02em;text-wrap:balance;color:var(--luz-text-primary)}.luz-cms-article-header__standfirst{max-inline-size:70ch;font-size:var(--luz-text-lg);line-height:1.4;text-wrap:pretty;color:var(--luz-text-secondary)}.luz-cms-article-header__byline{display:flex;flex-wrap:wrap;align-items:center;gap:var(--luz-space-xs) var(--luz-space-sm);margin-block-start:var(--luz-space-xs);font-family:var(--luz-font-sans);font-size:var(--luz-text-md);line-height:1.5;color:var(--luz-text-secondary)}.luz-cms-article-header__media{margin-block:var(--luz-space-sm) 0;margin-inline:0;padding:0;background:none}@media(max-width:640px){.luz-cms-article-header__title{font-size:var(--luz-text-2xl)}.luz-cms-article-header__standfirst{font-size:var(--luz-text-base)}}.luz-cms-article{container-type:inline-size}.luz-cms-article__layout{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--luz-space-xl) var(--luz-space-2xl)}.luz-cms-toc__title{margin-block-end:var(--luz-space-xs);font-family:var(--luz-font-sans);font-size:var(--luz-text-base);font-weight:600;letter-spacing:0}.luz-cms-toc__list{list-style:none;border-inline-start:1px solid var(--luz-divider)}.luz-cms-toc__list a{display:block;margin-inline-start:-1px;padding:var(--luz-space-2xs) var(--luz-space-sm);border-inline-start:2px solid transparent;font-size:var(--luz-text-md);color:var(--luz-text-secondary)}.luz-cms-toc__list a:hover{background:var(--luz-surface-muted);color:var(--luz-text-primary)}.luz-cms-toc__list a[aria-current=true]{border-inline-start-color:var(--luz-brand-primary);color:var(--luz-text-primary);font-weight:600}@container (min-width: 46rem){.luz-cms-article__layout{grid-template-columns:minmax(0,1fr) 13rem}.luz-cms-toc{position:sticky;inset-block-start:var(--luz-cms-toc-top, var(--luz-space-lg));grid-column:2;grid-row:1;align-self:start;max-block-size:calc(100dvh - var(--luz-cms-toc-top, var(--luz-space-lg)) - var(--luz-space-lg));overflow-y:auto}}@media(min-height:30rem){:root:has(.o-sticky) .luz-cms-toc{--luz-cms-toc-top: calc(var(--luz-bar-h) + var(--luz-space-lg))}}.luz-cms-footer{padding-block:var(--luz-space-lg) var(--luz-space-xl);border-block-start:1px solid var(--luz-divider)}.luz-cms-footer>.o-row{justify-content:space-between;gap:var(--luz-space-md)}@media(max-width:768px){.luz-cms-footer>.o-row{flex-flow:column nowrap;align-items:flex-start}}}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
@layer luz.tokens, luz.themes, luz.settings, luz.generic, luz.elements, luz.objects, luz.components, luz.utilities, luz.
|
|
1
|
+
@layer luz.tokens, luz.themes, luz.settings, luz.generic, luz.elements, luz.objects, luz.components, luz.utilities, luz.catalog, luz.landing, luz.cms, luz.app, luz.docs, luz.print;
|
|
2
2
|
@layer luz.cms {
|
|
3
3
|
/* ==========================================================================
|
|
4
4
|
LUZ CMS: article header.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
@layer luz.tokens,luz.themes,luz.settings,luz.generic,luz.elements,luz.objects,luz.components,luz.utilities,luz.
|
|
1
|
+
@layer luz.tokens,luz.themes,luz.settings,luz.generic,luz.elements,luz.objects,luz.components,luz.utilities,luz.catalog,luz.landing,luz.cms,luz.app,luz.docs,luz.print;@layer luz.cms{.luz-cms-article-header{display:grid;gap:var(--luz-space-sm);margin-block-end:var(--luz-space-xl)}.luz-cms-article-header__kicker{font-family:var(--luz-font-mono);font-size:var(--luz-text-xs);font-weight:500;line-height:1.5;letter-spacing:.1em;text-transform:uppercase;color:var(--luz-text-secondary)}.luz-cms-article-header__kicker:lang(ar){font-family:var(--luz-font-sans)}.luz-cms-article-header__kicker:lang(ar),.luz-cms-article-header__title:lang(ar){letter-spacing:0}.luz-cms-article-header__title{font-family:var(--luz-font-heading);font-size:var(--luz-text-3xl);font-weight:300;line-height:1.15;letter-spacing:-.02em;text-wrap:balance;color:var(--luz-text-primary)}.luz-cms-article-header__standfirst{max-inline-size:70ch;font-size:var(--luz-text-lg);line-height:1.4;text-wrap:pretty;color:var(--luz-text-secondary)}.luz-cms-article-header__byline{display:flex;flex-wrap:wrap;align-items:center;gap:var(--luz-space-xs) var(--luz-space-sm);margin-block-start:var(--luz-space-xs);font-family:var(--luz-font-sans);font-size:var(--luz-text-md);line-height:1.5;color:var(--luz-text-secondary)}.luz-cms-article-header__media{margin-block:var(--luz-space-sm) 0;margin-inline:0;padding:0;background:none}@media(max-width:640px){.luz-cms-article-header__title{font-size:var(--luz-text-2xl)}.luz-cms-article-header__standfirst{font-size:var(--luz-text-base)}}}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
@layer luz.tokens, luz.themes, luz.settings, luz.generic, luz.elements, luz.objects, luz.components, luz.utilities, luz.
|
|
1
|
+
@layer luz.tokens, luz.themes, luz.settings, luz.generic, luz.elements, luz.objects, luz.components, luz.utilities, luz.catalog, luz.landing, luz.cms, luz.app, luz.docs, luz.print;
|
|
2
2
|
@layer luz.cms {
|
|
3
3
|
/* ==========================================================================
|
|
4
4
|
LUZ CMS: article and its table of contents.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
@layer luz.tokens,luz.themes,luz.settings,luz.generic,luz.elements,luz.objects,luz.components,luz.utilities,luz.
|
|
1
|
+
@layer luz.tokens,luz.themes,luz.settings,luz.generic,luz.elements,luz.objects,luz.components,luz.utilities,luz.catalog,luz.landing,luz.cms,luz.app,luz.docs,luz.print;@layer luz.cms{.luz-cms-article{container-type:inline-size}.luz-cms-article__layout{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--luz-space-xl) var(--luz-space-2xl)}.luz-cms-toc__title{margin-block-end:var(--luz-space-xs);font-family:var(--luz-font-sans);font-size:var(--luz-text-base);font-weight:600;letter-spacing:0}.luz-cms-toc__list{list-style:none;border-inline-start:1px solid var(--luz-divider)}.luz-cms-toc__list a{display:block;margin-inline-start:-1px;padding:var(--luz-space-2xs) var(--luz-space-sm);border-inline-start:2px solid transparent;font-size:var(--luz-text-md);color:var(--luz-text-secondary)}.luz-cms-toc__list a:hover{background:var(--luz-surface-muted);color:var(--luz-text-primary)}.luz-cms-toc__list a[aria-current=true]{border-inline-start-color:var(--luz-brand-primary);color:var(--luz-text-primary);font-weight:600}@container (min-width: 46rem){.luz-cms-article__layout{grid-template-columns:minmax(0,1fr) 13rem}.luz-cms-toc{position:sticky;inset-block-start:var(--luz-cms-toc-top, var(--luz-space-lg));grid-column:2;grid-row:1;align-self:start;max-block-size:calc(100dvh - var(--luz-cms-toc-top, var(--luz-space-lg)) - var(--luz-space-lg));overflow-y:auto}}@media(min-height:30rem){:root:has(.o-sticky) .luz-cms-toc{--luz-cms-toc-top: calc(var(--luz-bar-h) + var(--luz-space-lg))}}}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
@layer luz.tokens, luz.themes, luz.settings, luz.generic, luz.elements, luz.objects, luz.components, luz.utilities, luz.
|
|
1
|
+
@layer luz.tokens, luz.themes, luz.settings, luz.generic, luz.elements, luz.objects, luz.components, luz.utilities, luz.catalog, luz.landing, luz.cms, luz.app, luz.docs, luz.print;
|
|
2
2
|
@layer luz.cms {
|
|
3
3
|
/* ==========================================================================
|
|
4
4
|
LUZ CMS: footer.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
@layer luz.tokens,luz.themes,luz.settings,luz.generic,luz.elements,luz.objects,luz.components,luz.utilities,luz.
|
|
1
|
+
@layer luz.tokens,luz.themes,luz.settings,luz.generic,luz.elements,luz.objects,luz.components,luz.utilities,luz.catalog,luz.landing,luz.cms,luz.app,luz.docs,luz.print;@layer luz.cms{.luz-cms-footer{padding-block:var(--luz-space-lg) var(--luz-space-xl);border-block-start:1px solid var(--luz-divider)}.luz-cms-footer>.o-row{justify-content:space-between;gap:var(--luz-space-md)}@media(max-width:768px){.luz-cms-footer>.o-row{flex-flow:column nowrap;align-items:flex-start}}}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
@layer luz.tokens, luz.themes, luz.settings, luz.generic, luz.elements, luz.objects, luz.components, luz.utilities, luz.
|
|
1
|
+
@layer luz.tokens, luz.themes, luz.settings, luz.generic, luz.elements, luz.objects, luz.components, luz.utilities, luz.catalog, luz.landing, luz.cms, luz.app, luz.docs, luz.print;
|
|
2
2
|
@layer luz.cms {
|
|
3
3
|
/* ==========================================================================
|
|
4
4
|
LUZ CMS: header.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
@layer luz.tokens,luz.themes,luz.settings,luz.generic,luz.elements,luz.objects,luz.components,luz.utilities,luz.
|
|
1
|
+
@layer luz.tokens,luz.themes,luz.settings,luz.generic,luz.elements,luz.objects,luz.components,luz.utilities,luz.catalog,luz.landing,luz.cms,luz.app,luz.docs,luz.print;@layer luz.cms{.luz-cms-header{padding-block:var(--luz-space-2xs);border-block-end:1px solid var(--luz-divider);background:var(--luz-surface-page)}.luz-cms-header>.o-row{gap:var(--luz-space-xs) var(--luz-space-md)}.luz-cms-header__brand{display:inline-flex;align-items:center;min-block-size:var(--luz-control-lg);margin-inline-end:auto;color:var(--luz-text-primary);font-family:var(--luz-font-heading);font-size:var(--luz-text-xl);font-weight:600;text-decoration:none}.luz-cms-header__brand:hover{text-decoration:underline}.luz-cms-header__brand :where(img){block-size:var(--luz-control-lg);inline-size:auto}.luz-cms-header__actions{gap:var(--luz-space-xs)}.luz-cms-header :where(luz-lang-switch){--luz-lang-switch-top: var(--luz-bar-h)}.luz-cms-header--masthead{padding-block:var(--luz-space-md);border-block-end:0}.luz-cms-header__top{flex-wrap:nowrap;justify-content:space-between}.luz-cms-header__date{flex:1 1 0;min-inline-size:0;margin:0;color:var(--luz-text-secondary);font-family:var(--luz-font-sans);font-size:var(--luz-text-sm)}.luz-cms-header--masthead .luz-cms-header__brand{display:block;margin:0;font-size:var(--luz-text-4xl);line-height:1.1;text-align:center}.luz-cms-header--masthead .luz-cms-header__brand :where(img){block-size:calc(var(--luz-control-lg) * 2)}.luz-cms-header__sections{padding-block:var(--luz-space-2xs);border-block:1px solid var(--luz-divider)}@media(min-width:769px){.luz-cms-header>.o-row{column-gap:var(--luz-space-lg)}.luz-cms-header__sections{justify-content:center}}@media(max-width:768px){.luz-cms-header>.o-row>.luz-cms-header__brand{flex:1 1 0}}@media(max-width:1023px){.luz-cms-header--masthead .luz-cms-header__brand{font-size:var(--luz-text-3xl)}}@media(max-width:640px){.luz-cms-header__brand{font-size:var(--luz-text-lg)}.luz-cms-header--masthead .luz-cms-header__brand{font-size:var(--luz-text-2xl)}}@supports (anchor-name: --luz-bar){.luz-cms-header,.luz-cms-header__sections{anchor-name:--luz-bar;anchor-scope:--luz-bar}.luz-cms-header :where(luz-lang-switch){--luz-lang-switch-top: anchor(--luz-bar end, var(--luz-bar-h))}}}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
@layer luz.tokens, luz.themes, luz.settings, luz.generic, luz.elements, luz.objects, luz.components, luz.utilities, luz.
|
|
1
|
+
@layer luz.tokens, luz.themes, luz.settings, luz.generic, luz.elements, luz.objects, luz.components, luz.utilities, luz.catalog, luz.landing, luz.cms, luz.app, luz.docs, luz.print;
|
|
2
2
|
@layer luz.cms {
|
|
3
3
|
/* ==========================================================================
|
|
4
4
|
LUZ CMS: page header.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
@layer luz.tokens,luz.themes,luz.settings,luz.generic,luz.elements,luz.objects,luz.components,luz.utilities,luz.
|
|
1
|
+
@layer luz.tokens,luz.themes,luz.settings,luz.generic,luz.elements,luz.objects,luz.components,luz.utilities,luz.catalog,luz.landing,luz.cms,luz.app,luz.docs,luz.print;@layer luz.cms{.luz-cms-page-header{margin-block-end:var(--luz-space-xl)}.luz-cms-page-header__title{margin-block-end:var(--luz-space-2xs);color:var(--luz-text-primary);font-family:var(--luz-font-heading);font-size:var(--luz-text-3xl);font-weight:300;letter-spacing:-1px}.luz-cms-page-header__lead{max-inline-size:600px;color:var(--luz-text-secondary);font-size:var(--luz-text-base)}@media(max-width:640px){.luz-cms-page-header__title{font-size:var(--luz-text-2xl);letter-spacing:-.5px}}.luz-cms-page-header__title:lang(ar){letter-spacing:0}}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@luz-ds/cms",
|
|
3
|
-
"version": "0.1
|
|
3
|
+
"version": "0.2.1",
|
|
4
4
|
"description": "LUZ Design System — the page structure of a blog, a newspaper or any CMS (header, page header, article header, table of contents, footer), built on @luz-ds/core",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"type": "module",
|
|
@@ -39,18 +39,18 @@
|
|
|
39
39
|
"access": "public"
|
|
40
40
|
},
|
|
41
41
|
"peerDependencies": {
|
|
42
|
-
"@luz-ds/core": "^0.1.0",
|
|
43
|
-
"@luz-ds/
|
|
44
|
-
"@luz-ds/tokens": "^0.1.0"
|
|
42
|
+
"@luz-ds/core": "^0.1.0 || ^0.2.0",
|
|
43
|
+
"@luz-ds/catalog": "^0.1.0 || ^0.2.0",
|
|
44
|
+
"@luz-ds/tokens": "^0.1.0 || ^0.2.0"
|
|
45
45
|
},
|
|
46
46
|
"peerDependenciesMeta": {
|
|
47
|
-
"@luz-ds/
|
|
47
|
+
"@luz-ds/catalog": {
|
|
48
48
|
"optional": true
|
|
49
49
|
}
|
|
50
50
|
},
|
|
51
51
|
"devDependencies": {
|
|
52
|
-
"@luz-ds/core": "0.1
|
|
53
|
-
"@luz-ds/
|
|
54
|
-
"@luz-ds/
|
|
52
|
+
"@luz-ds/core": "0.2.1",
|
|
53
|
+
"@luz-ds/catalog": "0.2.1",
|
|
54
|
+
"@luz-ds/tokens": "0.2.1"
|
|
55
55
|
}
|
|
56
56
|
}
|