62 lines
1.2 KiB
CSS
62 lines
1.2 KiB
CSS
@tailwind base;
|
|
@tailwind components;
|
|
@tailwind utilities;
|
|
|
|
html{
|
|
scroll-behavior: smooth;
|
|
}
|
|
|
|
*{
|
|
transition: all .3s;
|
|
}
|
|
|
|
body {
|
|
margin: 0;
|
|
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
|
|
'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
|
|
sans-serif;
|
|
-webkit-font-smoothing: antialiased;
|
|
-moz-osx-font-smoothing: grayscale;
|
|
}
|
|
|
|
code {
|
|
font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
|
|
monospace;
|
|
}
|
|
|
|
@layer components {
|
|
.change-text::after{
|
|
content: '';
|
|
animation: text-change 5s linear 0s infinite;
|
|
}
|
|
.text-slide-in{
|
|
position: relative;
|
|
animation: slide-text-in .5s linear 0s forwards;
|
|
}
|
|
|
|
.pop-modal{
|
|
animation: pop-modal .1s linear 0s forwards;
|
|
}
|
|
|
|
|
|
/* ANIMATIONS */
|
|
@keyframes text-change {
|
|
0%{content: 'Boundaries';}
|
|
100%{content: 'Limitations';}
|
|
}
|
|
|
|
@keyframes slide-text-in {
|
|
/* 0%{left: -200%;}
|
|
100%{left: 0%;} */
|
|
0%{transform: scale(0); opacity: 0;}
|
|
100%{transform: scale(1); opacity: 1;}
|
|
}
|
|
|
|
@keyframes pop-modal {
|
|
/* 0%{left: -200%;}
|
|
100%{left: 0%;} */
|
|
0%{margin-top: 20px; opacity: 0;}
|
|
100%{margin-top: 0; opacity: 1;}
|
|
}
|
|
}
|