diff --git a/web/static/camper.css b/web/static/camper.css index 5637b5b..bfc9588 100644 --- a/web/static/camper.css +++ b/web/static/camper.css @@ -623,6 +623,11 @@ fieldset img { align-items: center; } +.sortable img { + max-width: 20rem; + border-radius: 5px; +} + #slide-index img { width: 192px; aspect-ratio: 4 / 3; diff --git a/web/static/public.css b/web/static/public.css index 05ee64c..3d494f7 100644 --- a/web/static/public.css +++ b/web/static/public.css @@ -346,7 +346,7 @@ nav:last-of-type > ul > li:last-child { .boto-reserva { border: 2px solid; - border-radius: 5px; + border-radius: .6rem; height: 40px; display: flex; align-items: center; @@ -425,7 +425,7 @@ nav:last-of-type > ul > li:last-child { .hero { position: relative; - margin-bottom: 2rem; + margin-bottom: 5rem; } .nature, .services { @@ -433,7 +433,7 @@ nav:last-of-type > ul > li:last-child { } .hero .slick-slide, .nature section, .services { - border-radius: 5px; + border-radius: .6rem; } .hero .slick-initialized .slick-slide { @@ -459,18 +459,17 @@ nav:last-of-type > ul > li:last-child { } .hero .slick-slide span, .hero a { - border-radius: 5px; + border-radius: .6rem; background-color: var(--clar); } .hero .slick-slide > span { width: 50%; margin-bottom: 0; - font-size: calc(2rem + 4vw); + font-size: calc(2rem + 2.7vw); display: block; background: transparent; color: var(--base); - text-shadow: 0 1px 0 black; } .hero a, .services h2, .surroundings .spiel a { @@ -488,8 +487,8 @@ nav:last-of-type > ul > li:last-child { .hero a { position: absolute; - bottom: 1.5rem; - right: 3.5rem; + bottom: 1rem; + right: 1rem; } .hero a:hover span, .services a:hover span, .spiel a:hover span, .campsite_type_booking button:hover span { @@ -523,7 +522,7 @@ dl, .nature > div, .outside_activities > div { display: block; width: 100%; height: 20rem; - border-radius: 5px; + border-radius: .6rem; } .nature section a span { @@ -531,8 +530,8 @@ dl, .nature > div, .outside_activities > div { padding: .55rem 1.5rem 1rem; background-color: var(--accent); color: var(--base); - border-top-left-radius: 5px; - border-bottom-right-radius: 5px; + border-top-left-radius: .6rem; + border-bottom-right-radius: .6rem; } @media (max-width: 64rem) { @@ -571,7 +570,7 @@ dl, .nature > div, .outside_activities > div { .carousel img { height: 30rem; width: 100%; - border-radius: 5px; + border-radius: .6rem; object-fit: cover; } @@ -583,7 +582,7 @@ dl, .nature > div, .outside_activities > div { position: absolute; bottom: 0; right: 0; - border-top-left-radius: 5px; + border-top-left-radius: .6rem; font-size: 1.7rem; } @@ -593,7 +592,8 @@ dl, .nature > div, .outside_activities > div { } .slick-slider .slick-arrow { - font-size: 4rem; + font-weight: 600; + font-size: calc(1rem + 1.2vw); line-height: 1; width: 5rem; height: 5rem; @@ -641,7 +641,7 @@ dl div { flex-basis: calc(25% - 5rem + 5rem / 4); min-height: 220px; padding: 12.5px; - border-radius: 5px; + border-radius: .6rem; transition: all 0.5s ease; } @@ -674,6 +674,10 @@ dt { margin-top: 2rem; } +.outside_activities img { + border-radius: .6rem; +} + .outside_activities h3, .campsite_services .spiel { font-size: calc(2.2rem + 4vw); font-weight: 600; @@ -688,7 +692,7 @@ dt { max-width: 108rem; margin: 0 auto; flex-direction: column; - gap: 2.7rem; + gap: 5rem; } .outside_activities article { @@ -699,6 +703,7 @@ dt { .outside_activities > ul > li:nth-child(2n) article { flex-direction: row-reverse; + text-align: right; } .outside_activities article h4 { @@ -814,7 +819,7 @@ dt { .campsite_type_booking button, .campsite_type_booking input { border: none; - border-radius: 5px; + border-radius: .6rem; } .campsite_type_calendar_prices { @@ -830,7 +835,7 @@ dt { .campsite_type_prices { padding: 2.5rem; - border-radius: 5px; + border-radius: .6rem; flex: .5; } @@ -927,7 +932,7 @@ dt { } .campsite_type_detail section:last-child { - flex: 2; + flex: 1; } .campsite_type_detail h4 { @@ -1100,13 +1105,13 @@ dt { input { height: 60px; - border-radius: 5px; + border-radius: .6rem; border: 1px solid; } select { min-height: 60px; - border-radius: 5px; + border-radius: .6rem; border: 1px solid; background: white; padding: 20px; @@ -1129,7 +1134,7 @@ fieldset { button { font-size: 4rem; background: var(--accent); - border-radius: 5px; + border-radius: .6rem; border: 1px solid var(--accent); color: var(--contrast); } @@ -1301,8 +1306,8 @@ body > footer { margin: 120px 20px 0 20px; background: var(--contrast); color: var(--base); - border-top-left-radius: 5px; - border-top-right-radius: 5px; + border-top-left-radius: .6rem; + border-top-right-radius: .6rem; } body > footer a { @@ -1315,7 +1320,7 @@ body > footer > div, .campsite_type_features, .campsite_type_detail { /* highlight footer season */ body > footer section:nth-child(3) { - border-radius: 5px; + border-radius: .6rem; background: var(--accent-2); padding: 0 15px; color: var(--contrast); @@ -1412,7 +1417,7 @@ address { } #map { - border-radius: 5px; + border-radius: .6rem; } .leaflet-popup-content-wrapper { @@ -1426,7 +1431,7 @@ address { /* camping map */ #campground_map { - border-radius: 5px; + border-radius: .6rem; } #arbres { @@ -1451,9 +1456,9 @@ address { .ad-image-container { width: 50%; min-height: 300px; - border-top-left-radius: 5px; - border-bottom-left-radius: 5px; - background-image: url(https://camper.tandem.ws/media/0c0625998215b6caec6e871ab26d791c330f34bb46a2facc9d502d769d207e7b/barranquisme.jpg); + border-top-left-radius: .6rem; + border-bottom-left-radius:.8rem; + background-image: url(https://campingmontagut.tandem.ws/media/0c0625998215b6caec6e871ab26d791c330f34bb46a2facc9d502d769d207e7b/barranquisme.jpg); background-repeat: no-repeat; background-position: center center; background-size: cover; @@ -1466,8 +1471,8 @@ address { flex-direction: column; justify-content: center; padding: 50px; - border-top-right-radius: 5px; - border-bottom-right-radius: 5px; + border-top-right-radius: .6rem; + border-bottom-right-radius: .6rem; background-color: var(--accent-2); } @@ -1484,7 +1489,7 @@ address { display: flex; align-items: flex-start; column-gap: 0.5em; - border-radius: 5px; + border-radius: .6rem; color: var(--contrast); }