Fixed about pages style

This commit is contained in:
kvakazyambra 2022-11-10 00:39:54 +03:00
parent 64907a84e6
commit c92fd115c4
11 changed files with 81 additions and 66 deletions

View File

@ -7,7 +7,7 @@ export const DiscussionRulesPage = () => {
<MainLayout>
<article class="container container--static-page">
<div class="row">
<div class="col-md-7 shift-content order-md-first">
<div class="col-md-6 col-xl-7 shift-content order-md-first">
<h1>
<span class="wrapped" innerHTML={title} />
</h1>

View File

@ -7,7 +7,7 @@ export const DogmaPage = () => {
<MainLayout>
<article class="container container--static-page">
<div class="row">
<div class="col-md-7 shift-content order-md-first">
<div class="col-md-6 col-xl-7 shift-content order-md-first">
<h4>Редакционные принципы</h4>
<p>
Дискурс - журнал с открытой горизонтальной редакцией. Содержание журнала определяется прямым

View File

@ -22,17 +22,15 @@ export const GuidePage = () => {
<article class="container container--static-page">
<div class="row">
<div class="col-md-3 col-lg-2 col-xl-3 order-md-last">
<p class="content-index-control-container">
<button class="button button--content-index" onClick={toggleIndexExpanded}>
<Show when={!indexExpanded()}>
<Icon name="content-index-control" />
</Show>
<Show when={indexExpanded()}>
<Icon name="content-index-control-expanded" />
</Show>
</button>
</p>
<div class="col-md-4 col-lg-3 order-md-last">
<button class="button button--content-index" onClick={toggleIndexExpanded}>
<Show when={!indexExpanded()}>
<Icon name="content-index-control" />
</Show>
<Show when={indexExpanded()}>
<Icon name="content-index-control-expanded" />
</Show>
</button>
<Show when={indexExpanded()}>
<nav class="content-index">
@ -60,7 +58,7 @@ export const GuidePage = () => {
</Show>
</div>
<div class="col-md-7 shift-content order-md-first">
<div class="col-md-6 col-xl-7 shift-content order-md-first">
<h1 id="about">
<span class="wrapped">Как устроен Дискурс</span>
</h1>

View File

@ -19,17 +19,15 @@ export const HelpPage = () => {
<article class="container container--static-page discours-help">
<div class="row">
<div class="col-md-3 col-lg-2 col-xl-3 order-md-last">
<p class="content-index-control-container">
<button class="button button--content-index" onClick={toggleIndexExpanded}>
<Show when={!indexExpanded()}>
<Icon name="content-index-control" />
</Show>
<Show when={indexExpanded()}>
<Icon name="content-index-control-expanded" />
</Show>
</button>
</p>
<div class="col-md-4 col-lg-3 order-md-last">
<button class="button button--content-index" onClick={toggleIndexExpanded}>
<Show when={!indexExpanded()}>
<Icon name="content-index-control" />
</Show>
<Show when={indexExpanded()}>
<Icon name="content-index-control-expanded" />
</Show>
</button>
<Show when={indexExpanded()}>
<nav class="content-index">
@ -51,7 +49,7 @@ export const HelpPage = () => {
</Show>
</div>
<div class="col-md-7 shift-content order-md-first">
<div class="col-md-6 col-xl-7 shift-content order-md-first">
<h1 id="help-us">
<span class="wrapped">Как вы&nbsp;можете поддержать Дискурс?</span>
</h1>

View File

@ -23,17 +23,15 @@ export const ManifestPage = () => {
</Modal>
<article class="container container--static-page">
<div class="row">
<div class="col-md-3 col-lg-2 col-xl-3 order-md-last">
<p class="content-index-control-container">
<button class="button button--content-index" onClick={toggleIndexExpanded}>
<Show when={!indexExpanded()}>
<Icon name="content-index-control" />
</Show>
<Show when={indexExpanded()}>
<Icon name="content-index-control-expanded" />
</Show>
</button>
</p>
<div class="col-md-4 col-lg-3 order-md-last">
<button class="button button--content-index" onClick={toggleIndexExpanded}>
<Show when={!indexExpanded()}>
<Icon name="content-index-control" />
</Show>
<Show when={indexExpanded()}>
<Icon name="content-index-control-expanded" />
</Show>
</button>
<Show when={indexExpanded()}>
<nav class="content-index">
@ -66,7 +64,7 @@ export const ManifestPage = () => {
</Show>
</div>
<div class="col-md-7 shift-content order-md-first">
<div class="col-md-6 col-xl-7 shift-content order-md-first">
<h1 id="manifest">
<span class="wrapped">Манифест</span>
</h1>

View File

@ -8,7 +8,7 @@ export const PartnersPage = () => {
<MainLayout>
<article class="container container--static-page">
<div class="row">
<div class="col-md-7 shift-content order-md-first">
<div class="col-md-6 col-xl-7 shift-content order-md-first">
<h1>{t('Partners')}</h1>
</div>
</div>

View File

@ -7,7 +7,7 @@ export const PrinciplesPage = () => {
<MainLayout>
<article class="container container--static-page">
<div class="row">
<div class="col-md-7 shift-content order-md-first">
<div class="col-md-6 col-xl-7 shift-content order-md-first">
<h1>
<span class="wrapped">{title}</span>
</h1>

View File

@ -8,7 +8,7 @@ export const ProjectsPage = () => {
<MainLayout>
<article class="container container--static-page">
<div class="row">
<div class="col-md-7 shift-content order-md-first">
<div class="col-md-6 col-xl-7 shift-content order-md-first">
<h1>{t('Projects')}</h1>
</div>
</div>

View File

@ -17,17 +17,15 @@ export const TermsOfUsePage = () => {
{/*<Meta property="og:description" content={title} />*/}
<article class="container container--static-page">
<div class="row">
<div class="col-md-3 col-lg-2 col-xl-3 order-md-last">
<p class="content-index-control-container">
<button class="button button--content-index" onClick={toggleIndexExpanded}>
<Show when={!indexExpanded()}>
<Icon name="content-index-control" />
</Show>
<Show when={indexExpanded()}>
<Icon name="content-index-control-expanded" />
</Show>
</button>
</p>
<div class="col-md-4 col-lg-3 order-md-last">
<button class="button button--content-index" onClick={toggleIndexExpanded}>
<Show when={!indexExpanded()}>
<Icon name="content-index-control" />
</Show>
<Show when={indexExpanded()}>
<Icon name="content-index-control-expanded" />
</Show>
</button>
<Show when={indexExpanded()}>
<nav class="content-index">
@ -55,7 +53,7 @@ export const TermsOfUsePage = () => {
</Show>
</div>
<div class="col-md-7 shift-content order-md-first">
<div class="col-md-6 col-xl-7 shift-content order-md-first">
<h1 id="terms-of-use">
<span class="wrapped">Пользовательское соглашение</span>
</h1>

View File

@ -12,7 +12,7 @@ export const ThanksPage = () => {
<article class="container container--static-page">
<div class="row">
<div class="col-md-7 shift-content order-md-first">
<div class="col-md-6 col-xl-7 shift-content order-md-first">
<h1>
<span class="wrapped">{title}</span>
</h1>

View File

@ -243,8 +243,23 @@ button {
border: 2px solid #fff;
background: none;
height: 3.2rem;
float: right;
padding: 0;
position: absolute;
right: $container-padding-x * 0.5;
top: -0.5rem;
width: 3.2rem;
z-index: 1;
@include media-breakpoint-up(md) {
margin-top: -0.5rem;
position: sticky;
top: 90px;
}
@include media-breakpoint-up(sm) {
right: $container-padding-x;
}
.icon,
img {
@ -259,10 +274,6 @@ button {
}
}
.content-index-control-container {
text-align: right;
}
form {
.pretty-form__item {
position: relative;
@ -617,18 +628,26 @@ astro-island {
.container {
max-width: 1400px;
// margin-left: 201px;
// width: auto;
@include media-breakpoint-up(md) {
// padding-left: 227px;
}
}
.container--static-page {
@include font-size(1.7rem);
color: #404040;
position: relative;
@include media-breakpoint-up(md) {
padding-top: 1.5em;
> .row {
flex-wrap: nowrap;
justify-content: space-between;
margin-right: 0;
}
}
.order-md-last {
padding-right: 0;
}
}
@ -664,7 +683,7 @@ astro-island {
.content-index {
@include font-size(1.4rem);
margin-bottom: 2em;
margin: 0 3.6rem 2em 0;
@include media-breakpoint-up(md) {
position: sticky;
@ -695,6 +714,10 @@ astro-island {
details {
margin-bottom: 1.5em;
@include media-breakpoint-down(md) {
padding-left: 3rem;
}
summary {
display: block;
position: relative;