@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 +1 -1
- package/dist/module.mjs +1 -1
- package/dist/runtime/assets/scss/main.css +81 -25
- package/dist/runtime/components/development/example.button.vue +4 -0
- package/dist/runtime/public/scss/element-plus/dialog.css +4 -4
- package/dist/runtime/public/scss/element-plus/dialog.scss +2 -2
- package/dist/runtime/public/scss/element-plus/index.css +34 -11
- package/dist/runtime/public/scss/element-plus/popover.css +30 -7
- package/dist/runtime/public/scss/element-plus/popover.scss +3 -9
- package/dist/runtime/public/scss/theme.css +48 -0
- package/dist/runtime/public/scss/theme.scss +5 -0
- package/package.json +1 -1
package/dist/module.json
CHANGED
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.
|
|
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-
|
|
9217
|
+
flex-basis: 100%;
|
|
9185
9218
|
}
|
|
9186
|
-
.el-dialog__footer .el-button:first-
|
|
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-
|
|
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-
|
|
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--
|
|
12444
|
+
@apply el-button--mini;
|
|
12412
12445
|
}
|
|
12413
12446
|
.popover-footer .el-button:first-of-type {
|
|
12414
|
-
--el-button-
|
|
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-
|
|
12417
|
-
--el-button-active-
|
|
12418
|
-
--el-button-active-
|
|
12419
|
-
--el-button-
|
|
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-
|
|
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 {
|
|
@@ -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-
|
|
440
|
+
flex-basis: 100%;
|
|
441
441
|
}
|
|
442
|
-
.el-dialog__footer .el-button:first-
|
|
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-
|
|
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-
|
|
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);
|
|
@@ -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-
|
|
8220
|
+
flex-basis: 100%;
|
|
8221
8221
|
}
|
|
8222
|
-
.el-dialog__footer .el-button:first-
|
|
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-
|
|
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-
|
|
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--
|
|
11558
|
+
@apply el-button--mini;
|
|
11559
11559
|
}
|
|
11560
11560
|
.popover-footer .el-button:first-of-type {
|
|
11561
|
-
--el-button-
|
|
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-
|
|
11564
|
-
--el-button-active-
|
|
11565
|
-
--el-button-active-
|
|
11566
|
-
--el-button-
|
|
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-
|
|
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--
|
|
363
|
+
@apply el-button--mini;
|
|
364
364
|
}
|
|
365
365
|
.popover-footer .el-button:first-of-type {
|
|
366
|
-
--el-button-
|
|
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-
|
|
369
|
-
--el-button-active-
|
|
370
|
-
--el-button-active-
|
|
371
|
-
--el-button-
|
|
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-
|
|
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--
|
|
65
|
+
@apply el-button--mini;
|
|
65
66
|
|
|
66
67
|
&:first-of-type {
|
|
67
|
-
|
|
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