Files
portfolio/app/globals.css

121 lines
2.4 KiB
CSS

/* app/globals.css */
@tailwind base;
@tailwind components;
@tailwind utilities;
body {
margin: 0;
padding: 0;
position: relative;
min-height: 100vh;
}
.markdown h1 {
font-size: 2.5rem;
font-weight: bold;
margin-top: 1.5rem;
margin-bottom: 1rem;
color: #333;
}
.markdown h2 {
font-size: 2rem;
font-weight: bold;
margin-top: 1.25rem;
margin-bottom: 0.75rem;
color: #444;
}
.markdown h3 {
font-size: 1.75rem;
font-weight: bold;
margin-top: 1rem;
margin-bottom: 0.5rem;
color: #555;
}
.markdown p {
margin-top: 0.5rem;
margin-bottom: 0.5rem;
line-height: 1.6;
color: #666;
}
.markdown img {
max-width: 100%;
height: auto;
margin-top: 1rem;
margin-bottom: 1rem;
border-radius: 8px;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}
.markdown ul {
list-style-type: disc;
margin-left: 1.5rem;
margin-top: 0.5rem;
margin-bottom: 0.5rem;
}
.markdown ol {
list-style-type: decimal;
margin-left: 1.5rem;
margin-top: 0.5rem;
margin-bottom: 0.5rem;
}
.markdown blockquote {
border-left: 4px solid #ccc;
color: #777;
margin-top: 1rem;
margin-bottom: 1rem;
font-style: italic;
background-color: #f9f9f9;
padding: 1rem;
border-radius: 4px;
}
.bg-radiant-animated {
background: radial-gradient(circle at 20% 20%, #ff8185, transparent 25%),
radial-gradient(circle at 80% 80%, #ffaa91, transparent 25%),
radial-gradient(circle at 50% 50%, #fb7fd9, transparent 25%),
radial-gradient(circle at 30% 70%, #9b6fff, transparent 25%),
radial-gradient(circle at 70% 30%, #ff8edf, transparent 25%);
background-size: 200% 200%;
animation: backgroundAnimation 60s ease infinite alternate;
}
.bg-radiant {
background: radial-gradient(circle at 20% 20%, #ff8185, transparent 25%),
radial-gradient(circle at 80% 80%, #ffaa91, transparent 25%),
radial-gradient(circle at 50% 50%, #fb7fd9, transparent 25%),
radial-gradient(circle at 30% 70%, #9b6fff, transparent 25%),
radial-gradient(circle at 70% 30%, #ff8edf, transparent 25%);
background-size: cover;
}
@keyframes backgroundAnimation {
0% {
background-position: 0 0;
}
100% {
background-position: 100% 100%;
}
}
.min-h-screen {
min-height: 100vh;
}
.flex {
display: flex;
}
.flex-col {
flex-direction: column;
}
.flex-grow {
flex-grow: 1;
}