192 lines
3.1 KiB
CSS

#blog {
margin-top: 2svh;
min-height: 80svh;
}
#blog #blog_info {
display: flex;
flex-direction: column;
}
#blog #blog_info p {
padding: 2svh 0svw;
margin: 0px;
}
#blog #blog_info h1 {
padding: 1svh 1svw;
margin: 2svh 0svw;
margin-bottom: 0px;
}
#blog #blog_info div {
display: flex;
flex-direction: row;
justify-content: space-between;
padding: 1svh 2svw;
border-bottom: var(--underlineTitle);
border-radius: var(--underlineTitleBorderRadius);
}
#blog #blog_info div p {
padding: 0px;
margin: 0px;
}
#blog #blog_info div div {
margin: 0px;
padding: 0px;
border: none;
}
#blog #blog_info div p:last-child {
margin-right: 10svh;
}
#blog #blog_info div div p {
background-color: rgba(128, 0, 128, 0.2);
border-radius: 1rem;
padding: 0.25svh 1svw;
margin: 0svh 0.25svh;
}
#blog a {
color: #ffffff;
margin-top: 50px;
}
#blog a:hover {
color: #91a4d2;
}
#blog_content {
padding: 2svh 0svw;
}
#blog_content h1,
h2,
h3 {
margin: 0px;
padding: 1svh 0svw;
border-bottom: none;
/* border-bottom: var(--underlineTitle);
border-radius: var(--underlineTitleBorderRadius); */
}
#blog_content p {
padding: 1svh 0svw;
margin: 0px;
}
#blogs {
display: flex;
flex-direction: column;
min-height: 80svh;
}
#blogs h1 {
border-bottom: var(--underlineTitle);
border-radius: var(--underlineTitleBorderRadius);
margin: 1svh 2svw;
padding: 1svh 2svw;
display: flex;
}
#blogs button {
/* background-color: transparent; */
background-color: var(--card-background-color);
border-radius: var(--card-border-radius);
border: none;
color: inherit;
font-size: x-large;
padding: 0.5rem;
margin: 1svh 0svw;
}
#blogs p {
margin: 0px;
padding: 0px;
}
#blogs a {
text-decoration: none;
color: inherit;
}
#blogs a:hover {
color: #91a4d2;
}
#blogs-title {
display: flex;
flex-direction: column;
padding-bottom: 1svh;
}
#blogs-title p {
margin: 0svh 1svw;
padding: 1svh 0svw;
}
#blog-loading {
display: flex;
flex-direction: column;
justify-self: center;
align-self: center;
justify-content: center;
align-items: center;
background-color: var(--card-background-color);
border-radius: var(--card-border-radius);
padding: 2svh 2svw;
margin: 8svh 0svw;
}
#blog-out-of {
display: flex;
flex-direction: column;
justify-self: center;
align-self: center;
justify-content: center;
align-items: center;
background-color: var(--card-background-color);
border-radius: var(--card-border-radius);
padding: 2svh 2svw;
margin: 8svh 0svw;
}
#blog-nav {
display: flex;
align-items: center;
position: relative;
padding: 0svh 2svw;
margin-top: auto;
margin-bottom: 2svh;
background-color: var(--card-background-color);
border-radius: var(--card-border-radius);
}
#blog-nav a:last-child {
margin-left: auto;
}
#blog-nav div {
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
justify-self: center;
margin: 1svh 0svw;
padding: 0.5rem;
column-gap: 1svw;
min-height: 28px;
font-size: large;
background-color: var(--card-background-color);
border-radius: var(--card-border-radius);
position: absolute;
left: 50%;
transform: translateX(-50%);
}