@miljodirektoratet/md-css 1.0.32 → 1.0.34
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/README.md
CHANGED
|
@@ -22,3 +22,5 @@ const MyComponent = () => {
|
|
|
22
22
|
**For HTML structure for each component, see the README.md for each css-file, located in /src, or the `Docs`-section in the [Storybook](https://miljodir.github.io/md-components/) for each component. This must be followed if stylesheets are used as standalone, without React components.**
|
|
23
23
|
|
|
24
24
|
_For React components, see [@miljodirektoratet/md-react](https://www.npmjs.com/package/@miljodirektoratet/md-react)_
|
|
25
|
+
|
|
26
|
+
## test-pr, dette vil bli omgjort tilbake
|
package/package.json
CHANGED
|
@@ -13,12 +13,14 @@
|
|
|
13
13
|
|
|
14
14
|
.md-autocomplete__container {
|
|
15
15
|
position: relative;
|
|
16
|
+
background-color: white;
|
|
16
17
|
}
|
|
17
18
|
|
|
18
19
|
.md-autocomplete__label {
|
|
19
20
|
display: flex;
|
|
20
21
|
align-items: flex-end;
|
|
21
22
|
font-weight: 600;
|
|
23
|
+
padding-bottom: 0.25em;
|
|
22
24
|
}
|
|
23
25
|
|
|
24
26
|
.md-autocomplete__label > * + * {
|
|
@@ -28,7 +30,7 @@
|
|
|
28
30
|
.md-autocomplete__input {
|
|
29
31
|
max-width: 100%;
|
|
30
32
|
width: 100%;
|
|
31
|
-
background-color:
|
|
33
|
+
background-color: transparent;
|
|
32
34
|
border-radius: 0;
|
|
33
35
|
color: var(--mdGreyColor);
|
|
34
36
|
box-sizing: border-box;
|
|
@@ -39,15 +41,20 @@
|
|
|
39
41
|
justify-content: space-between;
|
|
40
42
|
padding: 1em;
|
|
41
43
|
border: 1px solid var(--mdGreyColor60);
|
|
42
|
-
margin: 0.8em 0 0 0;
|
|
43
44
|
text-align: left;
|
|
44
45
|
cursor: pointer;
|
|
46
|
+
position: relative;
|
|
47
|
+
z-index: 2;
|
|
45
48
|
}
|
|
46
49
|
|
|
47
50
|
.md-autocomplete__input.md-autocomplete__input--error {
|
|
48
51
|
border-color: var(--mdErrorColor);
|
|
49
52
|
}
|
|
50
53
|
|
|
54
|
+
.md-autocomplete--small > .md-autocomplete__input {
|
|
55
|
+
padding: 0.75em;
|
|
56
|
+
}
|
|
57
|
+
|
|
51
58
|
.md-autocomplete--disabled .md-autocomplete__input {
|
|
52
59
|
background-color: var(--mdGreyColor20);
|
|
53
60
|
color: var(--mdGreyColor60);
|
|
@@ -65,15 +72,6 @@
|
|
|
65
72
|
padding-right: 1em;
|
|
66
73
|
}
|
|
67
74
|
|
|
68
|
-
.md-autocomplete__input-icon {
|
|
69
|
-
display: flex;
|
|
70
|
-
flex-shrink: 0;
|
|
71
|
-
width: 15px;
|
|
72
|
-
height: 15px;
|
|
73
|
-
rotate: 90deg;
|
|
74
|
-
color: var(--mdGreyColor);
|
|
75
|
-
}
|
|
76
|
-
|
|
77
75
|
.md-autocomplete__input.md-autocomplete__input--has-prefix {
|
|
78
76
|
padding-left: 2.5em;
|
|
79
77
|
}
|
|
@@ -90,6 +88,12 @@
|
|
|
90
88
|
width: 16px;
|
|
91
89
|
display: flex;
|
|
92
90
|
color: var(--mdPrimaryColor);
|
|
91
|
+
z-index: 1;
|
|
92
|
+
}
|
|
93
|
+
|
|
94
|
+
.md-autocomplete--small > .md-autocomplete__input__prefix {
|
|
95
|
+
top: 1em;
|
|
96
|
+
left: 1em;
|
|
93
97
|
}
|
|
94
98
|
|
|
95
99
|
.md-autocomplete__input__prefix.md-autocomplete__input__prefix--disabled {
|
|
@@ -101,12 +105,17 @@
|
|
|
101
105
|
top: 1.3em;
|
|
102
106
|
right: 0.9em;
|
|
103
107
|
display: flex;
|
|
104
|
-
width:
|
|
105
|
-
height:
|
|
108
|
+
width: 16px;
|
|
109
|
+
height: 16px;
|
|
106
110
|
rotate: 90deg;
|
|
107
111
|
color: var(--mdGreyColor);
|
|
108
112
|
}
|
|
109
113
|
|
|
114
|
+
.md-autocomplete--small > .md-autocomplete__input-icon {
|
|
115
|
+
top: 1em;
|
|
116
|
+
right: 1em;
|
|
117
|
+
}
|
|
118
|
+
|
|
110
119
|
.md-autocomplete__help-text {
|
|
111
120
|
max-height: 0;
|
|
112
121
|
overflow: hidden;
|
|
@@ -130,6 +139,7 @@
|
|
|
130
139
|
|
|
131
140
|
.md-autocomplete__dropdown-item {
|
|
132
141
|
display: flex;
|
|
142
|
+
align-items: center;
|
|
133
143
|
font-family: 'Open sans';
|
|
134
144
|
border: 0;
|
|
135
145
|
background-color: #fff;
|
|
@@ -169,6 +179,10 @@
|
|
|
169
179
|
border-left: 2px solid var(--mdPrimaryColor);
|
|
170
180
|
border-right: 2px solid var(--mdPrimaryColor);
|
|
171
181
|
border-top: 2px solid var(--mdPrimaryColor);
|
|
182
|
+
padding-bottom: calc(1em - 1px);
|
|
183
|
+
}
|
|
184
|
+
.md-autocomplete--open.md-autocomplete--small .md-autocomplete__input {
|
|
185
|
+
padding-bottom: calc(0.75em - 1px);
|
|
172
186
|
}
|
|
173
187
|
|
|
174
188
|
.md-autocomplete--open .md-autocomplete__dropdown {
|
|
@@ -179,6 +193,7 @@
|
|
|
179
193
|
border-right: 2px solid var(--mdPrimaryColor);
|
|
180
194
|
border-left: 2px solid var(--mdPrimaryColor);
|
|
181
195
|
border-bottom: 2px solid var(--mdPrimaryColor);
|
|
196
|
+
box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.25);
|
|
182
197
|
z-index: 2;
|
|
183
198
|
}
|
|
184
199
|
|
|
@@ -15,6 +15,7 @@
|
|
|
15
15
|
display: flex;
|
|
16
16
|
align-items: flex-end;
|
|
17
17
|
font-weight: 600;
|
|
18
|
+
padding-bottom: 0.25em;
|
|
18
19
|
}
|
|
19
20
|
|
|
20
21
|
.md-multiselect__label > * + * {
|
|
@@ -36,6 +37,10 @@
|
|
|
36
37
|
cursor: pointer;
|
|
37
38
|
}
|
|
38
39
|
|
|
40
|
+
.md-multiselect__button.md-multiselect--small {
|
|
41
|
+
padding: 0.75em;
|
|
42
|
+
}
|
|
43
|
+
|
|
39
44
|
.md-multiselect--disabled .md-multiselect__button {
|
|
40
45
|
background-color: var(--mdGreyColor20);
|
|
41
46
|
color: var(--mdGreyColor60);
|
|
@@ -46,11 +51,18 @@
|
|
|
46
51
|
.md-multiselect__button:focus-within {
|
|
47
52
|
outline: none;
|
|
48
53
|
}
|
|
54
|
+
.md-multiselect:not(.md-multiselect--disabled)
|
|
55
|
+
.md-multiselect__button.md-multiselect--small:not(.md-multiselect__button--open):focus,
|
|
56
|
+
.md-multiselect:not(.md-multiselect--disabled)
|
|
57
|
+
.md-multiselect__button.md-multiselect--small:not(.md-multiselect__button--open):focus-within {
|
|
58
|
+
padding: calc(0.75em - 1px);
|
|
59
|
+
border: 2px solid var(--mdPrimaryColor80);
|
|
60
|
+
}
|
|
49
61
|
|
|
50
62
|
.md-multiselect:not(.md-multiselect--disabled) .md-multiselect__button:not(.md-multiselect__button--open):focus,
|
|
51
63
|
.md-multiselect:not(.md-multiselect--disabled) .md-multiselect__button:not(.md-multiselect__button--open):focus-within {
|
|
52
64
|
padding: calc(1em - 1px);
|
|
53
|
-
border: 2px solid var(--
|
|
65
|
+
border: 2px solid var(--mdPrimaryColor80);
|
|
54
66
|
}
|
|
55
67
|
|
|
56
68
|
.md-multiselect--error:not(.md-multiselect--disabled) .md-multiselect__button {
|
|
@@ -93,7 +105,6 @@
|
|
|
93
105
|
|
|
94
106
|
.md-multiselect__dropdown-wrapper {
|
|
95
107
|
position: relative;
|
|
96
|
-
margin: 0.7em 0 0 0;
|
|
97
108
|
}
|
|
98
109
|
|
|
99
110
|
.md-multiselect__dropdown {
|
|
@@ -127,13 +138,22 @@
|
|
|
127
138
|
display: flex;
|
|
128
139
|
flex-shrink: 0;
|
|
129
140
|
flex-grow: 1;
|
|
130
|
-
padding: 0.
|
|
141
|
+
padding: 0.75em;
|
|
131
142
|
}
|
|
132
143
|
|
|
133
144
|
.md-multiselect__dropdown-item .md-checkbox .md-checkbox__label .md-checkbox__labelText {
|
|
134
145
|
padding: 0;
|
|
135
146
|
}
|
|
136
147
|
|
|
148
|
+
.md-multiselect__dropdown-item .md-checkbox__labelText {
|
|
149
|
+
font-family: 'Open Sans';
|
|
150
|
+
font-size: 16px;
|
|
151
|
+
font-style: normal;
|
|
152
|
+
font-weight: 400;
|
|
153
|
+
line-height: 22px;
|
|
154
|
+
color: var(--mdGreyColor);
|
|
155
|
+
}
|
|
156
|
+
|
|
137
157
|
.md-multiselect__dropdown-item:hover,
|
|
138
158
|
.md-multiselect__dropdown-item:focus,
|
|
139
159
|
.md-multiselect__dropdown-item:focus-within {
|
|
@@ -191,24 +211,39 @@
|
|
|
191
211
|
|
|
192
212
|
/* Open state */
|
|
193
213
|
.md-multiselect--open .md-multiselect__button {
|
|
194
|
-
border-top: 2px solid var(--
|
|
195
|
-
border-right: 2px solid var(--
|
|
196
|
-
border-left: 2px solid var(--
|
|
214
|
+
border-top: 2px solid var(--mdPrimaryColor80);
|
|
215
|
+
border-right: 2px solid var(--mdPrimaryColor80);
|
|
216
|
+
border-left: 2px solid var(--mdPrimaryColor80);
|
|
197
217
|
padding: calc(1em - 1px);
|
|
198
218
|
padding-bottom: 1em;
|
|
199
219
|
}
|
|
200
220
|
|
|
221
|
+
.md-multiselect--open .md-multiselect__button.md-multiselect--small {
|
|
222
|
+
border-top: 2px solid var(--mdPrimaryColor80);
|
|
223
|
+
border-right: 2px solid var(--mdPrimaryColor80);
|
|
224
|
+
border-left: 2px solid var(--mdPrimaryColor80);
|
|
225
|
+
padding: calc(0.75em - 1px);
|
|
226
|
+
padding-bottom: 0.75em;
|
|
227
|
+
}
|
|
228
|
+
|
|
201
229
|
.md-multiselect__button:not(.md-multiselect__button--open):focus,
|
|
202
230
|
.md-multiselect__button:not(.md-multiselect__button--open):focus-within {
|
|
203
231
|
padding: calc(1em - 1px);
|
|
204
|
-
border: 2px solid var(--
|
|
232
|
+
border: 2px solid var(--mdPrimaryColor80);
|
|
233
|
+
}
|
|
234
|
+
|
|
235
|
+
.md-multiselect__button.md-multiselect--small:not(.md-multiselect__button--open):focus,
|
|
236
|
+
.md-multiselect__button.md-multiselect--small:not(.md-multiselect__button--open):focus-within {
|
|
237
|
+
padding: calc(0.75em - 1px);
|
|
238
|
+
border: 2px solid var(--mdPrimaryColor80);
|
|
205
239
|
}
|
|
206
240
|
|
|
207
241
|
.md-multiselect__dropdown--open {
|
|
208
242
|
max-height: 350px;
|
|
209
243
|
overflow-y: auto;
|
|
210
244
|
opacity: 1;
|
|
211
|
-
border: 2px solid var(--
|
|
245
|
+
border: 2px solid var(--mdPrimaryColor80);
|
|
246
|
+
box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.25);
|
|
212
247
|
border-top: 0;
|
|
213
248
|
}
|
|
214
249
|
.md-multiselect--open.md-multiselect--error .md-multiselect__dropdown {
|
|
@@ -19,6 +19,7 @@
|
|
|
19
19
|
display: flex;
|
|
20
20
|
align-items: flex-end;
|
|
21
21
|
font-weight: 600;
|
|
22
|
+
padding-bottom: 0.25em;
|
|
22
23
|
}
|
|
23
24
|
|
|
24
25
|
.md-select__label > * + * {
|
|
@@ -36,7 +37,6 @@
|
|
|
36
37
|
padding: 1em;
|
|
37
38
|
border: 1px solid var(--mdGreyColor60);
|
|
38
39
|
color: var(--mdGreyColor);
|
|
39
|
-
margin: 0.8em 0 0 0;
|
|
40
40
|
text-align: left;
|
|
41
41
|
cursor: pointer;
|
|
42
42
|
}
|
|
@@ -45,6 +45,17 @@
|
|
|
45
45
|
border-color: var(--mdErrorColor);
|
|
46
46
|
}
|
|
47
47
|
|
|
48
|
+
.md-select__button.md-select__button--small {
|
|
49
|
+
padding: 0.75em;
|
|
50
|
+
}
|
|
51
|
+
|
|
52
|
+
.md-select__button:not(.md-select__button--open):focus.md-select__button--small {
|
|
53
|
+
padding: calc(0.75em - 1px);
|
|
54
|
+
}
|
|
55
|
+
.md-select__button.md-select__button--open.md-select__button--small {
|
|
56
|
+
padding: calc(0.75em - 1px);
|
|
57
|
+
}
|
|
58
|
+
|
|
48
59
|
.md-select--disabled .md-select__button {
|
|
49
60
|
background-color: var(--mdGreyColor20);
|
|
50
61
|
color: var(--mdGreyColor60);
|
|
@@ -106,6 +117,7 @@
|
|
|
106
117
|
|
|
107
118
|
.md-select__dropdown-item {
|
|
108
119
|
display: flex;
|
|
120
|
+
align-items: center;
|
|
109
121
|
font-family: 'Open sans';
|
|
110
122
|
border: 0;
|
|
111
123
|
background-color: #fff;
|
|
@@ -158,6 +170,7 @@
|
|
|
158
170
|
opacity: 1;
|
|
159
171
|
transition: max-height 0.5s ease-in-out;
|
|
160
172
|
border: 2px solid var(--mdPrimaryColor);
|
|
173
|
+
box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.25);
|
|
161
174
|
border-top: 0;
|
|
162
175
|
z-index: 2;
|
|
163
176
|
}
|