[mod] simple theme: define a '.show-content-button'

With LESS function '.show-content-button' all the *Show-Media* links becomes
bottons.

Signed-off-by: Markus Heiser <markus.heiser@darmarit.de>
This commit is contained in:
Markus Heiser 2022-02-08 17:45:18 +01:00
parent ace5401632
commit 16d05ca285
5 changed files with 26 additions and 4 deletions

View file

@ -28,6 +28,8 @@
/// Button Colors
--color-btn-background: #3050ff;
--color-btn-font: #fff;
--color-show-btn-background: #bbb;
--color-show-btn-font: #222;
/// Search Input Colors
--color-search-border: #bbb;
--color-search-background: #fff;
@ -129,6 +131,8 @@
/// Button Colors
--color-btn-background: #58f;
--color-btn-font: #222;
--color-show-btn-background: #555;
--color-show-btn-font: #bbb;
/// Search Input Colors
--color-search-border: #555;
--color-search-background: #222;

View file

@ -25,3 +25,16 @@
-webkit-touch-callout: none;
user-select: none;
}
.show-content-button() {
padding: 5px 10px;
.rounded-corners-tiny;
background: var(--color-show-btn-background);
color: var(--color-show-btn-font);
cursor: pointer;
&:hover {
background: var(--color-btn-background);
color: var(--color-btn-font);
}
}

View file

@ -190,8 +190,7 @@ article[data-vim-selected].category-social {
}
.content,
.stat,
.altlink {
.stat {
font-size: 0.9em;
margin: 0;
padding: 0;
@ -206,6 +205,12 @@ article[data-vim-selected].category-social {
}
}
.altlink a {
font-size: 0.9em;
margin: 0 10px 0 0;
.show-content-button;
}
.codelines {
.highlight {
color: inherit;

View file

@ -3,7 +3,7 @@
{{ result_header(result, favicons, image_proxify) -}}
{{- result_sub_header(result) -}}
{% if result.iframe_src -%}
<p class="altlink"> &bull; <a class="btn-collapse collapsed media-loader disabled_if_nojs" data-target="#result-media-{{ index }}" data-btn-text-collapsed="{{ _('show media') }}" data-btn-text-not-collapsed="{{ _('hide media') }}">{{ icon('music-note') }} {{ _('show media') }}</a></p>
<p class="altlink"><a class="btn-collapse collapsed media-loader disabled_if_nojs" data-target="#result-media-{{ index }}" data-btn-text-collapsed="{{ _('show media') }}" data-btn-text-not-collapsed="{{ _('hide media') }}">{{ icon('music-note') }} {{ _('show media') }}</a></p>
{%- endif %}
{%- if result.content %}
<p class="content">

View file

@ -3,7 +3,7 @@
{{ result_header(result, favicons, image_proxify) }}
{{ result_sub_header(result) }}
{% if result.iframe_src -%}
<p class="altlink"> &bull; <a class="btn-collapse collapsed media-loader disabled_if_nojs" data-target="#result-video-{{ index }}" data-btn-text-collapsed="{{ _('show video') }}" data-btn-text-not-collapsed="{{ _('hide video') }}">{{ icon('film-outline') }} {{ _('show video') }}</a></p>
<p class="altlink"> <a class="btn-collapse collapsed media-loader disabled_if_nojs" data-target="#result-video-{{ index }}" data-btn-text-collapsed="{{ _('show video') }}" data-btn-text-not-collapsed="{{ _('hide video') }}">{{ icon('film-outline') }} {{ _('show video') }}</a></p>
{%- endif %}
{%- if result.content %}
<p class="content">