@timus-networks/theme 2.4.286 → 2.4.288

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.285",
4
+ "version": "2.4.287",
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.285";
14
+ const version = "2.4.287";
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 = {
@@ -13638,6 +13638,24 @@ heights > $common-component-size
13638
13638
  }
13639
13639
  .el-select__wrapper.is-filterable {
13640
13640
  cursor: text;
13641
+ overflow: hidden;
13642
+ }
13643
+ .el-select__wrapper.is-filterable .el-select__selection {
13644
+ overflow: hidden;
13645
+ }
13646
+ .el-select__wrapper.is-filterable .el-select__input-wrapper {
13647
+ flex: 1 1 0;
13648
+ min-width: 0;
13649
+ max-width: 100%;
13650
+ overflow: hidden;
13651
+ }
13652
+ .el-select__wrapper.is-filterable .el-select__input {
13653
+ min-width: 0 !important;
13654
+ width: 100% !important;
13655
+ max-width: 100%;
13656
+ overflow: hidden;
13657
+ text-overflow: ellipsis;
13658
+ white-space: nowrap;
13641
13659
  }
13642
13660
 
13643
13661
  .el-select__wrapper.is-focused {
@@ -13739,17 +13757,10 @@ heights > $common-component-size
13739
13757
  flex-wrap: wrap;
13740
13758
  user-select: none;
13741
13759
  align-items: center;
13742
- /* Sonradan ekledim truncate etmek için */
13743
- white-space: nowrap;
13744
- text-overflow: ellipsis;
13745
- width: min-content;
13746
- max-width: calc(100% - 120px);
13760
+ flex-shrink: 1;
13747
13761
  }
13748
13762
  .el-select__selected-item.el-tooltip__trigger {
13749
- max-width: min-content;
13750
- }
13751
- .el-select__selected-item {
13752
- /* buraya kadar ekledim truncate etmek için */
13763
+ flex-shrink: 0;
13753
13764
  }
13754
13765
  .el-select__selected-item .el-tag.el-tag--info {
13755
13766
  --el-tag-bg-color: var(--el-color-primary-light-1);
@@ -13757,15 +13768,6 @@ heights > $common-component-size
13757
13768
  --el-tag-hover-color: var(--el-color-primary-light-5);
13758
13769
  --el-tag-text-color: var(--el-color-primary-light-5);
13759
13770
  }
13760
- .el-select__selected-item:has(~ .el-select__input-wrapper.is-hidden) {
13761
- max-width: none;
13762
- }
13763
- .el-select__selected-item:has(+ .el-tooltip__trigger + .el-select__input-wrapper:not(.is-hidden)) {
13764
- max-width: calc(100% - 160px);
13765
- }
13766
- .el-select__selected-item:has(~ .el-select__input-wrapper.is-hidden) {
13767
- max-width: none;
13768
- }
13769
13771
 
13770
13772
  .el-select__tags-text {
13771
13773
  display: block;
@@ -13781,11 +13783,12 @@ heights > $common-component-size
13781
13783
  top: 50%;
13782
13784
  transform: translateY(-50%);
13783
13785
  width: 100%;
13786
+ max-width: 100%;
13784
13787
  overflow: hidden;
13785
13788
  text-overflow: ellipsis;
13786
13789
  white-space: nowrap;
13787
13790
  color: var(--el-input-text-color, var(--el-text-color-regular));
13788
- min-width: 100%;
13791
+ min-width: 0;
13789
13792
  }
13790
13793
  .el-select__placeholder.is-transparent {
13791
13794
  user-select: none;
@@ -13980,6 +13983,36 @@ heights > $common-component-size
13980
13983
  flex-wrap: wrap;
13981
13984
  }
13982
13985
 
13986
+ .el-form-items .el-select .el-select__placeholder {
13987
+ min-width: 0;
13988
+ max-width: 100%;
13989
+ }
13990
+ .el-form-items .el-select .el-select__selection > .el-select__selected-item:not(.el-tooltip__trigger) {
13991
+ flex: 0 1 auto;
13992
+ min-width: 0;
13993
+ overflow: hidden;
13994
+ max-width: 100%;
13995
+ }
13996
+ .el-form-items .el-select .el-select__selection > .el-select__selected-item:not(.el-tooltip__trigger):has(+ .el-select__selected-item.el-tooltip__trigger) {
13997
+ max-width: calc(100% - 3rem);
13998
+ }
13999
+ .el-form-items .el-select .el-select__selection > .el-select__selected-item:not(.el-tooltip__trigger) .el-tag {
14000
+ max-width: 100% !important;
14001
+ width: 100%;
14002
+ }
14003
+ .el-form-items .el-select .el-select__selection > .el-select__selected-item.el-tooltip__trigger {
14004
+ flex: 0 0 auto;
14005
+ width: auto;
14006
+ max-width: none;
14007
+ position: static;
14008
+ display: inline-flex;
14009
+ align-items: center;
14010
+ }
14011
+ .el-form-items .el-select .el-select__selection > .el-select__selected-item.el-tooltip__trigger .el-tag {
14012
+ width: auto !important;
14013
+ max-width: none !important;
14014
+ }
14015
+
13983
14016
  .el-skeleton {
13984
14017
  --el-skeleton-circle-size: var(--el-avatar-size);
13985
14018
  }
@@ -16496,6 +16529,9 @@ heights > $common-component-size
16496
16529
  background-color: var(--el-tag-bg-color);
16497
16530
  border-color: var(--el-tag-border-color);
16498
16531
  color: var(--el-tag-text-color);
16532
+ display: inline-flex;
16533
+ justify-content: center;
16534
+ align-items: center;
16499
16535
  vertical-align: middle;
16500
16536
  height: 16px;
16501
16537
  padding: 0 7px;
@@ -16507,9 +16543,6 @@ heights > $common-component-size
16507
16543
  box-sizing: border-box;
16508
16544
  white-space: nowrap;
16509
16545
  transition: none;
16510
- overflow: hidden;
16511
- text-overflow: ellipsis;
16512
- white-space: nowrap;
16513
16546
  --el-icon-size: 14px;
16514
16547
  --el-tag-bg-color: var(--el-color-primary-light-1);
16515
16548
  --el-tag-border-color: var(--el-color-primary-light-4);
@@ -16821,6 +16854,13 @@ heights > $common-component-size
16821
16854
  --el-tag-bg-color: var(--el-color-white);
16822
16855
  }
16823
16856
 
16857
+ .el-tag.el-tag--warning {
16858
+ --el-tag-bg-color: var(--el-color-warning-light-1);
16859
+ --el-tag-border-color: var(--el-color-warning-light-3);
16860
+ --el-tag-text-color: var(--el-color-warning-light-6);
16861
+ --el-tag-hover-color: var(--el-color-warning-light-6);
16862
+ }
16863
+
16824
16864
  .el-tag.rounded {
16825
16865
  width: 16px;
16826
16866
  height: 16px;
@@ -12746,6 +12746,24 @@ h6,
12746
12746
  }
12747
12747
  .el-select__wrapper.is-filterable {
12748
12748
  cursor: text;
12749
+ overflow: hidden;
12750
+ }
12751
+ .el-select__wrapper.is-filterable .el-select__selection {
12752
+ overflow: hidden;
12753
+ }
12754
+ .el-select__wrapper.is-filterable .el-select__input-wrapper {
12755
+ flex: 1 1 0;
12756
+ min-width: 0;
12757
+ max-width: 100%;
12758
+ overflow: hidden;
12759
+ }
12760
+ .el-select__wrapper.is-filterable .el-select__input {
12761
+ min-width: 0 !important;
12762
+ width: 100% !important;
12763
+ max-width: 100%;
12764
+ overflow: hidden;
12765
+ text-overflow: ellipsis;
12766
+ white-space: nowrap;
12749
12767
  }
12750
12768
 
12751
12769
  .el-select__wrapper.is-focused {
@@ -12847,17 +12865,10 @@ h6,
12847
12865
  flex-wrap: wrap;
12848
12866
  user-select: none;
12849
12867
  align-items: center;
12850
- /* Sonradan ekledim truncate etmek için */
12851
- white-space: nowrap;
12852
- text-overflow: ellipsis;
12853
- width: min-content;
12854
- max-width: calc(100% - 120px);
12868
+ flex-shrink: 1;
12855
12869
  }
12856
12870
  .el-select__selected-item.el-tooltip__trigger {
12857
- max-width: min-content;
12858
- }
12859
- .el-select__selected-item {
12860
- /* buraya kadar ekledim truncate etmek için */
12871
+ flex-shrink: 0;
12861
12872
  }
12862
12873
  .el-select__selected-item .el-tag.el-tag--info {
12863
12874
  --el-tag-bg-color: var(--el-color-primary-light-1);
@@ -12865,15 +12876,6 @@ h6,
12865
12876
  --el-tag-hover-color: var(--el-color-primary-light-5);
12866
12877
  --el-tag-text-color: var(--el-color-primary-light-5);
12867
12878
  }
12868
- .el-select__selected-item:has(~ .el-select__input-wrapper.is-hidden) {
12869
- max-width: none;
12870
- }
12871
- .el-select__selected-item:has(+ .el-tooltip__trigger + .el-select__input-wrapper:not(.is-hidden)) {
12872
- max-width: calc(100% - 160px);
12873
- }
12874
- .el-select__selected-item:has(~ .el-select__input-wrapper.is-hidden) {
12875
- max-width: none;
12876
- }
12877
12879
 
12878
12880
  .el-select__tags-text {
12879
12881
  display: block;
@@ -12889,11 +12891,12 @@ h6,
12889
12891
  top: 50%;
12890
12892
  transform: translateY(-50%);
12891
12893
  width: 100%;
12894
+ max-width: 100%;
12892
12895
  overflow: hidden;
12893
12896
  text-overflow: ellipsis;
12894
12897
  white-space: nowrap;
12895
12898
  color: var(--el-input-text-color, var(--el-text-color-regular));
12896
- min-width: 100%;
12899
+ min-width: 0;
12897
12900
  }
12898
12901
  .el-select__placeholder.is-transparent {
12899
12902
  user-select: none;
@@ -13088,6 +13091,36 @@ h6,
13088
13091
  flex-wrap: wrap;
13089
13092
  }
13090
13093
 
13094
+ .el-form-items .el-select .el-select__placeholder {
13095
+ min-width: 0;
13096
+ max-width: 100%;
13097
+ }
13098
+ .el-form-items .el-select .el-select__selection > .el-select__selected-item:not(.el-tooltip__trigger) {
13099
+ flex: 0 1 auto;
13100
+ min-width: 0;
13101
+ overflow: hidden;
13102
+ max-width: 100%;
13103
+ }
13104
+ .el-form-items .el-select .el-select__selection > .el-select__selected-item:not(.el-tooltip__trigger):has(+ .el-select__selected-item.el-tooltip__trigger) {
13105
+ max-width: calc(100% - 3rem);
13106
+ }
13107
+ .el-form-items .el-select .el-select__selection > .el-select__selected-item:not(.el-tooltip__trigger) .el-tag {
13108
+ max-width: 100% !important;
13109
+ width: 100%;
13110
+ }
13111
+ .el-form-items .el-select .el-select__selection > .el-select__selected-item.el-tooltip__trigger {
13112
+ flex: 0 0 auto;
13113
+ width: auto;
13114
+ max-width: none;
13115
+ position: static;
13116
+ display: inline-flex;
13117
+ align-items: center;
13118
+ }
13119
+ .el-form-items .el-select .el-select__selection > .el-select__selected-item.el-tooltip__trigger .el-tag {
13120
+ width: auto !important;
13121
+ max-width: none !important;
13122
+ }
13123
+
13091
13124
  .el-skeleton {
13092
13125
  --el-skeleton-circle-size: var(--el-avatar-size);
13093
13126
  }
@@ -15604,6 +15637,9 @@ h6,
15604
15637
  background-color: var(--el-tag-bg-color);
15605
15638
  border-color: var(--el-tag-border-color);
15606
15639
  color: var(--el-tag-text-color);
15640
+ display: inline-flex;
15641
+ justify-content: center;
15642
+ align-items: center;
15607
15643
  vertical-align: middle;
15608
15644
  height: 16px;
15609
15645
  padding: 0 7px;
@@ -15615,9 +15651,6 @@ h6,
15615
15651
  box-sizing: border-box;
15616
15652
  white-space: nowrap;
15617
15653
  transition: none;
15618
- overflow: hidden;
15619
- text-overflow: ellipsis;
15620
- white-space: nowrap;
15621
15654
  --el-icon-size: 14px;
15622
15655
  --el-tag-bg-color: var(--el-color-primary-light-1);
15623
15656
  --el-tag-border-color: var(--el-color-primary-light-4);
@@ -15929,6 +15962,13 @@ h6,
15929
15962
  --el-tag-bg-color: var(--el-color-white);
15930
15963
  }
15931
15964
 
15965
+ .el-tag.el-tag--warning {
15966
+ --el-tag-bg-color: var(--el-color-warning-light-1);
15967
+ --el-tag-border-color: var(--el-color-warning-light-3);
15968
+ --el-tag-text-color: var(--el-color-warning-light-6);
15969
+ --el-tag-hover-color: var(--el-color-warning-light-6);
15970
+ }
15971
+
15932
15972
  .el-tag.rounded {
15933
15973
  width: 16px;
15934
15974
  height: 16px;
@@ -488,6 +488,24 @@ Bununla selectorun içerisine variable ekleyebiliyorsun
488
488
  }
489
489
  .el-select__wrapper.is-filterable {
490
490
  cursor: text;
491
+ overflow: hidden;
492
+ }
493
+ .el-select__wrapper.is-filterable .el-select__selection {
494
+ overflow: hidden;
495
+ }
496
+ .el-select__wrapper.is-filterable .el-select__input-wrapper {
497
+ flex: 1 1 0;
498
+ min-width: 0;
499
+ max-width: 100%;
500
+ overflow: hidden;
501
+ }
502
+ .el-select__wrapper.is-filterable .el-select__input {
503
+ min-width: 0 !important;
504
+ width: 100% !important;
505
+ max-width: 100%;
506
+ overflow: hidden;
507
+ text-overflow: ellipsis;
508
+ white-space: nowrap;
491
509
  }
492
510
 
493
511
  .el-select__wrapper.is-focused {
@@ -589,17 +607,10 @@ Bununla selectorun içerisine variable ekleyebiliyorsun
589
607
  flex-wrap: wrap;
590
608
  user-select: none;
591
609
  align-items: center;
592
- /* Sonradan ekledim truncate etmek için */
593
- white-space: nowrap;
594
- text-overflow: ellipsis;
595
- width: min-content;
596
- max-width: calc(100% - 120px);
610
+ flex-shrink: 1;
597
611
  }
598
612
  .el-select__selected-item.el-tooltip__trigger {
599
- max-width: min-content;
600
- }
601
- .el-select__selected-item {
602
- /* buraya kadar ekledim truncate etmek için */
613
+ flex-shrink: 0;
603
614
  }
604
615
  .el-select__selected-item .el-tag.el-tag--info {
605
616
  --el-tag-bg-color: var(--el-color-primary-light-1);
@@ -607,15 +618,6 @@ Bununla selectorun içerisine variable ekleyebiliyorsun
607
618
  --el-tag-hover-color: var(--el-color-primary-light-5);
608
619
  --el-tag-text-color: var(--el-color-primary-light-5);
609
620
  }
610
- .el-select__selected-item:has(~ .el-select__input-wrapper.is-hidden) {
611
- max-width: none;
612
- }
613
- .el-select__selected-item:has(+ .el-tooltip__trigger + .el-select__input-wrapper:not(.is-hidden)) {
614
- max-width: calc(100% - 160px);
615
- }
616
- .el-select__selected-item:has(~ .el-select__input-wrapper.is-hidden) {
617
- max-width: none;
618
- }
619
621
 
620
622
  .el-select__tags-text {
621
623
  display: block;
@@ -631,11 +633,12 @@ Bununla selectorun içerisine variable ekleyebiliyorsun
631
633
  top: 50%;
632
634
  transform: translateY(-50%);
633
635
  width: 100%;
636
+ max-width: 100%;
634
637
  overflow: hidden;
635
638
  text-overflow: ellipsis;
636
639
  white-space: nowrap;
637
640
  color: var(--el-input-text-color, var(--el-text-color-regular));
638
- min-width: 100%;
641
+ min-width: 0;
639
642
  }
640
643
  .el-select__placeholder.is-transparent {
641
644
  user-select: none;
@@ -828,4 +831,34 @@ Bununla selectorun içerisine variable ekleyebiliyorsun
828
831
 
829
832
  .el-select.wrap .el-select__selection {
830
833
  flex-wrap: wrap;
834
+ }
835
+
836
+ .el-form-items .el-select .el-select__placeholder {
837
+ min-width: 0;
838
+ max-width: 100%;
839
+ }
840
+ .el-form-items .el-select .el-select__selection > .el-select__selected-item:not(.el-tooltip__trigger) {
841
+ flex: 0 1 auto;
842
+ min-width: 0;
843
+ overflow: hidden;
844
+ max-width: 100%;
845
+ }
846
+ .el-form-items .el-select .el-select__selection > .el-select__selected-item:not(.el-tooltip__trigger):has(+ .el-select__selected-item.el-tooltip__trigger) {
847
+ max-width: calc(100% - 3rem);
848
+ }
849
+ .el-form-items .el-select .el-select__selection > .el-select__selected-item:not(.el-tooltip__trigger) .el-tag {
850
+ max-width: 100% !important;
851
+ width: 100%;
852
+ }
853
+ .el-form-items .el-select .el-select__selection > .el-select__selected-item.el-tooltip__trigger {
854
+ flex: 0 0 auto;
855
+ width: auto;
856
+ max-width: none;
857
+ position: static;
858
+ display: inline-flex;
859
+ align-items: center;
860
+ }
861
+ .el-form-items .el-select .el-select__selection > .el-select__selected-item.el-tooltip__trigger .el-tag {
862
+ width: auto !important;
863
+ max-width: none !important;
831
864
  }
@@ -488,6 +488,24 @@ Bununla selectorun içerisine variable ekleyebiliyorsun
488
488
  }
489
489
  .el-select__wrapper.is-filterable {
490
490
  cursor: text;
491
+ overflow: hidden;
492
+ }
493
+ .el-select__wrapper.is-filterable .el-select__selection {
494
+ overflow: hidden;
495
+ }
496
+ .el-select__wrapper.is-filterable .el-select__input-wrapper {
497
+ flex: 1 1 0;
498
+ min-width: 0;
499
+ max-width: 100%;
500
+ overflow: hidden;
501
+ }
502
+ .el-select__wrapper.is-filterable .el-select__input {
503
+ min-width: 0 !important;
504
+ width: 100% !important;
505
+ max-width: 100%;
506
+ overflow: hidden;
507
+ text-overflow: ellipsis;
508
+ white-space: nowrap;
491
509
  }
492
510
 
493
511
  .el-select__wrapper.is-focused {
@@ -589,17 +607,10 @@ Bununla selectorun içerisine variable ekleyebiliyorsun
589
607
  flex-wrap: wrap;
590
608
  user-select: none;
591
609
  align-items: center;
592
- /* Sonradan ekledim truncate etmek için */
593
- white-space: nowrap;
594
- text-overflow: ellipsis;
595
- width: min-content;
596
- max-width: calc(100% - 120px);
610
+ flex-shrink: 1;
597
611
  }
598
612
  .el-select__selected-item.el-tooltip__trigger {
599
- max-width: min-content;
600
- }
601
- .el-select__selected-item {
602
- /* buraya kadar ekledim truncate etmek için */
613
+ flex-shrink: 0;
603
614
  }
604
615
  .el-select__selected-item .el-tag.el-tag--info {
605
616
  --el-tag-bg-color: var(--el-color-primary-light-1);
@@ -607,15 +618,6 @@ Bununla selectorun içerisine variable ekleyebiliyorsun
607
618
  --el-tag-hover-color: var(--el-color-primary-light-5);
608
619
  --el-tag-text-color: var(--el-color-primary-light-5);
609
620
  }
610
- .el-select__selected-item:has(~ .el-select__input-wrapper.is-hidden) {
611
- max-width: none;
612
- }
613
- .el-select__selected-item:has(+ .el-tooltip__trigger + .el-select__input-wrapper:not(.is-hidden)) {
614
- max-width: calc(100% - 160px);
615
- }
616
- .el-select__selected-item:has(~ .el-select__input-wrapper.is-hidden) {
617
- max-width: none;
618
- }
619
621
 
620
622
  .el-select__tags-text {
621
623
  display: block;
@@ -631,11 +633,12 @@ Bununla selectorun içerisine variable ekleyebiliyorsun
631
633
  top: 50%;
632
634
  transform: translateY(-50%);
633
635
  width: 100%;
636
+ max-width: 100%;
634
637
  overflow: hidden;
635
638
  text-overflow: ellipsis;
636
639
  white-space: nowrap;
637
640
  color: var(--el-input-text-color, var(--el-text-color-regular));
638
- min-width: 100%;
641
+ min-width: 0;
639
642
  }
640
643
  .el-select__placeholder.is-transparent {
641
644
  user-select: none;
@@ -828,4 +831,34 @@ Bununla selectorun içerisine variable ekleyebiliyorsun
828
831
 
829
832
  .el-select.wrap .el-select__selection {
830
833
  flex-wrap: wrap;
834
+ }
835
+
836
+ .el-form-items .el-select .el-select__placeholder {
837
+ min-width: 0;
838
+ max-width: 100%;
839
+ }
840
+ .el-form-items .el-select .el-select__selection > .el-select__selected-item:not(.el-tooltip__trigger) {
841
+ flex: 0 1 auto;
842
+ min-width: 0;
843
+ overflow: hidden;
844
+ max-width: 100%;
845
+ }
846
+ .el-form-items .el-select .el-select__selection > .el-select__selected-item:not(.el-tooltip__trigger):has(+ .el-select__selected-item.el-tooltip__trigger) {
847
+ max-width: calc(100% - 3rem);
848
+ }
849
+ .el-form-items .el-select .el-select__selection > .el-select__selected-item:not(.el-tooltip__trigger) .el-tag {
850
+ max-width: 100% !important;
851
+ width: 100%;
852
+ }
853
+ .el-form-items .el-select .el-select__selection > .el-select__selected-item.el-tooltip__trigger {
854
+ flex: 0 0 auto;
855
+ width: auto;
856
+ max-width: none;
857
+ position: static;
858
+ display: inline-flex;
859
+ align-items: center;
860
+ }
861
+ .el-form-items .el-select .el-select__selection > .el-select__selected-item.el-tooltip__trigger .el-tag {
862
+ width: auto !important;
863
+ max-width: none !important;
831
864
  }
@@ -53,6 +53,27 @@
53
53
 
54
54
  @include when(filterable) {
55
55
  cursor: text;
56
+ overflow: hidden;
57
+
58
+ .#{$namespace}-select__selection {
59
+ overflow: hidden;
60
+ }
61
+
62
+ .#{$namespace}-select__input-wrapper {
63
+ flex: 1 1 0;
64
+ min-width: 0;
65
+ max-width: 100%;
66
+ overflow: hidden;
67
+ }
68
+
69
+ .#{$namespace}-select__input {
70
+ min-width: 0 !important;
71
+ width: 100% !important;
72
+ max-width: 100%;
73
+ overflow: hidden;
74
+ text-overflow: ellipsis;
75
+ white-space: nowrap;
76
+ }
56
77
  }
57
78
 
58
79
  @include when(focused) {
@@ -176,18 +197,11 @@
176
197
  flex-wrap: wrap;
177
198
  user-select: none;
178
199
  align-items: center;
200
+ flex-shrink: 1;
179
201
 
180
- /* Sonradan ekledim truncate etmek için */
181
- white-space: nowrap;
182
- // overflow: hidden;
183
- text-overflow: ellipsis;
184
- width: min-content;
185
- max-width: calc(100% - 120px);
186
-
187
- &.el-tooltip__trigger {
188
- max-width: min-content;
202
+ &.#{$namespace}-tooltip__trigger {
203
+ flex-shrink: 0;
189
204
  }
190
- /* buraya kadar ekledim truncate etmek için */
191
205
 
192
206
  .el-tag.#{$namespace}-tag--info {
193
207
  @include css-var-from-global(('tag', 'bg-color'), ('color', 'primary', 'light-1'));
@@ -195,18 +209,6 @@
195
209
  @include css-var-from-global(('tag', 'hover-color'), ('color', 'primary', 'light-5'));
196
210
  @include css-var-from-global(('tag', 'text-color'), ('color', 'primary', 'light-5'));
197
211
  }
198
-
199
- &:has(~ .el-select__input-wrapper.is-hidden) {
200
- max-width: none;
201
- }
202
-
203
- &:has(+ .el-tooltip__trigger + .el-select__input-wrapper:not(.is-hidden)) {
204
- max-width: calc(100% - 160px);
205
- }
206
-
207
- &:has(~ .el-select__input-wrapper.is-hidden) {
208
- max-width: none;
209
- }
210
212
  }
211
213
 
212
214
  @include e(tags-text) {
@@ -221,9 +223,10 @@
221
223
  top: 50%;
222
224
  transform: translateY(-50%);
223
225
  width: 100%;
226
+ max-width: 100%;
224
227
  @include utils-ellipsis;
225
228
  color: var(#{getCssVarName('input-text-color')}, map.get($input, 'text-color'));
226
- min-width: 100%;
229
+ min-width: 0;
227
230
 
228
231
  @include when(transparent) {
229
232
  user-select: none;
@@ -326,3 +329,43 @@
326
329
  }
327
330
  }
328
331
  }
332
+
333
+ // el-form-items value selects (rules port-input, ztna source, etc.) — collapse-tags layout
334
+ .el-form-items .#{$namespace}-select {
335
+ .#{$namespace}-select__placeholder {
336
+ min-width: 0;
337
+ max-width: 100%;
338
+ }
339
+
340
+ .#{$namespace}-select__selection {
341
+ & > .#{$namespace}-select__selected-item:not(.#{$namespace}-tooltip__trigger) {
342
+ flex: 0 1 auto;
343
+ min-width: 0;
344
+ overflow: hidden;
345
+ max-width: 100%;
346
+
347
+ &:has(+ .#{$namespace}-select__selected-item.#{$namespace}-tooltip__trigger) {
348
+ max-width: calc(100% - 3rem);
349
+ }
350
+
351
+ .#{$namespace}-tag {
352
+ max-width: 100% !important;
353
+ width: 100%;
354
+ }
355
+ }
356
+
357
+ & > .#{$namespace}-select__selected-item.#{$namespace}-tooltip__trigger {
358
+ flex: 0 0 auto;
359
+ width: auto;
360
+ max-width: none;
361
+ position: static;
362
+ display: inline-flex;
363
+ align-items: center;
364
+
365
+ .#{$namespace}-tag {
366
+ width: auto !important;
367
+ max-width: none !important;
368
+ }
369
+ }
370
+ }
371
+ }
@@ -310,6 +310,9 @@ Bununla selectorun içerisine variable ekleyebiliyorsun
310
310
  background-color: var(--el-tag-bg-color);
311
311
  border-color: var(--el-tag-border-color);
312
312
  color: var(--el-tag-text-color);
313
+ display: inline-flex;
314
+ justify-content: center;
315
+ align-items: center;
313
316
  vertical-align: middle;
314
317
  height: 16px;
315
318
  padding: 0 7px;
@@ -321,9 +324,6 @@ Bununla selectorun içerisine variable ekleyebiliyorsun
321
324
  box-sizing: border-box;
322
325
  white-space: nowrap;
323
326
  transition: none;
324
- overflow: hidden;
325
- text-overflow: ellipsis;
326
- white-space: nowrap;
327
327
  --el-icon-size: 14px;
328
328
  --el-tag-bg-color: var(--el-color-primary-light-1);
329
329
  --el-tag-border-color: var(--el-color-primary-light-4);
@@ -635,6 +635,13 @@ Bununla selectorun içerisine variable ekleyebiliyorsun
635
635
  --el-tag-bg-color: var(--el-color-white);
636
636
  }
637
637
 
638
+ .el-tag.el-tag--warning {
639
+ --el-tag-bg-color: var(--el-color-warning-light-1);
640
+ --el-tag-border-color: var(--el-color-warning-light-3);
641
+ --el-tag-text-color: var(--el-color-warning-light-6);
642
+ --el-tag-hover-color: var(--el-color-warning-light-6);
643
+ }
644
+
638
645
  .el-tag.rounded {
639
646
  width: 16px;
640
647
  height: 16px;
@@ -52,9 +52,9 @@ $tag-icon-span-gap: map.merge(
52
52
  border-color: getCssVar('tag-border-color');
53
53
  color: getCssVar('tag-text-color');
54
54
 
55
- // display: inline-flex;
56
- // justify-content: center;
57
- // align-items: center;
55
+ display: inline-flex;
56
+ justify-content: center;
57
+ align-items: center;
58
58
  vertical-align: middle;
59
59
  height: map.get($tag-height, 'default');
60
60
  padding: 0 map.get($tag-padding, 'default') - $border-width;
@@ -68,11 +68,6 @@ $tag-icon-span-gap: map.merge(
68
68
  white-space: nowrap;
69
69
  transition: none;
70
70
 
71
- // truncate
72
- overflow: hidden;
73
- text-overflow: ellipsis;
74
- white-space: nowrap;
75
-
76
71
  @include set-css-var-value('icon-size', 14px);
77
72
  @include genTheme('light-1', 'light-4', '');
78
73
 
@@ -175,6 +170,14 @@ $tag-icon-span-gap: map.merge(
175
170
  --el-tag-bg-color: var(--el-color-white);
176
171
  }
177
172
 
173
+ // [TC-19214] - Changed the colors of the warning type tags only to improve readability.
174
+ .el-tag.el-tag--warning {
175
+ --el-tag-bg-color: var(--el-color-warning-light-1);
176
+ --el-tag-border-color: var(--el-color-warning-light-3);
177
+ --el-tag-text-color: var(--el-color-warning-light-6);
178
+ --el-tag-hover-color: var(--el-color-warning-light-6);
179
+ }
180
+
178
181
  .el-tag {
179
182
  &.rounded {
180
183
  width: 16px;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@timus-networks/theme",
3
- "version": "2.4.286",
3
+ "version": "2.4.288",
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": {