Add CSS wrapper and position utilities

This commit is contained in:
Timothée Goguely 2024-09-12 19:08:20 +02:00
parent 3df97ca489
commit d99623d773
3 changed files with 37 additions and 0 deletions

View file

@ -25,7 +25,9 @@
@import 'src/3.utilities.flow.css';
@import 'src/3.utilities.icons.css';
@import 'src/3.utilities.overflow.css';
@import 'src/3.utilities.position.css';
@import 'src/3.utilities.screen-readers.css';
@import 'src/3.utilities.size.css';
@import 'src/3.utilities.spacing.css';
@import 'src/3.utilities.text.css';
@import 'src/3.utilities.wrapper.css';

View file

@ -0,0 +1,23 @@
/* POSITION UTILITY */
.relative {
position: relative;
}
.absolute {
position: absolute;
}
.sticky {
position: -webkit-sticky;
position: sitcky;
}
.fixed {
position: fixed;
}
.inset-0 { inset: 0 }
.top-0 { top: 0 }
.bottom-0 { bottom: 0 }
.left-0 { left: 0 }
.right-0 { right: 0 }
.-z-1 { z-index: -1 }

View file

@ -0,0 +1,12 @@
/* WRAPPER UTILITY */
.wrapper {
margin-left: auto;
margin-right: auto;
width: 100%;
max-width: var(--wrapper-max-width, 100rem);
padding-left: var(--gutter);
padding-right: var(--gutter);
position: relative;
z-index: 1;
}