Skip to content

Commit 37337eb

Browse files
sosahcarlossosahcarlos
committed
Fix addons css
1 parent 9ef5232 commit 37337eb

File tree

4 files changed

+102
-126
lines changed

4 files changed

+102
-126
lines changed

‎theme/pycones23/static/assets/css/main.css‎

Lines changed: 48 additions & 60 deletions
Original file line numberDiff line numberDiff line change
@@ -269,44 +269,21 @@ display: none;
269269
color: var(--light-text-color);
270270
}
271271

272-
.box-addons {
273-
border-radius: 10px;
274-
background-color: var(--background-color);
275-
}
276272

277-
.box-addons > h2 {
278-
justify-content: center;
279-
text-align: center;
280-
padding-top: 3%;
281-
}
282273

283-
.box-content {
284-
padding: 5px;
285-
display: flex;
286-
flex-direction: column;
287-
justify-content: center;
288-
border-radius: 10px;
289-
background-color: var(--background-color);
290-
}
291-
.box-content > div > img {
292-
width: 200px;
293-
}
274+
294275

295276
.card {
296277
display: block;
297278
box-shadow: 0 4px 8px 0 var(--shadow-color);
298279
transition: 0.3s;
299280
width: 40%;
300281
padding: 10px;
301-
margin: 10px;
302282
}
283+
303284
.card > div > img {
304285
width: 200px;
305286
}
306-
.card_image {
307-
height: 50%;
308-
margin-top: 40px;
309-
}
310287

311288
.card:hover {
312289
box-shadow: 0 8px 16px 0 var(--shadow-color);
@@ -436,18 +413,11 @@ section > iframe {
436413
font-size: 30px;
437414
}
438415

439-
@media (min-width: 17rem) {
440-
.card {
441-
width: 100%;
442-
}
443-
}
444-
445416
@media (min-width: 22.5rem) {
446417
.box-intro {
447418
flex-direction: row;
448-
}
449-
.box-content {
450-
flex-direction: row;
419+
display: block;
420+
padding: 50px;
451421
}
452422
.caption {
453423
font-size: 0.8rem;
@@ -457,30 +427,16 @@ section > iframe {
457427
}
458428
}
459429

460-
@media (min-width: 40rem) {
461-
.content-wrapper .content {
462-
padding: 1.5rem 2rem 2.3rem 2rem;
463-
}
430+
@media (min-width: 30rem) {
464431
.card {
465432
width: 100%;
466433
}
467434
}
468435

469-
@media (min-width: 22.5rem) {
470-
.box-intro {
471-
display: block;
472-
padding: 50px;
473-
}
474-
.box-content {
475-
display: block;
476-
padding: 10px;
477-
}
478-
.card {
479-
width: 100%;
436+
@media (min-width: 40rem) {
437+
.content-wrapper .content {
438+
padding: 1.5rem 2rem 2.3rem 2rem;
480439
}
481-
}
482-
483-
@media (min-width: 30rem) {
484440
.card {
485441
width: 100%;
486442
}
@@ -494,14 +450,6 @@ section > iframe {
494450
.box-intro > h1 > img {
495451
width: 400px;
496452
}
497-
498-
.box-content {
499-
display: flex;
500-
}
501-
502-
.box-content > div > img {
503-
width: 150px;
504-
}
505453
}
506454

507455
/* FOOTER */
@@ -955,6 +903,46 @@ Sección de fotos polaroid
955903
}
956904
}
957905

906+
/* Patrocinios - add-ons */
907+
.box-addons {
908+
border-radius: 10px;
909+
background-color: var(--background-color);
910+
}
911+
912+
.box-addons > h2 {
913+
justify-content: center;
914+
text-align: center;
915+
padding-top: 3%;
916+
}
917+
918+
.box-content {
919+
display: flex;
920+
flex-direction: column;
921+
justify-content: center;
922+
gap: 1.3rem;
923+
padding: 0.8rem;
924+
border-radius: 10px;
925+
background-color: var(--background-color);
926+
}
927+
928+
.box-content .addon-image {
929+
margin-top: 1.5rem;
930+
}
931+
932+
.box-content .addon-image img {
933+
width: 12.5rem;
934+
}
935+
936+
@media (min-width: 63rem) {
937+
.box-content {
938+
flex-direction: row;
939+
}
940+
941+
.box-content .addon-image img {
942+
width: 9.3rem;
943+
}
944+
}
945+
958946
/* Organización*/
959947
.list-item {
960948
flex-wrap: nowrap !important;

‎theme/pycones23/templates/tabla-patrocinios.html‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -57,7 +57,7 @@ <h2>Este año, ¡personaliza tu patrocinio añadiendo add-ons!</h2>
5757

5858
<div class="box-content">
5959
<div class="card">
60-
<div class="card_image">
60+
<div class="addon-image">
6161
<img
6262
src="{{ SITEURL }}/theme/assets/images/patrocinios/entrevistas.PNG"
6363
alt="Dos mujeres durante una entrevista"
@@ -73,7 +73,7 @@ <h3><b>Entrevistas</b></h3>
7373
</div>
7474
</div>
7575
<div class="card">
76-
<div class="card_image">
76+
<div class="addon-image">
7777
<img
7878
src="{{ SITEURL }}/theme/assets/images/patrocinios/lactancia.PNG"
7979
alt="Una mujer dando de mamar a su bebe sentada en un sillón"
@@ -89,7 +89,7 @@ <h3><b>Sala de Lactancia</b></h3>
8989
</div>
9090
</div>
9191
<div class="card">
92-
<div class="card_image">
92+
<div class="addon-image">
9393
<img src="{{ SITEURL }}/theme/assets/images/patrocinios/ludoteca.PNG"
9494
alt="Cuatro piezas de puzzle"/>
9595
</div>

‎theme/pycones23_en/static/assets/css/main.css‎

Lines changed: 48 additions & 60 deletions
Original file line numberDiff line numberDiff line change
@@ -269,44 +269,21 @@ display: none;
269269
color: var(--light-text-color);
270270
}
271271

272-
.box-addons {
273-
border-radius: 10px;
274-
background-color: var(--background-color);
275-
}
276272

277-
.box-addons > h2 {
278-
justify-content: center;
279-
text-align: center;
280-
padding-top: 3%;
281-
}
282273

283-
.box-content {
284-
padding: 5px;
285-
display: flex;
286-
flex-direction: column;
287-
justify-content: center;
288-
border-radius: 10px;
289-
background-color: var(--background-color);
290-
}
291-
.box-content > div > img {
292-
width: 200px;
293-
}
274+
294275

295276
.card {
296277
display: block;
297278
box-shadow: 0 4px 8px 0 var(--shadow-color);
298279
transition: 0.3s;
299280
width: 40%;
300281
padding: 10px;
301-
margin: 10px;
302282
}
283+
303284
.card > div > img {
304285
width: 200px;
305286
}
306-
.card_image {
307-
height: 50%;
308-
margin-top: 40px;
309-
}
310287

311288
.card:hover {
312289
box-shadow: 0 8px 16px 0 var(--shadow-color);
@@ -436,18 +413,11 @@ section > iframe {
436413
font-size: 30px;
437414
}
438415

439-
@media (min-width: 17rem) {
440-
.card {
441-
width: 100%;
442-
}
443-
}
444-
445416
@media (min-width: 22.5rem) {
446417
.box-intro {
447418
flex-direction: row;
448-
}
449-
.box-content {
450-
flex-direction: row;
419+
display: block;
420+
padding: 50px;
451421
}
452422
.caption {
453423
font-size: 0.8rem;
@@ -457,30 +427,16 @@ section > iframe {
457427
}
458428
}
459429

460-
@media (min-width: 40rem) {
461-
.content-wrapper .content {
462-
padding: 1.5rem 2rem 2.3rem 2rem;
463-
}
430+
@media (min-width: 30rem) {
464431
.card {
465432
width: 100%;
466433
}
467434
}
468435

469-
@media (min-width: 22.5rem) {
470-
.box-intro {
471-
display: block;
472-
padding: 50px;
473-
}
474-
.box-content {
475-
display: block;
476-
padding: 10px;
477-
}
478-
.card {
479-
width: 100%;
436+
@media (min-width: 40rem) {
437+
.content-wrapper .content {
438+
padding: 1.5rem 2rem 2.3rem 2rem;
480439
}
481-
}
482-
483-
@media (min-width: 30rem) {
484440
.card {
485441
width: 100%;
486442
}
@@ -494,14 +450,6 @@ section > iframe {
494450
.box-intro > h1 > img {
495451
width: 400px;
496452
}
497-
498-
.box-content {
499-
display: flex;
500-
}
501-
502-
.box-content > div > img {
503-
width: 150px;
504-
}
505453
}
506454

507455
/* FOOTER */
@@ -955,6 +903,46 @@ Sección de fotos polaroid
955903
}
956904
}
957905

906+
/* Patrocinios - add-ons */
907+
.box-addons {
908+
border-radius: 10px;
909+
background-color: var(--background-color);
910+
}
911+
912+
.box-addons > h2 {
913+
justify-content: center;
914+
text-align: center;
915+
padding-top: 3%;
916+
}
917+
918+
.box-content {
919+
display: flex;
920+
flex-direction: column;
921+
justify-content: center;
922+
gap: 1.3rem;
923+
padding: 0.8rem;
924+
border-radius: 10px;
925+
background-color: var(--background-color);
926+
}
927+
928+
.box-content .addon-image {
929+
margin-top: 1.5rem;
930+
}
931+
932+
.box-content .addon-image img {
933+
width: 12.5rem;
934+
}
935+
936+
@media (min-width: 63rem) {
937+
.box-content {
938+
flex-direction: row;
939+
}
940+
941+
.box-content .addon-image img {
942+
width: 9.3rem;
943+
}
944+
}
945+
958946
/* Organización*/
959947
.list-item {
960948
flex-wrap: nowrap !important;

‎theme/pycones23_en/templates/tabla-patrocinios.html‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -61,7 +61,7 @@ <h2>This year, personalize your sponsorship by adding add-ons!</h2>
6161

6262
<div class="box-content">
6363
<div class="card">
64-
<div class="card_image">
64+
<div class="addon-image">
6565
<img
6666
src="{{ SITEURL }}/theme/assets/images/patrocinios/entrevistas.PNG"
6767
alt="Two women in an interview"
@@ -77,7 +77,7 @@ <h3><b>Interviews</b></h3>
7777
</div>
7878
</div>
7979
<div class="card">
80-
<div class="card_image">
80+
<div class="addon-image">
8181
<img
8282
src="{{ SITEURL }}/theme/assets/images/patrocinios/lactancia.PNG"
8383
alt="A woman breastfeeding her baby sitting in an armchair"
@@ -93,7 +93,7 @@ <h3><b>Nursery room</b></h3>
9393
</div>
9494
</div>
9595
<div class="card">
96-
<div class="card_image">
96+
<div class="addon-image">
9797
<img src="{{ SITEURL }}/theme/assets/images/patrocinios/ludoteca.PNG"
9898
alt="Four puzzle pieces" />
9999
</div>

0 commit comments

Comments
 (0)