ada-ui 5.9.0 → 5.9.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.
Files changed (9) hide show
  1. package/CHANGELOG.md +6 -0
  2. package/css/ada.blue.css +1 -1
  3. package/index.html +13 -9
  4. package/package.json +1 -1
  5. package/scss/ada.blue.scss +5 -5
  6. package/css/ada.blue2.css +0 -1
  7. package/css/ada.green2.css +0 -1
  8. /package/scss/{ada.blue2.scss → deprecated/_ada.blue-alt-old.scss} +0 -0
  9. /package/scss/{ada.green2.scss → deprecated/_ada.green-alt-old.scss} +0 -0
package/CHANGELOG.md CHANGED
@@ -1,5 +1,11 @@
1
1
  # ada-ui
2
2
 
3
+ ## 5.9.1
4
+
5
+ ### Patch Changes
6
+
7
+ - 9329d75: Streamlined blue theme to be the best of both previously existing blue themes
8
+
3
9
  ## 5.9.0
4
10
 
5
11
  ### Minor Changes
package/css/ada.blue.css CHANGED
@@ -1 +1 @@
1
- .warn,.shade3,.shade2,.shade1,.default,:root{--bg-body: var(--color950);--fg-body: var(--color100);--bg-body-light: var(--color100);--fg-body-light: var(--color800);--100: 0.91 0.05 var(--hue);--500: calc(var(--l-base) + 0.15) calc(var(--c-base) + 0.06) var(--hue);--600: calc(var(--l-base) + 0.1) calc(var(--c-base) + 0.04) var(--hue);--700: calc(var(--l-base) + 0.05) calc(var(--c-base) + 0.02) var(--hue);--800: var(--l-base) var(--c-base) var(--hue);--950: 0.18 0.03 var(--hue);--color100: oklch(var(--100));--color500: oklch(var(--500));--color600: oklch(var(--600));--color700: oklch(var(--700));--color800: oklch(var(--800));--color950: oklch(var(--950))}.light-theme.warn,.light-theme.shade3,.light-theme.shade2,.light-theme.shade1,.light-theme.default,.light-theme:root,:root.light-theme .warn,:root.light-theme .shade3,:root.light-theme .shade2,:root.light-theme .shade1,:root.light-theme .default,:root.light-theme :root{--l-base: var(--l-base-light);--c-base: var(--c-base-light);--bg-body: var(--bg-body-light);--fg-body: var(--fg-body-light)}:root{--l-base: 0.26;--c-base: 0.06;--l-base-light: 0.4;--c-base-light: 0.1}.default,:root{--hue: 246}.shade1{--hue: 225}.shade2{--hue: 190}.shade3{--hue: 165}.warn{--hue: 29}
1
+ .warn,.shade3,.shade2,.shade1,.default,:root{--bg-body: var(--color950);--fg-body: var(--color100);--bg-body-light: var(--color100);--fg-body-light: var(--color800);--100: 0.91 0.05 var(--hue);--500: calc(var(--l-base) + 0.15) calc(var(--c-base) + 0.06) var(--hue);--600: calc(var(--l-base) + 0.1) calc(var(--c-base) + 0.04) var(--hue);--700: calc(var(--l-base) + 0.05) calc(var(--c-base) + 0.02) var(--hue);--800: var(--l-base) var(--c-base) var(--hue);--950: 0.18 0.03 var(--hue);--color100: oklch(var(--100));--color500: oklch(var(--500));--color600: oklch(var(--600));--color700: oklch(var(--700));--color800: oklch(var(--800));--color950: oklch(var(--950))}.light-theme.warn,.light-theme.shade3,.light-theme.shade2,.light-theme.shade1,.light-theme.default,.light-theme:root,:root.light-theme .warn,:root.light-theme .shade3,:root.light-theme .shade2,:root.light-theme .shade1,:root.light-theme .default,:root.light-theme :root{--l-base: var(--l-base-light);--c-base: var(--c-base-light);--bg-body: var(--bg-body-light);--fg-body: var(--fg-body-light)}:root{--l-base: 0.3;--c-base: 0.1;--l-base-light: 0.4;--c-base-light: 0.1}.default,:root{--hue: 246}.shade1{--hue: 220}.shade2{--hue: 195}.shade3{--hue: 170}.warn{--hue: 29}
package/index.html CHANGED
@@ -374,13 +374,13 @@
374
374
  The panel has a translucent background, so when stacking multiple
375
375
  panels the background changes slightly with each level.
376
376
  </p>
377
- <div class="panel" style="margin: var(--spacing)">
377
+ <div class="panel">
378
378
  <header></header>
379
379
  <article>
380
- <div class="panel" style="margin: var(--spacing)">
380
+ <div class="panel">
381
381
  <header></header>
382
382
  <article>
383
- <div class="panel" style="margin: var(--spacing)">
383
+ <div class="panel">
384
384
  <header></header>
385
385
  <article>Content</article>
386
386
  <footer></footer>
@@ -397,31 +397,35 @@
397
397
  <div class="panel">
398
398
  <header><h2 id="tile">Tile</h2></header>
399
399
  <article
400
- style="display: grid; grid-auto-flow: column; gap: var(--spacing)"
400
+ style="
401
+ display: grid;
402
+ grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr));
403
+ gap: var(--spacing);
404
+ "
401
405
  >
402
406
  <div class="tile">
403
407
  <header></header>
404
- <article>Tile</article>
408
+ <article>Tile Content</article>
405
409
  <footer></footer>
406
410
  </div>
407
411
  <div class="tile shade1">
408
412
  <header></header>
409
- <article>Tile</article>
413
+ <article>Tile Content</article>
410
414
  <footer></footer>
411
415
  </div>
412
416
  <div class="tile shade2">
413
417
  <header></header>
414
- <article>Tile</article>
418
+ <article>Tile Content</article>
415
419
  <footer></footer>
416
420
  </div>
417
421
  <div class="tile shade3">
418
422
  <header></header>
419
- <article>Tile</article>
423
+ <article>Tile Content</article>
420
424
  <footer></footer>
421
425
  </div>
422
426
  <div class="tile warn">
423
427
  <header></header>
424
- <article>Tile</article>
428
+ <article>Tile Content</article>
425
429
  <footer></footer>
426
430
  </div>
427
431
  </article>
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "ada-ui",
3
- "version": "5.9.0",
3
+ "version": "5.9.1",
4
4
  "scripts": {
5
5
  "dev": "concurrently -n scss,serve 'sass scss:css --watch --embed-source-map' 'alive-server .'",
6
6
  "postdev": "git checkout css/*",
package/scss/ada.blue.scss CHANGED
@@ -2,8 +2,8 @@
2
2
 
3
3
  :root {
4
4
  @extend .default;
5
- --l-base: 0.26;
6
- --c-base: 0.06;
5
+ --l-base: 0.3;
6
+ --c-base: 0.1;
7
7
 
8
8
  --l-base-light: 0.4;
9
9
  --c-base-light: 0.1;
@@ -16,17 +16,17 @@
16
16
 
17
17
  .shade1 {
18
18
  @extend %colourShades;
19
- --hue: 225;
19
+ --hue: 220;
20
20
  }
21
21
 
22
22
  .shade2 {
23
23
  @extend %colourShades;
24
- --hue: 190;
24
+ --hue: 195;
25
25
  }
26
26
 
27
27
  .shade3 {
28
28
  @extend %colourShades;
29
- --hue: 165;
29
+ --hue: 170;
30
30
  }
31
31
 
32
32
  .warn {
package/css/ada.blue2.css DELETED
@@ -1 +0,0 @@
1
- .warn,.shade3,.shade2,.shade1,.default,:root{--bg-body: var(--color950);--fg-body: var(--color100);--bg-body-light: var(--color100);--fg-body-light: var(--color800);--100: 0.91 0.05 var(--hue);--500: calc(var(--l-base) + 0.15) calc(var(--c-base) + 0.06) var(--hue);--600: calc(var(--l-base) + 0.1) calc(var(--c-base) + 0.04) var(--hue);--700: calc(var(--l-base) + 0.05) calc(var(--c-base) + 0.02) var(--hue);--800: var(--l-base) var(--c-base) var(--hue);--950: 0.18 0.03 var(--hue);--color100: oklch(var(--100));--color500: oklch(var(--500));--color600: oklch(var(--600));--color700: oklch(var(--700));--color800: oklch(var(--800));--color950: oklch(var(--950))}.light-theme.warn,.light-theme.shade3,.light-theme.shade2,.light-theme.shade1,.light-theme.default,.light-theme:root,:root.light-theme .warn,:root.light-theme .shade3,:root.light-theme .shade2,:root.light-theme .shade1,:root.light-theme .default,:root.light-theme :root{--l-base: var(--l-base-light);--c-base: var(--c-base-light);--bg-body: var(--bg-body-light);--fg-body: var(--fg-body-light)}:root{--l-base: 0.34;--c-base: 0.1;--l-base-light: 0.42;--c-base-light: 0.13}.default,:root{--hue: 258}.shade1{--hue: 210}.shade2{--hue: 118}.shade3{--hue: 96}.warn{--hue: 29}
package/css/ada.green2.css DELETED
@@ -1 +0,0 @@
1
- .warn,.shade3,.shade2,.shade1,.default,:root{--bg-body: var(--color950);--fg-body: var(--color100);--bg-body-light: var(--color100);--fg-body-light: var(--color800);--100: 0.91 0.05 var(--hue);--500: calc(var(--l-base) + 0.15) calc(var(--c-base) + 0.06) var(--hue);--600: calc(var(--l-base) + 0.1) calc(var(--c-base) + 0.04) var(--hue);--700: calc(var(--l-base) + 0.05) calc(var(--c-base) + 0.02) var(--hue);--800: var(--l-base) var(--c-base) var(--hue);--950: 0.18 0.03 var(--hue);--color100: oklch(var(--100));--color500: oklch(var(--500));--color600: oklch(var(--600));--color700: oklch(var(--700));--color800: oklch(var(--800));--color950: oklch(var(--950))}.light-theme.warn,.light-theme.shade3,.light-theme.shade2,.light-theme.shade1,.light-theme.default,.light-theme:root,:root.light-theme .warn,:root.light-theme .shade3,:root.light-theme .shade2,:root.light-theme .shade1,:root.light-theme .default,:root.light-theme :root{--l-base: var(--l-base-light);--c-base: var(--c-base-light);--bg-body: var(--bg-body-light);--fg-body: var(--fg-body-light)}:root{--l-base: 0.29;--c-base: 0.07;--l-base-light: 0.4;--c-base-light: 0.1}.default,:root{--hue: 155}.shade1{--hue: 138}.shade2{--hue: 129}.shade3{--hue: 185}.warn{--hue: 29}