@digigov/css 1.0.0-00643e1d → 1.0.0-05af31dd

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.
Files changed (13) hide show
  1. package/dist/base/index.css +1 -1
  2. package/dist/base.js +1 -1
  3. package/dist/components.js +1 -1
  4. package/dist/digigov.css +2 -2
  5. package/package.json +4 -4
  6. package/src/base/index.css +1 -0
  7. package/src/components/button.css +16 -4
  8. package/src/components/dropdown.css +87 -62
  9. package/src/components/layout.css +5 -4
  10. package/src/components/pagination.css +3 -0
  11. package/src/components/panel.css +1 -0
  12. package/src/components/tabs.css +14 -1
  13. package/src/components/typography.css +6 -0
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@digigov/css",
3
- "version": "1.0.0-00643e1d",
3
+ "version": "1.0.0-05af31dd",
4
4
  "description": "Digigov CSS - Tailwind CSS Components",
5
5
  "author": "GRNET Devs <devs@lists.grnet.gr>",
6
6
  "license": "BSD-2-Clause",
@@ -48,13 +48,13 @@
48
48
  "tailwindcss": "3.3.5",
49
49
  "nodemon": "2.0.7",
50
50
  "next": "10.0.9",
51
- "@digigov/postcss-banner": "1.0.0-00643e1d",
52
- "@digigov/cli-build-tailwind": "1.0.0-00643e1d",
51
+ "@digigov/postcss-banner": "1.0.0-05af31dd",
52
+ "@digigov/cli-build-tailwind": "1.0.0-05af31dd",
53
53
  "rimraf": "3.0.2",
54
54
  "postcss-js": "4.0.0",
55
55
  "postcss-load-config": "3.1.4",
56
56
  "publint": "0.1.8",
57
- "@digigov/cli": "1.0.0-00643e1d"
57
+ "@digigov/cli": "1.0.0-05af31dd"
58
58
  },
59
59
  "scripts": {
60
60
  "preutilities": "DIGIGOV_CSS_BUILD=TRUE postcss --config src/utilities src/utilities/index.css --base src --dir dist",
package/src/base/index.css CHANGED
@@ -5,6 +5,7 @@
5
5
  }
6
6
  html{
7
7
  -webkit-tap-highlight-color: transparent;
8
+ scroll-behavior: smooth;
8
9
  }
9
10
  body {
10
11
  @apply font-sans text-base-content bg-base-100;
package/src/components/button.css CHANGED
@@ -1,4 +1,7 @@
1
- .govgr-btn {
1
+ .govgr-btn,
2
+ .govgr-btn[type=submit],
3
+ .govgr-btn[type=button],
4
+ .govgr-btn[type=reset] {
2
5
  @apply no-underline font-medium cursor-pointer
3
6
  m-0 mb-8 w-max min-h-10 md:min-h-12
4
7
  flex gap-x-3 items-center;
@@ -26,7 +29,10 @@
26
29
  }
27
30
  }
28
31
  }
29
- .govgr-btn-primary {
32
+ .govgr-btn-primary,
33
+ .govgr-btn-primary[type=submit],
34
+ .govgr-btn-primary[type=button],
35
+ .govgr-btn-primary[type=reset] {
30
36
  -webkit-box-shadow: 0 2px 0 var(--color-base-content);
31
37
  box-shadow: 0 2px 0 var(--color-base-content);
32
38
  background-color: var(--btn-primary-background-color);
@@ -45,7 +51,10 @@
45
51
  @apply py-4 print:pr-2;
46
52
  font-size: var(--btn-cta-font-size);
47
53
  }
48
- .govgr-btn-secondary {
54
+ .govgr-btn-secondary,
55
+ .govgr-btn-secondary[type=submit],
56
+ .govgr-btn-secondary[type=button],
57
+ .govgr-btn-secondary[type=reset] {
49
58
  -webkit-box-shadow: 0 2px 0 var(--color-base-500);
50
59
  box-shadow: 0 2px 0 var(--color-base-500);
51
60
  @apply hover:no-underline
@@ -60,7 +69,10 @@
60
69
  background-color: var(--btn-secondary-background-color-active);
61
70
  }
62
71
  }
63
- .govgr-btn-warning {
72
+ .govgr-btn-warning,
73
+ .govgr-btn-warning[type=submit],
74
+ .govgr-btn-warning[type=button],
75
+ .govgr-btn-warning[type=reset] {
64
76
  -webkit-box-shadow: 0 2px 0 var(--color-base-content);
65
77
  box-shadow: 0 2px 0 var(--color-base-content);
66
78
  @apply hover:no-underline
package/src/components/dropdown.css CHANGED
@@ -1,49 +1,63 @@
1
1
  .govgr-dropdown {
2
2
  @apply w-fit relative;
3
- }
4
- .govgr-dropdown--up {
5
- .govgr-dropdown__content {
6
- @apply mb-4 border border-b-0 bottom-full;
7
- -webkit-box-box-shadow: 0 2px 8px rgba(var(--color-base-900-rgb), 0.3), 0 2px 0 var(--color-base-500);
8
- box-shadow: 0 2px 8px rgba(var(--color-base-900-rgb), 0.3), 0 2px 0 var(--color-base-500);
3
+ &.govgr-dropdown--up {
4
+ .govgr-dropdown__content {
5
+ @apply mb-4 border border-b-0 bottom-full;
6
+ -webkit-box-box-shadow:
7
+ 0 2px 8px rgba(var(--color-base-900-rgb), 0.3),
8
+ 0 2px 0 var(--color-base-500);
9
+ box-shadow:
10
+ 0 2px 8px rgba(var(--color-base-900-rgb), 0.3),
11
+ 0 2px 0 var(--color-base-500);
12
+ }
9
13
  }
10
- }
11
- .govgr-dropdown--right {
12
- .govgr-dropdown__content {
13
- @apply right-0 mr-0 ml-4;
14
+ &.govgr-dropdown--right {
15
+ .govgr-dropdown__content {
16
+ @apply right-0 mr-0 ml-4;
17
+ }
18
+ }
19
+ &.govgr-dropdown--disabled {
20
+ @apply cursor-not-allowed;
21
+ .govgr-dropdown__button {
22
+ pointer-events: none;
23
+ user-select: none;
24
+ opacity: 0.5;
25
+ }
26
+ }
27
+ &.govgr-dropdown--dense,
28
+ .govgr-dense & {
29
+ .govgr-dropdown__content {
30
+ @apply p-2;
31
+ }
14
32
  }
15
- }
16
- .govgr-dropdown--disabled {
17
- @apply cursor-not-allowed;
18
33
  .govgr-dropdown__button {
19
- pointer-events: none;
20
- user-select: none;
21
- opacity: 0.5;
34
+ @apply w-fit print:text-base-content;
35
+ &::marker {
36
+ font-size: 0px;
37
+ }
22
38
  }
23
- }
24
- .govgr-dropdown__button {
25
- @apply w-fit print:text-base-content;
26
- &::marker {
27
- font-size: 0px;
39
+ .govgr-dropdown__button.govgr-link + .govgr-dropdown__content {
40
+ @apply mt-4 print:text-base-content;
28
41
  }
29
- }
30
- .govgr-dropdown__button.govgr-link + .govgr-dropdown__content {
31
- @apply mt-4 print:text-base-content;
32
- }
33
- .govgr-btn-group .govgr-btn + .govgr-dropdown__content {
34
- @apply mt-4;
35
- }
36
- .govgr-dropdown__content {
37
- @apply border border-base-400 p-4 bg-base-100 border-t-0
38
- max-w-xs w-max min-w-full absolute transition z-3 mr-4 -mt-4;
39
- -webkit-box-box-shadow: 0 2px 8px rgba(var(--color-base-900-rgb), 0.3), 0 -2px 0 var(--color-base-500);
40
- box-shadow: 0 2px 8px rgba(var(--color-base-900-rgb), 0.3), 0 -2px 0 var(--color-base-500);
41
- *:last-child {
42
- @apply mb-0;
42
+ .govgr-btn-group .govgr-btn + .govgr-dropdown__content {
43
+ @apply mt-4;
44
+ }
45
+ .govgr-dropdown__content {
46
+ @apply border border-base-400 p-4 bg-base-100 border-t-0
47
+ max-w-xs w-max min-w-full absolute transition z-3 mr-4 -mt-4;
48
+ -webkit-box-box-shadow:
49
+ 0 2px 8px rgba(var(--color-base-900-rgb), 0.3),
50
+ 0 -2px 0 var(--color-base-500);
51
+ box-shadow:
52
+ 0 2px 8px rgba(var(--color-base-900-rgb), 0.3),
53
+ 0 -2px 0 var(--color-base-500);
54
+ *:last-child {
55
+ @apply mb-0;
56
+ }
57
+ }
58
+ .govgr-dropdown__content--full-width {
59
+ @apply min-w-full;
43
60
  }
44
- }
45
- .govgr-dropdown__content--full-width {
46
- @apply min-w-full;
47
61
  }
48
62
 
49
63
  /* overrides */
@@ -59,7 +73,7 @@
59
73
  &.govgr-btn-primary {
60
74
  background-color: var(--btn-primary-background-color-hover);
61
75
  color: var(--btn-primary-color-hover);
62
- }
76
+ }
63
77
  &.govgr-btn-secondary {
64
78
  background-color: var(--btn-secondary-background-color-hover);
65
79
  color: var(--btn-secondary-color-hover);
@@ -75,32 +89,43 @@
75
89
  @apply transition duration-300;
76
90
  }
77
91
  }
78
- }
79
- .govgr-dropdown__button {
80
- .govgr-svg-icon {
81
- @apply w-5 h-6 md:h-8;
82
- @apply print:hidden;
83
- }
84
- &.govgr-link {
85
- @apply inline-flex gap-1 items-center;
86
- }
87
- }
88
- .govgr-dropdown__content {
89
- .govgr-field {
90
- @apply mb-4;
92
+ .govgr-dropdown__button {
93
+ .govgr-svg-icon {
94
+ @apply w-5 h-6 md:h-8;
95
+ @apply print:hidden;
96
+ }
97
+ &.govgr-link {
98
+ @apply inline-flex gap-1 items-center;
99
+ }
91
100
  }
92
- .govgr-section-break {
93
- @apply -mx-4 w-auto;
101
+ .govgr-dropdown__content {
102
+ .govgr-field {
103
+ @apply mb-4;
104
+ }
105
+ .govgr-section-break {
106
+ @apply -mx-4 w-auto;
107
+ }
108
+ > .govgr-nav__list {
109
+ @apply w-auto -mx-4 flex-col;
110
+ .govgr-nav__list-item {
111
+ @apply border-b border-base-300 py-2 px-4;
112
+ &:last-child {
113
+ @apply border-0;
114
+ }
115
+ &:focus {
116
+ @apply border-focus;
117
+ }
118
+ }
119
+ }
94
120
  }
95
- >.govgr-nav__list {
96
- @apply w-auto -mx-4 flex-col;
97
- .govgr-nav__list-item {
98
- @apply border-b border-base-300 py-2 px-4;
99
- &:last-child {
100
- @apply border-0;
121
+ &.govgr-dropdown--dense,
122
+ .govgr-dense & {
123
+ .govgr-dropdown__content {
124
+ .govgr-section-break {
125
+ @apply -mx-2 w-auto;
101
126
  }
102
- &:focus {
103
- @apply border-focus;
127
+ > .govgr-nav__list {
128
+ @apply w-auto -mx-2 flex-col;
104
129
  }
105
130
  }
106
131
  }
package/src/components/layout.css CHANGED
@@ -38,13 +38,13 @@
38
38
  @apply border-t border-base-300 border-solid;
39
39
  }
40
40
  .govgr-section-break--md {
41
- @apply mb-5;
41
+ @apply mb-5;
42
42
  }
43
43
  .govgr-section-break--lg {
44
- @apply mb-7;
44
+ @apply mb-7;
45
45
  }
46
46
  .govgr-section-break--xl {
47
- @apply mb-9;
47
+ @apply mb-9;
48
48
  }
49
49
 
50
50
  /* overrides */
@@ -55,7 +55,8 @@
55
55
  }
56
56
  }
57
57
  .govgr-btn-group {
58
- .govgr-btn, .govgr-link {
58
+ .govgr-btn,
59
+ .govgr-link {
59
60
  @apply mb-0;
60
61
  }
61
62
  }
package/src/components/pagination.css CHANGED
@@ -68,5 +68,8 @@
68
68
  .govgr-link {
69
69
  pointer-events: none;
70
70
  @apply text-base-800;
71
+ .govgr-svg-icon {
72
+ fill: var(--color-base-800);
73
+ }
71
74
  }
72
75
  }
package/src/components/panel.css CHANGED
@@ -15,6 +15,7 @@
15
15
  letter-spacing: var(--panel__title-letter-spacing);
16
16
  }
17
17
  .govgr-panel__body {
18
+ @apply break-words;
18
19
  font-size: var(--panel__body-font-size);
19
20
  line-height:var(--panel__body-line-height);
20
21
  margin:var(--panel__body-margin);
package/src/components/tabs.css CHANGED
@@ -15,7 +15,7 @@
15
15
  @apply md:float-left md:border md:border-base-300 md:bg-base-300 md:rounded-t-sm md:mr-2;
16
16
  @apply print:hidden;
17
17
  &.govgr-tabs__list-item-selected {
18
- @apply no-underline md:border-base-400 md:border bg-base-100 md:border-b-0 md:px-5 md:pb-4 md:-mt-1 md:pt-4;
18
+ @apply no-underline md:border-base-400 md:border bg-base-100 md:border-b-0 md:px-5 md:py-4 md:-mt-1;
19
19
  margin-bottom: -1px;
20
20
  &:hover {
21
21
  text-decoration-thickness: 2px;
@@ -46,6 +46,19 @@
46
46
  @apply block;
47
47
  }
48
48
  }
49
+ &.govgr-tabs--dense, .govgr-dense & {
50
+ .govgr-tabs__list {
51
+ .govgr-tabs__list-item {
52
+ @apply px-3 py-1;
53
+ &.govgr-tabs__list-item-selected {
54
+ @apply md:px-4 md:pb-3 md:pt-2;
55
+ }
56
+ }
57
+ }
58
+ .govgr-tabs__panel {
59
+ @apply pb-2 pt-3;
60
+ }
61
+ }
49
62
  }
50
63
 
51
64
  .govgr-tabs--vertical {
package/src/components/typography.css CHANGED
@@ -38,6 +38,9 @@
38
38
  font-weight: var(--heading-xs-font-weight);
39
39
  letter-spacing: var(--heading-xs-letter-spacing);
40
40
  }
41
+ .govgr-heading--break-words {
42
+ @apply break-words;
43
+ }
41
44
  .govgr-caption-xl {
42
45
  @apply block mx-0 font-normal;
43
46
  color: var(--caption-xl-color);
@@ -180,6 +183,9 @@
180
183
  color: var(--hint-color);
181
184
  letter-spacing: var(--hint-letter-spacing);
182
185
  }
186
+ .govgr-hint--break-words {
187
+ @apply break-words;
188
+ }
183
189
 
184
190
  .govgr-\!-font-weight-regular {
185
191
  @apply font-normal !important;