oneslash-design-system 1.1.11 → 1.1.13

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/designTokens.js CHANGED
@@ -46,10 +46,10 @@ module.exports = {
46
46
  light: '#67C16B',
47
47
  },
48
48
  background:{
49
- default: '#FFFFFF',
50
- accent100:'#F6F6F6',
51
- accent200:'#E7E7E7',
52
- accent300:'#D1D1D1',
49
+ default: '#F2F2F2',
50
+ accent100:'#F5F5F5',
51
+ accent200:'#FAFAFA',
52
+ accent300:'#FFFFFF',
53
53
  },
54
54
  action:{
55
55
  active: '#888888',
@@ -47,10 +47,10 @@ module.exports = {
47
47
  light: '#67C16B',
48
48
  },
49
49
  background: {
50
- default: '#FFFFFF',
51
- accent100: '#F6F6F6',
52
- accent200: '#E7E7E7',
53
- accent300: '#D1D1D1',
50
+ default: '#F2F2F2',
51
+ accent100: '#F5F5F5',
52
+ accent200: '#FAFAFA',
53
+ accent300: '#FFFFFF',
54
54
  },
55
55
  action: {
56
56
  active: '#888888',
package/dist/output.css CHANGED
@@ -563,6 +563,9 @@ video {
563
563
  .h-12 {
564
564
  height: 3rem;
565
565
  }
566
+ .h-2 {
567
+ height: 0.5rem;
568
+ }
566
569
  .h-3 {
567
570
  height: 0.75rem;
568
571
  }
@@ -587,6 +590,9 @@ video {
587
590
  .w-12 {
588
591
  width: 3rem;
589
592
  }
593
+ .w-2 {
594
+ width: 0.5rem;
595
+ }
590
596
  .w-3 {
591
597
  width: 0.75rem;
592
598
  }
@@ -663,6 +669,11 @@ video {
663
669
  margin-right: calc(0.5rem * var(--tw-space-x-reverse));
664
670
  margin-left: calc(0.5rem * calc(1 - var(--tw-space-x-reverse)));
665
671
  }
672
+ .space-x-4 > :not([hidden]) ~ :not([hidden]) {
673
+ --tw-space-x-reverse: 0;
674
+ margin-right: calc(1rem * var(--tw-space-x-reverse));
675
+ margin-left: calc(1rem * calc(1 - var(--tw-space-x-reverse)));
676
+ }
666
677
  .space-y-2 > :not([hidden]) ~ :not([hidden]) {
667
678
  --tw-space-y-reverse: 0;
668
679
  margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));
@@ -713,6 +724,10 @@ video {
713
724
  --tw-border-opacity: 1;
714
725
  border-color: rgb(238 174 3 / var(--tw-border-opacity));
715
726
  }
727
+ .border-light-text-primary {
728
+ --tw-border-opacity: 1;
729
+ border-color: rgb(0 0 0 / var(--tw-border-opacity));
730
+ }
716
731
  .border-light-text-secondary {
717
732
  --tw-border-opacity: 1;
718
733
  border-color: rgb(109 109 109 / var(--tw-border-opacity));
@@ -740,21 +755,25 @@ video {
740
755
  --tw-bg-opacity: 1;
741
756
  background-color: rgb(238 174 3 / var(--tw-bg-opacity));
742
757
  }
758
+ .bg-light-action-selected {
759
+ --tw-bg-opacity: 1;
760
+ background-color: rgb(227 227 227 / var(--tw-bg-opacity));
761
+ }
743
762
  .bg-light-actionBackground-disabled {
744
763
  --tw-bg-opacity: 1;
745
764
  background-color: rgb(238 238 238 / var(--tw-bg-opacity));
746
765
  }
747
766
  .bg-light-background-accent100 {
748
767
  --tw-bg-opacity: 1;
749
- background-color: rgb(246 246 246 / var(--tw-bg-opacity));
768
+ background-color: rgb(245 245 245 / var(--tw-bg-opacity));
750
769
  }
751
770
  .bg-light-background-accent200 {
752
771
  --tw-bg-opacity: 1;
753
- background-color: rgb(231 231 231 / var(--tw-bg-opacity));
772
+ background-color: rgb(250 250 250 / var(--tw-bg-opacity));
754
773
  }
755
774
  .bg-light-background-default {
756
775
  --tw-bg-opacity: 1;
757
- background-color: rgb(255 255 255 / var(--tw-bg-opacity));
776
+ background-color: rgb(242 242 242 / var(--tw-bg-opacity));
758
777
  }
759
778
  .bg-light-error-main {
760
779
  --tw-bg-opacity: 1;
@@ -772,6 +791,10 @@ video {
772
791
  --tw-bg-opacity: 1;
773
792
  background-color: rgb(50 135 54 / var(--tw-bg-opacity));
774
793
  }
794
+ .bg-light-text-primary {
795
+ --tw-bg-opacity: 1;
796
+ background-color: rgb(0 0 0 / var(--tw-bg-opacity));
797
+ }
775
798
  .bg-light-warning-main {
776
799
  --tw-bg-opacity: 1;
777
800
  background-color: rgb(239 108 0 / var(--tw-bg-opacity));
@@ -912,7 +935,7 @@ video {
912
935
  --tw-ring-offset-width: 4px;
913
936
  }
914
937
  .ring-offset-light-background-default {
915
- --tw-ring-offset-color: #FFFFFF;
938
+ --tw-ring-offset-color: #F2F2F2;
916
939
  }
917
940
  .blur {
918
941
  --tw-blur: blur(8px);
@@ -962,17 +985,17 @@ body {
962
985
 
963
986
  .hover\:bg-light-background-accent100:hover {
964
987
  --tw-bg-opacity: 1;
965
- background-color: rgb(246 246 246 / var(--tw-bg-opacity));
988
+ background-color: rgb(245 245 245 / var(--tw-bg-opacity));
966
989
  }
967
990
 
968
991
  .hover\:bg-light-background-accent300:hover {
969
992
  --tw-bg-opacity: 1;
970
- background-color: rgb(209 209 209 / var(--tw-bg-opacity));
993
+ background-color: rgb(255 255 255 / var(--tw-bg-opacity));
971
994
  }
972
995
 
973
996
  .hover\:bg-light-background-default:hover {
974
997
  --tw-bg-opacity: 1;
975
- background-color: rgb(255 255 255 / var(--tw-bg-opacity));
998
+ background-color: rgb(242 242 242 / var(--tw-bg-opacity));
976
999
  }
977
1000
 
978
1001
  .hover\:bg-light-primary-dark:hover {
@@ -996,15 +1019,25 @@ body {
996
1019
 
997
1020
  @media (prefers-color-scheme: dark) {
998
1021
 
1022
+ .dark\:border-dark-text-primary {
1023
+ --tw-border-opacity: 1;
1024
+ border-color: rgb(255 255 255 / var(--tw-border-opacity));
1025
+ }
1026
+
999
1027
  .dark\:border-dark-text-secondary {
1000
1028
  --tw-border-opacity: 1;
1001
1029
  border-color: rgb(176 176 176 / var(--tw-border-opacity));
1002
1030
  }
1003
1031
 
1004
- .dark\:bg-dark-accent-main:is(.dark *) {
1005
- --tw-bg-opacity: 1;
1006
- background-color: rgb(255 205 41 / var(--tw-bg-opacity));
1007
- }
1032
+ .dark\:bg-dark-accent-main {
1033
+ --tw-bg-opacity: 1;
1034
+ background-color: rgb(255 205 41 / var(--tw-bg-opacity));
1035
+ }
1036
+
1037
+ .dark\:bg-dark-action-selected {
1038
+ --tw-bg-opacity: 1;
1039
+ background-color: rgb(78 78 78 / var(--tw-bg-opacity));
1040
+ }
1008
1041
 
1009
1042
  .dark\:bg-dark-actionBackground-disabled {
1010
1043
  --tw-bg-opacity: 1;
@@ -1046,6 +1079,11 @@ body {
1046
1079
  background-color: rgb(66 165 71 / var(--tw-bg-opacity));
1047
1080
  }
1048
1081
 
1082
+ .dark\:bg-dark-text-primary {
1083
+ --tw-bg-opacity: 1;
1084
+ background-color: rgb(255 255 255 / var(--tw-bg-opacity));
1085
+ }
1086
+
1049
1087
  .dark\:bg-dark-warning-main {
1050
1088
  --tw-bg-opacity: 1;
1051
1089
  background-color: rgb(255 140 10 / var(--tw-bg-opacity));
@@ -1053,7 +1091,7 @@ body {
1053
1091
 
1054
1092
  .dark\:bg-light-background-accent300 {
1055
1093
  --tw-bg-opacity: 1;
1056
- background-color: rgb(209 209 209 / var(--tw-bg-opacity));
1094
+ background-color: rgb(255 255 255 / var(--tw-bg-opacity));
1057
1095
  }
1058
1096
 
1059
1097
  .dark\:text-dark-info-main {
@@ -1100,15 +1138,15 @@ body {
1100
1138
  background-color: rgb(78 78 78 / var(--tw-bg-opacity));
1101
1139
  }
1102
1140
 
1103
- .dark\:hover\:bg-dark-background-accent200:hover:is(.dark *) {
1104
- --tw-bg-opacity: 1;
1105
- background-color: rgb(69 69 69 / var(--tw-bg-opacity));
1106
- }
1141
+ .dark\:hover\:bg-dark-action-hover:hover {
1142
+ --tw-bg-opacity: 1;
1143
+ background-color: rgb(61 61 61 / var(--tw-bg-opacity));
1144
+ }
1107
1145
 
1108
- .dark\:hover\:bg-dark-background-accent300:hover:is(.dark *) {
1109
- --tw-bg-opacity: 1;
1110
- background-color: rgb(79 79 79 / var(--tw-bg-opacity));
1111
- }
1146
+ .dark\:hover\:bg-dark-background-accent300:hover {
1147
+ --tw-bg-opacity: 1;
1148
+ background-color: rgb(79 79 79 / var(--tw-bg-opacity));
1149
+ }
1112
1150
 
1113
1151
  .dark\:hover\:bg-dark-primary-dark:hover {
1114
1152
  --tw-bg-opacity: 1;
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "oneslash-design-system",
3
3
  "description": "A design system for the Oneslash projects",
4
- "version": "1.1.11",
4
+ "version": "1.1.13",
5
5
  "private": false,
6
6
  "main": "./dist/index.js",
7
7
  "types": "./dist/index.d.ts",