@obosbbl/grunnmuren-tailwind 2.4.0 → 2.4.2

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 (2) hide show
  1. package/package.json +1 -1
  2. package/tailwind-base.css +57 -59
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@obosbbl/grunnmuren-tailwind",
3
- "version": "2.4.0",
3
+ "version": "2.4.2",
4
4
  "description": "Grunnmuren Tailwind preset",
5
5
  "repository": {
6
6
  "url": "https://github.com/code-obos/grunnmuren"
package/tailwind-base.css CHANGED
@@ -113,8 +113,64 @@
113
113
  @apply sm:gap-x-4 md:gap-x-9 lg:gap-x-12 xl:gap-x-16;
114
114
  }
115
115
 
116
+ /** Grid base, defines the grid columns and their spacing */
117
+ @utility layout-grid {
118
+ @apply layout-grid-gap-x sm:grid-cols-14 grid;
119
+ }
120
+
121
+ /** Grid container that applies the grid columns, grid spacing and the container component class */
122
+ @utility layout-grid-container {
123
+ @apply layout-grid container;
124
+ /** Make content of the grid span the mid 12 columns as a default (unless it has another explicit col-span class) */
125
+ & > * {
126
+ @apply sm:col-start-2 sm:col-span-12;
127
+ }
128
+ }
129
+
130
+ @utility layout-subgrid-* {
131
+ @apply layout-grid-gap-x grid;
132
+ }
133
+
134
+ @utility layout-subgrid-1 {
135
+ @apply grid-cols-1;
136
+ }
137
+ @utility layout-subgrid-2 {
138
+ @apply grid-cols-2;
139
+ }
140
+ @utility layout-subgrid-3 {
141
+ @apply grid-cols-3;
142
+ }
143
+ @utility layout-subgrid-4 {
144
+ @apply grid-cols-4;
145
+ }
146
+ @utility layout-subgrid-5 {
147
+ @apply grid-cols-5;
148
+ }
149
+ @utility layout-subgrid-6 {
150
+ @apply grid-cols-6;
151
+ }
152
+ @utility layout-subgrid-7 {
153
+ @apply grid-cols-7;
154
+ }
155
+ @utility layout-subgrid-8 {
156
+ @apply grid-cols-8;
157
+ }
158
+ @utility layout-subgrid-9 {
159
+ @apply grid-cols-9;
160
+ }
161
+ @utility layout-subgrid-10 {
162
+ @apply grid-cols-10;
163
+ }
164
+ @utility layout-subgrid-11 {
165
+ @apply grid-cols-11;
166
+ }
167
+ @utility layout-subgrid-12 {
168
+ @apply grid-cols-12;
169
+ }
170
+
116
171
  @utility layout-gap-x {
117
- @apply gap-x-2 layout-grid-gap-x;
172
+ @apply gap-x-2;
173
+ @apply layout-grid-gap-x;
118
174
  }
119
175
 
120
176
  @utility layout-gap-y {
@@ -201,64 +257,6 @@
201
257
  }
202
258
 
203
259
  @layer components {
204
- /*** Grid Layout ***/
205
-
206
- .layout-grid,
207
- .layout-grid-container {
208
- /** Grid base: defines the grid columns and their spacing */
209
- @apply layout-grid-gap-x sm:grid-cols-14 grid;
210
-
211
- /** Grid container that applies the grid columns, grid spacing and the container component class */
212
- &.layout-grid-container {
213
- @apply container;
214
- /** Make content of the grid span the mid 12 columns as a default (unless it has another explicit col-span class) */
215
- & > * {
216
- @apply sm:col-start-2 sm:col-span-12;
217
- }
218
- }
219
- }
220
-
221
- [class*="layout-subgrid-"] {
222
- @apply layout-grid-gap-x grid;
223
- }
224
-
225
- [class*="layout-subgrid-1"] {
226
- @apply grid-cols-1;
227
- }
228
- [class*="layout-subgrid-2"] {
229
- @apply grid-cols-2;
230
- }
231
- [class*="layout-subgrid-3"] {
232
- @apply grid-cols-3;
233
- }
234
- [class*="layout-subgrid-4"] {
235
- @apply grid-cols-4;
236
- }
237
- [class*="layout-subgrid-5"] {
238
- @apply grid-cols-5;
239
- }
240
- [class*="layout-subgrid-6"] {
241
- @apply grid-cols-6;
242
- }
243
- [class*="layout-subgrid-7"] {
244
- @apply grid-cols-7;
245
- }
246
- [class*="layout-subgrid-8"] {
247
- @apply grid-cols-8;
248
- }
249
- [class*="layout-subgrid-9"] {
250
- @apply grid-cols-9;
251
- }
252
- [class*="layout-subgrid-10"] {
253
- @apply grid-cols-10;
254
- }
255
- [class*="layout-subgrid-11"] {
256
- @apply grid-cols-11;
257
- }
258
- [class*="layout-subgrid-12"] {
259
- @apply grid-cols-12;
260
- }
261
-
262
260
  /*** Link List component styles ***/
263
261
  .link-list-container {
264
262
  @apply @container;