mirror of
https://github.com/pockethost/pockethost.git
synced 2025-11-23 22:15:49 +00:00
140 lines
2.8 KiB
CSS
140 lines
2.8 KiB
CSS
@import url('https://fonts.googleapis.com/css2?family=Figtree:ital,wght@0,300..900;1,300..900&display=swap');
|
|
@import "prismjs/themes/prism-twilight.css";
|
|
@tailwind base;
|
|
@tailwind components;
|
|
@tailwind utilities;
|
|
|
|
|
|
* {
|
|
font-family: 'Figtree', sans-serif;
|
|
}
|
|
|
|
.prose :where(pre):not(:where([class~='not-prose'], [class~='not-prose'] *)) {
|
|
@apply mb-1 mt-1;
|
|
}
|
|
.prose :where(code):not(:where([class~='not-prose'] *)) {
|
|
@apply bg-transparent;
|
|
}
|
|
|
|
.prose :where(p):not(:where([class~='not-prose'], [class~='not-prose'] *)) {
|
|
@apply mt-2 mb-2;
|
|
}
|
|
|
|
.prose :where(blockquote):not(:where([class~='not-prose'], [class~='not-prose'] *)) {
|
|
quotes: none;
|
|
}
|
|
|
|
.docs-content img {
|
|
@apply border-accent rounded-lg border;
|
|
}
|
|
|
|
.prose :where(li):not(:where([class~='not-prose'], [class~='not-prose'] *)) {
|
|
@apply mt-0 mb-0;
|
|
line-height: 1.5em;
|
|
}
|
|
|
|
.mockup-code {
|
|
@apply bg-[#111111] border border-white/10;
|
|
}
|
|
|
|
pre {
|
|
border: none !important;
|
|
box-shadow: none !important;
|
|
}
|
|
|
|
|
|
|
|
.alert-error {
|
|
@apply bg-red-500/60 border-white/10 text-white
|
|
}
|
|
.alert-success {
|
|
@apply bg-green-500/60 border-white/10 text-white
|
|
}
|
|
.alert-info {
|
|
@apply bg-blue-500/60 border-white/10 text-white
|
|
}
|
|
.alert-warning {
|
|
@apply bg-yellow-500/30 border-white/10 text-white
|
|
}
|
|
|
|
.content {
|
|
position: relative;
|
|
z-index: 1;
|
|
color: white;
|
|
font-size: 3rem;
|
|
font-weight: bold;
|
|
text-shadow: 0 0 10px rgba(255,255,255,0.3);
|
|
}
|
|
|
|
|
|
.wiggle:hover {
|
|
-webkit-animation-name: wiggle;
|
|
-ms-animation-name: wiggle;
|
|
-ms-animation-duration: 400ms;
|
|
-webkit-animation-duration: 400ms;
|
|
-webkit-animation-iteration-count: 1;
|
|
-ms-animation-iteration-count: 1;
|
|
-webkit-animation-timing-function: ease-in-out;
|
|
-ms-animation-timing-function: ease-in-out;
|
|
}
|
|
|
|
@-webkit-keyframes wiggle {
|
|
0% {-webkit-transform: rotate(2deg);}
|
|
25% {-webkit-transform: rotate(-2deg);}
|
|
50% {-webkit-transform: rotate(4deg);}
|
|
75% {-webkit-transform: rotate(-3deg);}
|
|
100% {-webkit-transform: rotate(0deg);}
|
|
}
|
|
|
|
@-ms-keyframes wiggle {
|
|
0% {-ms-transform: rotate(2deg);}
|
|
25% {-ms-transform: rotate(-2deg);}
|
|
50% {-ms-transform: rotate(4deg);}
|
|
75% {-ms-transform: rotate(-3deg);}
|
|
100% {-ms-transform: rotate(0deg);}
|
|
}
|
|
|
|
@keyframes wiggle {
|
|
0% {transform: rotate(2deg);}
|
|
25% {transform: rotate(-2deg);}
|
|
50% {transform: rotate(4deg);}
|
|
75% {transform: rotate(-3deg);}
|
|
100% {transform: rotate(0deg);}
|
|
}
|
|
|
|
|
|
.fade-up {
|
|
opacity: 0;
|
|
transform: translateY(20px);
|
|
animation: fadeUp 1s forwards;
|
|
}
|
|
|
|
@keyframes fadeUp {
|
|
to {
|
|
opacity: 1;
|
|
transform: translateY(0);
|
|
}
|
|
}
|
|
|
|
|
|
.fade-in {
|
|
opacity: 0;
|
|
animation: fadeIn 1s forwards;
|
|
}
|
|
|
|
@keyframes fadeIn {
|
|
to {
|
|
opacity: 1;
|
|
}
|
|
}
|
|
|
|
.animation-delay-250 {
|
|
animation-delay: 250ms;
|
|
}
|
|
.animation-delay-500 {
|
|
animation-delay: 500ms;
|
|
}
|
|
.animation-delay-1s {
|
|
animation-delay: 1s;
|
|
}
|