@timus-networks/theme 2.4.135 → 2.4.137

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/dist/module.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@timus-networks/theme",
3
3
  "configKey": "themeOptions",
4
- "version": "2.4.134",
4
+ "version": "2.4.136",
5
5
  "builder": {
6
6
  "@nuxt/module-builder": "0.8.4",
7
7
  "unbuild": "2.0.0"
package/dist/module.mjs CHANGED
@@ -11,7 +11,7 @@ const __filename = __cjs_url__.fileURLToPath(import.meta.url);
11
11
  const __dirname = __cjs_path__.dirname(__filename);
12
12
  const require = __cjs_mod__.createRequire(import.meta.url);
13
13
  const name = "@timus-networks/theme";
14
- const version = "2.4.134";
14
+ const version = "2.4.136";
15
15
  const description = "A comprehensive Nuxt.js module providing a tailored theme experience with integrated TailwindCSS support for applications.";
16
16
  const type = "module";
17
17
  const exports = {
@@ -1212,6 +1212,20 @@ select {
1212
1212
  white-space: nowrap;
1213
1213
  }
1214
1214
 
1215
+ /* Element Chalk Variables */
1216
+ /**
1217
+ Bununla selectorun içerisine variable ekleyebiliyorsun
1218
+ .selector{
1219
+ // --el-button-text-color: var(--el-color-primary); -> bu eklenir
1220
+ @include css-var-from-global(('button-text-color'), ('color-primary'));
1221
+
1222
+ // bununla property'ye değer atayabilirsin (hiyerarşik alıyor)
1223
+ color: getCssVar('colors-neutral-light-2');
1224
+
1225
+ // bununla da property alınabililyor
1226
+ font-size: map.get($select, 'font-size');
1227
+ }
1228
+ **/
1215
1229
  html,
1216
1230
  body,
1217
1231
  #main {
@@ -1236,6 +1250,39 @@ body {
1236
1250
  flex-basis: 100%;
1237
1251
  justify-content: center;
1238
1252
  }
1253
+ .page-footer .el-button:first-of-type {
1254
+ --el-button-text-color: var(--el-color-secondary-light-9);
1255
+ --el-button-bg-color: var(--el-color-secondary-light-1);
1256
+ --el-button-border-color: var(--el-color-secondary-light-2);
1257
+ --el-button-outline-color: var(--el-color-secondary-light-5);
1258
+ --el-button-active-color: var(--el-color-secondary-dark-2);
1259
+ --el-button-hover-text-color: var(--el-color-secondary-light-9);
1260
+ --el-button-hover-link-text-color: var(--el-color-secondary-light-5);
1261
+ --el-button-hover-bg-color: var(--el-color-white);
1262
+ --el-button-hover-border-color: var(--el-color-secondary-light-3);
1263
+ --el-button-active-bg-color: var(--el-color-secondary-light-2);
1264
+ --el-button-active-border-color: var(--el-color-secondary-light-2);
1265
+ --el-button-disabled-text-color: var(--el-color-white);
1266
+ --el-button-disabled-bg-color: var(--el-color-secondary-light-1);
1267
+ --el-button-disabled-border-color: var(--el-color-secondary-light-1);
1268
+ }
1269
+ .page-footer .el-button:first-of-type.is-plain, .page-footer .el-button:first-of-type.is-text, .page-footer .el-button:first-of-type.is-link {
1270
+ --el-button-text-color: var(--el-color-secondary);
1271
+ --el-button-disabled-text-color: var(--el-color-secondary-light-9);
1272
+ --el-button-bg-color: var(--el-color-white);
1273
+ --el-button-border-color: var(--el-color-secondary-light-5);
1274
+ --el-button-hover-text-color: var(--el-color-secondary-light-4);
1275
+ --el-button-hover-bg-color: var(--el-color-white);
1276
+ --el-button-hover-border-color: var(--el-color-secondary-light-4);
1277
+ --el-button-active-text-color: var(--el-color-secondary-light-6);
1278
+ --el-button-active-bg-color: var(--el-color-white);
1279
+ --el-button-active-border-color: var(--el-color-secondary-light-6);
1280
+ }
1281
+ .page-footer .el-button:first-of-type.is-plain.is-disabled, .page-footer .el-button:first-of-type.is-plain.is-disabled:hover, .page-footer .el-button:first-of-type.is-plain.is-disabled:focus, .page-footer .el-button:first-of-type.is-plain.is-disabled:active, .page-footer .el-button:first-of-type.is-text.is-disabled, .page-footer .el-button:first-of-type.is-text.is-disabled:hover, .page-footer .el-button:first-of-type.is-text.is-disabled:focus, .page-footer .el-button:first-of-type.is-text.is-disabled:active, .page-footer .el-button:first-of-type.is-link.is-disabled, .page-footer .el-button:first-of-type.is-link.is-disabled:hover, .page-footer .el-button:first-of-type.is-link.is-disabled:focus, .page-footer .el-button:first-of-type.is-link.is-disabled:active {
1282
+ color: var(--el-color-secondary-light-2);
1283
+ background-color: transparent;
1284
+ border-color: var(--el-color-secondary-light-2);
1285
+ }
1239
1286
 
1240
1287
  .el-icon.more-icon {
1241
1288
  align-items: center;
@@ -1250,20 +1297,6 @@ body {
1250
1297
  width: 20px;
1251
1298
  }
1252
1299
 
1253
- /* Element Chalk Variables */
1254
- /**
1255
- Bununla selectorun içerisine variable ekleyebiliyorsun
1256
- .selector{
1257
- // --el-button-text-color: var(--el-color-primary); -> bu eklenir
1258
- @include css-var-from-global(('button-text-color'), ('color-primary'));
1259
-
1260
- // bununla property'ye değer atayabilirsin (hiyerarşik alıyor)
1261
- color: getCssVar('colors-neutral-light-2');
1262
-
1263
- // bununla da property alınabililyor
1264
- font-size: map.get($select, 'font-size');
1265
- }
1266
- **/
1267
1300
  :root {
1268
1301
  --el-color-white: #ffffff;
1269
1302
  --el-color-black: #000000;
@@ -9181,9 +9214,9 @@ heights > $common-component-size
9181
9214
  box-sizing: border-box;
9182
9215
  }
9183
9216
  .el-dialog__footer .el-button {
9184
- flex-grow: 1;
9217
+ flex-basis: 100%;
9185
9218
  }
9186
- .el-dialog__footer .el-button:first-child {
9219
+ .el-dialog__footer .el-button:first-of-type {
9187
9220
  --el-button-text-color: var(--el-color-secondary-light-9);
9188
9221
  --el-button-bg-color: var(--el-color-secondary-light-1);
9189
9222
  --el-button-border-color: var(--el-color-secondary-light-2);
@@ -9199,7 +9232,7 @@ heights > $common-component-size
9199
9232
  --el-button-disabled-bg-color: var(--el-color-secondary-light-1);
9200
9233
  --el-button-disabled-border-color: var(--el-color-secondary-light-1);
9201
9234
  }
9202
- .el-dialog__footer .el-button:first-child.is-plain, .el-dialog__footer .el-button:first-child.is-text, .el-dialog__footer .el-button:first-child.is-link {
9235
+ .el-dialog__footer .el-button:first-of-type.is-plain, .el-dialog__footer .el-button:first-of-type.is-text, .el-dialog__footer .el-button:first-of-type.is-link {
9203
9236
  --el-button-text-color: var(--el-color-secondary);
9204
9237
  --el-button-disabled-text-color: var(--el-color-secondary-light-9);
9205
9238
  --el-button-bg-color: var(--el-color-white);
@@ -9211,7 +9244,7 @@ heights > $common-component-size
9211
9244
  --el-button-active-bg-color: var(--el-color-white);
9212
9245
  --el-button-active-border-color: var(--el-color-secondary-light-6);
9213
9246
  }
9214
- .el-dialog__footer .el-button:first-child.is-plain.is-disabled, .el-dialog__footer .el-button:first-child.is-plain.is-disabled:hover, .el-dialog__footer .el-button:first-child.is-plain.is-disabled:focus, .el-dialog__footer .el-button:first-child.is-plain.is-disabled:active, .el-dialog__footer .el-button:first-child.is-text.is-disabled, .el-dialog__footer .el-button:first-child.is-text.is-disabled:hover, .el-dialog__footer .el-button:first-child.is-text.is-disabled:focus, .el-dialog__footer .el-button:first-child.is-text.is-disabled:active, .el-dialog__footer .el-button:first-child.is-link.is-disabled, .el-dialog__footer .el-button:first-child.is-link.is-disabled:hover, .el-dialog__footer .el-button:first-child.is-link.is-disabled:focus, .el-dialog__footer .el-button:first-child.is-link.is-disabled:active {
9247
+ .el-dialog__footer .el-button:first-of-type.is-plain.is-disabled, .el-dialog__footer .el-button:first-of-type.is-plain.is-disabled:hover, .el-dialog__footer .el-button:first-of-type.is-plain.is-disabled:focus, .el-dialog__footer .el-button:first-of-type.is-plain.is-disabled:active, .el-dialog__footer .el-button:first-of-type.is-text.is-disabled, .el-dialog__footer .el-button:first-of-type.is-text.is-disabled:hover, .el-dialog__footer .el-button:first-of-type.is-text.is-disabled:focus, .el-dialog__footer .el-button:first-of-type.is-text.is-disabled:active, .el-dialog__footer .el-button:first-of-type.is-link.is-disabled, .el-dialog__footer .el-button:first-of-type.is-link.is-disabled:hover, .el-dialog__footer .el-button:first-of-type.is-link.is-disabled:focus, .el-dialog__footer .el-button:first-of-type.is-link.is-disabled:active {
9215
9248
  color: var(--el-color-secondary-light-2);
9216
9249
  background-color: transparent;
9217
9250
  border-color: var(--el-color-secondary-light-2);
@@ -12408,17 +12441,40 @@ heights > $common-component-size
12408
12441
  }
12409
12442
  .popover-footer .el-button {
12410
12443
  flex-basis: 100%;
12411
- @apply el-button--small;
12444
+ @apply el-button--mini;
12412
12445
  }
12413
12446
  .popover-footer .el-button:first-of-type {
12414
- --el-button-hover-text-color: var(--el-color-primary-light-4);
12447
+ --el-button-text-color: var(--el-color-secondary-light-9);
12448
+ --el-button-bg-color: var(--el-color-secondary-light-1);
12449
+ --el-button-border-color: var(--el-color-secondary-light-2);
12450
+ --el-button-outline-color: var(--el-color-secondary-light-5);
12451
+ --el-button-active-color: var(--el-color-secondary-dark-2);
12452
+ --el-button-hover-text-color: var(--el-color-secondary-light-9);
12453
+ --el-button-hover-link-text-color: var(--el-color-secondary-light-5);
12415
12454
  --el-button-hover-bg-color: var(--el-color-white);
12416
- --el-button-hover-border-color: var(--el-color-primary-light-4);
12417
- --el-button-active-text-color: var(--el-color-primary-light-6);
12418
- --el-button-active-bg-color: var(--el-color-white);
12419
- --el-button-active-border-color: var(--el-color-primary-light-6);
12455
+ --el-button-hover-border-color: var(--el-color-secondary-light-3);
12456
+ --el-button-active-bg-color: var(--el-color-secondary-light-2);
12457
+ --el-button-active-border-color: var(--el-color-secondary-light-2);
12458
+ --el-button-disabled-text-color: var(--el-color-white);
12459
+ --el-button-disabled-bg-color: var(--el-color-secondary-light-1);
12460
+ --el-button-disabled-border-color: var(--el-color-secondary-light-1);
12461
+ }
12462
+ .popover-footer .el-button:first-of-type.is-plain, .popover-footer .el-button:first-of-type.is-text, .popover-footer .el-button:first-of-type.is-link {
12463
+ --el-button-text-color: var(--el-color-secondary);
12464
+ --el-button-disabled-text-color: var(--el-color-secondary-light-9);
12420
12465
  --el-button-bg-color: var(--el-color-white);
12421
- --el-button-text-color: var(--el-color-primary);
12466
+ --el-button-border-color: var(--el-color-secondary-light-5);
12467
+ --el-button-hover-text-color: var(--el-color-secondary-light-4);
12468
+ --el-button-hover-bg-color: var(--el-color-white);
12469
+ --el-button-hover-border-color: var(--el-color-secondary-light-4);
12470
+ --el-button-active-text-color: var(--el-color-secondary-light-6);
12471
+ --el-button-active-bg-color: var(--el-color-white);
12472
+ --el-button-active-border-color: var(--el-color-secondary-light-6);
12473
+ }
12474
+ .popover-footer .el-button:first-of-type.is-plain.is-disabled, .popover-footer .el-button:first-of-type.is-plain.is-disabled:hover, .popover-footer .el-button:first-of-type.is-plain.is-disabled:focus, .popover-footer .el-button:first-of-type.is-plain.is-disabled:active, .popover-footer .el-button:first-of-type.is-text.is-disabled, .popover-footer .el-button:first-of-type.is-text.is-disabled:hover, .popover-footer .el-button:first-of-type.is-text.is-disabled:focus, .popover-footer .el-button:first-of-type.is-text.is-disabled:active, .popover-footer .el-button:first-of-type.is-link.is-disabled, .popover-footer .el-button:first-of-type.is-link.is-disabled:hover, .popover-footer .el-button:first-of-type.is-link.is-disabled:focus, .popover-footer .el-button:first-of-type.is-link.is-disabled:active {
12475
+ color: var(--el-color-secondary-light-2);
12476
+ background-color: transparent;
12477
+ border-color: var(--el-color-secondary-light-2);
12422
12478
  }
12423
12479
 
12424
12480
  .el-progress {
@@ -208,6 +208,10 @@
208
208
  </code>
209
209
  </template>
210
210
  </el-card>
211
+ <div class="page-footer">
212
+ <el-button>Cancel</el-button>
213
+ <el-button>Submit</el-button>
214
+ </div>
211
215
  </div>
212
216
  </template>
213
217
 
@@ -437,9 +437,9 @@ Bununla selectorun içerisine variable ekleyebiliyorsun
437
437
  box-sizing: border-box;
438
438
  }
439
439
  .el-dialog__footer .el-button {
440
- flex-grow: 1;
440
+ flex-basis: 100%;
441
441
  }
442
- .el-dialog__footer .el-button:first-child {
442
+ .el-dialog__footer .el-button:first-of-type {
443
443
  --el-button-text-color: var(--el-color-secondary-light-9);
444
444
  --el-button-bg-color: var(--el-color-secondary-light-1);
445
445
  --el-button-border-color: var(--el-color-secondary-light-2);
@@ -455,7 +455,7 @@ Bununla selectorun içerisine variable ekleyebiliyorsun
455
455
  --el-button-disabled-bg-color: var(--el-color-secondary-light-1);
456
456
  --el-button-disabled-border-color: var(--el-color-secondary-light-1);
457
457
  }
458
- .el-dialog__footer .el-button:first-child.is-plain, .el-dialog__footer .el-button:first-child.is-text, .el-dialog__footer .el-button:first-child.is-link {
458
+ .el-dialog__footer .el-button:first-of-type.is-plain, .el-dialog__footer .el-button:first-of-type.is-text, .el-dialog__footer .el-button:first-of-type.is-link {
459
459
  --el-button-text-color: var(--el-color-secondary);
460
460
  --el-button-disabled-text-color: var(--el-color-secondary-light-9);
461
461
  --el-button-bg-color: var(--el-color-white);
@@ -467,7 +467,7 @@ Bununla selectorun içerisine variable ekleyebiliyorsun
467
467
  --el-button-active-bg-color: var(--el-color-white);
468
468
  --el-button-active-border-color: var(--el-color-secondary-light-6);
469
469
  }
470
- .el-dialog__footer .el-button:first-child.is-plain.is-disabled, .el-dialog__footer .el-button:first-child.is-plain.is-disabled:hover, .el-dialog__footer .el-button:first-child.is-plain.is-disabled:focus, .el-dialog__footer .el-button:first-child.is-plain.is-disabled:active, .el-dialog__footer .el-button:first-child.is-text.is-disabled, .el-dialog__footer .el-button:first-child.is-text.is-disabled:hover, .el-dialog__footer .el-button:first-child.is-text.is-disabled:focus, .el-dialog__footer .el-button:first-child.is-text.is-disabled:active, .el-dialog__footer .el-button:first-child.is-link.is-disabled, .el-dialog__footer .el-button:first-child.is-link.is-disabled:hover, .el-dialog__footer .el-button:first-child.is-link.is-disabled:focus, .el-dialog__footer .el-button:first-child.is-link.is-disabled:active {
470
+ .el-dialog__footer .el-button:first-of-type.is-plain.is-disabled, .el-dialog__footer .el-button:first-of-type.is-plain.is-disabled:hover, .el-dialog__footer .el-button:first-of-type.is-plain.is-disabled:focus, .el-dialog__footer .el-button:first-of-type.is-plain.is-disabled:active, .el-dialog__footer .el-button:first-of-type.is-text.is-disabled, .el-dialog__footer .el-button:first-of-type.is-text.is-disabled:hover, .el-dialog__footer .el-button:first-of-type.is-text.is-disabled:focus, .el-dialog__footer .el-button:first-of-type.is-text.is-disabled:active, .el-dialog__footer .el-button:first-of-type.is-link.is-disabled, .el-dialog__footer .el-button:first-of-type.is-link.is-disabled:hover, .el-dialog__footer .el-button:first-of-type.is-link.is-disabled:focus, .el-dialog__footer .el-button:first-of-type.is-link.is-disabled:active {
471
471
  color: var(--el-color-secondary-light-2);
472
472
  background-color: transparent;
473
473
  border-color: var(--el-color-secondary-light-2);
@@ -109,10 +109,10 @@
109
109
  box-sizing: border-box;
110
110
 
111
111
  .el-button {
112
- flex-grow: 1;
112
+ flex-basis: 100%;
113
113
  }
114
114
 
115
- .el-button:first-child {
115
+ .el-button:first-of-type {
116
116
  @include button-variant('secondary');
117
117
  }
118
118
  }
@@ -8217,9 +8217,9 @@ heights > $common-component-size
8217
8217
  box-sizing: border-box;
8218
8218
  }
8219
8219
  .el-dialog__footer .el-button {
8220
- flex-grow: 1;
8220
+ flex-basis: 100%;
8221
8221
  }
8222
- .el-dialog__footer .el-button:first-child {
8222
+ .el-dialog__footer .el-button:first-of-type {
8223
8223
  --el-button-text-color: var(--el-color-secondary-light-9);
8224
8224
  --el-button-bg-color: var(--el-color-secondary-light-1);
8225
8225
  --el-button-border-color: var(--el-color-secondary-light-2);
@@ -8235,7 +8235,7 @@ heights > $common-component-size
8235
8235
  --el-button-disabled-bg-color: var(--el-color-secondary-light-1);
8236
8236
  --el-button-disabled-border-color: var(--el-color-secondary-light-1);
8237
8237
  }
8238
- .el-dialog__footer .el-button:first-child.is-plain, .el-dialog__footer .el-button:first-child.is-text, .el-dialog__footer .el-button:first-child.is-link {
8238
+ .el-dialog__footer .el-button:first-of-type.is-plain, .el-dialog__footer .el-button:first-of-type.is-text, .el-dialog__footer .el-button:first-of-type.is-link {
8239
8239
  --el-button-text-color: var(--el-color-secondary);
8240
8240
  --el-button-disabled-text-color: var(--el-color-secondary-light-9);
8241
8241
  --el-button-bg-color: var(--el-color-white);
@@ -8247,7 +8247,7 @@ heights > $common-component-size
8247
8247
  --el-button-active-bg-color: var(--el-color-white);
8248
8248
  --el-button-active-border-color: var(--el-color-secondary-light-6);
8249
8249
  }
8250
- .el-dialog__footer .el-button:first-child.is-plain.is-disabled, .el-dialog__footer .el-button:first-child.is-plain.is-disabled:hover, .el-dialog__footer .el-button:first-child.is-plain.is-disabled:focus, .el-dialog__footer .el-button:first-child.is-plain.is-disabled:active, .el-dialog__footer .el-button:first-child.is-text.is-disabled, .el-dialog__footer .el-button:first-child.is-text.is-disabled:hover, .el-dialog__footer .el-button:first-child.is-text.is-disabled:focus, .el-dialog__footer .el-button:first-child.is-text.is-disabled:active, .el-dialog__footer .el-button:first-child.is-link.is-disabled, .el-dialog__footer .el-button:first-child.is-link.is-disabled:hover, .el-dialog__footer .el-button:first-child.is-link.is-disabled:focus, .el-dialog__footer .el-button:first-child.is-link.is-disabled:active {
8250
+ .el-dialog__footer .el-button:first-of-type.is-plain.is-disabled, .el-dialog__footer .el-button:first-of-type.is-plain.is-disabled:hover, .el-dialog__footer .el-button:first-of-type.is-plain.is-disabled:focus, .el-dialog__footer .el-button:first-of-type.is-plain.is-disabled:active, .el-dialog__footer .el-button:first-of-type.is-text.is-disabled, .el-dialog__footer .el-button:first-of-type.is-text.is-disabled:hover, .el-dialog__footer .el-button:first-of-type.is-text.is-disabled:focus, .el-dialog__footer .el-button:first-of-type.is-text.is-disabled:active, .el-dialog__footer .el-button:first-of-type.is-link.is-disabled, .el-dialog__footer .el-button:first-of-type.is-link.is-disabled:hover, .el-dialog__footer .el-button:first-of-type.is-link.is-disabled:focus, .el-dialog__footer .el-button:first-of-type.is-link.is-disabled:active {
8251
8251
  color: var(--el-color-secondary-light-2);
8252
8252
  background-color: transparent;
8253
8253
  border-color: var(--el-color-secondary-light-2);
@@ -11555,17 +11555,40 @@ h6,
11555
11555
  }
11556
11556
  .popover-footer .el-button {
11557
11557
  flex-basis: 100%;
11558
- @apply el-button--small;
11558
+ @apply el-button--mini;
11559
11559
  }
11560
11560
  .popover-footer .el-button:first-of-type {
11561
- --el-button-hover-text-color: var(--el-color-primary-light-4);
11561
+ --el-button-text-color: var(--el-color-secondary-light-9);
11562
+ --el-button-bg-color: var(--el-color-secondary-light-1);
11563
+ --el-button-border-color: var(--el-color-secondary-light-2);
11564
+ --el-button-outline-color: var(--el-color-secondary-light-5);
11565
+ --el-button-active-color: var(--el-color-secondary-dark-2);
11566
+ --el-button-hover-text-color: var(--el-color-secondary-light-9);
11567
+ --el-button-hover-link-text-color: var(--el-color-secondary-light-5);
11562
11568
  --el-button-hover-bg-color: var(--el-color-white);
11563
- --el-button-hover-border-color: var(--el-color-primary-light-4);
11564
- --el-button-active-text-color: var(--el-color-primary-light-6);
11565
- --el-button-active-bg-color: var(--el-color-white);
11566
- --el-button-active-border-color: var(--el-color-primary-light-6);
11569
+ --el-button-hover-border-color: var(--el-color-secondary-light-3);
11570
+ --el-button-active-bg-color: var(--el-color-secondary-light-2);
11571
+ --el-button-active-border-color: var(--el-color-secondary-light-2);
11572
+ --el-button-disabled-text-color: var(--el-color-white);
11573
+ --el-button-disabled-bg-color: var(--el-color-secondary-light-1);
11574
+ --el-button-disabled-border-color: var(--el-color-secondary-light-1);
11575
+ }
11576
+ .popover-footer .el-button:first-of-type.is-plain, .popover-footer .el-button:first-of-type.is-text, .popover-footer .el-button:first-of-type.is-link {
11577
+ --el-button-text-color: var(--el-color-secondary);
11578
+ --el-button-disabled-text-color: var(--el-color-secondary-light-9);
11567
11579
  --el-button-bg-color: var(--el-color-white);
11568
- --el-button-text-color: var(--el-color-primary);
11580
+ --el-button-border-color: var(--el-color-secondary-light-5);
11581
+ --el-button-hover-text-color: var(--el-color-secondary-light-4);
11582
+ --el-button-hover-bg-color: var(--el-color-white);
11583
+ --el-button-hover-border-color: var(--el-color-secondary-light-4);
11584
+ --el-button-active-text-color: var(--el-color-secondary-light-6);
11585
+ --el-button-active-bg-color: var(--el-color-white);
11586
+ --el-button-active-border-color: var(--el-color-secondary-light-6);
11587
+ }
11588
+ .popover-footer .el-button:first-of-type.is-plain.is-disabled, .popover-footer .el-button:first-of-type.is-plain.is-disabled:hover, .popover-footer .el-button:first-of-type.is-plain.is-disabled:focus, .popover-footer .el-button:first-of-type.is-plain.is-disabled:active, .popover-footer .el-button:first-of-type.is-text.is-disabled, .popover-footer .el-button:first-of-type.is-text.is-disabled:hover, .popover-footer .el-button:first-of-type.is-text.is-disabled:focus, .popover-footer .el-button:first-of-type.is-text.is-disabled:active, .popover-footer .el-button:first-of-type.is-link.is-disabled, .popover-footer .el-button:first-of-type.is-link.is-disabled:hover, .popover-footer .el-button:first-of-type.is-link.is-disabled:focus, .popover-footer .el-button:first-of-type.is-link.is-disabled:active {
11589
+ color: var(--el-color-secondary-light-2);
11590
+ background-color: transparent;
11591
+ border-color: var(--el-color-secondary-light-2);
11569
11592
  }
11570
11593
 
11571
11594
  .el-progress {
@@ -360,15 +360,38 @@ Bununla selectorun içerisine variable ekleyebiliyorsun
360
360
  }
361
361
  .popover-footer .el-button {
362
362
  flex-basis: 100%;
363
- @apply el-button--small;
363
+ @apply el-button--mini;
364
364
  }
365
365
  .popover-footer .el-button:first-of-type {
366
- --el-button-hover-text-color: var(--el-color-primary-light-4);
366
+ --el-button-text-color: var(--el-color-secondary-light-9);
367
+ --el-button-bg-color: var(--el-color-secondary-light-1);
368
+ --el-button-border-color: var(--el-color-secondary-light-2);
369
+ --el-button-outline-color: var(--el-color-secondary-light-5);
370
+ --el-button-active-color: var(--el-color-secondary-dark-2);
371
+ --el-button-hover-text-color: var(--el-color-secondary-light-9);
372
+ --el-button-hover-link-text-color: var(--el-color-secondary-light-5);
367
373
  --el-button-hover-bg-color: var(--el-color-white);
368
- --el-button-hover-border-color: var(--el-color-primary-light-4);
369
- --el-button-active-text-color: var(--el-color-primary-light-6);
370
- --el-button-active-bg-color: var(--el-color-white);
371
- --el-button-active-border-color: var(--el-color-primary-light-6);
374
+ --el-button-hover-border-color: var(--el-color-secondary-light-3);
375
+ --el-button-active-bg-color: var(--el-color-secondary-light-2);
376
+ --el-button-active-border-color: var(--el-color-secondary-light-2);
377
+ --el-button-disabled-text-color: var(--el-color-white);
378
+ --el-button-disabled-bg-color: var(--el-color-secondary-light-1);
379
+ --el-button-disabled-border-color: var(--el-color-secondary-light-1);
380
+ }
381
+ .popover-footer .el-button:first-of-type.is-plain, .popover-footer .el-button:first-of-type.is-text, .popover-footer .el-button:first-of-type.is-link {
382
+ --el-button-text-color: var(--el-color-secondary);
383
+ --el-button-disabled-text-color: var(--el-color-secondary-light-9);
372
384
  --el-button-bg-color: var(--el-color-white);
373
- --el-button-text-color: var(--el-color-primary);
385
+ --el-button-border-color: var(--el-color-secondary-light-5);
386
+ --el-button-hover-text-color: var(--el-color-secondary-light-4);
387
+ --el-button-hover-bg-color: var(--el-color-white);
388
+ --el-button-hover-border-color: var(--el-color-secondary-light-4);
389
+ --el-button-active-text-color: var(--el-color-secondary-light-6);
390
+ --el-button-active-bg-color: var(--el-color-white);
391
+ --el-button-active-border-color: var(--el-color-secondary-light-6);
392
+ }
393
+ .popover-footer .el-button:first-of-type.is-plain.is-disabled, .popover-footer .el-button:first-of-type.is-plain.is-disabled:hover, .popover-footer .el-button:first-of-type.is-plain.is-disabled:focus, .popover-footer .el-button:first-of-type.is-plain.is-disabled:active, .popover-footer .el-button:first-of-type.is-text.is-disabled, .popover-footer .el-button:first-of-type.is-text.is-disabled:hover, .popover-footer .el-button:first-of-type.is-text.is-disabled:focus, .popover-footer .el-button:first-of-type.is-text.is-disabled:active, .popover-footer .el-button:first-of-type.is-link.is-disabled, .popover-footer .el-button:first-of-type.is-link.is-disabled:hover, .popover-footer .el-button:first-of-type.is-link.is-disabled:focus, .popover-footer .el-button:first-of-type.is-link.is-disabled:active {
394
+ color: var(--el-color-secondary-light-2);
395
+ background-color: transparent;
396
+ border-color: var(--el-color-secondary-light-2);
374
397
  }
@@ -1,6 +1,7 @@
1
1
  @use 'mixins/mixins' as *;
2
2
  @use 'mixins/var' as *;
3
3
  @use 'common/var' as *;
4
+ @use 'mixins/button' as *;
4
5
 
5
6
  @include b(popover) {
6
7
  @include set-component-css-var('popover', $popover);
@@ -61,17 +62,10 @@
61
62
  .el-button {
62
63
  flex-basis: 100%;
63
64
 
64
- @apply el-button--small;
65
+ @apply el-button--mini;
65
66
 
66
67
  &:first-of-type {
67
- --el-button-hover-text-color: var(--el-color-primary-light-4);
68
- --el-button-hover-bg-color: var(--el-color-white);
69
- --el-button-hover-border-color: var(--el-color-primary-light-4);
70
- --el-button-active-text-color: var(--el-color-primary-light-6);
71
- --el-button-active-bg-color: var(--el-color-white);
72
- --el-button-active-border-color: var(--el-color-primary-light-6);
73
- --el-button-bg-color: var(--el-color-white);
74
- --el-button-text-color: var(--el-color-primary);
68
+ @include button-variant('secondary');
75
69
  }
76
70
  }
77
71
  }
@@ -1,3 +1,4 @@
1
+ @charset "UTF-8";
1
2
  :root {
2
3
  --font-size: 1em;
3
4
  --border-width: 1px;
@@ -1206,6 +1207,20 @@ select {
1206
1207
  white-space: nowrap;
1207
1208
  }
1208
1209
 
1210
+ /* Element Chalk Variables */
1211
+ /**
1212
+ Bununla selectorun içerisine variable ekleyebiliyorsun
1213
+ .selector{
1214
+ // --el-button-text-color: var(--el-color-primary); -> bu eklenir
1215
+ @include css-var-from-global(('button-text-color'), ('color-primary'));
1216
+
1217
+ // bununla property'ye değer atayabilirsin (hiyerarşik alıyor)
1218
+ color: getCssVar('colors-neutral-light-2');
1219
+
1220
+ // bununla da property alınabililyor
1221
+ font-size: map.get($select, 'font-size');
1222
+ }
1223
+ **/
1209
1224
  html,
1210
1225
  body,
1211
1226
  #main {
@@ -1230,6 +1245,39 @@ body {
1230
1245
  flex-basis: 100%;
1231
1246
  justify-content: center;
1232
1247
  }
1248
+ .page-footer .el-button:first-of-type {
1249
+ --el-button-text-color: var(--el-color-secondary-light-9);
1250
+ --el-button-bg-color: var(--el-color-secondary-light-1);
1251
+ --el-button-border-color: var(--el-color-secondary-light-2);
1252
+ --el-button-outline-color: var(--el-color-secondary-light-5);
1253
+ --el-button-active-color: var(--el-color-secondary-dark-2);
1254
+ --el-button-hover-text-color: var(--el-color-secondary-light-9);
1255
+ --el-button-hover-link-text-color: var(--el-color-secondary-light-5);
1256
+ --el-button-hover-bg-color: var(--el-color-white);
1257
+ --el-button-hover-border-color: var(--el-color-secondary-light-3);
1258
+ --el-button-active-bg-color: var(--el-color-secondary-light-2);
1259
+ --el-button-active-border-color: var(--el-color-secondary-light-2);
1260
+ --el-button-disabled-text-color: var(--el-color-white);
1261
+ --el-button-disabled-bg-color: var(--el-color-secondary-light-1);
1262
+ --el-button-disabled-border-color: var(--el-color-secondary-light-1);
1263
+ }
1264
+ .page-footer .el-button:first-of-type.is-plain, .page-footer .el-button:first-of-type.is-text, .page-footer .el-button:first-of-type.is-link {
1265
+ --el-button-text-color: var(--el-color-secondary);
1266
+ --el-button-disabled-text-color: var(--el-color-secondary-light-9);
1267
+ --el-button-bg-color: var(--el-color-white);
1268
+ --el-button-border-color: var(--el-color-secondary-light-5);
1269
+ --el-button-hover-text-color: var(--el-color-secondary-light-4);
1270
+ --el-button-hover-bg-color: var(--el-color-white);
1271
+ --el-button-hover-border-color: var(--el-color-secondary-light-4);
1272
+ --el-button-active-text-color: var(--el-color-secondary-light-6);
1273
+ --el-button-active-bg-color: var(--el-color-white);
1274
+ --el-button-active-border-color: var(--el-color-secondary-light-6);
1275
+ }
1276
+ .page-footer .el-button:first-of-type.is-plain.is-disabled, .page-footer .el-button:first-of-type.is-plain.is-disabled:hover, .page-footer .el-button:first-of-type.is-plain.is-disabled:focus, .page-footer .el-button:first-of-type.is-plain.is-disabled:active, .page-footer .el-button:first-of-type.is-text.is-disabled, .page-footer .el-button:first-of-type.is-text.is-disabled:hover, .page-footer .el-button:first-of-type.is-text.is-disabled:focus, .page-footer .el-button:first-of-type.is-text.is-disabled:active, .page-footer .el-button:first-of-type.is-link.is-disabled, .page-footer .el-button:first-of-type.is-link.is-disabled:hover, .page-footer .el-button:first-of-type.is-link.is-disabled:focus, .page-footer .el-button:first-of-type.is-link.is-disabled:active {
1277
+ color: var(--el-color-secondary-light-2);
1278
+ background-color: transparent;
1279
+ border-color: var(--el-color-secondary-light-2);
1280
+ }
1233
1281
 
1234
1282
  .el-icon.more-icon {
1235
1283
  align-items: center;
@@ -8,6 +8,7 @@
8
8
  @use 'logo' as *;
9
9
  @use 'selectbox' as *;
10
10
  @use 'sass:map';
11
+ @use 'element-plus/mixins/button' as *;
11
12
 
12
13
  // @use 'layers' as *;
13
14
 
@@ -38,6 +39,10 @@ body {
38
39
  .el-button {
39
40
  flex-basis: 100%;
40
41
  justify-content: center;
42
+
43
+ &:first-of-type {
44
+ @include button-variant('secondary');
45
+ }
41
46
  }
42
47
  }
43
48
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@timus-networks/theme",
3
- "version": "2.4.135",
3
+ "version": "2.4.137",
4
4
  "description": "A comprehensive Nuxt.js module providing a tailored theme experience with integrated TailwindCSS support for applications.",
5
5
  "type": "module",
6
6
  "exports": {