Skip to content

Commit ef7c078

Browse files
Alexanderer159Alexanderer159
committed
arreglos
1 parent fc7f301 commit ef7c078

File tree

2 files changed

+25
-19
lines changed

2 files changed

+25
-19
lines changed

‎src/js/components/Calendario.jsx‎

Lines changed: 24 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -3,27 +3,27 @@ const Calendar = () => {
33
<>
44
<div className="All vh-100 container-fluid vh-100 m-auto col-12 col-md-4 d-flex flex-column">
55
<div className="calendar h-10 d-flex flex-row align-items-center justify-content-center gap-3 my-4">
6-
<div className="calendarday rounded-5 shadow-lg border-0 bg-light text-center justify-content-center w-25 p-1 bg-opacity-50">
6+
<div className="calendarday rounded-5 shadow border-0 bg-light text-center justify-content-center w-25 p-1 bg-opacity-50">
77
<p className="fs-4 m-0 p-0 d-flex justify-content-center align-items-center">Mon</p>
88
<p className="fs-4 m-0 p-0 d-flex justify-content-center align-items-center">20</p>
99
<a>❌</a>
1010
</div>
11-
<div className="calendarday rounded-5 shadow-lg border-0 bg-light text-center justify-content-center w-25 p-1 bg-opacity-50">
11+
<div className="calendarday rounded-5 shadow border-0 bg-light text-center justify-content-center w-25 p-1 bg-opacity-50">
1212
<p className="fs-4 m-0 p-0 d-flex justify-content-center align-items-center">Tue</p>
1313
<p className="fs-4 m-0 p-0 d-flex justify-content-center align-items-center">21</p>
1414
<a>❌</a>
1515
</div>
16-
<div className="calendarday rounded-5 shadow-lg border-0 bg-light text-center justify-content-center w-25 p-1">
16+
<div className="calendarday rounded-5 shadow border-0 bg-light text-center justify-content-center w-25 p-1">
1717
<p className="fs-4 m-0 p-0 d-flex justify-content-center align-items-center">Wed</p>
1818
<p className="fs-4 m-0 p-0 d-flex justify-content-center align-items-center">22</p>
1919
<a>❌</a>
2020
</div>
21-
<div className="calendarday rounded-5 shadow-lg border-0 bg-light text-center justify-content-center w-25 p-1 bg-opacity-50">
21+
<div className="calendarday rounded-5 shadow border-0 bg-light text-center justify-content-center w-25 p-1 bg-opacity-50">
2222
<p className="fs-4 m-0 p-0 d-flex justify-content-center align-items-center">Thu</p>
2323
<p className="fs-4 m-0 p-0 d-flex justify-content-center align-items-center">23</p>
2424
<a>✔️</a>
2525
</div>
26-
<div className="calendarday rounded-5 shadow-lg border-0 bg-light text-center justify-content-center w-25 p-1 bg-opacity-50">
26+
<div className="calendarday rounded-5 shadow border-0 bg-light text-center justify-content-center w-25 p-1 bg-opacity-50">
2727
<p className="fs-4 m-0 p-0 d-flex justify-content-center align-items-center">Fri</p>
2828
<p className="fs-4 m-0 p-0 d-flex justify-content-center align-items-center">24</p>
2929
<a>✔️</a>
@@ -35,13 +35,17 @@ const Calendar = () => {
3535
<div className="location-top m-2 h-30 w-100 d-flex flex-row align-items-center justify-content-center">
3636

3737
<div className="location-top-left shadow p-2 px-3 m-2 h-100 w-75 rounded-5 d-flex flex-row align-items-center justify-content-center">
38-
<div className="car-left shadow m-2 h-100 w-25 rounded-circle d-flex align-items-center justify-content-center fs-4">🚘</div>
39-
<div className="car-middle shadow m-2 p-0 h-100 w-50 rounded-5 d-flex align-items-center justify-content-center">56 min</div>
40-
<div className="car-right shadow p-0 m-2 mx-3 h-100 w-25 rounded-circle d-flex align-items-center justify-content-center">⚫</div>
38+
<div className="car-left shadow h-100 w-25 rounded-circle d-flex align-items-center justify-content-center fs-3">📍</div>
39+
40+
<div className="car-middle shadow m-3 h-100 w-50 rounded-5 d-flex align-items-center justify-content-center fs-5">56 min</div>
41+
42+
<div className="car-right shadow m-3 h-100 w-25 rounded-circle d-flex align-items-center justify-content-center">⚫</div>
4143
</div>
4244

4345
<div className="location-top-right shadow m-2 h-100 w-50 rounded-5 d-flex flex-row align-items-center justify-content-center p-1">
44-
<div className="weather-left m-1 h-100 w-50 rounded-circle d-flex align-items-center justify-content-center fs-2">⛅</div>
46+
47+
<div className="weather-left m-3 h-100 w-50 rounded-circle d-flex align-items-center justify-content-center fs-1">⛅</div>
48+
4549
<div className="weather-right m-4 w-50 d-flex flex-column justify-content-center align-items-start p-2">
4650
<div className="fs-5 d-flex align-items-start"><strong>48° F</strong></div>
4751
<div className="d-flex align-items-start">Cloudy</div>
@@ -54,21 +58,23 @@ const Calendar = () => {
5458
<div className="location-bottom-left h-100 w-50 rounded-5 d-flex flex-column align-items-center justify-content-center">
5559

5660
<div className="location-bottom-left-1 my-1 h-100 w-75 rounded-5 d-flex flex-row align-items-center justify-content-center">
57-
<button type="button" className="btn btn-light w-100 shadow d-flex flex-row rounded-5 p-0 border-0">
58-
<div className="icon my-2 h-100 w-25 rounded-5 d-flex justify-content-end align-items-center">💊</div>
59-
<div className="pill m-2 my-2 h-100 w-75 d-flex justify-content-start align-items-center">Atenolol</div>
61+
<button type="button" className="btn btn-light btn-lg w-100 shadow d-flex flex-row rounded-5 p-1 border-0">
62+
<div className="icon m-2 h-100 w-25 rounded-5 d-flex justify-content-end align-items-center">💊</div>
63+
<div className="pill m-2 h-100 w-75 d-flex justify-content-start align-items-center">Atenolol</div>
6064
</button>
6165
</div>
66+
6267
<div className="location-bottom-left-2 my-1 h-100 w-75 rounded-5 d-flex flex-row align-items-center justify-content-center">
63-
<button type="button" className="btn btn-light w-100 shadow d-flex flex-row rounded-5 p-0 border-0">
64-
<div className="icon my-2 h-100 w-25 rounded-5 d-flex justify-content-end align-items-center">X</div>
65-
<div className="pill m-2 my-2 h-100 w-75 d-flex justify-content-start align-items-center">Lisinopril</div>
68+
<button type="button" className="btn btn-light btn-lg w-100 shadow d-flex flex-row rounded-5 p-1 border-0">
69+
<div className="icon m-2 h-100 w-25 rounded-5 d-flex justify-content-end align-items-center">💊</div>
70+
<div className="pill m-2 h-100 w-75 d-flex justify-content-start align-items-center">Lisinopril</div>
6671
</button>
6772
</div>
73+
6874
<div className="location-bottom-left-3 my-1 h-100 w-75 rounded-5 d-flex flex-row align-items-center justify-content-center">
69-
<button type="button" className="btn btn-light w-100 shadow d-flex flex-row rounded-5 p-0 border-0">
70-
<div className="icon my-2 h-100 w-25 rounded-circle d-flex justify-content-end align-items-center">💊</div>
71-
<div className="pill m-2 my-2 h-100 w-75 d-flex justify-content-start align-items-center">Astorvastatin</div>
75+
<button type="button" className="btn btn-light btn-lg w-100 shadow d-flex flex-row rounded-5 p-1 border-0">
76+
<div className="icon m-2 h-100 w-25 rounded-circle d-flex justify-content-end align-items-center">💊</div>
77+
<div className="pill m-2 h-100 w-75 d-flex justify-content-start align-items-center">Astorvastatin</div>
7278
</button>
7379
</div>
7480
</div>

‎src/styles/calendar.css‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@
2424
}
2525

2626
.location-top-right {
27-
background-color: rgba(128, 128, 128, 0.4);
27+
background-color: rgba(128, 128, 128, 0.3);
2828

2929
}
3030

0 commit comments

Comments
 (0)