piratify: fix expand and tabs for Pirates RTL #469

This commit is contained in:
Sören Weber 2023-02-08 21:59:28 +01:00
parent 56bc99b79a
commit 5d9e1b6d47
No known key found for this signature in database
GPG key ID: BEC6D55545451B6D
5 changed files with 8 additions and 10 deletions

View file

@ -6,15 +6,14 @@
{{- if eq (printf "%T" $expanded) "string" }} {{- if eq (printf "%T" $expanded) "string" }}
{{- $expanded = (eq $expanded "true") }} {{- $expanded = (eq $expanded "true") }}
{{- end }} {{- end }}
{{- $direction := T "Reading-direction" | default "ltr" }}
{{- with $context }} {{- with $context }}
{{- $id := partial "make-random-md5.hugo" }} {{- $id := partial "make-random-md5.hugo" }}
<div class="expand"> <div class="expand">
<input type="checkbox" id="expand-{{ $id }}" aria-controls="expandcontent-{{ $id }}" {{ if $expanded }} checked{{ end }}> <input type="checkbox" id="expand-{{ $id }}" aria-controls="expandcontent-{{ $id }}" {{ if $expanded }} checked{{ end }}>
<label class="expand-label" for="expand-{{ $id }}" > <label class="expand-label" for="expand-{{ $id }}" >
<i class="fas fa-chevron-down"></i> <i class="fas fa-chevron-down"></i>
<i class="fas fa-chevron-left expand-rtl direction-{{ $direction }}"></i> <i class="fas fa-chevron-left expand-rtl"></i>
<i class="fas fa-chevron-right expand-ltr direction-{{ $direction }}"></i> <i class="fas fa-chevron-right expand-ltr"></i>
{{ $title }} {{ $title }}
</label> </label>
<div id="expandcontent-{{ $id }}" class="expand-content"> <div id="expandcontent-{{ $id }}" class="expand-content">

View file

@ -1,14 +1,13 @@
{{- $context := .context }} {{- $context := .context }}
{{- $tabs := .tabs | default slice }} {{- $tabs := .tabs | default slice }}
{{- $groupid := .groupid | default "default" }} {{- $groupid := .groupid | default "default" }}
{{- $direction := T "Reading-direction" | default "ltr" }}
{{- with $context }} {{- with $context }}
<div class="tab-panel" data-tab-group="{{ $groupid }}"> <div class="tab-panel" data-tab-group="{{ $groupid }}">
<div class="tab-nav"> <div class="tab-nav">
{{- range $idx, $tab := $tabs }} {{- range $idx, $tab := $tabs }}
<button <button
data-tab-item="{{ .name }}" data-tab-item="{{ .name }}"
class="tab-nav-button direction-{{ $direction }} {{ cond (eq $idx 0) "active" ""}}" class="tab-nav-button{{ cond (eq $idx 0) " active" ""}}"
onclick="switchTab('{{ $groupid }}','{{ .name }}')" onclick="switchTab('{{ $groupid }}','{{ .name }}')"
> >
<span>{{ .name }}</span></button> <span>{{ .name }}</span></button>
@ -18,7 +17,7 @@
{{- range $idx, $tab := $tabs }} {{- range $idx, $tab := $tabs }}
<div <div
data-tab-item="{{ .name }}" data-tab-item="{{ .name }}"
class="tab-content-text {{ cond (eq $idx 0) "active" ""}}" class="tab-content-text{{ cond (eq $idx 0) " active" ""}}"
> >
{{ .content | safeHTML }} {{ .content | safeHTML }}
</div> </div>

View file

@ -44,7 +44,7 @@
#body .tab-nav-button { #body .tab-nav-button {
margin-left: 4px; margin-left: 4px;
} }
#body .tab-nav-button.direction-rtl { html[dir="rtl"] #body .tab-nav-button {
float: left; float: left;
} }
#body .tab-nav-button:first-child { #body .tab-nav-button:first-child {

View file

@ -20,7 +20,7 @@
padding: 6px 12px; padding: 6px 12px;
position: relative; position: relative;
} }
#body .tab-nav-button.direction-rtl{ html[dir="rtl"] #body .tab-nav-button{
float: right; float: right;
} }

View file

@ -1118,8 +1118,8 @@ option {
} }
/* turn off unsuitable expander for this reading direction */ /* turn off unsuitable expander for this reading direction */
.expand > .expand-label > .expand-rtl.direction-ltr, html[dir="ltr"] .expand > .expand-label > .expand-rtl,
.expand > .expand-label > .expand-ltr.direction-rtl { html[dir="rtl"] .expand > .expand-label > .expand-ltr {
display: none; display: none;
} }