march-ui 0.0.2 → 0.0.3

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 (6) hide show
  1. package/ContextMenu/index.css +6 -5
  2. package/MenuItem/colors.css +4 -4
  3. package/Tabs/colors.css +8 -8
  4. package/Tabs/index.css +2 -2
  5. package/UI/colors.css +3 -3
  6. package/package.json +1 -1
package/ContextMenu/index.css CHANGED
@@ -1,13 +1,14 @@
1
1
  .contextmenu {
2
2
  width: 12em;
3
- padding-top: 0.25em;
4
- padding-bottom: 0.25em;
5
- border-radius: 0.25em;
3
+ padding-top: 0.5em;
4
+ padding-bottom: 0.5em;
5
+ border-radius: 0.5em;
6
6
  user-select: none;
7
7
  box-sizing: border-box;
8
8
  background-color: var(--contextmenu-background-color);
9
9
  border: 1px solid var(--contextmenu-border-color);
10
10
  box-shadow: 0 0 2em var(--contextmenu-shadow-color);
11
+ overflow: hidden;
11
12
  }
12
13
 
13
14
  .contextmenu--shown {
@@ -19,6 +20,6 @@
19
20
  }
20
21
 
21
22
  .contextmenu .splitter.splitter--horizontal {
22
- margin-top: 0.25em;
23
- margin-bottom: 0.25em;
23
+ margin-top: 0.5em;
24
+ margin-bottom: 0.5em;
24
25
  }
package/MenuItem/colors.css CHANGED
@@ -4,11 +4,11 @@ html {
4
4
 
5
5
  --theme-light-menuitem-foreground-color: hsl(0,0%,10%);
6
6
  --theme-light-menuitem-background-color: inherit;
7
- --theme-light-menuitem-foreground-color-selected: hsl(266,65%,45%);
7
+ --theme-light-menuitem-foreground-color-selected: var(--theme-light-accent-color-focused);
8
8
  --theme-light-menuitem-background-color-selected: hsla(266,100%,58%,0.2);
9
9
  --theme-light-menuitem-foreground-color-hover: hsl(0,0%,0%);
10
10
  --theme-light-menuitem-background-color-hover: hsl(0,0%,95%);
11
- --theme-light-menuitem-foreground-color-selected-hover: hsl(266,65%,40%);
11
+ --theme-light-menuitem-foreground-color-selected-hover: var(--theme-light-accent-color);
12
12
  --theme-light-menuitem-background-color-selected-hover: hsla(266,100%,58%,0.25);
13
13
  --theme-light-menuitem-foreground-color-disabled: hsl(0,0%,60%);
14
14
  --theme-light-menuitem-background-color-disabled: inherit;
@@ -17,11 +17,11 @@ html {
17
17
 
18
18
  --theme-dark-menuitem-foreground-color: hsl(0,0%,90%);
19
19
  --theme-dark-menuitem-background-color: inherit;
20
- --theme-dark-menuitem-foreground-color-selected: hsl(266,100%,63%);
20
+ --theme-dark-menuitem-foreground-color-selected: var(--theme-dark-accent-color);
21
21
  --theme-dark-menuitem-background-color-selected: hsla(266,100%,58%,0.2);
22
22
  --theme-dark-menuitem-foreground-color-hover: hsl(0,0%,100%);
23
23
  --theme-dark-menuitem-background-color-hover: hsl(0,0%,22%);
24
- --theme-dark-menuitem-foreground-color-selected-hover: hsl(266,100%,68%);
24
+ --theme-dark-menuitem-foreground-color-selected-hover: var(--theme-dark-accent-color-focused);
25
25
  --theme-dark-menuitem-background-color-selected-hover: hsla(266,100%,58%,0.25);
26
26
  --theme-dark-menuitem-foreground-color-disabled: hsl(0,0%,50%);
27
27
  --theme-dark-menuitem-background-color-disabled: inherit;
package/Tabs/colors.css CHANGED
@@ -3,18 +3,18 @@ html {
3
3
  /* light theme */
4
4
 
5
5
  --theme-light-tabs-background-color: hsl(0,0%,98%);
6
- --theme-light-tabs-border-color: hsl(0,0%,80%);
6
+ --theme-light-tabs-border-color: hsl(0,0%,85%);
7
7
  --theme-light-tabs-active-background-color: hsl(0,0%,100%);
8
- --theme-light-tabs-active-shadow-color: hsla(0,0%,0%,0.2);
9
- --theme-light-tabs-active-text-color: var(--theme-light-accent-color);
8
+ --theme-light-tabs-active-shadow-color: hsla(0,0%,0%,0.3);
9
+ --theme-light-tabs-active-text-color: var(--theme-light-accent-color-focused);
10
10
 
11
11
  /* dark theme */
12
12
 
13
- --theme-dark-tabs-background-color: hsl(0,0%,16%);
14
- --theme-dark-tabs-border-color: hsl(0,0%,25%);
15
- --theme-dark-tabs-active-background-color: hsl(0,0%,9%);
16
- --theme-dark-tabs-active-shadow-color: hsla(0,0%,0%,0.2);
17
- --theme-dark-tabs-active-text-color: var(--theme-dark-accent-color);
13
+ --theme-dark-tabs-background-color: hsl(0,0%,22%);
14
+ --theme-dark-tabs-border-color: hsl(0,0%,16%);
15
+ --theme-dark-tabs-active-background-color: hsl(0,0%,32%);
16
+ --theme-dark-tabs-active-shadow-color: hsla(0,0%,0%,0.4);
17
+ --theme-dark-tabs-active-text-color: var(--theme-dark-accent-color-focused);
18
18
  }
19
19
 
20
20
  .theme--light {
package/Tabs/index.css CHANGED
@@ -4,7 +4,7 @@
4
4
  flex-direction: row;
5
5
  justify-content: center;
6
6
  padding: 0.25em;
7
- border-radius: 0.25em;
7
+ border-radius: 0.5em;
8
8
  background-color: var(--tabs-border-color);
9
9
  }
10
10
 
@@ -13,7 +13,7 @@
13
13
  width: max-content;
14
14
  flex-direction: row;
15
15
  justify-content: center;
16
- border-radius: 0.25em;
16
+ border-radius: 0.4em;
17
17
  user-select: none;
18
18
  background-color: var(--tabs-background-color);
19
19
  }
package/UI/colors.css CHANGED
@@ -11,7 +11,7 @@ html {
11
11
  /* light theme */
12
12
 
13
13
  --theme-light-accent-color: hsl(266,100%,58%);
14
- --theme-light-accent-color-focused: hsl(266,100%,63%);
14
+ --theme-light-accent-color-focused: hsl(266,100%,66%);
15
15
  --theme-light-accent-darken-color: hsl(266,65%,45%);
16
16
  --theme-light-accent-darken-color-focused: hsl(266,70%,50%);
17
17
 
@@ -22,8 +22,8 @@ html {
22
22
 
23
23
  /* dark theme */
24
24
 
25
- --theme-dark-accent-color: hsl(266,75%,62%);
26
- --theme-dark-accent-color-focused: hsl(266,100%,63%);
25
+ --theme-dark-accent-color: hsl(266,100%,75%);
26
+ --theme-dark-accent-color-focused: hsl(266,100%,82%);
27
27
  --theme-dark-accent-darken-color: hsl(266,65%,45%);
28
28
  --theme-dark-accent-darken-color-focused: hsl(266,70%,50%);
29
29
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "march-ui",
3
- "version": "0.0.2",
3
+ "version": "0.0.3",
4
4
  "description": "Lightweight UI-kit for Mithril.js",
5
5
  "type": "module",
6
6
  "main": "index.js",