57 lines
1.2 KiB
CSS
57 lines
1.2 KiB
CSS
.align-center {
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
text-align: center;
|
|
}
|
|
|
|
.align-left {
|
|
margin-left: 0;
|
|
margin-right: auto;
|
|
text-align: left;
|
|
}
|
|
|
|
.align-right {
|
|
margin-left: auto;
|
|
margin-right: 0;
|
|
text-align: right;
|
|
}
|
|
|
|
.keep { white-space: nowrap; }
|
|
|
|
/* https://fajarwz.com/blog/how-to-solve-unwanted-css-transitions-on-page-load/ */
|
|
.no-transition,
|
|
.no-transition * {
|
|
-webkit-transition: none !important;
|
|
-moz-transition: none !important;
|
|
-ms-transition: none !important;
|
|
-o-transition: none !important;
|
|
transition: none !important;
|
|
}
|
|
|
|
|
|
|
|
|
|
@keyframes parallax-background {
|
|
to { background-position-y: -200px; }
|
|
}
|
|
|
|
.parallax-background {
|
|
position: relative;
|
|
overflow: clip;
|
|
background: none;
|
|
|
|
&::before {
|
|
animation: parallax-background linear;
|
|
animation-timeline: view();
|
|
background-image: var(--parallax-background); /* define --parallax-background in element's style attribute */
|
|
background-position-x: center;
|
|
background-repeat: no-repeat;
|
|
background-size: cover;
|
|
content: '';
|
|
height: calc(100% + 200px);
|
|
inset: 0;
|
|
position: absolute;
|
|
z-index: -1;
|
|
}
|
|
}
|