Skip to content

Commit

Permalink
feat: relocate ErrorCode component from web
Browse files Browse the repository at this point in the history
  • Loading branch information
Uzhastin-Nikita authored and the-homeless-god committed Jun 5, 2022
1 parent 4be092a commit a4cff2a
Show file tree
Hide file tree
Showing 3 changed files with 96 additions and 0 deletions.
62 changes: 62 additions & 0 deletions src/components/molecules/ErrorCode/ErrorCode.styles.module.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,62 @@
@import '@digitable-team/web-ui-components/src/scss/variables';

.error {
width: 100%;
height: auto;
margin-top: 200px;
}

.error,
.box {
display: flex;
justify-content: center;
align-items: center;
flex-wrap: wrap;
}

.box {
width: 1070px;
margin-top: 92px;
}

.numeric {
font-size: 400px;
font-weight: 500;
line-height: 484px;
letter-spacing: 0;
color: $color-base;
}

.text {
width: 100%;
height: 170px;
font-size: 70px;
font-weight: 700;
text-align: center;
margin: 0;
}

.highlight-text {
color: $color-base;
}

.button {
display: flex;
align-items: center;
justify-content: center;
height: 59px;
width: 365px;
border-radius: 36px;
margin: 50px;
border: 1px solid $color-base;
background: transparent;
color: $color-base;
outline: none;
font-size: 30px;
text-decoration: none;

&:hover {
color: $color-background-black;
background-color: $color-base;
}
}
33 changes: 33 additions & 0 deletions src/components/molecules/ErrorCode/ErrorCode.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,33 @@
import React from 'react'

import cx from 'classnames'
import { Link } from 'react-router-dom'

import { Image } from 'src/components/atoms/Image'

import css from './ErrorCode.styles.module.scss'

export type ErrorCodeProps = {
imageUrl?: string
leftNumber?: number
rightNumber?: number
simpleText?: string
highlightText?: string
}

export const ErrorCode = ({ imageUrl, leftNumber, rightNumber, simpleText, highlightText }: ErrorCodeProps) => {
return (
<div className={css.error}>
<span className={css.numeric}>{leftNumber}</span>
<Image src={imageUrl} width="568" height="568" />
<span className={css.numeric}>{rightNumber}</span>
<div className={css.box}>
<span className={css.text}>{simpleText}</span>
<span className={cx(css.text, css.highlightText)}> {highlightText}</span>
<Link to="/" className={css.button}>
На главную
</Link>
</div>
</div>
)
}
1 change: 1 addition & 0 deletions src/components/molecules/ErrorCode/index.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
export * from './ErrorCode'

0 comments on commit a4cff2a

Please sign in to comment.