Move inline styles to classes

This commit is contained in:
Sofía Aritz 2025-04-27 20:14:56 +02:00
parent 11cd13c6a6
commit 9088331064
Signed by: sofia
GPG key ID: 5A1485B4CCCDDB4A
4 changed files with 47 additions and 24 deletions

View file

@ -1,15 +1,38 @@
/* Warning */
.warning {
padding: 1rem;
background-color: color-mix(in srgb, var(--color-secondary),#fff 80%);
border: 1px solid var(--color-accent);
border-radius: 0.5rem;
margin-bottom: 1.5rem;
color: var(--color-text);
}
.warning h3 {
margin-top: 0;
font-size: 1.25rem;
color: var(--color-accent);
}
padding: 1rem;
background-color: color-mix(in srgb, var(--color-secondary),#fff 80%);
border: 1px solid var(--color-accent);
border-radius: 0.5rem;
margin-bottom: 1.5rem;
color: var(--color-text);
}
.warning h3 {
margin-top: 0;
font-size: 1.25rem;
color: var(--color-accent);
}
/* Post preview */
.post-preview h3 {
margin-bottom: 0.2rem;
}
.post-preview h3 a {
text-decoration: none;
}
.post-preview hr {
color: var(--color-secondary);
border: 3px dotted;
border-style: none none dotted;
}
.post-preview__content {
font-size: 0.9rem;
}
.post-preview__content__archived {
font-family: 'Nunito', sans-serif;
}

View file

@ -65,7 +65,7 @@
.nav-link:focus {
background: var(--color-bg);
border-left-color: var(--color-bg);
color: var(--color-nav-text);
color: var(--color-text);
}
.layout-main {

View file

@ -32,18 +32,18 @@ which I believe are essential for building a fairer and more sustainable technol
{% assign limitedPosts = collections.weblogActive | slice: 0, 2 %}
{% for post in limitedPosts %}
<div>
<h3 style="margin-bottom: 0.2rem;"><a style="text-decoration: none;" href="{{ post.data.permalink }}">{{ post.data.title }}</a></h3>
<div class="post-preview">
<h3><a href="{{ post.data.permalink }}">{{ post.data.title }}</a></h3>
<time datetime="{{ post.data.page.date | HTMLdatetime }}">{{ post.data.page.date | datetime }}</time>
{% if post.data.introduction %}
<p style="font-size: 0.9rem;">
<p class="post-preview__content">
{% if post.data.archived %}
<span><strong><span style="font-family: 'Nunito', sans-serif">&#9888;</span> Archived</strong> | </span>
<span><strong><span class="post-preview__content__archived">&#9888;</span> Archived</strong> | </span>
{% endif %}
{{ post.data.introduction }}
</p>
{% endif %}
<hr style="color: var(--color-secondary); border: 3px dotted; border-style: none none dotted;">
<hr>
</div>
{% endfor %}

View file

@ -13,18 +13,18 @@ permalink: /weblog/index.html
<ul style="list-style-type: none; padding: 0;">
{% for post in collections.weblog %}
<li>
<div>
<h3 style="margin-bottom: 0.2rem;"><a style="text-decoration: none;" href="{{ post.data.permalink }}">{{ post.data.title }}</a></h3>
<div class="post-preview">
<h3><a href="{{ post.data.permalink }}">{{ post.data.title }}</a></h3>
<time datetime="{{ post.data.page.date | HTMLdatetime }}">{{ post.data.page.date | datetime }}</time>
{% if post.data.introduction %}
<p style="font-size: 0.9rem;">
<p class="post-preview__content">
{% if post.data.archived %}
<span><strong><span style="font-family: 'Nunito', sans-serif">&#9888;</span> Archived</strong> | </span>
<span><strong><span class="post-preview__content__archived">&#9888;</span> Archived</strong> | </span>
{% endif %}
{{ post.data.introduction }}
</p>
{% endif %}
<hr style="color: var(--color-secondary); border: 3px dotted; border-style: none none dotted;">
<hr>
</div>
</li>
{% endfor %}