Create page (#106)

This commit is contained in:
Ilya Y 2023-05-31 15:23:18 +03:00 committed by GitHub
parent a6f58702d9
commit 659abb5e21
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
10 changed files with 132 additions and 12 deletions

View File

@ -0,0 +1,8 @@
<svg width="42" height="55" viewBox="0 0 42 55" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M0.200195 0.799805V9.9934V54.8798H41.2609V0.799805H8.41234H0.200195ZM34.5544 48.255H7.04365V15.6718V7.5598H15.3927H34.6912V48.255H34.5544Z" fill="black"/>
<path d="M30.98 15.1636H10.4604V17.2155H30.98V15.1636Z" fill="black"/>
<path d="M30.98 25.4233H10.4604V27.4753H30.98V25.4233Z" fill="black"/>
<path d="M27.902 30.5532H10.4604V32.6052H27.902V30.5532Z" fill="black"/>
<path d="M21.7462 35.6831H10.4604V37.7351H21.7462V35.6831Z" fill="black"/>
<path d="M24.8241 20.2935H10.4604V22.3454H24.8241V20.2935Z" fill="black"/>
</svg>

After

Width:  |  Height:  |  Size: 632 B

View File

@ -0,0 +1,3 @@
<svg width="38" height="55" viewBox="0 0 38 55" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M13.0231 5.86268L31.9809 12.4024V51.0431H37.6542V8.9669L13.7299 0.799805L0.850098 5.20885V46.213L23.6574 54.7998H27.0727V14.3958L7.43485 7.59621L13.0231 5.86268Z" fill="black"/>
</svg>

After

Width:  |  Height:  |  Size: 290 B

View File

@ -0,0 +1,5 @@
<svg width="54" height="47" viewBox="0 0 54 47" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M43.2452 0.799805H0.299805V35.7677H43.2452V0.799805Z" fill="black"/>
<path d="M48.0955 8.86944H53.9798V46.5272H8.35031V40.6303H48.0955V8.86944Z" fill="black"/>
<rect x="6.26416" y="6.76416" width="30.8163" height="22.8637" fill="white"/>
</svg>

After

Width:  |  Height:  |  Size: 350 B

View File

@ -0,0 +1,3 @@
<svg width="47" height="47" viewBox="0 0 47 47" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M39.8531 25.8606L39.8156 9.44197L18.3041 12.8079C18.2899 27.8483 18.2827 36.3973 18.2827 38.4549L18.2623 38.429C17.9505 42.9261 14.1092 46.4798 9.41627 46.4798C4.51946 46.4798 0.549805 42.6106 0.549805 37.8376C0.549805 33.0647 4.51946 29.1955 9.41627 29.1955C10.2965 29.1955 11.1469 29.3205 11.9495 29.5534V6.35548L46.1488 0.799805C46.2568 23.1532 46.2568 34.4703 46.1488 34.7512L46.1282 34.7269C45.8156 39.2232 41.9746 42.776 37.2823 42.776C32.3855 42.776 28.4158 38.9068 28.4158 34.1339C28.4158 29.3609 32.3855 25.4917 37.2823 25.4917C38.1763 25.4917 39.0394 25.6207 39.8531 25.8606Z" fill="black"/>
</svg>

After

Width:  |  Height:  |  Size: 714 B

View File

@ -0,0 +1,3 @@
<svg width="64" height="38" viewBox="0 0 64 38" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M46.5455 0.600098H0V37.8538H46.5455V27.3762L64 34.3613V4.09263L46.5455 11.0777V0.600098ZM40.7273 32.0329H5.81818V6.42099H40.7273V32.0329ZM58.1818 12.2419V26.212L46.5455 21.5553V16.8986L58.1818 12.2419Z" fill="black"/>
</svg>

After

Width:  |  Height:  |  Size: 330 B

View File

@ -22,6 +22,7 @@
"Author": "Author",
"Authors": "Authors",
"Autotypograph": "Autotypograph",
"Back": "Back",
"Back to main page": "Back to main page",
"Become an author": "Become an author",
"Bold": "Bold",
@ -42,6 +43,7 @@
"By views": "By views",
"Characters": "Знаков",
"Chat Title": "Chat Title",
"Choose a post type": "Choose a post type",
"Choose a title image for the article. You can immediately see how the publication card will look like.": "Choose a title image for the article. You can immediately see how the publication card will look like.",
"Choose who you want to write to": "Choose who you want to write to",
"Collaborate": "Help Edit",
@ -276,6 +278,7 @@
"actions": "actions",
"add link": "add link",
"all topics": "all topics",
"article": "article",
"author": "author",
"authors": "authors",
"back to menu": "back to menu",
@ -297,9 +300,12 @@
"header 1": "header 1",
"header 2": "header 2",
"header 3": "header 3",
"images": "images",
"invalid password": "invalid password",
"italic": "italic",
"literature": "literature",
"marker list": "marker list",
"music": "music",
"my feed": "my ribbon",
"notifications": "notifications",
"number list": "number list",
@ -313,6 +319,7 @@
"terms of use": "terms of use",
"topics": "topics",
"user already exist": "user already exists",
"video": "video",
"view": "view",
"zine": "zine"
}

View File

@ -24,6 +24,7 @@
"Author": "Автор",
"Authors": "Авторы",
"Autotypograph": "Автотипограф",
"Back": "Назад",
"Back to main page": "Вернуться на главную",
"Become an author": "Стать автором",
"Bold": "Жирный",
@ -44,6 +45,7 @@
"By views": "По просмотрам",
"Characters": "Знаков",
"Chat Title": "Тема дискурса",
"Choose a post type": "Выберите тип публикации",
"Choose a title image for the article. You can immediately see how the publication card will look like.": "Выберите заглавное изображение для статьи. Тут же сразу можно увидеть как будет выглядеть карточка публикации.",
"Choose who you want to write to": "Выберите кому хотите написать",
"Collaborate": "Помочь редактировать",
@ -291,6 +293,7 @@
"actions": "действия",
"add link": "добавить ссылку",
"all topics": "все темы",
"article": "статья",
"author": "автор",
"authors": "авторы",
"back to menu": "назад в меню",
@ -315,9 +318,12 @@
"header 1": "заголовок 1",
"header 2": "заголовок 2",
"header 3": "заголовок 3",
"images": "изображения",
"invalid password": "некорректный пароль",
"italic": "курсив",
"literature": "литература",
"marker list": "маркир. список",
"music": "музыка",
"my feed": "моя лента",
"notifications": "уведомления",
"number list": "нумер. список",
@ -335,6 +341,7 @@
"terms of use": "правилами пользования сайтом",
"topics": "темы",
"user already exist": "пользователь уже существует",
"video": "видео",
"view": "просмотр",
"zine": "журнал"
}

View File

@ -49,9 +49,7 @@ export const HeaderAuth = (props: HeaderAuthProps) => {
toggleWarnings()
}
const isEditorPage = createMemo(
() => page().route === 'create' || page().route === 'edit' || page().route === 'editSettings'
)
const isEditorPage = createMemo(() => page().route === 'edit' || page().route === 'editSettings')
const showNotifications = createMemo(() => isAuthenticated() && !isEditorPage())
const showSaveButton = createMemo(() => isAuthenticated() && isEditorPage())

View File

@ -1,19 +1,58 @@
import { PageLayout } from '../components/_shared/PageLayout'
import { Loading } from '../components/_shared/Loading'
import { onMount } from 'solid-js'
import { useLocalize } from '../context/localize'
import { Button } from '../components/_shared/Button'
import { Icon } from '../components/_shared/Icon'
import { clsx } from 'clsx'
import styles from '../styles/Create.module.scss'
import { apiClient } from '../utils/apiClient'
import { router } from '../stores/router'
import { redirectPage } from '@nanostores/router'
import { router } from '../stores/router'
const handleCreateArticle = async () => {
const shout = await apiClient.createArticle({ article: {} })
redirectPage(router, 'edit', { shoutId: shout.id.toString() })
}
export const CreatePage = () => {
onMount(async () => {
const shout = await apiClient.createArticle({ article: {} })
redirectPage(router, 'edit', { shoutId: shout.id.toString() })
})
const { t } = useLocalize()
return (
<PageLayout>
<Loading />
<article class={clsx('wide-container', 'container--static-page', styles.Create)}>
<h1>{t('Choose a post type')}</h1>
<ul class={clsx('nodash', styles.list)}>
<li>
<div class={styles.link} onClick={handleCreateArticle}>
<Icon name="create-article" class={styles.icon} />
<div>{t('article')}</div>
</div>
</li>
<li>
<a href="#">
<Icon name="create-books" class={styles.icon} />
<div>{t('literature')}</div>
</a>
</li>
<li>
<a href="#">
<Icon name="create-images" class={styles.icon} />
<div>{t('images')}</div>
</a>
</li>
<li>
<a href="#">
<Icon name="create-music" class={styles.icon} />
<div>{t('music')}</div>
</a>
</li>
<li>
<a href="#">
<Icon name="create-video" class={styles.icon} />
<div>{t('music')}</div>
</a>
</li>
</ul>
<Button value={t('Back')} onClick={() => window.history.back()} />
</article>
</PageLayout>
)
}

View File

@ -0,0 +1,47 @@
.Create {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
min-height: 50vh;
.list {
display: flex;
align-items: center;
justify-content: space-around;
gap: 24px;
li {
a,
.link {
cursor: pointer;
text-align: center;
padding: 16px;
justify-content: center;
display: flex;
flex-direction: column;
font-weight: bold;
text-decoration: none;
border: none;
&:hover {
background: var(--link-hover-background);
color: var(--link-hover-color);
.icon {
filter: invert(1);
}
}
}
}
.icon {
margin: auto 21px auto;
img {
height: 54px;
max-width: 64px;
}
}
}
}