@myst-theme/styles 0.9.6 → 0.9.8

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.
Files changed (5) hide show
  1. package/.turbo/turbo-build.log +2 -2
  2. package/CHANGELOG.md +12 -0
  3. package/grid-system.css +7 -2
  4. package/index.js +16 -1
  5. package/package.json +1 -1
package/.turbo/turbo-build.log CHANGED
@@ -1,5 +1,5 @@
1
1
 
2
- > @myst-theme/styles@0.9.6 build
2
+ > @myst-theme/styles@0.9.8 build
3
3
  > tailwindcss -m -i ./app.css -o ../docs/public/tailwind.css
4
4
 
5
5
  Browserslist: caniuse-lite is outdated. Please run:
@@ -8,4 +8,4 @@ Browserslist: caniuse-lite is outdated. Please run:
8
8
 
9
9
  Rebuilding...
10
10
 
11
- Done in 2140ms.
11
+ Done in 2340ms.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,17 @@
1
1
  # @myst-theme/styles
2
2
 
3
+ ## 0.9.8
4
+
5
+ ### Patch Changes
6
+
7
+ - ba28db7e: This fixes an asymmetric `col-*` class, improves main column width heirarchy and makes more space for `col-body` on the `lg` breakpoint
8
+
9
+ ## 0.9.7
10
+
11
+ ### Patch Changes
12
+
13
+ - 583a185c: A new, centered article grid
14
+
3
15
  ## 0.9.6
4
16
 
5
17
  ### Patch Changes
package/grid-system.css CHANGED
@@ -5,8 +5,13 @@
5
5
  .article-left-grid {
6
6
  @apply grid content-start grid-cols-article-sm md:grid-cols-article-left-md lg:grid-cols-article-left-lg xl:grid-cols-article-left-xl 2xl:grid-cols-article-left-2xl;
7
7
  }
8
+ .article-center-grid {
9
+ @apply grid content-start grid-cols-article-center-sm md:grid-cols-article-center-md lg:grid-cols-article-center-lg xl:grid-cols-article-center-xl 2xl:grid-cols-article-center-2xl;
10
+ }
11
+
8
12
  .article-grid > *,
9
- .article-left-grid > * {
13
+ .article-left-grid > *,
14
+ .article-center-grid > * {
10
15
  /* The default is spanning the body for any child component */
11
16
  @apply col-body;
12
17
  /* Grids do not have margin-collapse, so each direct child needs to be addressed */
@@ -24,7 +29,7 @@
24
29
  }
25
30
  .col-margin-right,
26
31
  .col-margin {
27
- @apply col-body lg:col-margin-right-lg;
32
+ @apply col-body xl:col-margin-right-lg;
28
33
  }
29
34
  .col-margin-right-inset {
30
35
  @apply col-body lg:col-margin-right-inset-lg;
package/index.js CHANGED
@@ -37,6 +37,19 @@ const themeExtensions = {
37
37
  '[screen-start] 0.5rem [screen-inset-start page-start page-inset-start body-outset-start] 3rem [body-start gutter-left-start] 1rem [body-inset-start] minmax(8ch, 12ch) [middle-start] minmax(8ch, 12ch) [gutter-left-end] minmax(8ch, 12ch) minmax(8ch, 12ch) [gutter-right-start] minmax(8ch, 12ch) [middle-end] minmax(8ch, 12ch) [body-inset-end] 1rem [body-end] 1fr [gutter-right-end] 1rem [body-outset-end] minmax(10rem, 18rem) [page-inset-end] 1rem [page-end] 1fr [screen-inset-end] 0.5rem [screen-end]',
38
38
  'article-left-2xl':
39
39
  '[screen-start] 0.5rem [screen-inset-start] 1fr [page-start page-inset-start body-outset-start] 3rem [body-start gutter-left-start] 1rem [body-inset-start] minmax(8ch, 12ch) [middle-start] minmax(8ch, 12ch) [gutter-left-end] minmax(8ch, 12ch) minmax(8ch, 12ch) [gutter-right-start] minmax(8ch, 12ch) [middle-end] minmax(8ch, 12ch) [body-inset-end] 1rem [body-end] 1fr [gutter-right-end] 1rem [body-outset-end] minmax(10rem, 18rem) [page-inset-end] 1rem [page-end] 1fr [screen-inset-end] 0.5rem [screen-end]',
40
+ // article - left theme
41
+ 'article-center-sm':
42
+ '[screen-start screen-inset-start] 0.5rem [page-start page-inset-start body-outset-start body-start gutter-left-start body-inset-start middle-start] 1fr 1fr [gutter-left-end] 1fr 1fr [gutter-right-start] 1fr 1fr [middle-end body-inset-end body-end gutter-right-end body-outset-end page-inset-end page-end] 0.5rem [screen-inset-end screen-end]',
43
+ 'article-center-md':
44
+ '[screen-start] 0.25rem [screen-inset-start page-start page-inset-start body-outset-start] 1fr [body-start gutter-left-start] 1rem [body-inset-start] minmax(2ch, 10ch) [middle-start] minmax(2ch, 10ch) [gutter-left-end] minmax(2ch, 10ch) minmax(2ch, 10ch) [gutter-right-start] minmax(2ch, 10ch) [middle-end] minmax(2ch, 10ch) [body-inset-end] 1rem [body-end gutter-right-end] 1fr [body-outset-end page-inset-end page-end screen-inset-end] 0.25rem [screen-end]',
45
+ 'article-center-lg': `[screen-start] 0.5rem [screen-inset-start page-start] 2rem [page-inset-start] 2fr [body-outset-start gutter-outset-left-start] 1rem
46
+ [body-start gutter-left-start] 2rem [body-inset-start gutter-left-start] minmax(8ch, 10ch) [gutter-left-end middle-start] minmax(8ch, 10ch) minmax(8ch, 10ch) []
47
+ minmax(8ch, 10ch) [] minmax(8ch, 10ch) [middle-end gutter-right-start gutter-page-right-start] minmax(8ch, 10ch) [body-inset-end gutter-right-end] 2rem
48
+ [body-end] 1rem [body-outset-end] 2fr [page-inset-end] 2rem [page-end screen-inset-end] 0.5rem [screen-end]`,
49
+ 'article-center-xl':
50
+ '[screen-start] 0.25rem [screen-inset-start] 1fr [page-start] 3rem [page-inset-start] minmax(4rem, 9rem) [body-outset-start] 3rem [body-start gutter-left-start] 1rem [body-inset-start] minmax(8ch, 10ch) [middle-start] minmax(8ch, 10ch) [gutter-left-end] minmax(8ch, 10ch) minmax(8ch, 10ch) [gutter-right-start] minmax(8ch, 10ch) [middle-end] minmax(8ch, 10ch) [body-inset-end] 1rem [body-end gutter-right-end] 3rem [body-outset-end] minmax(4rem, 9rem) [page-inset-end] 3rem [page-end] 1fr [screen-inset-end] 0.25rem [screen-end]',
51
+ 'article-center-2xl':
52
+ '[screen-start] 0.5rem [screen-inset-start] 1fr [page-start] 3rem [page-inset-start] minmax(4rem, 9rem) [body-outset-start] 3rem [body-start gutter-left-start] 1rem [body-inset-start] minmax(8ch, 10ch) [middle-start] minmax(8ch, 10ch) [gutter-left-end] minmax(8ch, 10ch) minmax(8ch, 10ch) [gutter-right-start] minmax(8ch, 10ch) [middle-end] minmax(8ch, 10ch) [body-inset-end] 1rem [body-end gutter-right-end] 3rem [body-outset-end] minmax(4rem, 9rem) [page-inset-end] 3rem [page-end] 1fr [screen-inset-end] 0.5rem [screen-end]',
40
53
  },
41
54
  gridColumn: {
42
55
  screen: 'screen',
@@ -66,7 +79,7 @@ const themeExtensions = {
66
79
  'gutter-outset-right': 'gutter-right / body-outset',
67
80
  'margin-left-lg': 'page / body-start',
68
81
  'margin-right-lg': 'body-end / page-end',
69
- 'margin-right-inset-lg': 'body-outset-end /page-inset',
82
+ 'margin-right-inset-lg': 'body-end /page-inset',
70
83
  'body-outset-right': 'body / body-outset',
71
84
  'page-inset-right': 'body / page-inset',
72
85
  'page-right': 'body / page',
@@ -145,6 +158,8 @@ const safeList = [
145
158
  'xl:article-grid',
146
159
  'article-left-grid',
147
160
  'xl:article-left-grid',
161
+ 'article-center-grid',
162
+ 'xl:article-center-grid',
148
163
  'col-screen',
149
164
  'col-screen-inset',
150
165
  'col-page',
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@myst-theme/styles",
3
- "version": "0.9.6",
3
+ "version": "0.9.8",
4
4
  "main": "index.js",
5
5
  "style": "app.css",
6
6
  "scripts": {