Minor CSS cleanup

This commit is contained in:
syeopite 2021-05-24 09:39:49 -07:00
parent f2c35b975f
commit 420c2be348
No known key found for this signature in database
GPG key ID: 6FA616E5A5294A82
4 changed files with 83 additions and 16 deletions

View file

@ -70,7 +70,7 @@
display: inline;
}
.section-contents .channel-profile {
.category-contents .channel-profile {
text-align: center;
}
@ -120,13 +120,16 @@ only show up when the screen is wide enough */
.trailer-metadata {
margin-left: 15px;
font-size: 12px;
color: rgb(232, 230, 227);
}
.trailer-title {
font-size: 15px;
}
.trailer-metadata .read-more {
line-height: 20px;
text-transform: uppercase;
color: gray;
font-size: 13px;
}
@ -135,4 +138,52 @@ only show up when the screen is wide enough */
max-height: 150px;
line-height: 20px;
margin-top: 20px;
}
}
@media (prefers-color-scheme: dark) {
.no-theme .trailer-metadata {
color: rgb(232, 230, 227);
}
.no-theme .trailer-title {
color:rgb(209, 209, 209)
}
.no-theme .trailer-metadata .read-more, .no-theme .trailer-timestamp {
color: gray;
}
}
.no-theme .trailer-metadata {
color: rgb(232, 230, 227);
}
.dark-theme .trailer-title {
color:rgb(209, 209, 209)
}
.dark-theme .trailer-metadata .read-more, .no-theme .trailer-timestamp {
color: gray;
}
@media (prefers-color-scheme: light) {
.no-theme .trailer-metadata, .no-theme .trailer-title {
color: black;
}
.no-theme .trailer-metadata .read-more, .no-theme .trailer-timestamp {
color: rgb(127, 127, 127);
}
}
.light-theme .trailer-metadata, .light-theme .trailer-title {
color: black;
}
.light-theme .trailer-metadata .read-more, .no-theme .trailer-timestamp {
color: rgb(127, 127, 127);
}

View file

@ -606,8 +606,8 @@ hr {
margin-top: 1em;
}
.category .heading > p {
display: inline-block;
.category-heading {
margin-bottom: 7px;
}
/* Split into .badge and #.featured */
@ -621,7 +621,23 @@ hr {
display: inline;
}
/* Temp */
.category-description {
@media (prefers-color-scheme: dark) {
.no-theme .category-description {
color: #A8A095;
}
}
.dark-theme .category-description {
color: #A8A095;
}
}
@media (prefers-color-scheme: light) {
.no-theme .category-description {
color: #000000;
}
}
.light-theme .category-description {
color: #000000;
}

View file

@ -11,8 +11,8 @@
<% if !featured_channel_categories.empty? %>
<% featured_channel_categories.each do | category | %>
<div class="channel-section pure-u-1">
<details open="">
<summary style="display: revert;">
<details open="" class="category">
<summary style="display: revert;" class="category-heading">
<span style="font-weight: bold;">
<% if category.url %>
<a href="<%=category.url%>">
@ -24,7 +24,7 @@
</h3>
</summary>
<% contents = category.contents%>
<div class="pure-g section-contents">
<div class="pure-g category-contents">
<% if contents.is_a?(Array) %>
<% contents.each do |item|%>
<% if !item.is_a?(SearchChannel)%>

View file

@ -26,8 +26,8 @@
</div>
<div class="trailer-metadata pure-u-1 pure-u-md-1-3">
<a style="color:rgb(209, 209, 209)"><%= HTML.escape(section.title) %></a>
<p style="color: gray;">
<a class="trailer-title"><%= HTML.escape(section.title) %></a>
<p class="trailer-timestamp">
<%= translate(locale, "`x` views", number_to_short_text(section.views || 0)) %>
<%= translate(locale, "Shared `x` ago", recode_date(section.published, locale)) %>
</p>
@ -40,8 +40,8 @@
<% else %>
<div class="category pure-u-1">
<details open = "">
<summary style="display: revert;">
<a class="category-heading" href="<%=section.url%>"> <%= section.title %> </a>
<summary style="display: revert;" class="category-heading">
<a href="<%=section.url%>"> <%= section.title %> </a>
</summary>
<div class="category-description h-box">