@timus-networks/theme 2.4.137 → 2.4.140

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.
@@ -4,20 +4,22 @@
4
4
 
5
5
  @include b(alert) {
6
6
  @include set-component-css-var('alert', $alert);
7
+ position: relative;
7
8
 
8
9
  width: 100%;
9
- padding: getCssVar('alert', 'padding');
10
+ padding: 8px 16px;
10
11
  margin: 0;
11
12
  box-sizing: border-box;
12
- border-radius: getCssVar('alert', 'border-radius-small');
13
+ border-radius: getCssVar('border-radius-small');
13
14
  border-width: getCssVar('border-width');
14
15
  border-style: getCssVar('border-style');
15
16
  border-color: getCssVar('alert', 'border-color');
16
17
  position: relative;
17
- background-color: getCssVar('color', 'info-light-1');
18
+ background-color: getCssVar('color', 'neutral-light-1');
18
19
  overflow: hidden;
19
20
  opacity: 1;
20
21
  display: flex;
22
+
21
23
  // align-items: center;
22
24
  transition: opacity getCssVar('transition-duration', 'fast');
23
25
 
@@ -42,69 +44,56 @@
42
44
 
43
45
  @each $type in $semantic {
44
46
  @include m($type) {
45
- @include css-var-from-global(('alert', 'bg-color'), ('color', $type, 'light-1'));
46
- @include css-var-from-global(('alert', 'border-color'), ('color', $type, 'light-3'));
47
+ @include css-var-from-global(('alert', 'bg-color'), ('color', if($type == 'info', 'neutral', $type), 'light-1'));
48
+ @include css-var-from-global(('alert', 'border-color'), ('color', if($type == 'info', 'neutral', $type), 'light-3'));
47
49
 
48
50
  &.is-light {
49
51
  background-color: getCssVar('alert', 'bg-color');
50
- color: getCssVar('color', $type, 'light-5');
52
+ color: getCssVar('color', if($type == 'info', 'neutral', $type), 'light-6');
51
53
 
52
54
  .#{$namespace}-alert__description {
53
- color: getCssVar('color', $type, 'light-4');
55
+ color: getCssVar('color', if($type == 'info', 'neutral', $type), 'light-6');
54
56
  }
55
57
  }
56
58
 
57
59
  &.is-dark {
58
- background-color: getCssVar('color', $type);
60
+ background-color: getCssVar('color', if($type == 'info', 'neutral', $type));
59
61
  color: getCssVar('color', 'white');
60
62
  }
61
63
 
62
64
  @include when(light) {
63
65
  .#{$namespace}-alert__close-btn {
64
- color: getCssVar('color', $type, 'light-5');
66
+ color: getCssVar('color', if($type == 'info', 'neutral', $type), 'light-6');
65
67
  }
66
68
  }
67
69
  }
68
70
  }
69
71
 
72
+ $material-icons-font-family: 'Material Symbols Outlined';
73
+
70
74
  &::before {
71
- font-family: 'iconsax' !important;
75
+ font-family: $material-icons-font-family !important;
72
76
  -webkit-font-smoothing: antialiased;
73
77
  -moz-osx-font-smoothing: grayscale;
74
78
  font-style: normal;
75
79
  font-variant: normal;
76
80
  font-weight: 600;
77
- line-height: 1;
78
81
  speak: never;
79
82
  text-transform: none;
80
83
  font-size: getCssVar('alert', 'icon-size');
81
- line-height: 24px;
82
- margin-right: 8px;
83
- }
84
-
85
- &.el-alert--success {
86
- &::before {
87
- content: '\ec2a';
88
- }
89
- }
90
-
91
- &.el-alert--info {
92
- &::before {
93
- content: '\eb4d';
94
- }
95
- }
96
-
97
- &.el-alert--warning {
98
- &::before {
99
- content: '\e9f6';
100
- }
84
+ line-height: 1;
85
+ margin-right: 5px;
86
+ content: 'info';
87
+ position: absolute;
88
+ font-weight: 500;
89
+ width: 12px;
90
+ height: 12px;
91
+ font-size: 12px;
92
+ top: 14px;
101
93
  }
102
94
 
103
- &.el-alert--danger,
104
- &.el-alert--error {
105
- &::before {
106
- content: '\e9c8';
107
- }
95
+ .el-alert__title {
96
+ padding-left: 17px;
108
97
  }
109
98
 
110
99
  .el-alert__icon {
@@ -137,6 +126,8 @@
137
126
 
138
127
  &.with-description {
139
128
  font-size: getCssVar('alert', 'title-with-description-font-size');
129
+ line-height: 14px;
130
+ margin-top: 5px;
140
131
  }
141
132
  }
142
133
 
@@ -304,7 +304,7 @@ Bununla selectorun içerisine variable ekleyebiliyorsun
304
304
  --el-color-white: #ffffff;
305
305
  --el-color-black: #000000;
306
306
  --el-color-primary-rgb: 87, 55, 214;
307
- --el-color-secondary-rgb: 119, 212, 183;
307
+ --el-color-secondary-rgb: 168, 166, 177;
308
308
  --el-color-neutral-rgb: 168, 166, 177;
309
309
  --el-color-success-rgb: 76, 183, 112;
310
310
  --el-color-warning-rgb: 232, 197, 82;
@@ -25,7 +25,7 @@ Bununla selectorun içerisine variable ekleyebiliyorsun
25
25
 
26
26
  // types
27
27
  $types: primary, secondary, neutral, success, warning, danger, error, info;
28
- $semantic: success, info, warning, error, danger;
28
+ $semantic: primary, success, info, warning, error;
29
29
  $sizes: large, medium, small, mini;
30
30
  $variants: 1, 2, 4, 3, 5, 6, 7, 8, 9;
31
31
  // Color
@@ -38,7 +38,7 @@ $colors: map.deep-merge(
38
38
  'base': #5737d6,
39
39
  ),
40
40
  'secondary': (
41
- 'base': #77d4b7,
41
+ 'base': #a8a6b1,
42
42
  ),
43
43
  'neutral': (
44
44
  'base': #a8a6b1,
@@ -542,12 +542,12 @@ $alert: map.merge(
542
542
  'padding': 8px 16px,
543
543
  'border-radius': getCssVar('border-radius-small'),
544
544
  'border-color': getCssVar('color', 'info-light-3'),
545
- 'title-font-size': 14px,
546
- 'title-with-description-font-size': 14px,
547
- 'description-font-size': 14px,
545
+ 'title-font-size': 12px,
546
+ 'title-with-description-font-size': 12px,
547
+ 'description-font-size': 10px,
548
548
  'close-font-size': 14px,
549
549
  'close-customed-font-size': 14px,
550
- 'icon-size': 18px,
550
+ 'icon-size': 12px,
551
551
  'icon-large-size': 32px,
552
552
  ),
553
553
  $alert
@@ -304,7 +304,7 @@ Bununla selectorun içerisine variable ekleyebiliyorsun
304
304
  --el-color-white: #ffffff;
305
305
  --el-color-black: #000000;
306
306
  --el-color-primary-rgb: 87, 55, 214;
307
- --el-color-secondary-rgb: 119, 212, 183;
307
+ --el-color-secondary-rgb: 168, 166, 177;
308
308
  --el-color-neutral-rgb: 168, 166, 177;
309
309
  --el-color-success-rgb: 76, 183, 112;
310
310
  --el-color-warning-rgb: 232, 197, 82;
@@ -559,23 +559,24 @@ Bununla selectorun içerisine variable ekleyebiliyorsun
559
559
  --el-alert-padding: 8px 16px;
560
560
  --el-alert-border-radius: var(--el-border-radius-small);
561
561
  --el-alert-border-color: var(--el-color-info-light-3);
562
- --el-alert-title-font-size: 14px;
563
- --el-alert-title-with-description-font-size: 14px;
564
- --el-alert-description-font-size: 14px;
562
+ --el-alert-title-font-size: 12px;
563
+ --el-alert-title-with-description-font-size: 12px;
564
+ --el-alert-description-font-size: 10px;
565
565
  --el-alert-close-font-size: 14px;
566
566
  --el-alert-close-customed-font-size: 14px;
567
- --el-alert-icon-size: 18px;
567
+ --el-alert-icon-size: 12px;
568
568
  --el-alert-icon-large-size: 32px;
569
+ position: relative;
569
570
  width: 100%;
570
- padding: var(--el-alert-padding);
571
+ padding: 8px 16px;
571
572
  margin: 0;
572
573
  box-sizing: border-box;
573
- border-radius: var(--el-alert-border-radius-small);
574
+ border-radius: var(--el-border-radius-small);
574
575
  border-width: var(--el-border-width);
575
576
  border-style: var(--el-border-style);
576
577
  border-color: var(--el-alert-border-color);
577
578
  position: relative;
578
- background-color: var(--el-color-info-light-1);
579
+ background-color: var(--el-color-neutral-light-1);
579
580
  overflow: hidden;
580
581
  opacity: 1;
581
582
  display: flex;
@@ -596,42 +597,61 @@ Bununla selectorun içerisine variable ekleyebiliyorsun
596
597
  justify-content: center;
597
598
  }
598
599
 
600
+ .el-alert--primary {
601
+ --el-alert-bg-color: var(--el-color-primary-light-1);
602
+ --el-alert-border-color: var(--el-color-primary-light-3);
603
+ }
604
+ .el-alert--primary.is-light {
605
+ background-color: var(--el-alert-bg-color);
606
+ color: var(--el-color-primary-light-6);
607
+ }
608
+ .el-alert--primary.is-light .el-alert__description {
609
+ color: var(--el-color-primary-light-6);
610
+ }
611
+ .el-alert--primary.is-dark {
612
+ background-color: var(--el-color-primary);
613
+ color: var(--el-color-white);
614
+ }
615
+ .el-alert--primary.is-light .el-alert__close-btn {
616
+ color: var(--el-color-primary-light-6);
617
+ }
618
+
599
619
  .el-alert--success {
600
620
  --el-alert-bg-color: var(--el-color-success-light-1);
601
621
  --el-alert-border-color: var(--el-color-success-light-3);
602
622
  }
603
623
  .el-alert--success.is-light {
604
624
  background-color: var(--el-alert-bg-color);
605
- color: var(--el-color-success-light-5);
625
+ color: var(--el-color-success-light-6);
606
626
  }
607
627
  .el-alert--success.is-light .el-alert__description {
608
- color: var(--el-color-success-light-4);
628
+ color: var(--el-color-success-light-6);
609
629
  }
610
630
  .el-alert--success.is-dark {
611
631
  background-color: var(--el-color-success);
612
632
  color: var(--el-color-white);
613
633
  }
614
634
  .el-alert--success.is-light .el-alert__close-btn {
615
- color: var(--el-color-success-light-5);
635
+ color: var(--el-color-success-light-6);
616
636
  }
617
637
 
618
638
  .el-alert--info {
619
- --el-alert-bg-color: var(--el-color-info-light-1);
620
- --el-alert-border-color: var(--el-color-info-light-3);
639
+ --el-alert-bg-color: var(--el-color-neutral-light-1);
640
+ --el-alert-border-color: var(--el-color-neutral-light-3);
621
641
  }
622
642
  .el-alert--info.is-light {
623
643
  background-color: var(--el-alert-bg-color);
624
- color: var(--el-color-info-light-5);
644
+ color: var(--el-color-neutral-light-6);
625
645
  }
626
646
  .el-alert--info.is-light .el-alert__description {
627
- color: var(--el-color-info-light-4);
647
+ color: var(--el-color-neutral-light-6);
628
648
  }
629
649
  .el-alert--info.is-dark {
630
- background-color: var(--el-color-info);
650
+ background-color: var(--el-color-neutral);
631
651
  color: var(--el-color-white);
632
652
  }
633
653
  .el-alert--info.is-light .el-alert__close-btn {
634
- color: var(--el-color-info-light-5);
654
+ color: var(--el-color-neutral-light-6);
635
655
  }
636
656
 
637
657
  .el-alert--warning {
@@ -640,17 +660,17 @@ Bununla selectorun içerisine variable ekleyebiliyorsun
640
660
  }
641
661
  .el-alert--warning.is-light {
642
662
  background-color: var(--el-alert-bg-color);
643
- color: var(--el-color-warning-light-5);
663
+ color: var(--el-color-warning-light-6);
644
664
  }
645
665
  .el-alert--warning.is-light .el-alert__description {
646
- color: var(--el-color-warning-light-4);
666
+ color: var(--el-color-warning-light-6);
647
667
  }
648
668
  .el-alert--warning.is-dark {
649
669
  background-color: var(--el-color-warning);
650
670
  color: var(--el-color-white);
651
671
  }
652
672
  .el-alert--warning.is-light .el-alert__close-btn {
653
- color: var(--el-color-warning-light-5);
673
+ color: var(--el-color-warning-light-6);
654
674
  }
655
675
 
656
676
  .el-alert--error {
@@ -659,63 +679,41 @@ Bununla selectorun içerisine variable ekleyebiliyorsun
659
679
  }
660
680
  .el-alert--error.is-light {
661
681
  background-color: var(--el-alert-bg-color);
662
- color: var(--el-color-error-light-5);
682
+ color: var(--el-color-error-light-6);
663
683
  }
664
684
  .el-alert--error.is-light .el-alert__description {
665
- color: var(--el-color-error-light-4);
685
+ color: var(--el-color-error-light-6);
666
686
  }
667
687
  .el-alert--error.is-dark {
668
688
  background-color: var(--el-color-error);
669
689
  color: var(--el-color-white);
670
690
  }
671
691
  .el-alert--error.is-light .el-alert__close-btn {
672
- color: var(--el-color-error-light-5);
673
- }
674
-
675
- .el-alert--danger {
676
- --el-alert-bg-color: var(--el-color-danger-light-1);
677
- --el-alert-border-color: var(--el-color-danger-light-3);
678
- }
679
- .el-alert--danger.is-light {
680
- background-color: var(--el-alert-bg-color);
681
- color: var(--el-color-danger-light-5);
682
- }
683
- .el-alert--danger.is-light .el-alert__description {
684
- color: var(--el-color-danger-light-4);
685
- }
686
- .el-alert--danger.is-dark {
687
- background-color: var(--el-color-danger);
688
- color: var(--el-color-white);
689
- }
690
- .el-alert--danger.is-light .el-alert__close-btn {
691
- color: var(--el-color-danger-light-5);
692
+ color: var(--el-color-error-light-6);
692
693
  }
693
694
 
694
695
  .el-alert::before {
695
- font-family: "iconsax" !important;
696
+ font-family: "Material Symbols Outlined" !important;
696
697
  -webkit-font-smoothing: antialiased;
697
698
  -moz-osx-font-smoothing: grayscale;
698
699
  font-style: normal;
699
700
  font-variant: normal;
700
701
  font-weight: 600;
701
- line-height: 1;
702
702
  speak: never;
703
703
  text-transform: none;
704
704
  font-size: var(--el-alert-icon-size);
705
- line-height: 24px;
706
- margin-right: 8px;
707
- }
708
- .el-alert.el-alert--success::before {
709
- content: "\ec2a";
710
- }
711
- .el-alert.el-alert--info::before {
712
- content: "\eb4d";
713
- }
714
- .el-alert.el-alert--warning::before {
715
- content: "\e9f6";
705
+ line-height: 1;
706
+ margin-right: 5px;
707
+ content: "info";
708
+ position: absolute;
709
+ font-weight: 500;
710
+ width: 12px;
711
+ height: 12px;
712
+ font-size: 12px;
713
+ top: 14px;
716
714
  }
717
- .el-alert.el-alert--danger::before, .el-alert.el-alert--error::before {
718
- content: "\e9c8";
715
+ .el-alert .el-alert__title {
716
+ padding-left: 17px;
719
717
  }
720
718
  .el-alert .el-alert__icon {
721
719
  display: none;
@@ -744,6 +742,8 @@ Bununla selectorun içerisine variable ekleyebiliyorsun
744
742
  }
745
743
  .el-alert__title.with-description {
746
744
  font-size: var(--el-alert-title-with-description-font-size);
745
+ line-height: 14px;
746
+ margin-top: 5px;
747
747
  }
748
748
 
749
749
  .el-alert .el-alert__description {
@@ -10016,6 +10016,7 @@ h6,
10016
10016
  border-color: var(--el-color-primary-light-4);
10017
10017
  }
10018
10018
  .el-link__inner {
10019
+ display: inline-flex;
10019
10020
  overflow: hidden;
10020
10021
  text-overflow: ellipsis;
10021
10022
  white-space: nowrap;
@@ -10693,6 +10694,10 @@ h6,
10693
10694
  .el-message-box__status {
10694
10695
  font-size: 24px;
10695
10696
  }
10697
+ .el-message-box__status.el-message-box-icon--primary {
10698
+ --el-messagebox-color: var(--el-color-primary);
10699
+ color: var(--el-messagebox-color);
10700
+ }
10696
10701
  .el-message-box__status.el-message-box-icon--success {
10697
10702
  --el-messagebox-color: var(--el-color-success);
10698
10703
  color: var(--el-messagebox-color);
@@ -10709,10 +10714,6 @@ h6,
10709
10714
  --el-messagebox-color: var(--el-color-error);
10710
10715
  color: var(--el-messagebox-color);
10711
10716
  }
10712
- .el-message-box__status.el-message-box-icon--danger {
10713
- --el-messagebox-color: var(--el-color-danger);
10714
- color: var(--el-messagebox-color);
10715
- }
10716
10717
 
10717
10718
  .el-message-box__message {
10718
10719
  margin: 0;
@@ -10739,16 +10740,37 @@ h6,
10739
10740
  flex-basis: 100%;
10740
10741
  }
10741
10742
  .el-message-box__btns .el-button:first-of-type {
10742
- --el-button-text-color: var(--el-color-primary);
10743
- --el-button-disabled-text-color: var(--el-color-primary-light-9);
10743
+ --el-button-text-color: var(--el-color-secondary-light-9);
10744
+ --el-button-bg-color: var(--el-color-secondary-light-1);
10745
+ --el-button-border-color: var(--el-color-secondary-light-2);
10746
+ --el-button-outline-color: var(--el-color-secondary-light-5);
10747
+ --el-button-active-color: var(--el-color-secondary-dark-2);
10748
+ --el-button-hover-text-color: var(--el-color-secondary-light-9);
10749
+ --el-button-hover-link-text-color: var(--el-color-secondary-light-5);
10750
+ --el-button-hover-bg-color: var(--el-color-white);
10751
+ --el-button-hover-border-color: var(--el-color-secondary-light-3);
10752
+ --el-button-active-bg-color: var(--el-color-secondary-light-2);
10753
+ --el-button-active-border-color: var(--el-color-secondary-light-2);
10754
+ --el-button-disabled-text-color: var(--el-color-white);
10755
+ --el-button-disabled-bg-color: var(--el-color-secondary-light-1);
10756
+ --el-button-disabled-border-color: var(--el-color-secondary-light-1);
10757
+ }
10758
+ .el-message-box__btns .el-button:first-of-type.is-plain, .el-message-box__btns .el-button:first-of-type.is-text, .el-message-box__btns .el-button:first-of-type.is-link {
10759
+ --el-button-text-color: var(--el-color-secondary);
10760
+ --el-button-disabled-text-color: var(--el-color-secondary-light-9);
10744
10761
  --el-button-bg-color: var(--el-color-white);
10745
- --el-button-border-color: var(--el-color-primary-light-5);
10746
- --el-button-hover-text-color: var(--el-color-primary-light-4);
10762
+ --el-button-border-color: var(--el-color-secondary-light-5);
10763
+ --el-button-hover-text-color: var(--el-color-secondary-light-4);
10747
10764
  --el-button-hover-bg-color: var(--el-color-white);
10748
- --el-button-hover-border-color: var(--el-color-primary-light-4);
10749
- --el-button-active-text-color: var(--el-color-primary-light-6);
10765
+ --el-button-hover-border-color: var(--el-color-secondary-light-4);
10766
+ --el-button-active-text-color: var(--el-color-secondary-light-6);
10750
10767
  --el-button-active-bg-color: var(--el-color-white);
10751
- --el-button-active-border-color: var(--el-color-primary-light-6);
10768
+ --el-button-active-border-color: var(--el-color-secondary-light-6);
10769
+ }
10770
+ .el-message-box__btns .el-button:first-of-type.is-plain.is-disabled, .el-message-box__btns .el-button:first-of-type.is-plain.is-disabled:hover, .el-message-box__btns .el-button:first-of-type.is-plain.is-disabled:focus, .el-message-box__btns .el-button:first-of-type.is-plain.is-disabled:active, .el-message-box__btns .el-button:first-of-type.is-text.is-disabled, .el-message-box__btns .el-button:first-of-type.is-text.is-disabled:hover, .el-message-box__btns .el-button:first-of-type.is-text.is-disabled:focus, .el-message-box__btns .el-button:first-of-type.is-text.is-disabled:active, .el-message-box__btns .el-button:first-of-type.is-link.is-disabled, .el-message-box__btns .el-button:first-of-type.is-link.is-disabled:hover, .el-message-box__btns .el-button:first-of-type.is-link.is-disabled:focus, .el-message-box__btns .el-button:first-of-type.is-link.is-disabled:active {
10771
+ color: var(--el-color-secondary-light-2);
10772
+ background-color: transparent;
10773
+ border-color: var(--el-color-secondary-light-2);
10752
10774
  }
10753
10775
 
10754
10776
  .el-message-box--center .el-message-box__title {
@@ -10848,6 +10870,30 @@ h6,
10848
10870
  .el-message .el-message__closeBtn:hover {
10849
10871
  color: var(--el-color-info-light-6);
10850
10872
  }
10873
+ .el-message--primary {
10874
+ --el-message-bg-color: var(--el-color-primary-light-1);
10875
+ --el-message-border-color: var(--el-color-primary-light-3);
10876
+ --el-message-text-color: var(--el-color-primary);
10877
+ }
10878
+ .el-message--primary .el-message__content {
10879
+ color: var(--el-message-text-color);
10880
+ overflow-wrap: break-word;
10881
+ }
10882
+ .el-message--primary .el-message__closeBtn {
10883
+ color: var(--el-color-primary);
10884
+ }
10885
+ .el-message--primary .el-message__closeBtn:hover {
10886
+ color: var(--el-color-primary-light-4);
10887
+ }
10888
+ .el-message--primary .el-message__closeBtn:active {
10889
+ color: var(--el-color-primary-light-6);
10890
+ }
10891
+
10892
+ .el-message .el-message-icon--primary {
10893
+ color: var(--el-message-text-color);
10894
+ width: 12px;
10895
+ height: 12px;
10896
+ }
10851
10897
  .el-message--success {
10852
10898
  --el-message-bg-color: var(--el-color-success-light-1);
10853
10899
  --el-message-border-color: var(--el-color-success-light-3);
@@ -10944,30 +10990,6 @@ h6,
10944
10990
  width: 12px;
10945
10991
  height: 12px;
10946
10992
  }
10947
- .el-message--danger {
10948
- --el-message-bg-color: var(--el-color-danger-light-1);
10949
- --el-message-border-color: var(--el-color-danger-light-3);
10950
- --el-message-text-color: var(--el-color-danger);
10951
- }
10952
- .el-message--danger .el-message__content {
10953
- color: var(--el-message-text-color);
10954
- overflow-wrap: break-word;
10955
- }
10956
- .el-message--danger .el-message__closeBtn {
10957
- color: var(--el-color-danger);
10958
- }
10959
- .el-message--danger .el-message__closeBtn:hover {
10960
- color: var(--el-color-danger-light-4);
10961
- }
10962
- .el-message--danger .el-message__closeBtn:active {
10963
- color: var(--el-color-danger-light-6);
10964
- }
10965
-
10966
- .el-message .el-message-icon--danger {
10967
- color: var(--el-message-text-color);
10968
- width: 12px;
10969
- height: 12px;
10970
- }
10971
10993
  .el-message .el-message__badge {
10972
10994
  position: absolute;
10973
10995
  top: -8px;
@@ -11094,6 +11116,10 @@ h6,
11094
11116
  .el-notification .el-notification__closeBtn:hover {
11095
11117
  color: var(--el-notification-close-hover-color);
11096
11118
  }
11119
+ .el-notification .el-notification--primary {
11120
+ --el-notification-icon-color: var(--el-color-primary);
11121
+ color: var(--el-notification-icon-color);
11122
+ }
11097
11123
  .el-notification .el-notification--success {
11098
11124
  --el-notification-icon-color: var(--el-color-success);
11099
11125
  color: var(--el-notification-icon-color);
@@ -11110,10 +11136,6 @@ h6,
11110
11136
  --el-notification-icon-color: var(--el-color-error);
11111
11137
  color: var(--el-notification-icon-color);
11112
11138
  }
11113
- .el-notification .el-notification--danger {
11114
- --el-notification-icon-color: var(--el-color-danger);
11115
- color: var(--el-notification-icon-color);
11116
- }
11117
11139
 
11118
11140
  .el-notification-fade-enter-from.right {
11119
11141
  right: 0;
@@ -11551,11 +11573,23 @@ h6,
11551
11573
  .popover-footer {
11552
11574
  display: flex;
11553
11575
  padding-top: 16px;
11554
- gap: 30px;
11576
+ gap: 28px;
11555
11577
  }
11556
11578
  .popover-footer .el-button {
11557
11579
  flex-basis: 100%;
11558
11580
  @apply el-button--mini;
11581
+ /*
11582
+ &:first-of-type {
11583
+ --el-button-hover-text-color: var(--el-color-primary-light-4);
11584
+ --el-button-hover-bg-color: var(--el-color-white);
11585
+ --el-button-hover-border-color: var(--el-color-primary-light-4);
11586
+ --el-button-active-text-color: var(--el-color-primary-light-6);
11587
+ --el-button-active-bg-color: var(--el-color-white);
11588
+ --el-button-active-border-color: var(--el-color-primary-light-6);
11589
+ --el-button-bg-color: var(--el-color-white);
11590
+ --el-button-text-color: var(--el-color-primary);
11591
+ }
11592
+ */
11559
11593
  }
11560
11594
  .popover-footer .el-button:first-of-type {
11561
11595
  --el-button-text-color: var(--el-color-secondary-light-9);
@@ -477,6 +477,7 @@ h6,
477
477
  border-color: var(--el-color-primary-light-4);
478
478
  }
479
479
  .el-link__inner {
480
+ display: inline-flex;
480
481
  overflow: hidden;
481
482
  text-overflow: ellipsis;
482
483
  white-space: nowrap;
@@ -83,7 +83,7 @@
83
83
  }
84
84
 
85
85
  @include e(inner) {
86
- // display: inline-flex;
86
+ display: inline-flex;
87
87
  // justify-content: center;
88
88
  // align-items: center;
89
89
 
@@ -458,6 +458,10 @@ Bununla selectorun içerisine variable ekleyebiliyorsun
458
458
  .el-message-box__status {
459
459
  font-size: 24px;
460
460
  }
461
+ .el-message-box__status.el-message-box-icon--primary {
462
+ --el-messagebox-color: var(--el-color-primary);
463
+ color: var(--el-messagebox-color);
464
+ }
461
465
  .el-message-box__status.el-message-box-icon--success {
462
466
  --el-messagebox-color: var(--el-color-success);
463
467
  color: var(--el-messagebox-color);
@@ -474,10 +478,6 @@ Bununla selectorun içerisine variable ekleyebiliyorsun
474
478
  --el-messagebox-color: var(--el-color-error);
475
479
  color: var(--el-messagebox-color);
476
480
  }
477
- .el-message-box__status.el-message-box-icon--danger {
478
- --el-messagebox-color: var(--el-color-danger);
479
- color: var(--el-messagebox-color);
480
- }
481
481
 
482
482
  .el-message-box__message {
483
483
  margin: 0;
@@ -504,16 +504,37 @@ Bununla selectorun içerisine variable ekleyebiliyorsun
504
504
  flex-basis: 100%;
505
505
  }
506
506
  .el-message-box__btns .el-button:first-of-type {
507
- --el-button-text-color: var(--el-color-primary);
508
- --el-button-disabled-text-color: var(--el-color-primary-light-9);
507
+ --el-button-text-color: var(--el-color-secondary-light-9);
508
+ --el-button-bg-color: var(--el-color-secondary-light-1);
509
+ --el-button-border-color: var(--el-color-secondary-light-2);
510
+ --el-button-outline-color: var(--el-color-secondary-light-5);
511
+ --el-button-active-color: var(--el-color-secondary-dark-2);
512
+ --el-button-hover-text-color: var(--el-color-secondary-light-9);
513
+ --el-button-hover-link-text-color: var(--el-color-secondary-light-5);
514
+ --el-button-hover-bg-color: var(--el-color-white);
515
+ --el-button-hover-border-color: var(--el-color-secondary-light-3);
516
+ --el-button-active-bg-color: var(--el-color-secondary-light-2);
517
+ --el-button-active-border-color: var(--el-color-secondary-light-2);
518
+ --el-button-disabled-text-color: var(--el-color-white);
519
+ --el-button-disabled-bg-color: var(--el-color-secondary-light-1);
520
+ --el-button-disabled-border-color: var(--el-color-secondary-light-1);
521
+ }
522
+ .el-message-box__btns .el-button:first-of-type.is-plain, .el-message-box__btns .el-button:first-of-type.is-text, .el-message-box__btns .el-button:first-of-type.is-link {
523
+ --el-button-text-color: var(--el-color-secondary);
524
+ --el-button-disabled-text-color: var(--el-color-secondary-light-9);
509
525
  --el-button-bg-color: var(--el-color-white);
510
- --el-button-border-color: var(--el-color-primary-light-5);
511
- --el-button-hover-text-color: var(--el-color-primary-light-4);
526
+ --el-button-border-color: var(--el-color-secondary-light-5);
527
+ --el-button-hover-text-color: var(--el-color-secondary-light-4);
512
528
  --el-button-hover-bg-color: var(--el-color-white);
513
- --el-button-hover-border-color: var(--el-color-primary-light-4);
514
- --el-button-active-text-color: var(--el-color-primary-light-6);
529
+ --el-button-hover-border-color: var(--el-color-secondary-light-4);
530
+ --el-button-active-text-color: var(--el-color-secondary-light-6);
515
531
  --el-button-active-bg-color: var(--el-color-white);
516
- --el-button-active-border-color: var(--el-color-primary-light-6);
532
+ --el-button-active-border-color: var(--el-color-secondary-light-6);
533
+ }
534
+ .el-message-box__btns .el-button:first-of-type.is-plain.is-disabled, .el-message-box__btns .el-button:first-of-type.is-plain.is-disabled:hover, .el-message-box__btns .el-button:first-of-type.is-plain.is-disabled:focus, .el-message-box__btns .el-button:first-of-type.is-plain.is-disabled:active, .el-message-box__btns .el-button:first-of-type.is-text.is-disabled, .el-message-box__btns .el-button:first-of-type.is-text.is-disabled:hover, .el-message-box__btns .el-button:first-of-type.is-text.is-disabled:focus, .el-message-box__btns .el-button:first-of-type.is-text.is-disabled:active, .el-message-box__btns .el-button:first-of-type.is-link.is-disabled, .el-message-box__btns .el-button:first-of-type.is-link.is-disabled:hover, .el-message-box__btns .el-button:first-of-type.is-link.is-disabled:focus, .el-message-box__btns .el-button:first-of-type.is-link.is-disabled:active {
535
+ color: var(--el-color-secondary-light-2);
536
+ background-color: transparent;
537
+ border-color: var(--el-color-secondary-light-2);
517
538
  }
518
539
 
519
540
  .el-message-box--center .el-message-box__title {