Minor fixes about pages

This commit is contained in:
kvakazyambra 2022-11-11 12:34:40 +03:00
parent 76d43514e6
commit 8ffa30f1be
5 changed files with 39 additions and 11 deletions

View File

@ -6,7 +6,7 @@ import { Icon } from '../../Nav/Icon'
export const GuidePage = () => {
const title = t('How it works')
const [indexExpanded, setIndexExpanded] = createSignal(false)
const [indexExpanded, setIndexExpanded] = createSignal(true)
const toggleIndexExpanded = () => setIndexExpanded((oldExpanded) => !oldExpanded)
@ -28,12 +28,14 @@ export const GuidePage = () => {
<Icon name="content-index-control" />
</Show>
<Show when={indexExpanded()}>
<Icon name="content-index-control-expanded" />
<Icon name="content-index-control-expanded" class={'expanded'} />
</Show>
</button>
<Show when={indexExpanded()}>
<nav class="content-index">
<h4>Оглавление</h4>
<ul class="nodash">
<li>
<a href="#how-it-works">{title}</a>

View File

@ -6,7 +6,7 @@ import { Icon } from '../../Nav/Icon'
// const title = t('Support us')
export const HelpPage = () => {
const [indexExpanded, setIndexExpanded] = createSignal(false)
const [indexExpanded, setIndexExpanded] = createSignal(true)
const toggleIndexExpanded = () => setIndexExpanded((oldExpanded) => !oldExpanded)
@ -25,12 +25,14 @@ export const HelpPage = () => {
<Icon name="content-index-control" />
</Show>
<Show when={indexExpanded()}>
<Icon name="content-index-control-expanded" />
<Icon name="content-index-control-expanded" class={'expanded'} />
</Show>
</button>
<Show when={indexExpanded()}>
<nav class="content-index">
<h4>Оглавление</h4>
<ul class="nodash">
<li>
<a href="#help-us">Как вы&nbsp;можете поддержать Дискурс?</a>

View File

@ -9,7 +9,7 @@ import { Icon } from '../../Nav/Icon'
// title={t('Manifest')}
export const ManifestPage = () => {
const [indexExpanded, setIndexExpanded] = createSignal(false)
const [indexExpanded, setIndexExpanded] = createSignal(true)
const toggleIndexExpanded = () => setIndexExpanded((oldExpanded) => !oldExpanded)
@ -29,12 +29,14 @@ export const ManifestPage = () => {
<Icon name="content-index-control" />
</Show>
<Show when={indexExpanded()}>
<Icon name="content-index-control-expanded" />
<Icon name="content-index-control-expanded" class={'expanded'} />
</Show>
</button>
<Show when={indexExpanded()}>
<nav class="content-index">
<h4>Оглавление</h4>
<ul class="nodash">
<li>
<a href="#manifest">Манифест</a>
@ -104,7 +106,7 @@ export const ManifestPage = () => {
независимой журналистики. Участвовать в&nbsp;открытой редакции и&nbsp;помогать журналу можно
следующими способами:
</p>
<details>
<details open>
<summary>
<h3 id="contribute">Предлагать материалы</h3>
</summary>

View File

@ -5,7 +5,7 @@ import { Icon } from '../../Nav/Icon'
// const title = t('Terms of use')
export const TermsOfUsePage = () => {
const [indexExpanded, setIndexExpanded] = createSignal(false)
const [indexExpanded, setIndexExpanded] = createSignal(true)
const toggleIndexExpanded = () => setIndexExpanded((oldExpanded) => !oldExpanded)
@ -23,12 +23,14 @@ export const TermsOfUsePage = () => {
<Icon name="content-index-control" />
</Show>
<Show when={indexExpanded()}>
<Icon name="content-index-control-expanded" />
<Icon name="content-index-control-expanded" class={'expanded'} />
</Show>
</button>
<Show when={indexExpanded()}>
<nav class="content-index">
<h4>Оглавление</h4>
<ul class="nodash">
<li>
<a href="#terms-of-use">Пользовательское соглашение</a>

View File

@ -250,8 +250,8 @@ button {
}
.button--content-index {
border: 2px solid #fff;
background: none;
border: 2px solid #fff;
height: 3.2rem;
float: right;
padding: 0;
@ -271,15 +271,31 @@ button {
right: $container-padding-x;
}
.icon {
background: #fff;
transition: filter 0.3s;
}
.icon,
img {
height: 100%;
vertical-align: middle;
width: auto;
}
&:hover {
.icon {
opacity: 0.5;
filter: invert(1);
}
}
.expanded {
border-radius: 100%;
overflow: hidden;
img {
height: auto;
margin-top: 0.8rem;
}
}
}
@ -723,6 +739,10 @@ astro-island {
a {
border: none;
}
h4 {
@include font-size(1.6rem);
}
}
.load-more-container {