hazemKrimi/react-weather-app
1
0
Fork 0
mirror of https://github.com/hazemKrimi/react-weather-app.git synced 2026-05-01 18:30:25 +00:00
Code Issues Packages Projects Releases Wiki Activity

Fix main card styles

Browse Source
This commit is contained in:
Hazem Krimi
2022-05-08 15:54:54 +01:00
parent ec34936e9c
commit dc2f2f75da
2 changed files with 70 additions and 66 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/pages/Home/styles.ts
+35 -33
View File
@@ -1,43 +1,45 @@
import styled from 'styled-components'; import styled from 'styled-components';
export const Wrapper = styled.div` export const Wrapper = styled.div`
min-height: 85vh; min-height: 85vh;
padding: 2rem 0rem; padding: 2rem 0rem;
display: grid; display: grid;
row-gap: 3rem; row-gap: 3rem;
h2 { h2 {
text-align: center; text-align: center;
} }
.main, .main,
.wind, .wind,
.humidity { .humidity {
display: grid; display: flex;
justify-content: center; flex-direction: column;
} align-items: center;
align-content: center;
}
.carousel-arrow { .carousel-arrow {
background: none; background: none;
border: none; border: none;
align-self: center; align-self: center;
cursor: pointer; cursor: pointer;
padding: 0 !important; padding: 0 !important;
img { img {
width: 48px; width: 48px;
height: 48px; height: 48px;
} }
} }
.error { .error {
display: grid; display: grid;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
h2 { h2 {
text-align: center; text-align: center;
word-break: break-word; word-break: break-word;
} }
} }
`; `;
src/pages/Search/styles.ts
+35 -33
View File
@@ -1,43 +1,45 @@
import styled from 'styled-components'; import styled from 'styled-components';
export const Wrapper = styled.div` export const Wrapper = styled.div`
min-height: 85vh; min-height: 85vh;
padding: 2rem 0rem; padding: 2rem 0rem;
display: grid; display: grid;
row-gap: 3rem; row-gap: 3rem;
h2 { h2 {
text-align: center; text-align: center;
} }
.main, .main,
.wind, .wind,
.humidity { .humidity {
display: grid; display: flex;
justify-content: center; flex-direction: column;
} align-items: center;
align-content: center;
}
.carousel-arrow { .carousel-arrow {
background: none; background: none;
border: none; border: none;
align-self: center; align-self: center;
cursor: pointer; cursor: pointer;
padding: 0 !important; padding: 0 !important;
img { img {
width: 48px; width: 48px;
height: 48px; height: 48px;
} }
} }
.error { .error {
display: grid; display: grid;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
h2 { h2 {
text-align: center; text-align: center;
word-break: break-word; word-break: break-word;
} }
} }
`; `;