style(card): unified color with pills and buttons
This commit is contained in:
parent
cff0caec1d
commit
713a7fa70b
2 changed files with 16 additions and 14 deletions
|
@ -33,13 +33,15 @@
|
|||
vertical-align: text-bottom;
|
||||
}
|
||||
|
||||
& a:has(.link_card) {
|
||||
& a:has(.link-card) {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
& .media,
|
||||
& .link_card {
|
||||
border: 1px solid rgba(34, 34, 34, 0.15);
|
||||
& .link-card {
|
||||
border: 1px solid;
|
||||
border-color: var(--border-color-light);
|
||||
color: var(--text-color-dark-faded);
|
||||
border-radius: 5px;
|
||||
box-shadow: 5px 25px 10px -25px rgba(34, 34, 34, 0.15);
|
||||
max-width: 100%;
|
||||
|
@ -51,10 +53,10 @@
|
|||
}
|
||||
|
||||
& .media:hover,
|
||||
& .link_card:hover {
|
||||
color: var(--color-link);
|
||||
& .link-card:hover {
|
||||
color: var(--color-brand-blue-3);
|
||||
border: 1px solid var(--color-brand-blue-3);
|
||||
text-decoration-color: var(--color-link);
|
||||
border-color: var(--color-link);
|
||||
}
|
||||
|
||||
& p {
|
||||
|
@ -93,7 +95,7 @@
|
|||
}
|
||||
}
|
||||
|
||||
& .link_card {
|
||||
& .link-card {
|
||||
color: var(--text-color-dark-faded);
|
||||
text-decoration: underline;
|
||||
text-decoration-color: var(--text-color-light-faded);
|
||||
|
@ -149,17 +151,17 @@ article.card {
|
|||
}
|
||||
|
||||
& .media,
|
||||
& .link_card {
|
||||
border: 1px solid rgba(197, 209, 222, 0.15);
|
||||
& .link-card {
|
||||
border: 1px solid;
|
||||
border-color: var(--border-color-dark);
|
||||
color: var(--text-color-light-faded);
|
||||
background: var(--bg-dark);
|
||||
background-color: var(--bg-dark);
|
||||
}
|
||||
|
||||
& .media:hover,
|
||||
& .link_card:hover {
|
||||
& .link-card:hover {
|
||||
color: var(--color-brand-complement);
|
||||
text-decoration-color: var(--color-brand-complement);
|
||||
border-color: var(--color-brand-complement);
|
||||
border: 1px solid var(--color-brand-complement);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -44,7 +44,7 @@
|
|||
{% endif %}
|
||||
{% endfor %}
|
||||
{% if thread.media_attachments|length <= 0 and thread.card %} <a href="{{ thread.card.url }}">
|
||||
<div class="link_card">
|
||||
<div class="link-card">
|
||||
<small>
|
||||
{{ thread.card.provider_name or
|
||||
thread.card.provider_url }}
|
||||
|
|
Loading…
Reference in a new issue