@radioactive-labs/plutonium 0.4.11 → 0.31.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.
Files changed (11) hide show
  1. package/package.json +1 -1
  2. package/src/css/core.css +2 -2
  3. package/src/css/easymde.css +8 -8
  4. package/src/css/intl_tel_input.css +7 -7
  5. package/src/css/slim_select.css +5 -5
  6. package/src/dist/css/plutonium.css +2 -2
  7. package/src/dist/js/plutonium.js +13 -3
  8. package/src/dist/js/plutonium.js.map +3 -3
  9. package/src/dist/js/plutonium.min.js +1 -1
  10. package/src/dist/js/plutonium.min.js.map +2 -2
  11. package/src/js/controllers/color_mode_controller.js +19 -3
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@radioactive-labs/plutonium",
3
- "version": "0.4.11",
3
+ "version": "0.31.0",
4
4
  "description": "Core assets for the Plutonium gem",
5
5
  "type": "module",
6
6
  "main": "src/js/core.js",
package/src/css/core.css CHANGED
@@ -8,9 +8,9 @@
8
8
  }
9
9
 
10
10
  .pu-color-input::-webkit-color-swatch {
11
- @apply border-none rounded-lg;
11
+ @apply border-none rounded-sm;
12
12
  }
13
13
 
14
14
  .pu-color-input::-moz-color-swatch {
15
- @apply border-none rounded-lg;
15
+ @apply border-none rounded-sm;
16
16
  }
package/src/css/easymde.css CHANGED
@@ -6,7 +6,7 @@
6
6
 
7
7
  /* Container and CodeMirror theming */
8
8
  .EasyMDEContainer .CodeMirror {
9
- @apply border-gray-300 bg-white text-gray-900 dark:border-gray-600 dark:bg-gray-800 dark:text-gray-100;
9
+ @apply border-gray-300 bg-surface text-gray-900 dark:border-gray-600 dark:bg-surface-dark dark:text-gray-100;
10
10
  }
11
11
 
12
12
  .EasyMDEContainer .CodeMirror-focused .CodeMirror-selected {
@@ -31,7 +31,7 @@
31
31
 
32
32
  /* Gutter theming */
33
33
  .CodeMirror-gutters {
34
- @apply border-gray-300 bg-gray-50 dark:border-gray-600 dark:bg-gray-700;
34
+ @apply border-gray-300 bg-elevated dark:border-gray-600 dark:bg-elevated-dark;
35
35
  }
36
36
 
37
37
  .CodeMirror-linenumber {
@@ -44,11 +44,11 @@
44
44
 
45
45
  /* Toolbar theming */
46
46
  .editor-toolbar {
47
- @apply border-gray-300 bg-white dark:border-gray-600 dark:bg-gray-800;
47
+ @apply border-gray-300 bg-surface dark:border-gray-600 dark:bg-surface-dark;
48
48
  }
49
49
 
50
50
  .editor-toolbar.fullscreen {
51
- @apply bg-white dark:bg-gray-800;
51
+ @apply bg-surface dark:bg-surface-dark;
52
52
  }
53
53
 
54
54
  .editor-toolbar button {
@@ -71,7 +71,7 @@
71
71
 
72
72
  /* Preview theming */
73
73
  .editor-preview {
74
- @apply bg-gray-50 text-gray-900 dark:bg-gray-800 dark:text-gray-100;
74
+ @apply bg-elevated text-gray-900 dark:bg-surface-dark dark:text-gray-100;
75
75
  }
76
76
 
77
77
  .editor-preview pre {
@@ -84,7 +84,7 @@
84
84
  }
85
85
 
86
86
  .editor-preview-side {
87
- @apply border-gray-300 bg-white dark:border-gray-600 dark:bg-gray-800;
87
+ @apply border-gray-300 bg-surface dark:border-gray-600 dark:bg-surface-dark;
88
88
  }
89
89
 
90
90
  /* CodeMirror syntax highlighting - dark mode support */
@@ -127,11 +127,11 @@
127
127
 
128
128
  /* Dropdown theming */
129
129
  .editor-toolbar .easymde-dropdown {
130
- @apply bg-white border-gray-300 dark:bg-gray-800 dark:border-gray-600;
130
+ @apply bg-surface border-gray-300 dark:bg-surface-dark dark:border-gray-600;
131
131
  }
132
132
 
133
133
  .easymde-dropdown-content {
134
- @apply bg-white shadow-lg border border-gray-200 dark:bg-gray-800 dark:border-gray-600 dark:shadow-gray-900/20;
134
+ @apply bg-surface shadow-lg border border-gray-200 dark:bg-surface-dark dark:border-gray-600 dark:shadow-gray-900/20;
135
135
  }
136
136
 
137
137
  .easymde-dropdown-content button {
package/src/css/intl_tel_input.css CHANGED
@@ -9,7 +9,7 @@
9
9
  --iti-hover-color: theme(colors.primary.50);
10
10
  --iti-border-color: theme(colors.gray.300);
11
11
  --iti-dialcode-color: theme(colors.gray.500);
12
- --iti-dropdown-bg: theme(colors.white);
12
+ --iti-dropdown-bg: theme(colors.surface.DEFAULT);
13
13
  --iti-arrow-color: theme(colors.gray.700);
14
14
  }
15
15
 
@@ -19,7 +19,7 @@
19
19
  --iti-hover-color: theme(colors.primary.900 / 0.3);
20
20
  --iti-border-color: theme(colors.gray.600);
21
21
  --iti-dialcode-color: theme(colors.gray.400);
22
- --iti-dropdown-bg: theme(colors.gray.700);
22
+ --iti-dropdown-bg: theme(colors.surface.dark);
23
23
  --iti-arrow-color: theme(colors.white);
24
24
  }
25
25
  }
@@ -29,7 +29,7 @@
29
29
  --iti-hover-color: theme(colors.primary.900 / 0.3);
30
30
  --iti-border-color: theme(colors.gray.600);
31
31
  --iti-dialcode-color: theme(colors.gray.400);
32
- --iti-dropdown-bg: theme(colors.gray.700);
32
+ --iti-dropdown-bg: theme(colors.surface.dark);
33
33
  --iti-arrow-color: theme(colors.white);
34
34
  }
35
35
 
@@ -42,7 +42,7 @@
42
42
  .iti input.iti__tel-input,
43
43
  .iti input.iti__tel-input[type=tel],
44
44
  .iti input.iti__tel-input[type=text] {
45
- @apply w-full border border-gray-300 rounded-md shadow-sm font-medium text-sm bg-white text-gray-700 outline-none transition-colors duration-200 focus:ring-2 focus:ring-primary-500 focus:border-primary-500 dark:bg-gray-700 dark:border-gray-600 dark:text-white dark:placeholder-gray-400;
45
+ @apply w-full border border-gray-300 rounded shadow-sm font-medium text-sm bg-surface text-gray-700 outline-none transition-colors duration-200 focus:ring-2 focus:ring-primary-500 focus:border-primary-500 dark:bg-elevated-dark dark:border-gray-600 dark:text-white dark:placeholder-gray-400;
46
46
  padding: theme(spacing.2);
47
47
  padding-left: 52px;
48
48
  /* Space for country selector */
@@ -87,12 +87,12 @@
87
87
 
88
88
  /* Dropdown content styling to match form theme */
89
89
  .iti .iti__dropdown-content {
90
- @apply border border-gray-300 bg-white shadow-sm rounded-md dark:bg-gray-700 dark:border-gray-600;
90
+ @apply border border-gray-300 bg-surface shadow-sm rounded dark:bg-surface-dark dark:border-gray-600;
91
91
  }
92
92
 
93
93
  /* Search input to match form theme */
94
94
  .iti .iti__search-input {
95
- @apply w-full p-2 border border-gray-300 rounded-md shadow-sm font-medium text-sm bg-white text-gray-700 outline-none focus:ring-2 focus:ring-primary-500 focus:border-primary-500 dark:bg-gray-700 dark:border-gray-600 dark:text-white dark:placeholder-gray-400;
95
+ @apply w-full p-2 border border-gray-300 rounded shadow-sm font-medium text-sm bg-surface text-gray-700 outline-none focus:ring-2 focus:ring-primary-500 focus:border-primary-500 dark:bg-elevated-dark dark:border-gray-600 dark:text-white dark:placeholder-gray-400;
96
96
  margin: theme(spacing.2);
97
97
  width: calc(100% - theme(spacing.4));
98
98
  }
@@ -186,7 +186,7 @@
186
186
  }
187
187
 
188
188
  .iti--fullscreen-popup .iti__dropdown-content {
189
- @apply bg-white dark:bg-gray-700;
189
+ @apply bg-surface dark:bg-surface-dark;
190
190
  }
191
191
 
192
192
  .iti--fullscreen-popup .iti__country {
package/src/css/slim_select.css CHANGED
@@ -36,7 +36,7 @@
36
36
 
37
37
  /* Main container - Updated to match form input theme */
38
38
  .ss-main {
39
- @apply flex flex-row relative select-none w-full min-h-8 p-2 cursor-pointer border border-gray-300 rounded-md shadow-sm font-medium text-sm bg-white text-gray-700 outline-none transition-colors duration-200 overflow-hidden focus:ring-2 focus:ring-primary-500 focus:border-primary-500 dark:bg-gray-700 dark:border-gray-600 dark:text-white dark:placeholder-gray-400;
39
+ @apply flex flex-row relative select-none w-full min-h-8 p-2 cursor-pointer border border-gray-300 rounded shadow-sm font-medium text-sm bg-surface text-gray-700 outline-none transition-colors duration-200 overflow-hidden focus:ring-2 focus:ring-primary-500 focus:border-primary-500 dark:bg-elevated-dark dark:border-gray-600 dark:text-white dark:placeholder-gray-400;
40
40
  }
41
41
 
42
42
  .ss-main.ss-disabled {
@@ -131,7 +131,7 @@
131
131
 
132
132
  /* Content container - Updated to match shadow and borders */
133
133
  .ss-content {
134
- @apply absolute flex h-auto flex-col w-auto max-h-72 border border-gray-300 bg-white shadow-sm transition-all duration-200 opacity-0 z-[10000] overflow-hidden dark:bg-gray-700 dark:border-gray-600;
134
+ @apply absolute flex h-auto flex-col w-auto max-h-72 border border-gray-300 bg-surface shadow-sm transition-all duration-200 opacity-0 z-[10000] overflow-hidden dark:bg-surface-dark dark:border-gray-600;
135
135
  transform: scaleY(0);
136
136
  transform-origin: top;
137
137
  }
@@ -162,14 +162,14 @@
162
162
  }
163
163
 
164
164
  .ss-content .ss-search input {
165
- @apply inline-flex flex-auto w-full min-w-0 p-2 m-0 border border-gray-300 rounded-md shadow-sm font-medium text-sm bg-white outline-none text-left placeholder:text-gray-400 focus:ring-2 focus:ring-primary-500 focus:border-primary-500 dark:bg-gray-700 dark:border-gray-600 dark:text-white dark:placeholder-gray-400;
165
+ @apply inline-flex flex-auto w-full min-w-0 p-2 m-0 border border-gray-300 rounded shadow-sm font-medium text-sm bg-surface outline-none text-left placeholder:text-gray-400 focus:ring-2 focus:ring-primary-500 focus:border-primary-500 dark:bg-elevated-dark dark:border-gray-600 dark:text-white dark:placeholder-gray-400;
166
166
  box-sizing: border-box;
167
167
  font-size: inherit;
168
168
  line-height: inherit;
169
169
  }
170
170
 
171
171
  .ss-content .ss-search .ss-addable {
172
- @apply inline-flex justify-center items-center cursor-pointer flex-none h-auto ml-2 border border-gray-300 rounded-md shadow-sm dark:border-gray-600;
172
+ @apply inline-flex justify-center items-center cursor-pointer flex-none h-auto ml-2 border border-gray-300 rounded shadow-sm dark:border-gray-600;
173
173
  }
174
174
 
175
175
  .ss-content .ss-search .ss-addable svg {
@@ -202,7 +202,7 @@
202
202
 
203
203
  /* Option groups - Updated colors */
204
204
  .ss-content .ss-list .ss-optgroup .ss-optgroup-label {
205
- @apply flex flex-row items-center justify-between p-2 bg-gray-50 dark:bg-gray-600;
205
+ @apply flex flex-row items-center justify-between p-2 bg-elevated dark:bg-elevated-dark;
206
206
  }
207
207
 
208
208
  .ss-content .ss-list .ss-optgroup .ss-optgroup-label .ss-optgroup-label-text {