Move post actions to the top on mobile

It's not exactly useful to have them at the bottom
This commit is contained in:
daudix
2024-10-02 03:10:33 +03:00
parent 1ff0537045
commit 8085b6355c
2 changed files with 48 additions and 42 deletions

View File

@ -17,7 +17,7 @@
inset-inline-start: 0;
}
& + #heading {
&+#heading {
margin-block-start: 35vw;
}
@ -26,7 +26,7 @@
margin-block-start: 50vw;
}
& + #heading {
&+#heading {
margin-block-start: 2rem;
}
}
@ -42,7 +42,7 @@
background-clip: text;
color: transparent;
& + p {
&+p {
display: inline;
}
}
@ -159,7 +159,7 @@
width: min(calc(var(--container-width) / 3), calc(90vw - 3rem));
max-height: 50vh;
& > strong {
&>strong {
color: var(--fg-muted-4);
font-size: var(--font-size-x-large);
line-height: 1;
@ -194,8 +194,14 @@
}
}
#go-to-top .icon {
mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16'%3E%3Cpath d='M1 11a1 1 0 0 1 .293-.707l6-6a1 1 0 0 1 1.414 0l6 6a1 1 0 1 1-1.414 1.414L8 6.414l-5.293 5.293A1 1 0 0 1 1 11m0 0'/%3E%3C/svg%3E");
#go-to-top {
@media only screen and (max-width: 720px) {
display: none;
}
.icon {
mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16'%3E%3Cpath d='M1 11a1 1 0 0 1 .293-.707l6-6a1 1 0 0 1 1.414 0l6 6a1 1 0 1 1-1.414 1.414L8 6.414l-5.293 5.293A1 1 0 0 1 1 11m0 0'/%3E%3C/svg%3E");
}
}
#share .icon {

View File

@ -69,6 +69,42 @@
{%- endif %}
</div>
<div id="buttons-container">
{%- if page.extra.toc -%}
<details id="toc" class="closable">
<summary title="{{ macros_translate::translate(key='table_of_contents', default='Table of Contents', language_strings=language_strings) }}"><i class="icon"></i></summary>
<div id="toc-dropdown">
<strong>{{ macros_translate::translate(key="table_of_contents", default="Table of Contents", language_strings=language_strings) }}</strong>
<div>
<ul>
{%- for h1 in page.toc -%}
<li>
<a href="{{ h1.permalink | safe }}">{{ h1.title }}</a>
{%- if h1.children -%}
<ul>
{%- for h2 in h1.children -%}
<li>
<a href="{{ h2.permalink | safe }}">{{ h2.title }}</a>
</li>
{%- endfor -%}
</ul>
{%- endif -%}
</li>
{%- endfor -%}
</ul>
</div>
</div>
</details>
{%- endif -%}
<a id="go-to-top" href="#top" title="{{ macros_translate::translate(key='go_to_top', default='Go to Top', language_strings=language_strings) }}"><i class="icon"></i></a>
{%- if config.extra.show_share_button -%}
<a id="share" href="https://shareopenly.org/share/?url={{ page.permalink }}&text={{ page.description | urlencode }}" rel="{{ rel_attributes }}" title="{{ macros_translate::translate(key='share', default='Share', language_strings=language_strings) }}"><i class="icon"></i></a>
{%- endif -%}
{%- if config.extra.issues_url -%}
<a id="issue" href="{{ config.extra.issues_url }}" rel="{{ rel_attributes }}" title="{{ macros_translate::translate(key='file_an_issue', default='File an Issue', language_strings=language_strings) }}"><i class="icon"></i></a>
{%- endif -%}
</div>
{%- include "partials/statements.html" -%}
{{ page.content | safe }}
@ -78,42 +114,6 @@
{% include "partials/comments.html" %}
{%- endif -%}
<div id="buttons-container">
{%- if page.extra.toc -%}
<details id="toc" class="closable">
<summary title="{{ macros_translate::translate(key='table_of_contents', default='Table of Contents', language_strings=language_strings) }}"><i class="icon"></i></summary>
<div id="toc-dropdown">
<strong>{{ macros_translate::translate(key="table_of_contents", default="Table of Contents", language_strings=language_strings) }}</strong>
<div>
<ul>
{%- for h1 in page.toc -%}
<li>
<a href="{{ h1.permalink | safe }}">{{ h1.title }}</a>
{%- if h1.children -%}
<ul>
{%- for h2 in h1.children -%}
<li>
<a href="{{ h2.permalink | safe }}">{{ h2.title }}</a>
</li>
{%- endfor -%}
</ul>
{%- endif -%}
</li>
{%- endfor -%}
</ul>
</div>
</div>
</details>
{%- endif -%}
<a id="go-to-top" href="#top" title="{{ macros_translate::translate(key='go_to_top', default='Go to Top', language_strings=language_strings) }}"><i class="icon"></i></a>
{%- if config.extra.show_share_button -%}
<a id="share" href="https://shareopenly.org/share/?url={{ page.permalink }}&text={{ page.description | urlencode }}" rel="{{ rel_attributes }}" title="{{ macros_translate::translate(key='share', default='Share', language_strings=language_strings) }}"><i class="icon"></i></a>
{%- endif -%}
{%- if config.extra.issues_url -%}
<a id="issue" href="{{ config.extra.issues_url }}" rel="{{ rel_attributes }}" title="{{ macros_translate::translate(key='file_an_issue', default='File an Issue', language_strings=language_strings) }}"><i class="icon"></i></a>
{%- endif -%}
</div>
{%- if page.lower or page.higher -%}
<hr />
<nav id="post-nav">