@neo4j-ndl/base 0.5.0 → 0.6.0

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.
@@ -420,7 +420,7 @@ Ensure the default browser behavior of the `hidden` attribute.
420
420
  */
421
421
  /**
422
422
  * Do not edit directly
423
- * Generated on Tue, 07 Jun 2022 16:38:42 GMT
423
+ * Generated on Fri, 01 Jul 2022 10:44:25 GMT
424
424
  */
425
425
  :root {
426
426
  --border-radius-sm: 4px;
@@ -661,6 +661,39 @@ h6,
661
661
  letter-spacing: 0px;
662
662
  line-height: 20px;
663
663
  }
664
+ .n-container{
665
+ width: 100%;
666
+ }
667
+ @media (min-width: 450px){
668
+ .n-container{
669
+ max-width: 450px;
670
+ }
671
+ }
672
+ @media (min-width: 640px){
673
+ .n-container{
674
+ max-width: 640px;
675
+ }
676
+ }
677
+ @media (min-width: 768px){
678
+ .n-container{
679
+ max-width: 768px;
680
+ }
681
+ }
682
+ @media (min-width: 1024px){
683
+ .n-container{
684
+ max-width: 1024px;
685
+ }
686
+ }
687
+ @media (min-width: 1280px){
688
+ .n-container{
689
+ max-width: 1280px;
690
+ }
691
+ }
692
+ @media (min-width: 1536px){
693
+ .n-container{
694
+ max-width: 1536px;
695
+ }
696
+ }
664
697
  /**
665
698
  *
666
699
  * Copyright (c) "Neo4j"
@@ -860,6 +893,8 @@ a.ndl-btn{
860
893
  color: rgb(83 91 102 / var(--tw-text-opacity));
861
894
  }
862
895
  .ndl-icon-btn:not(.clean){
896
+ --tw-bg-opacity: 1;
897
+ background-color: rgb(255 255 255 / var(--tw-bg-opacity));
863
898
  --tw-ring-opacity: 1;
864
899
  --tw-ring-color: rgb(1 139 255 / var(--tw-ring-opacity));
865
900
  }
@@ -1613,7 +1648,6 @@ a.ndl-btn{
1613
1648
  width: 100%;
1614
1649
  position: absolute;
1615
1650
  top: -0.5px;
1616
- left: 0.5px;
1617
1651
  color: #fff;
1618
1652
  }
1619
1653
  .ndl-form-item input[type='checkbox']:checked::after {
@@ -2342,7 +2376,7 @@ a.ndl-btn{
2342
2376
  --tw-shadow-colored: 0px 4px 8px 0px var(--tw-shadow-color);
2343
2377
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
2344
2378
  position: fixed;
2345
- z-index: 2;
2379
+ z-index: 1001;
2346
2380
  display: none;
2347
2381
  flex-direction: column;
2348
2382
  border-width: 1px;
@@ -2362,7 +2396,7 @@ a.ndl-btn{
2362
2396
  bottom: 0px;
2363
2397
  right: 0px;
2364
2398
  left: 0px;
2365
- z-index: 1;
2399
+ z-index: 1000;
2366
2400
  }
2367
2401
  /**
2368
2402
  *
@@ -2390,10 +2424,10 @@ a.ndl-btn{
2390
2424
  left: 0;
2391
2425
  bottom: 0;
2392
2426
  right: 0;
2393
- z-index: 1001;
2394
2427
 
2395
2428
  background-color: rgba(0,0,0,0.4);
2396
2429
  cursor: default;
2430
+ z-index: 1000;
2397
2431
  }
2398
2432
  .ndl-modal {
2399
2433
  position: relative;
@@ -2404,6 +2438,7 @@ a.ndl-btn{
2404
2438
  margin: 32px;
2405
2439
  width: -moz-available;
2406
2440
  width: -webkit-fill-available;
2441
+ z-index: 1001;
2407
2442
  }
2408
2443
  .ndl-modal.small {
2409
2444
  max-width: 40rem;
@@ -2817,16 +2852,22 @@ a.ndl-btn{
2817
2852
  border-radius: 8px;
2818
2853
  --tw-border-opacity: 1;
2819
2854
  border-color: rgb(196 200 205 / var(--tw-border-opacity));
2855
+ padding: 0.25rem;
2820
2856
  }
2821
2857
  .ndl-drag-and-drop > div{
2822
2858
  padding-top: 2rem;
2823
2859
  padding-bottom: 2rem;
2824
2860
  }
2825
- .ndl-drag-and-drop .ndl-drag-and-drop-inner {
2826
- width: 320px;
2827
- margin-left: auto;
2828
- margin-right: auto;
2829
- }
2861
+ .ndl-drag-and-drop .ndl-drag-and-drop-inner{
2862
+ margin-left: auto;
2863
+ margin-right: auto;
2864
+ }
2865
+ .ndl-drag-and-drop .ndl-drag-and-drop-inner-content{
2866
+ display: flex;
2867
+ height: 100%;
2868
+ flex-direction: column;
2869
+ justify-content: center;
2870
+ }
2830
2871
  .ndl-drag-and-drop svg{
2831
2872
  margin-left: auto;
2832
2873
  margin-right: auto;
@@ -2900,6 +2941,96 @@ a.ndl-btn{
2900
2941
  --tw-bg-opacity: 1;
2901
2942
  background-color: rgb(237 18 82 / var(--tw-bg-opacity));
2902
2943
  }
2944
+ /**
2945
+ *
2946
+ * Copyright (c) "Neo4j"
2947
+ * Neo4j Sweden AB [http://neo4j.com]
2948
+ *
2949
+ * This file is part of Neo4j.
2950
+ *
2951
+ * Neo4j is free software: you can redistribute it and/or modify
2952
+ * it under the terms of the GNU General Public License as published by
2953
+ * the Free Software Foundation, either version 3 of the License, or
2954
+ * (at your option) any later version.
2955
+ *
2956
+ * This program is distributed in the hope that it will be useful,
2957
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
2958
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
2959
+ * GNU General Public License for more details.
2960
+ *
2961
+ * You should have received a copy of the GNU General Public License
2962
+ * along with this program. If not, see <http://www.gnu.org/licenses/>.
2963
+ */
2964
+ .ndl-dropdown{
2965
+ display: inline-flex;
2966
+ flex-direction: column;
2967
+ row-gap: 5px;
2968
+ }
2969
+ .ndl-dropdown.fluid{
2970
+ display: flex;
2971
+ }
2972
+ .ndl-dropdown label{
2973
+ --tw-text-opacity: 1;
2974
+ color: rgb(83 91 102 / var(--tw-text-opacity));
2975
+ font-size: var(--font-size-body-medium);
2976
+ font-weight: var(--font-weight-normal);
2977
+ letter-spacing: 0.25px;
2978
+ line-height: 20px;
2979
+ }
2980
+ .ndl-dropdown .sub-text{
2981
+ --tw-text-opacity: 1;
2982
+ color: rgb(113 119 128 / var(--tw-text-opacity));
2983
+ font-size: var(--font-size-body-small);
2984
+ font-weight: var(--font-weight-normal);
2985
+ letter-spacing: 0.25px;
2986
+ line-height: 20px;
2987
+ }
2988
+ .ndl-dropdown .error-text{
2989
+ --tw-text-opacity: 1;
2990
+ color: rgb(204 37 75 / var(--tw-text-opacity));
2991
+ }
2992
+ .ndl-dropdown.large label {
2993
+ font-size: var(--font-size-body-large);
2994
+ font-weight: var(--font-weight-normal);
2995
+ letter-spacing: 0.25px;
2996
+ line-height: 24px;
2997
+ }
2998
+ .ndl-dropdown.large .sub-text {
2999
+ font-size: var(--font-size-body-medium);
3000
+ font-weight: var(--font-weight-normal);
3001
+ letter-spacing: 0.25px;
3002
+ line-height: 20px;
3003
+ }
3004
+ .ndl-dropdown .dropdown-icon.small {
3005
+ width: 20px;
3006
+ height: 20px;
3007
+ }
3008
+ .ndl-dropdown .dropdown-icon.large {
3009
+ width: 24px;
3010
+ height: 24px;
3011
+ }
3012
+ .ndl-dropdown .dropdown-icon{
3013
+ --tw-text-opacity: 1;
3014
+ color: rgb(83 91 102 / var(--tw-text-opacity));
3015
+ }
3016
+ .ndl-dropdown .indicator {
3017
+ width: 1px;
3018
+ height: 100%;
3019
+ --tw-bg-opacity: 1;
3020
+ background-color: rgb(196 200 205 / var(--tw-bg-opacity));
3021
+ }
3022
+ .ndl-dropdown .error-icon.small {
3023
+ width: 20px;
3024
+ height: 20px;
3025
+ }
3026
+ .ndl-dropdown .error-icon.large {
3027
+ width: 24px;
3028
+ height: 24px;
3029
+ }
3030
+ .ndl-dropdown .error-icon{
3031
+ --tw-text-opacity: 1;
3032
+ color: rgb(204 37 75 / var(--tw-text-opacity));
3033
+ }
2903
3034
  .n-sr-only{
2904
3035
  position: absolute;
2905
3036
  width: 1px;
@@ -2988,6 +3119,9 @@ a.ndl-btn{
2988
3119
  .n-h-12{
2989
3120
  height: 3rem;
2990
3121
  }
3122
+ .n-h-7{
3123
+ height: 1.75rem;
3124
+ }
2991
3125
  .n-h-36{
2992
3126
  height: 9rem;
2993
3127
  }
@@ -3003,6 +3137,9 @@ a.ndl-btn{
3003
3137
  .n-w-10{
3004
3138
  width: 2.5rem;
3005
3139
  }
3140
+ .n-w-40{
3141
+ width: 10rem;
3142
+ }
3006
3143
  .n-w-6{
3007
3144
  width: 1.5rem;
3008
3145
  }
@@ -3059,9 +3196,15 @@ a.ndl-btn{
3059
3196
  .n-justify-between{
3060
3197
  justify-content: space-between;
3061
3198
  }
3199
+ .n-gap-3{
3200
+ gap: 0.75rem;
3201
+ }
3062
3202
  .n-gap-2{
3063
3203
  gap: 0.5rem;
3064
3204
  }
3205
+ .n-gap-1{
3206
+ gap: 0.25rem;
3207
+ }
3065
3208
  .n-gap-6{
3066
3209
  gap: 1.5rem;
3067
3210
  }
@@ -10,6 +10,10 @@ export const theme: {
10
10
  transparent: string;
11
11
  current: string;
12
12
  };
13
+ zIndex: {
14
+ modal: number;
15
+ 'modal-backdrop': number;
16
+ };
13
17
  };
14
18
  colors: {
15
19
  light: {
@@ -65,6 +65,10 @@ module.exports = {
65
65
  colors: {
66
66
  transparent: 'transparent',
67
67
  current: 'currentColor'
68
+ },
69
+ zIndex: {
70
+ modal: 1001,
71
+ 'modal-backdrop': 1000
68
72
  }
69
73
  } }),
70
74
  // Enable only necessary plugins
@@ -1 +1 @@
1
- {"version":3,"file":"optimised.config.js","sourceRoot":"","sources":["../src/optimised.config.js"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;;;;;;;;;;;;AAEH,IAAM,cAAc,GAAG,OAAO,CAAC,qBAAqB,CAAC,CAAC;AAEtD;;;;GAIG;AACH,MAAM,CAAC,OAAO,GAAG;IACf,MAAM,EAAE,IAAI;IACZ,OAAO,EAAE,CAAC,kCAAkC,CAAC;IAC7C,mEAAmE;IACnE,qDAAqD;IACrD,iDAAiD;IACjD,QAAQ,EAAE;QACR;YACE,OAAO,EACL,iFAAiF;YACnF,QAAQ,EAAE,CAAC,OAAO,CAAC;SACpB;QACD;YACE,OAAO,EACL,+EAA+E;YACjF,QAAQ,EAAE,CAAC,OAAO,CAAC;SACpB;QACD;YACE,sBAAsB;YACtB,OAAO,EAAE,wBAAwB;YACjC,QAAQ,EAAE,CAAC,QAAQ,CAAC;SACrB;QACD;YACE,OAAO,EAAE,2BAA2B;YACpC,QAAQ,EAAE,CAAC,OAAO,CAAC;SACpB;KACF;IACD,KAAK,wBACA,cAAc,KACjB,MAAM,EAAE;YACN,MAAM,EAAE;gBACN,WAAW,EAAE,aAAa;gBAC1B,OAAO,EAAE,cAAc;aACxB;SACF,GACF;IACD,gCAAgC;IAChC,0DAA0D;IAC1D,OAAO,EAAE,EAAE;CACZ,CAAC"}
1
+ {"version":3,"file":"optimised.config.js","sourceRoot":"","sources":["../src/optimised.config.js"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;;;;;;;;;;;;AAEH,IAAM,cAAc,GAAG,OAAO,CAAC,qBAAqB,CAAC,CAAC;AAEtD;;;;GAIG;AACH,MAAM,CAAC,OAAO,GAAG;IACf,MAAM,EAAE,IAAI;IACZ,OAAO,EAAE,CAAC,kCAAkC,CAAC;IAC7C,mEAAmE;IACnE,qDAAqD;IACrD,iDAAiD;IACjD,QAAQ,EAAE;QACR;YACE,OAAO,EACL,iFAAiF;YACnF,QAAQ,EAAE,CAAC,OAAO,CAAC;SACpB;QACD;YACE,OAAO,EACL,+EAA+E;YACjF,QAAQ,EAAE,CAAC,OAAO,CAAC;SACpB;QACD;YACE,sBAAsB;YACtB,OAAO,EAAE,wBAAwB;YACjC,QAAQ,EAAE,CAAC,QAAQ,CAAC;SACrB;QACD;YACE,OAAO,EAAE,2BAA2B;YACpC,QAAQ,EAAE,CAAC,OAAO,CAAC;SACpB;KACF;IACD,KAAK,wBACA,cAAc,KACjB,MAAM,EAAE;YACN,MAAM,EAAE;gBACN,WAAW,EAAE,aAAa;gBAC1B,OAAO,EAAE,cAAc;aACxB;YACD,MAAM,EAAE;gBACN,KAAK,EAAE,IAAI;gBACX,gBAAgB,EAAE,IAAI;aACvB;SACF,GACF;IACD,gCAAgC;IAChC,0DAA0D;IAC1D,OAAO,EAAE,EAAE;CACZ,CAAC"}
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Tue, 07 Jun 2022 16:38:42 GMT
3
+ * Generated on Fri, 01 Jul 2022 10:44:25 GMT
4
4
  */
5
5
 
6
6
  :root {
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Tue, 07 Jun 2022 16:38:42 GMT
3
+ * Generated on Fri, 01 Jul 2022 10:44:25 GMT
4
4
  */
5
5
 
6
6
  module.exports = {
@@ -1,7 +1,7 @@
1
1
  "use strict";
2
2
  /**
3
3
  * Do not edit directly
4
- * Generated on Tue, 07 Jun 2022 16:38:42 GMT
4
+ * Generated on Fri, 01 Jul 2022 10:44:25 GMT
5
5
  */
6
6
  module.exports = {
7
7
  "borderRadius": {
@@ -1,6 +1,6 @@
1
1
 
2
2
  // Do not edit directly
3
- // Generated on Tue, 07 Jun 2022 16:38:42 GMT
3
+ // Generated on Fri, 01 Jul 2022 10:44:25 GMT
4
4
 
5
5
  $border-radius-sm: 4px;
6
6
  $border-radius-md: 6px;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@neo4j-ndl/base",
3
- "version": "0.5.0",
3
+ "version": "0.6.0",
4
4
  "description": "Neo4j base package for the design system",
5
5
  "author": "Neo4j Inc.",
6
6
  "homepage": "",