Skip to content

Commit

Permalink
UI/UX fixes
Browse files Browse the repository at this point in the history
  • Loading branch information
Leo Seguin committed Aug 18, 2023
1 parent 6eab453 commit 9fe8740
Show file tree
Hide file tree
Showing 4 changed files with 34 additions and 24 deletions.
2 changes: 1 addition & 1 deletion app/assets/css/style.css

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

2 changes: 1 addition & 1 deletion app/assets/css/style.css.map

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

14 changes: 12 additions & 2 deletions app/assets/sass/style.scss
Original file line number Diff line number Diff line change
Expand Up @@ -227,6 +227,10 @@ header {
overflow: hidden;
overflow-x: auto;
padding: 5px;

span {
vertical-align: middle;
}
}

.carte {
Expand Down Expand Up @@ -282,7 +286,7 @@ header {
}

.forecasts-part .column {
min-width: 85px;
min-width: 80px;
}

.rain-jauge {
Expand All @@ -304,7 +308,9 @@ header {
}
}

.jauge-labels, .images-chart1, .images-chart2 {
.jauge-labels,
.images-chart1,
.images-chart2 {
display: flex;
justify-content: space-between;
margin: 5px .8rem 0;
Expand All @@ -331,6 +337,10 @@ header {
}
}

.temp-min-max {
font-size: .8rem;
}

#error-notification {
position: fixed;
top: 1rem;
Expand Down
40 changes: 20 additions & 20 deletions app/page.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -802,91 +802,91 @@ export default function Home() {
<div className="column">
<p>{jours[0]}</p>
<Image src={imgJours[0]} alt="" width={48} height={45} />
<div className="temp">
<div className="temp-min-max">
<span>
{tempMinJours[0]}
/
{tempMaxJours[0]}
</span>
</div>
<div className="temp">
<div>
<BsFillDropletFill />
{precipitationJours[0]}
<span>{precipitationJours[0]}</span>
</div>
</div>
<div className="column">
<p>{jours[1]}</p>
<Image src={imgJours[1]} alt="" width={48} height={45} />
<div className="temp">
<div className="temp-min-max">
<span>
{tempMinJours[1]}
/
{tempMaxJours[1]}
</span>
</div>
<div className="temp">
<div>
<BsFillDropletFill />
{precipitationJours[1]}
<span>{precipitationJours[1]}</span>
</div>
</div>
<div className="column">
<p>{jours[2]}</p>
<Image src={imgJours[2]} alt="" width={48} height={45} />
<div className="temp">
<div className="temp-min-max">
<span>
{tempMinJours[2]}
/
{tempMaxJours[2]}
</span>
</div>
<div className="temp">
<div>
<BsFillDropletFill />
{precipitationJours[2]}
<span>{precipitationJours[2]}</span>
</div>
</div>
<div className="column">
<p>{jours[3]}</p>
<Image src={imgJours[3]} alt="" width={48} height={45} />
<div className="temp">
<div className="temp-min-max">
<span>
{tempMinJours[3]}
/
{tempMaxJours[3]}
</span>
</div>
<div className="temp">
<div>
<BsFillDropletFill />
{precipitationJours[3]}
<span>{precipitationJours[3]}</span>
</div>
</div>
<div className="column">
<p>{jours[4]}</p>
<Image src={imgJours[4]} alt="" width={48} height={45} />
<div className="temp">
<div className="temp-min-max">
<span>
{tempMinJours[4]}
/
{tempMaxJours[4]}
</span>
</div>
<div className="temp">
<div>
<BsFillDropletFill />
{precipitationJours[4]}
<span>{precipitationJours[4]}</span>
</div>
</div>
<div className="column">
<p>{jours[5]}</p>
<Image src={imgJours[5]} alt="" width={48} height={45} />
<div className="temp">
<div className="temp-min-max">
<span>
{tempMinJours[5]}
/
{tempMaxJours[5]}
</span>
</div>
<div className="temp">
<div>
<BsFillDropletFill />
{precipitationJours[5]}
<span>{precipitationJours[5]}</span>
</div>
</div>
</div>
Expand Down Expand Up @@ -928,11 +928,11 @@ export default function Home() {
{' '}
{latitudeVille}
</p>
<footer>
<p>
Màj app :
{' '}
<a href="https://github.com/PouletEnSlip/Meteo" target="_blank" rel="noreferrer" aria-label="Vers GitHub">18/08/2023</a>
</footer>
</p>
</div>
</details>
</section>
Expand Down

1 comment on commit 9fe8740

@vercel
Copy link

@vercel vercel bot commented on 9fe8740 Aug 18, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Successfully deployed to the following URLs:

meteo – ./

meteo-leoseguin.vercel.app
meteo-git-main-leoseguin.vercel.app

Please sign in to comment.