@neo4j-ndl/base 0.5.1 → 0.6.1

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 Wed, 15 Jun 2022 09:40:10 GMT
423
+ * Generated on Mon, 18 Jul 2022 13:38:03 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"
@@ -1001,6 +1034,8 @@ a.ndl-btn{
1001
1034
  border-width: 1px;
1002
1035
  --tw-border-opacity: 1;
1003
1036
  border-color: rgb(196 200 205 / var(--tw-border-opacity));
1037
+ --tw-bg-opacity: 1;
1038
+ background-color: rgb(255 255 255 / var(--tw-bg-opacity));
1004
1039
  padding: 0.25rem;
1005
1040
  }
1006
1041
  .ndl-icon-btn-array.array-floating{
@@ -1615,7 +1650,6 @@ a.ndl-btn{
1615
1650
  width: 100%;
1616
1651
  position: absolute;
1617
1652
  top: -0.5px;
1618
- left: 0.5px;
1619
1653
  color: #fff;
1620
1654
  }
1621
1655
  .ndl-form-item input[type='checkbox']:checked::after {
@@ -2344,7 +2378,7 @@ a.ndl-btn{
2344
2378
  --tw-shadow-colored: 0px 4px 8px 0px var(--tw-shadow-color);
2345
2379
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
2346
2380
  position: fixed;
2347
- z-index: 2;
2381
+ z-index: 1001;
2348
2382
  display: none;
2349
2383
  flex-direction: column;
2350
2384
  border-width: 1px;
@@ -2364,7 +2398,7 @@ a.ndl-btn{
2364
2398
  bottom: 0px;
2365
2399
  right: 0px;
2366
2400
  left: 0px;
2367
- z-index: 1;
2401
+ z-index: 1000;
2368
2402
  }
2369
2403
  /**
2370
2404
  *
@@ -2392,10 +2426,10 @@ a.ndl-btn{
2392
2426
  left: 0;
2393
2427
  bottom: 0;
2394
2428
  right: 0;
2395
- z-index: 1001;
2396
2429
 
2397
2430
  background-color: rgba(0,0,0,0.4);
2398
2431
  cursor: default;
2432
+ z-index: 1000;
2399
2433
  }
2400
2434
  .ndl-modal {
2401
2435
  position: relative;
@@ -2406,6 +2440,7 @@ a.ndl-btn{
2406
2440
  margin: 32px;
2407
2441
  width: -moz-available;
2408
2442
  width: -webkit-fill-available;
2443
+ z-index: 1001;
2409
2444
  }
2410
2445
  .ndl-modal.small {
2411
2446
  max-width: 40rem;
@@ -2670,6 +2705,24 @@ a.ndl-btn{
2670
2705
  --tw-bg-opacity: 1;
2671
2706
  background-color: rgb(245 247 250 / var(--tw-bg-opacity));
2672
2707
  }
2708
+ .ndl-table .ndl-table-row .ndl-table-row-actions{
2709
+ display: none;
2710
+ }
2711
+ .ndl-table .ndl-table-row:hover .ndl-table-row-actions{
2712
+ position: absolute;
2713
+ top: 50%;
2714
+ right: 2rem;
2715
+ z-index: 10;
2716
+ display: flex;
2717
+ --tw-translate-y: -50%;
2718
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
2719
+ flex-direction: row;
2720
+ align-items: center;
2721
+ -moz-column-gap: 0.5rem;
2722
+ column-gap: 0.5rem;
2723
+ padding-left: 1rem;
2724
+ padding-right: 1rem;
2725
+ }
2673
2726
  .ndl-table .ndl-table-cell{
2674
2727
  position: relative;
2675
2728
  display: table-cell;
@@ -2686,29 +2739,6 @@ a.ndl-btn{
2686
2739
  letter-spacing: 0.25px;
2687
2740
  line-height: 20px;
2688
2741
  }
2689
- /* & .ndl-table-row-actions {
2690
- @apply group-hover:n-flex n-hidden n-z-10 n-gap-x-2 n-transform -n-translate-y-1/2 n-top-1/2 n-flex-row n-absolute n-px-4 n-items-center n-right-8;
2691
- } */
2692
- .ndl-table .ndl-table-row-actions-icon{
2693
- display: inline-flex;
2694
- height: 2rem;
2695
- width: 2rem;
2696
- align-items: center;
2697
- justify-content: center;
2698
- border-radius: 8px;
2699
- --tw-text-opacity: 1;
2700
- color: rgb(83 91 102 / var(--tw-text-opacity));
2701
- }
2702
- .ndl-table .ndl-table-row-actions-icon:hover{
2703
- background-color: rgb(83 91 102 / var(--tw-bg-opacity));
2704
- --tw-bg-opacity: 0.1;
2705
- --tw-text-opacity: 1;
2706
- color: rgb(21 30 41 / var(--tw-text-opacity));
2707
- }
2708
- .ndl-table .ndl-table-row-actions-icon > svg {
2709
- height: 20px;
2710
- width: 20px;
2711
- }
2712
2742
  .ndl-table tr th.table-column-styling {
2713
2743
  border-collapse: separate;
2714
2744
  box-sizing: content-box;
@@ -2908,6 +2938,96 @@ a.ndl-btn{
2908
2938
  --tw-bg-opacity: 1;
2909
2939
  background-color: rgb(237 18 82 / var(--tw-bg-opacity));
2910
2940
  }
2941
+ /**
2942
+ *
2943
+ * Copyright (c) "Neo4j"
2944
+ * Neo4j Sweden AB [http://neo4j.com]
2945
+ *
2946
+ * This file is part of Neo4j.
2947
+ *
2948
+ * Neo4j is free software: you can redistribute it and/or modify
2949
+ * it under the terms of the GNU General Public License as published by
2950
+ * the Free Software Foundation, either version 3 of the License, or
2951
+ * (at your option) any later version.
2952
+ *
2953
+ * This program is distributed in the hope that it will be useful,
2954
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
2955
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
2956
+ * GNU General Public License for more details.
2957
+ *
2958
+ * You should have received a copy of the GNU General Public License
2959
+ * along with this program. If not, see <http://www.gnu.org/licenses/>.
2960
+ */
2961
+ .ndl-dropdown{
2962
+ display: inline-flex;
2963
+ flex-direction: column;
2964
+ row-gap: 5px;
2965
+ }
2966
+ .ndl-dropdown.fluid{
2967
+ display: flex;
2968
+ }
2969
+ .ndl-dropdown label{
2970
+ --tw-text-opacity: 1;
2971
+ color: rgb(83 91 102 / var(--tw-text-opacity));
2972
+ font-size: var(--font-size-body-medium);
2973
+ font-weight: var(--font-weight-normal);
2974
+ letter-spacing: 0.25px;
2975
+ line-height: 20px;
2976
+ }
2977
+ .ndl-dropdown .sub-text{
2978
+ --tw-text-opacity: 1;
2979
+ color: rgb(113 119 128 / var(--tw-text-opacity));
2980
+ font-size: var(--font-size-body-small);
2981
+ font-weight: var(--font-weight-normal);
2982
+ letter-spacing: 0.25px;
2983
+ line-height: 20px;
2984
+ }
2985
+ .ndl-dropdown .error-text{
2986
+ --tw-text-opacity: 1;
2987
+ color: rgb(204 37 75 / var(--tw-text-opacity));
2988
+ }
2989
+ .ndl-dropdown.large label {
2990
+ font-size: var(--font-size-body-large);
2991
+ font-weight: var(--font-weight-normal);
2992
+ letter-spacing: 0.25px;
2993
+ line-height: 24px;
2994
+ }
2995
+ .ndl-dropdown.large .sub-text {
2996
+ font-size: var(--font-size-body-medium);
2997
+ font-weight: var(--font-weight-normal);
2998
+ letter-spacing: 0.25px;
2999
+ line-height: 20px;
3000
+ }
3001
+ .ndl-dropdown .dropdown-icon.small {
3002
+ width: 20px;
3003
+ height: 20px;
3004
+ }
3005
+ .ndl-dropdown .dropdown-icon.large {
3006
+ width: 24px;
3007
+ height: 24px;
3008
+ }
3009
+ .ndl-dropdown .dropdown-icon{
3010
+ --tw-text-opacity: 1;
3011
+ color: rgb(83 91 102 / var(--tw-text-opacity));
3012
+ }
3013
+ .ndl-dropdown .indicator {
3014
+ width: 1px;
3015
+ height: 100%;
3016
+ --tw-bg-opacity: 1;
3017
+ background-color: rgb(196 200 205 / var(--tw-bg-opacity));
3018
+ }
3019
+ .ndl-dropdown .error-icon.small {
3020
+ width: 20px;
3021
+ height: 20px;
3022
+ }
3023
+ .ndl-dropdown .error-icon.large {
3024
+ width: 24px;
3025
+ height: 24px;
3026
+ }
3027
+ .ndl-dropdown .error-icon{
3028
+ --tw-text-opacity: 1;
3029
+ color: rgb(204 37 75 / var(--tw-text-opacity));
3030
+ }
2911
3031
  .n-sr-only{
2912
3032
  position: absolute;
2913
3033
  width: 1px;
@@ -2996,6 +3116,9 @@ a.ndl-btn{
2996
3116
  .n-h-12{
2997
3117
  height: 3rem;
2998
3118
  }
3119
+ .n-h-7{
3120
+ height: 1.75rem;
3121
+ }
2999
3122
  .n-h-36{
3000
3123
  height: 9rem;
3001
3124
  }
@@ -3070,9 +3193,15 @@ a.ndl-btn{
3070
3193
  .n-justify-between{
3071
3194
  justify-content: space-between;
3072
3195
  }
3196
+ .n-gap-3{
3197
+ gap: 0.75rem;
3198
+ }
3073
3199
  .n-gap-2{
3074
3200
  gap: 0.5rem;
3075
3201
  }
3202
+ .n-gap-1{
3203
+ gap: 0.25rem;
3204
+ }
3076
3205
  .n-gap-6{
3077
3206
  gap: 1.5rem;
3078
3207
  }
@@ -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 Wed, 15 Jun 2022 09:40:10 GMT
3
+ * Generated on Mon, 18 Jul 2022 13:38:03 GMT
4
4
  */
5
5
 
6
6
  :root {
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Wed, 15 Jun 2022 09:40:10 GMT
3
+ * Generated on Mon, 18 Jul 2022 13:38:03 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 Wed, 15 Jun 2022 09:40:10 GMT
4
+ * Generated on Mon, 18 Jul 2022 13:38:03 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 Wed, 15 Jun 2022 09:40:10 GMT
3
+ // Generated on Mon, 18 Jul 2022 13:38:03 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.1",
3
+ "version": "0.6.1",
4
4
  "description": "Neo4j base package for the design system",
5
5
  "author": "Neo4j Inc.",
6
6
  "homepage": "",