This repository has been archived by the owner on Nov 29, 2023. It is now read-only.
generated from atls-academy/template
-
Notifications
You must be signed in to change notification settings - Fork 0
feat/landing-second-step #11
Merged
Merged
Changes from 56 commits
Commits
Show all changes
60 commits
Select commit
Hold shift + click to select a range
88c7145
feat: add ui/button
Mirved64 16c656c
feat: add divider to navigation items
Mirved64 17508ea
feat: add button to navigation section
Mirved64 34e498f
feat: add buttons to hero section
Mirved64 a748013
feat: add buttons to courses section, add cards component, info compo…
Mirved64 280c85c
fix: fix imposition in process section
Mirved64 c965f82
feat: add borders to theme, add borders to slider section
Mirved64 043de1b
feat: add button to faq section
Mirved64 1c1251b
feat: add buttons to slider section
Mirved64 4f8cea9
fix: remove display props in card-small component
Mirved64 dd39936
fix: rename card-small and card-big components, fix markup in courses…
Mirved64 a6ad0b1
fix: check markup
Mirved64 fd8da08
fix: change @ui/button files, change buttons in sections
Mirved64 747b074
fix: remove links from hero section
Mirved64 4268789
fix: remove margin 0 auto from courses section
Mirved64 00d5f65
fix: remove card-letning-material and cards-lerning-and-courses, add …
Mirved64 9080f00
fix: remove card factory, add Ui/card
Mirved64 8c936d9
fix: change some depencies in yarnrc
Mirved64 840ac39
fix: change structure of ui/card directory
Mirved64 0ea3387
fix: check fonts
Mirved64 9ddd98c
fix: resolve error in tsconfig.json
Mirved64 583b5be
fix: rework ui/card, add custom card in landing courses, add cards in…
Mirved64 a4470c2
refactor: add condition to card.component
Mirved64 069f313
refactor: wrap card in NextLink in ui/card, remove backdrop
Mirved64 b2c5e07
fix: resolve error in tsconfig
Mirved64 f56800c
refactor: check fonts, rename mobail to mobile
Mirved64 cc34043
chore: rename gaps to gapBasis in card
Mirved64 207564f
feat: add ui/swiper
Mirved64 34f8748
refactor: change markup in courses component, card component, add swi…
Mirved64 29ca0c4
refactor: change markup in navigation and courses sections
Mirved64 0adb7f9
feat: wrap socials to nextlink in hero section, check markup
Mirved64 1620211
refactor: remove some flexShrink in about section
Mirved64 15ca889
refactor: check markup in process section
Mirved64 bc5ba44
refactor: check markup in technologies section
Mirved64 87aa57b
refactor: check markup in slider section
Mirved64 bef01b0
refactor: check markup in faq section, remove nextLinks
Mirved64 c709edd
style: use yarn format
Mirved64 83c8614
chore: remove margin 0 auto
Mirved64 44fdc45
chore: change NextLink to Link in hero section
Mirved64 59459f4
chore: add flexShrink to markup
Mirved64 7bb16ac
feat: add @ui/utils, add useWindowWidth hook
Mirved64 338f790
chore: remove display, add condition
Mirved64 ddade8c
reafactor: add isMobile and isDesktop in useWindowWidth hook. check m…
Mirved64 5c68ad2
refactor: separate box and column, check display=none, make responsiv…
Mirved64 6c3bd2c
refactor: rename gap prop, change width=100% to flexGrow in courses s…
Mirved64 38172a8
refactor: change width=100% to flexGrow, remove needless wrapper in …
Mirved64 ff48362
refactor: change width=100% to flexGrow in about, hero, process sections
Mirved64 0252940
refactor: remove needless wrapper, check layout in technology section
Mirved64 4e0151f
refactor: check depencies of swiper
Mirved64 adb01ac
refactor: change ui/card files, check layout in coursess section
Mirved64 24730c4
refactor: rename props in item component in process section
Mirved64 854d9c7
refactor: change layout in navigation section
Mirved64 a5b32a4
fix: resolve warnings in console
Mirved64 eb98255
chore: rename colors in project
Mirved64 7cba243
refactor: make adaptive layout, change space-between to layout
Mirved64 e9cb28e
refactor: change layout in about section
Mirved64 be27855
chore: check version of dependencies in packages
Mirved64 6bd8405
refactor: check some depencies in project
Mirved64 8bd77d2
fix: add width to wrapper of Layout, Divider and Layout elements in I…
Mirved64 cd94a88
refactor: remove needless flexShrink
Mirved64 File filter
Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
There are no files selected for viewing
Large diffs are not rendered by default.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Binary file not shown.
Binary file not shown.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
259 changes: 122 additions & 137 deletions
259
landing/fragments/landing-about/src/about.component.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,148 +1,133 @@ | ||
import React from 'react' | ||
import { FormattedMessage } from 'react-intl' | ||
|
||
import { Condition } from '@ui/condition' | ||
import { Image } from '@ui/image' | ||
import { Box } from '@ui/layout' | ||
import { Row } from '@ui/layout' | ||
import { Layout } from '@ui/layout' | ||
import { Column } from '@ui/layout' | ||
import { Text } from '@ui/text' | ||
import { Space } from '@ui/text' | ||
|
||
export const About = () => ( | ||
<Box backgroundColor='background.about' width='100%' flexDirection='column' margin='0 auto'> | ||
<Layout flexBasis={[64, 160]} flexShrink='0' /> | ||
|
||
<Row> | ||
<Layout flexBasis={[20, 230]} flexShrink='0' /> | ||
|
||
<Column flexBasis={[335, 1460]} flexGrow='1' flexShrink='1'> | ||
<Column display={['none', 'flex']}> | ||
<Box> | ||
<Text | ||
color='text.about.primary' | ||
fontSize='common' | ||
fontWeight='normal' | ||
lineHeight='huge' | ||
> | ||
<FormattedMessage id='aboutTextIntroFirstDesktop' /> | ||
</Text> | ||
</Box> | ||
|
||
<Row> | ||
<Box> | ||
<Text | ||
color='text.about.primary' | ||
fontSize='common' | ||
fontWeight='normal' | ||
lineHeight='huge' | ||
> | ||
<FormattedMessage id='aboutTextIntroSecondDesktop' /> | ||
</Text> | ||
</Box> | ||
|
||
<Space count='6' /> | ||
|
||
<Box width={76} height={52} alignItems='center' justifyContent='center'> | ||
<Image src='./image/Default.png' width={40} height={40} /> | ||
</Box> | ||
|
||
<Space count='6' /> | ||
|
||
<Box> | ||
<Text | ||
color='text.about.primary' | ||
fontSize='common' | ||
fontWeight='normal' | ||
lineHeight='huge' | ||
> | ||
<FormattedMessage id='aboutTextProblemFirstDesktop' /> | ||
</Text> | ||
</Box> | ||
</Row> | ||
|
||
<Row> | ||
<Box> | ||
<Text | ||
color='text.about.primary' | ||
fontSize='common' | ||
fontWeight='normal' | ||
lineHeight='huge' | ||
> | ||
<FormattedMessage id='aboutTextProblemSecondDesktop' /> | ||
</Text> | ||
</Box> | ||
<Space count='14' /> | ||
|
||
<Box width={76} height={52} alignItems='center' justifyContent='center'> | ||
<Image src='./image/Default.png' width={40} height={40} /> | ||
</Box> | ||
</Row> | ||
</Column> | ||
|
||
<Column display={['flex', 'none']}> | ||
<Box> | ||
<Text | ||
color='text.about.primary' | ||
fontSize='small' | ||
fontWeight='normal' | ||
lineHeight='normal' | ||
> | ||
<FormattedMessage id='aboutIntroMobile' /> | ||
</Text> | ||
</Box> | ||
|
||
<Layout flexBasis={28} /> | ||
|
||
<Box> | ||
<Text | ||
color='text.about.primary' | ||
fontSize='small' | ||
fontWeight='normal' | ||
lineHeight='normal' | ||
> | ||
<FormattedMessage id='aboutCentralIdeaMobile' /> | ||
</Text> | ||
</Box> | ||
</Column> | ||
|
||
<Layout flexBasis={[0, 40]} /> | ||
|
||
<Column display={['none', 'flex']}> | ||
<Box> | ||
<Text | ||
color='text.about.primary' | ||
fontSize='common' | ||
fontWeight='normal' | ||
lineHeight='huge' | ||
> | ||
<FormattedMessage id='aboutCentralIdeaFirstDesktop' /> | ||
</Text> | ||
</Box> | ||
|
||
<Row> | ||
<Box> | ||
<Text | ||
color='text.about.primary' | ||
fontSize='common' | ||
fontWeight='normal' | ||
lineHeight='huge' | ||
> | ||
<FormattedMessage id='aboutCentralIdeaSecondDesktop' /> | ||
</Text> | ||
</Box> | ||
<Space count='6' /> | ||
|
||
<Box width={76} height={52} alignItems='center' justifyContent='center'> | ||
<Image src='./image/Default.png' width={40} height={40} /> | ||
</Box> | ||
</Row> | ||
</Column> | ||
import { useWindowWidth } from '@ui/utils' | ||
|
||
export const About = () => { | ||
const { isMobile, isDesktop } = useWindowWidth() | ||
|
||
return ( | ||
<Box backgroundColor='background.grey' justifyContent='center'> | ||
<Column flexGrow='1'> | ||
<Layout flexBasis={[64, 160]} /> | ||
|
||
<Row> | ||
<Layout flexBasis={[20, 230]} /> | ||
|
||
<Column flexBasis={[335, 1460]} flexGrow='1'> | ||
<Condition match={isDesktop}> | ||
<Box display='inline'> | ||
<Text | ||
display='inline' | ||
color='text.white' | ||
fontSize='common' | ||
fontWeight='normal' | ||
lineHeight='huge' | ||
wordWrap='break-word' | ||
> | ||
<FormattedMessage id='aboutTextIntroDesktop' /> | ||
</Text> | ||
|
||
<Space count='6' /> | ||
|
||
<Box | ||
display='inline-flex' | ||
width={76} | ||
height={52} | ||
alignItems='center' | ||
justifyContent='center' | ||
> | ||
<Image src='./image/Default.png' width={40} height={40} /> | ||
</Box> | ||
|
||
<Space count='6' /> | ||
|
||
<Text | ||
display='inline' | ||
color='text.white' | ||
fontSize='common' | ||
fontWeight='normal' | ||
lineHeight='huge' | ||
wordWrap='break-word' | ||
> | ||
<FormattedMessage id='aboutTextProblemDesktop' /> | ||
</Text> | ||
|
||
<Space count='14' /> | ||
|
||
<Box | ||
display='inline-flex' | ||
width={76} | ||
height={52} | ||
alignItems='center' | ||
justifyContent='center' | ||
> | ||
<Image src='./image/Default.png' width={40} height={40} /> | ||
</Box> | ||
</Box> | ||
</Condition> | ||
|
||
<Condition match={isMobile}> | ||
<Column> | ||
<Box> | ||
<Text color='text.white' fontSize='small' fontWeight='normal' lineHeight='normal'> | ||
<FormattedMessage id='aboutIntroMobile' /> | ||
</Text> | ||
</Box> | ||
|
||
<Layout flexBasis={28} /> | ||
|
||
<Box> | ||
<Text color='text.white' fontSize='small' fontWeight='normal' lineHeight='normal'> | ||
<FormattedMessage id='aboutCentralIdeaMobile' /> | ||
</Text> | ||
</Box> | ||
</Column> | ||
</Condition> | ||
|
||
<Layout flexBasis={[0, 40]} /> | ||
|
||
<Condition match={isDesktop}> | ||
<Box display='inline'> | ||
<Text | ||
display='inline' | ||
color='text.white' | ||
fontSize='common' | ||
fontWeight='normal' | ||
lineHeight='huge' | ||
wordWrap='break-word' | ||
> | ||
<FormattedMessage id='aboutCentralIdeaDesktop' /> | ||
</Text> | ||
|
||
<Space count='6' /> | ||
|
||
<Box | ||
display='inline-flex' | ||
width={76} | ||
height={52} | ||
alignItems='center' | ||
justifyContent='center' | ||
> | ||
<Image src='./image/Default.png' width={40} height={40} /> | ||
</Box> | ||
</Box> | ||
</Condition> | ||
</Column> | ||
|
||
<Layout flexBasis={[20, 230]} /> | ||
</Row> | ||
|
||
<Layout flexBasis={[64, 160]} /> | ||
</Column> | ||
|
||
<Layout flexBasis={[20, 230]} /> | ||
</Row> | ||
|
||
<Layout flexBasis={[64, 160]} /> | ||
</Box> | ||
) | ||
</Box> | ||
) | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
This comment was marked as resolved.
Sorry, something went wrong.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@TorinAsakura с каретками критично или можно оставить?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
всегда критично