ruangrupa/lumbung.space
ruangrupa/lumbung.space
1
0
Fork 1
Code Issues 11 Pull Requests Projects Releases Wiki Activity

change video card colors &remove shadow

Browse Source
This commit is contained in:
Aadil Ayub 2022-01-06 15:50:04 +05:00
parent b2a3b09ce7
commit a8eb96309a
2 changed files with 15 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
themes/lumbung-theme/static/css/main.css
View File

@ -73,7 +73,6 @@ a {
.card { .card {
border: 2px solid var(--border-color); border: 2px solid var(--border-color);
box-shadow:1em 1em 0 #d2d1c8;
background-color: #fff09d; background-color: #fff09d;
max-width: 600px; max-width: 600px;
margin-bottom: 2em; margin-bottom: 2em;
@ -294,7 +293,7 @@ footer.post-footer {
.card.network { .card.network {
border: 2px solid darkcyan; border: 2px solid darkcyan;
box-shadow:1em 1em 0 #d2d1c8;
background-color: lightgreen; background-color: lightgreen;
max-width: min-content; max-width: min-content;
margin-bottom: 2em; margin-bottom: 2em;
@ -409,7 +408,7 @@ div.network-source {
.card.shout { .card.shout {
border-color: steelblue; border-color: steelblue;
border: 2px solid; border: 2px solid;
box-shadow:1em 1em 0 #d2d1c8;
background-color: aliceblue; background-color: aliceblue;
max-width: min-content; max-width: min-content;
margin-bottom: 2em; margin-bottom: 2em;
@ -423,7 +422,6 @@ div.network-source {
.card.calendar { .card.calendar {
border: 2px solid cornflowerblue; border: 2px solid cornflowerblue;
box-shadow:1em 1em 0 #d2d1c8;
background-color: lightblue; background-color: lightblue;
max-width: 360px; max-width: 360px;
margin-bottom: 2em; margin-bottom: 2em;
@ -431,7 +429,6 @@ div.network-source {
margin: 0 3em 3em 0; margin: 0 3em 3em 0;
align-self: start; align-self: start;
color: royalblue; color: royalblue;
} }
.card.calendar.past { .card.calendar.past {

26
themes/lumbung-theme/static/css/video-box.css
View File

@ -1,14 +1,14 @@
:root { :root {
--video-border-color: burlywood; --tv-dark: #237D0F;
--video-background-color: antiquewhite; --tv-light: #E2FAD7;
} }
.video-box { .video-box {
border:2px solid var(--video-border-color); border:2px solid var(--tv-dark);
max-width:560px; max-width:560px;
margin:auto; margin:auto;
box-shadow:1em 1em 0 #d2d1c8;
margin-bottom: 2em; margin-bottom: 2em;
color: chocolate; color: var(--tv-dark);
} }
.video-box:nth-child(even){ .video-box:nth-child(even){
@ -37,7 +37,7 @@
} }
.video { .video {
background-color: var(--video-background-color); background-color: var(--tv-light);
} }
.video .metadata{ .video .metadata{
@ -48,8 +48,8 @@
.metadata .title{ .metadata .title{
margin-top:0; margin-top:0;
border-top: 2px solid var(--video-border-color); border-top: 2px solid var(--tv-dark);
border-bottom: 2px solid var(--video-border-color); border-bottom: 2px solid var(--tv-dark);
padding:0.5em; padding:0.5em;
font-weight:700; font-weight:700;
font-size:1.3rem; font-size:1.3rem;
@ -57,20 +57,20 @@
} }
.video.channel{ .video.channel{
border-right: 2px solid var(--video-border-color); border-right: 2px solid var(--tv-dark);
padding: 0.5em 0.9em 0.5em 0.9em; padding: 0.5em 0.9em 0.5em 0.9em;
font-size: 0.8rem; font-size: 0.8rem;
} }
.video.date { .video.date {
float:right; float:right;
border-left: 2px solid var(--video-border-color); border-left: 2px solid var(--tv-dark);
padding: 0.5em 0.9em 0.5em 0.9em; padding: 0.5em 0.9em 0.5em 0.9em;
font-size: 0.8rem; font-size: 0.8rem;
} }
.video.description { .video.description {
border-top: 2px solid var(--video-border-color); border-top: 2px solid var(--tv-dark);
padding: 0.8em 0.8em 0.8em 0.8em; padding: 0.8em 0.8em 0.8em 0.8em;
} }
@ -120,7 +120,7 @@ input:checked + label + .video.date +.description {
.video-thumbnail-duration-overlay { .video-thumbnail-duration-overlay {
display: inline-block; display: inline-block;
background-color: var(--video-background-color); background-color: var(--tv-light);
color: chocolate; color: chocolate;
font-size: 14px; font-size: 14px;
line-height: 1.1; line-height: 1.1;
@ -129,7 +129,7 @@ input:checked + label + .video.date +.description {
padding: 1px 3px 1px 3px; padding: 1px 3px 1px 3px;
right: 5px; right: 5px;
bottom: 5px; bottom: 5px;
border: 2px solid var(--video-border-color); border: 2px solid var(--tv-dark);
} }
.play-overlay { .play-overlay {