From 4fae3e4bc8f0eebd17399eb6e0d679f79e3cc73a Mon Sep 17 00:00:00 2001 From: muli Date: Sun, 4 Jun 2023 21:57:20 +0200 Subject: [PATCH] fix: Services-Seite ist jetzt responsive. --- assets/css/style.css | 102 ++++++++++++++++++++++++++++++++++++++++++- 1 file changed, 101 insertions(+), 1 deletion(-) diff --git a/assets/css/style.css b/assets/css/style.css index 74f44df..4611197 100644 --- a/assets/css/style.css +++ b/assets/css/style.css @@ -874,6 +874,15 @@ hr.-even { color: var(--wtf-orange); margin-bottom: 0.5rem; } + +.servies_card__img_credits { + font-size: 0.8rem; + color: var(--wtf-dark-grey); +} + +.servies_card__img_credits a { + color: var(--wtf-dark-blue); +} /* services_cards - end */ /* bubble_gird - start */ @@ -986,7 +995,6 @@ hr.-even { } - .content__box, .contact__box, .content__half_box, @@ -1401,6 +1409,30 @@ footer { margin-top: 0; padding-top: 0; } + + .services_box { + display: block; + margin: 0 1.5rem 3rem 1.5rem; + } + + .services_box h1 { + color: var(--wtf-orange); + background-image: unset; + margin-bottom: 1rem; + } + + .services_card_box { + margin: 0; + } + + .bubble_grid { + grid-template-columns: repeat(5, 1fr); + grid-template-rows: repeat(5, 10rem); + } + + h1.big_heading { + font-size: 3.5rem; + } } @media screen and (max-width: 789px) and (min-width: 596px) { @@ -1579,6 +1611,35 @@ footer { .pod_ctrl_box { margin-top: 1.5rem; } + + .content__box.-card_box.-homepage { + margin-top: 0; + padding-top: 0; + } + + .services_box { + display: block; + margin: 0 1.5rem 3rem 1.5rem; + } + + .services_box h1 { + color: var(--wtf-orange); + background-image: unset; + margin-bottom: 1rem; + } + + .services_card_box { + margin: 0; + } + + .bubble_grid { + grid-template-columns: repeat(4, 1fr); + grid-template-rows: repeat(6, 10rem); + } + + h1.big_heading { + font-size: 3.5rem; + } } @media screen and (max-width: 595px) { @@ -1838,6 +1899,45 @@ footer { .pod_ctrl_box { margin-top: 1.5rem; } + + .services_box { + display: block; + margin: 0 1.5rem 3rem 1.5rem; + } + + .services_box h1 { + color: var(--wtf-orange); + background-image: unset; + margin-bottom: 1rem; + } + + .services_card_box { + margin: 0; + } + + .services_card, + .services_card.-even { + flex-direction: column; + } + + .services_card__text_box h2 { + margin-top: 0; + } + + h1.big_heading { + font-size: 2.5rem; + } + + .bubble_grid { + grid-template-columns: repeat(2, 1fr); + grid-template-rows: repeat(11, 10rem); + } + + .bubble_grid__card { + padding: 2rem; + grid-column: 1 / span 2; + grid-row: 2 / span 3; + } /* content - end */ /* footer - start */