formatting

This commit is contained in:
Aadil Ayub 2022-01-13 16:33:40 +05:00
parent 2a44f64777
commit 28c59acb34

View File

@ -36,21 +36,19 @@
:root { :root {
--border-color: tomato; --border-color: tomato;
--tv-dark: #237D0F; --tv-dark: #237D0F;
--tv-light: #E2FAD7; --tv-light: #E2FAD7;
--pen-dark: #E0005C; --pen-dark: #E0005C;
--pen-light: #FEDAE9; --pen-light: #FEDAE9;
--social-light: #C2E4F2; --social-light: #C2E4F2;
--social-dark: #0163A4; --social-dark: #0163A4;
--gallery-light: #FCF4B9; --gallery-light: #FCF4B9;
--gallery-dark: #846A00; --gallery-dark: #846A00;
} }
/*Main Stuff*/ /*Main Stuff*/
body { body {
font-size: 21px; font-size: 21px;
font-family: Gudea; font-family: Gudea;
@ -75,7 +73,6 @@ body {
flex: auto; flex: auto;
margin: 0 3em 3em 0; margin: 0 3em 3em 0;
align-self: start; align-self: start;
} }
.card { .card {
@ -87,7 +84,6 @@ body {
max-width: 400px; max-width: 400px;
} }
.card:nth-child(even) { .card:nth-child(even) {
transform: rotate(-1deg); transform: rotate(-1deg);
} }
@ -100,7 +96,6 @@ body {
transform: rotate(2deg); transform: rotate(2deg);
} }
.video.box { .video.box {
margin-top: 3em; margin-top: 3em;
} }
@ -118,7 +113,6 @@ body {
display: flex; display: flex;
flex-flow: row wrap; flex-flow: row wrap;
width: 100%; width: 100%;
} }
.entries { .entries {
@ -135,8 +129,9 @@ body {
align-items: flex-start; align-items: flex-start;
} }
.home-link {
.home-link { text-decoration: none; } text-decoration: none;
}
.logo { .logo {
width: 283px; width: 283px;
@ -220,6 +215,7 @@ body {
padding: 0.5em; padding: 0.5em;
} }
/*Article Summary Cards*/ /*Article Summary Cards*/
.h-entry header { .h-entry header {
@ -244,7 +240,6 @@ body {
color: var(--border-color); color: var(--border-color);
} }
.h-entry header .header-metadata { .h-entry header .header-metadata {
margin: 0; margin: 0;
display: flex; display: flex;
@ -261,7 +256,6 @@ body {
padding: 0.5em 1.2em 0.5em 1.2em; padding: 0.5em 1.2em 0.5em 1.2em;
} }
.p-summary.truncated.image { .p-summary.truncated.image {
display: flex; display: flex;
flex-direction: row-reverse; flex-direction: row-reverse;
@ -284,7 +278,6 @@ body {
/* height: 100%; /* height: 100%;
object-fit: cover; object-fit: cover;
max-width: 100%;*/ max-width: 100%;*/
} }
.summary-image>a { .summary-image>a {
@ -309,11 +302,11 @@ footer.post-footer {
font-size: 0.9rem; font-size: 0.9rem;
} }
/* network cards */ /* network cards */
.card.network { .card.network {
border: 2px solid darkcyan; border: 2px solid darkcyan;
background-color: lightgreen; background-color: lightgreen;
max-width: min-content; max-width: min-content;
margin-bottom: 2em; margin-bottom: 2em;
@ -350,7 +343,6 @@ footer.post-footer {
} }
.network .header-metadata .dt-published { .network .header-metadata .dt-published {
border-bottom: 2px solid darkcyan; border-bottom: 2px solid darkcyan;
} }
@ -370,21 +362,24 @@ footer.post-footer {
.network .p-summary.portrait { .network .p-summary.portrait {
flex-direction: row; flex-direction: row;
} }
.network .p-summary.landscape { .network .p-summary.landscape {
flex-direction: column; flex-direction: column;
} }
.network .summary-image.portrait { .network .summary-image.portrait {
border-right: 2px solid darkcyan; border-right: 2px solid darkcyan;
} }
.network .summary-image.landscape { .network .summary-image.landscape {
border-bottom: 2px solid darkcyan; border-bottom: 2px solid darkcyan;
border-right: none; border-right: none;
} }
.network .summary-image>img { .network .summary-image>img {
display: inherit; display: inherit;
} }
.network .summary-text { .network .summary-text {
font-size: 18px; font-size: 18px;
} }
@ -423,12 +418,12 @@ div.network-source {
padding: 0.5em 1.2em 0.5em 1.2em; padding: 0.5em 1.2em 0.5em 1.2em;
} }
/* shouts cards */ /* shouts cards */
.card.shout { .card.shout {
border-color: steelblue; border-color: steelblue;
border: 2px solid; border: 2px solid;
background-color: aliceblue; background-color: aliceblue;
max-width: min-content; max-width: min-content;
margin-bottom: 2em; margin-bottom: 2em;
@ -443,9 +438,7 @@ div.network-source {
cursor: pointer; cursor: pointer;
} }
.card .card .card.shout h2 a:hover {
.card.shout h2 a:hover {
border: none; border: none;
text-decoration: none; text-decoration: none;
} }
@ -455,6 +448,7 @@ div.network-source {
color: var(--social-dark); color: var(--social-dark);
} }
/* calendar cards */ /* calendar cards */
.card.calendar { .card.calendar {
@ -519,6 +513,7 @@ div.network-source {
flex-flow: row-reverse; flex-flow: row-reverse;
border-bottom: 2px solid cornflowerblue; border-bottom: 2px solid cornflowerblue;
} }
.start-scroller marquee { .start-scroller marquee {
font-size: 0.8rem; font-size: 0.8rem;
padding-top: 0.2em; padding-top: 0.2em;
@ -542,6 +537,7 @@ div.network-source {
display: inherit; display: inherit;
} }
/* Card metadata (video & calendar) */ /* Card metadata (video & calendar) */
.metadata { .metadata {
@ -592,6 +588,7 @@ label:hover {
text-align: center; text-align: center;
} }
/* Paginator */ /* Paginator */
nav.pagination { nav.pagination {
@ -603,8 +600,10 @@ nav.pagination {
ul.pagination { ul.pagination {
display: flex; display: flex;
justify-content: space-evenly; /* align horizontal */ justify-content: space-evenly;
align-items: center; /* align vertical */ /* align horizontal */
align-items: center;
/* align vertical */
} }
.page-item { .page-item {
@ -632,6 +631,7 @@ li.page-item.disabled {
display: none; display: none;
} }
/* /*
li.page-item:nth-child(even) { li.page-item:nth-child(even) {
transform: rotate(-1deg); transform: rotate(-1deg);
@ -672,7 +672,6 @@ li.page-item:nth-last-child(2)::after {
display: none; display: none;
} }
li.page-item a { li.page-item a {
text-decoration: none; text-decoration: none;
} }
@ -721,6 +720,7 @@ footer a:hover {
text-decoration: underline; text-decoration: underline;
} }
/* mobile styles */ /* mobile styles */
@media (max-width: 480px) { @media (max-width: 480px) {
@ -761,10 +761,14 @@ footer a:hover {
width: 0; width: 0;
z-index: 2; z-index: 2;
transition: 0.2s all ease-in-out; transition: 0.2s all ease-in-out;
padding-top: 120px; } padding-top: 120px;
}
.drawer * { .drawer * {
display: none; display: none;
opacity: 0; } opacity: 0;
}
#top-menu .drawer ul { #top-menu .drawer ul {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
@ -773,20 +777,27 @@ footer a:hover {
margin: 0; margin: 0;
padding: 0; padding: 0;
} }
.drawer ul li { .drawer ul li {
padding: 1em 0; padding: 1em 0;
border-bottom: 1px solid #333; } /* border-bottom: 1px solid #333; */
}
.drawer ul li a { .drawer ul li a {
color: white; color: white;
text-decoration: none; text-decoration: none;
text-transform: lowercase; text-transform: lowercase;
margin-left: 1em; } margin-left: 1em;
}
.drawer.opened { .drawer.opened {
width: 80%; } width: 80%;
}
.drawer.opened * { .drawer.opened * {
display: block; display: block;
opacity: 1; } opacity: 1;
}
/* card styles */ /* card styles */
.h-entry img { .h-entry img {