uetchy/namae
1
0
Fork 0
mirror of https://github.com/uetchy/namae.git synced 2025-03-17 12:30:32 +09:00
Code Issues Releases Activity

fix: cosmetic changes

Browse Source
This commit is contained in:
uetchy 2020-02-05 20:47:03 +09:00
parent 39a27f7205
commit f0c122c485
2 changed files with 12 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
web/src/components/Suggestion.tsx
View File

@ -218,14 +218,14 @@ const Icon = styled(Item)`
border-radius: 4px; border-radius: 4px;
font-size: 1.3rem; font-size: 1.3rem;
user-select: none; user-select: none;
background: #1066ff; background: #5610ff;
transition: background 0.1s ease-out; transition: background 0.1s ease-out;
&:hover { &:hover {
background: #3a79ea; background: #723df3;
} }
&:active { &:active {
background: #669dfd; background: #a17ff5;
} }
`; `;

16
web/src/components/Welcome.tsx
View File

@ -33,7 +33,7 @@ const Welcome: React.FC = () => {
<Header>{t('title')}</Header> <Header>{t('title')}</Header>
<Text>{t('description')}</Text> <Text>{t('description')}</Text>
<ExampleQueries> <ExampleQueries>
<h5>Try with these queries</h5> <h5>Try these queries</h5>
<List> <List>
<ListButton> <ListButton>
<Link to="/s/namae">namae</Link> <Link to="/s/namae">namae</Link>
@ -155,7 +155,7 @@ const Text = styled.p`
const Hero = styled.div``; const Hero = styled.div``;
const ExampleQueries = styled.div` const ExampleQueries = styled.div`
margin: 50px 0 50px; margin: 30px 0 0;
`; `;
const List = styled.div` const List = styled.div`
@ -171,32 +171,34 @@ const List = styled.div`
`; `;
const ColorfulList = styled.div` const ColorfulList = styled.div`
margin-top: 100px;
width: 100%; width: 100%;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
flex-wrap: wrap; flex-wrap: wrap;
justify-content: center; justify-content: center;
font-size: 1rem;
${mobile} { ${mobile} {
flex-direction: column; flex-direction: column;
margin-top: 50px;
padding: 20px;
} }
padding: 20px; padding: 50px 20vw 50px 20vw;
margin-top: 50px;
color: white; color: white;
background-image: linear-gradient(180deg, #a57bf3 0%, #4364e1 100%); background-image: linear-gradient(180deg, #a57bf3 0%, #4364e1 100%);
`; `;
const ListItem = styled.div` const ListItem = styled.div`
margin: 15px; margin: 30px 15px;
display: flex; display: flex;
align-items: center; align-items: center;
font-size: 1.2rem; font-size: 1.5rem;
line-height: 1em; line-height: 1em;
${mobile} { ${mobile} {
margin: 10px 0; margin: 10px 0;
font-size: 1.2rem;
} }
svg { svg {