Add blog page css
This commit is contained in:
parent
178fa113a5
commit
a31fa68e84
4 changed files with 42 additions and 16 deletions
|
@ -3,8 +3,28 @@
|
|||
@apply bg-surface dark:bg-dark_surface text-on_surface dark:text-dark_on_surface;
|
||||
@apply min-h-screen py-5;
|
||||
|
||||
& > h1 {
|
||||
@apply font-bold text-3xl text-center;
|
||||
& h1 {
|
||||
@apply font-bold text-3xl;
|
||||
}
|
||||
|
||||
& h2 {
|
||||
@apply font-bold text-2xl;
|
||||
}
|
||||
|
||||
& h3 {
|
||||
@apply font-bold text-xl;
|
||||
}
|
||||
|
||||
& h4 {
|
||||
@apply font-bold text-lg;
|
||||
}
|
||||
|
||||
& h5 {
|
||||
@apply font-bold text-base;
|
||||
}
|
||||
|
||||
& h6 {
|
||||
@apply font-bold text-sm;
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -12,7 +32,7 @@
|
|||
& > .posts__cards {
|
||||
@apply grid grid-cols-1 gap-5 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 2xl:grid-cols-5 m-5;
|
||||
|
||||
& > div {
|
||||
& > a {
|
||||
@apply rounded-xl overflow-hidden relative;
|
||||
@apply bg-primary/10 dark:bg-dark_primary/10;
|
||||
@apply shadow-md shadow-primary/5 dark:shadow-dark_primary/5;
|
||||
|
@ -23,12 +43,19 @@
|
|||
|
||||
& > div {
|
||||
@apply p-5 flex flex-col gap-3;
|
||||
|
||||
& > h2 {
|
||||
@apply font-bold text-2xl;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.post {
|
||||
& > div {
|
||||
@apply mx-auto max-w-3xl;
|
||||
@apply flex flex-col gap-5;
|
||||
}
|
||||
|
||||
& pre > code {
|
||||
@apply rounded-md my-2;
|
||||
}
|
||||
}
|
||||
}
|
Loading…
Add table
Add a link
Reference in a new issue