discours.io/webapp
5
0
Fork 0
Code Issues Pull Requests Actions Projects Wiki Activity

postmerge

Browse Source
This commit is contained in:
tonyrewin 2022-11-15 15:15:35 +03:00
commit a9a22cd7f6
9 changed files with 91 additions and 80 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
src/components/Author/Card.module.scss
View File

@ -52,10 +52,7 @@
.authorSubscribe {
align-items: center;
display: flex;
@include media-breakpoint-down(lg) {
padding: 0 0 0 42px;
}
padding: 0 0 0 42px;
a {
background: #f7f7f7;

22
src/components/Nav/Header.module.scss
View File

@ -135,6 +135,10 @@
position: relative;
@include font-size(1.7rem);
@include media-breakpoint-down(lg) {
margin-right: 7rem;
}
@include media-breakpoint-down(md) {
display: none;
}
@ -300,7 +304,7 @@
@include font-size(1.4rem);
left: 0;
margin: 0.2em;
margin: 0.2em 0;
overflow: hidden;
position: absolute;
text-overflow: ellipsis;
@ -329,13 +333,21 @@
display: flex;
justify-content: flex-end;
position: absolute;
right: 2rem;
right: 5rem;
top: 50%;
transform: translateY(-50%);
width: 100%;
@include media-breakpoint-up(sm) {
right: 6rem;
}
@include media-breakpoint-up(md) {
right: 0;
right: 1.5rem;
}
@include media-breakpoint-up(lg) {
right: 1.5rem;
}
.control {
@ -403,12 +415,10 @@
.userControlItem {
align-items: center;
border: 2px solid #f6f6f6;
border-radius: 100%;
display: flex;
height: 2.4em;
justify-content: center;
margin-left: divide($container-padding-x, 4);
position: relative;
transition: margin-left 0.3s;
width: 2.4em;
@ -419,8 +429,6 @@
.headerScrolledTop &,
.headerScrolledBottom & {
border-color: transparent;
margin-left: 0;
transition: none;
}

2
src/components/Nav/ProfilePopup.tsx
View File

@ -15,7 +15,7 @@ export const ProfilePopup = (props: ProfilePopupProps) => {
<Popup {...props} horizontalAnchor="right">
<ul class="nodash">
<li>
<a href={`/${session().user?.slug}`}>Профиль</a>
<a href={`/author/${session().user?.slug}`}>Профиль</a>
</li>
<li>
<a href="#">Черновики</a>

9
src/components/Pages/ConnectPage.tsx
View File

@ -5,10 +5,11 @@ export const ConnectPage = () => {
<PageWrap>
<article class="container container--static-page">
<div class="row">
<h1 class="col-md-8 offset-md-2">
<span class="wrapped">Предложить идею</span>
</h1>
<div class="col-md-8 col-lg-6 offset-md-3">
<div class="col-sm-10 col-md-8 col-lg-7 col-xl-6 shift-content">
<h1>
<span class="wrapped">Предложить идею</span>
</h1>
<p>
Хотите что-то предложить, обсудить или посоветовать? Поделиться темой или идеей? Напишите нам
скорее! Если укажете свою почту, мы&nbsp;обязательно ответим.

2
src/components/Topic/Card.tsx
View File

@ -50,7 +50,7 @@ export const TopicCard = (props: TopicProps) => {
[styles.topicInRow]: props.isTopicInRow
}}
>
<div classList={{ 'col-md-9 col-lg-7': !props.compact && !props.subscribeButtonBottom }}>
<div classList={{ 'col-md-9 col-lg-7 col-xl-6': !props.compact && !props.subscribeButtonBottom }}>
<Show when={props.topic.title}>
<h3 class={styles.topicTitle}>
<a href={`/topic/${props.topic.slug}`}>{capitalize(props.topic.title || '')}</a>

66
src/components/Views/AllAuthors.tsx
View File

@ -64,13 +64,10 @@ export const AllAuthorsView = (props: Props) => {
<Show when={sortedAuthors().length > 0}>
<div class="shift-content">
<div class="row">
<div class={clsx(styles.pageHeader, 'col-lg-10 col-xl-8')}>
<div class={clsx(styles.pageHeader, 'col-lg-10 col-xl-9')}>
<h1>{t('Authors')}</h1>
<p>{t('Subscribe who you like to tune your personal feed')}</p>
</div>
</div>
<div class="row">
<div class="col-lg-10 col-xl-8">
<ul class={clsx(styles.viewSwitcher, 'view-switcher')}>
<li classList={{ selected: searchParams().by === 'shouts' }}>
<a href="/authors?by=shouts" onClick={handleClientRouteLinkClick}>
@ -94,10 +91,15 @@ export const AllAuthorsView = (props: Props) => {
</a>
</li>
</ul>
<Show
when={!searchParams().by || searchParams().by === 'name'}
fallback={() => (
<div class={styles.stats}>
</div>
</div>
<Show
when={!searchParams().by || searchParams().by === 'name'}
fallback={() => (
<div class={styles.stats}>
<div class="row">
<div class="col-lg-10 col-xl-9">
<For each={sortedAuthors().slice(0, limit())}>
{(author) => (
<AuthorCard
@ -110,25 +112,31 @@ export const AllAuthorsView = (props: Props) => {
/>
)}
</For>
<Show when={sortedAuthors().length > limit()}>
<div class={styles.loadMoreContainer}>
<button class={clsx('button', styles.loadMoreButton)} onClick={showMore}>
{t('More')}
</button>
</div>
</Show>
</div>
)}
>
<For each={sortedKeys()}>
{(letter) => (
<div class={clsx(styles.group, 'group')}>
<h2>{letter}</h2>
<div class="container">
</div>
<Show when={sortedAuthors().length > limit()}>
<div class="row">
<div class={clsx(styles.loadMoreContainer, 'col-12 col-md-10')}>
<button class={clsx('button', styles.loadMoreButton)} onClick={showMore}>
{t('More')}
</button>
</div>
</div>
</Show>
</div>
)}
>
<For each={sortedKeys()}>
{(letter) => (
<div class={clsx(styles.group, 'group')}>
<h2>{letter}</h2>
<div class="container">
<div class="row">
<div class="col-lg-10">
<div class="row">
<For each={byLetter()[letter]}>
{(author: Author) => (
<div class={clsx(styles.topic, 'topic col-sm-6 col-md-3')}>
<div class={clsx(styles.topic, 'topic col-sm-6 col-md-4')}>
<div class="topic-title">
<a href={`/author/${author.slug}`}>{author.name}</a>
</div>
@ -138,11 +146,11 @@ export const AllAuthorsView = (props: Props) => {
</div>
</div>
</div>
)}
</For>
</Show>
</div>
</div>
</div>
</div>
)}
</For>
</Show>
</div>
</Show>
</div>

42
src/components/Views/AllTopics.tsx
View File

@ -63,15 +63,11 @@ export const AllTopicsView = (props: AllTopicsViewProps) => {
<Show when={sortedTopics().length > 0}>
<div class="shift-content">
<div class="row">
<div class={clsx(styles.pageHeader, 'col-lg-9')}>
<div class={clsx(styles.pageHeader, 'col-lg-10 col-xl-9')}>
<h1>{t('Topics')}</h1>
<div class="col-lg-10">
<p>{t('Subscribe what you like to tune your personal feed')}</p>
</div>
</div>
<p>{t('Subscribe what you like to tune your personal feed')}</p>
<div class="col-12">
<ul class={clsx(styles.viewSwitcher, 'view-switcher col-lg-10')}>
<ul class={clsx(styles.viewSwitcher, 'view-switcher')}>
<li classList={{ selected: searchParams().by === 'shouts' || !searchParams().by }}>
<a href="/topics?by=shouts" onClick={handleClientRouteLinkClick}>
{t('By shouts')}
@ -114,10 +110,12 @@ export const AllTopicsView = (props: AllTopicsViewProps) => {
)}
</For>
<Show when={sortedTopics().length > limit()}>
<div class={styles.loadMoreContainer}>
<button class={clsx('button', styles.loadMoreButton)} onClick={showMore}>
{t('More')}
</button>
<div class="row">
<div class={clsx(styles.loadMoreContainer, 'col-12 col-md-10')}>
<button class={clsx('button', styles.loadMoreButton)} onClick={showMore}>
{t('More')}
</button>
</div>
</div>
</Show>
</>
@ -129,15 +127,19 @@ export const AllTopicsView = (props: AllTopicsViewProps) => {
<h2>{letter}</h2>
<div class="container">
<div class="row">
<For each={byLetter()[letter]}>
{(topic) => (
<div class={clsx(styles.topic, 'topic col-sm-6 col-md-3')}>
<div class="topic-title">
<a href={`/topic/${topic.slug}`}>{topic.title}</a>
</div>
</div>
)}
</For>
<div class="col-lg-10">
<div class="row">
<For each={byLetter()[letter]}>
{(topic) => (
<div class={clsx(styles.topic, 'topic col-sm-6 col-md-4')}>
<div class="topic-title">
<a href={`/topic/${topic.slug}`}>{topic.title}</a>
</div>
</div>
)}
</For>
</div>
</div>
</div>
</div>
</div>

11
src/styles/AllTopics.module.scss
View File

@ -17,9 +17,7 @@
}
.topic {
@include media-breakpoint-down(md) {
margin-top: 1.6rem;
}
margin-bottom: 1.6rem;
@include media-breakpoint-down(sm) {
margin-left: 2.6rem;
@ -41,6 +39,11 @@
text-align: center;
.loadMoreButton {
padding: 0.6em 1.5em;
padding: 0.6em 5em;
width: 100%;
@include media-breakpoint-up(sm) {
width: auto;
}
}
}

12
src/styles/app.scss
View File

@ -471,15 +471,9 @@ figcaption {
flex-wrap: wrap;
font-weight: bold;
list-style: none;
margin: 2.4rem 0 0;
margin: 3.6rem 0 0;
padding: 0;
.all-topics-page & {
@include media-breakpoint-down(sm) {
margin-left: 1.3rem;
}
}
li {
display: inline-block;
margin-right: 1em;
@ -628,12 +622,10 @@ figcaption {
padding-left: divide($container-padding-x, 2);
padding-right: divide($container-padding-x, 2);
/*
.row {
> .row {
margin-left: divide(-$container-padding-x, 2);
margin-right: divide(-$container-padding-x, 2);
}
*/
}
}