Unverified Commit f83185a6 authored by Lauri Timmanee's avatar Lauri Timmanee
Browse files

Issue #3211622 by Gauravmahlawat, mherchel, kiran.kadam911, rikki_iki:... 

Issue #3211622 by Gauravmahlawat, mherchel, kiran.kadam911, rikki_iki: Olivero: Text can be cut off at mobile if site-branding text goes to two lines

(cherry picked from commit df024ac4)
parent f6d8825e

core/themes/olivero/css/components/header-site-branding.css

+4 −4
Original line number Diff line number Diff line
@@ -41,7 +41,7 @@ 
  flex-shrink: 1;

  align-items: flex-end;

  min-width: calc(33.33333vw + 0.75rem);

  height: 3.375rem;

  min-height: 3.375rem;

  padding-top: 0;

  padding-bottom: 0.5625rem;
@@ -52,14 +52,14 @@ 
@media (min-width: 31.25rem) {



.site-branding {

    height: 4.5rem

    min-height: 4.5rem

}

  }



@media (min-width: 43.75rem) {



.site-branding {

    height: 6.75rem;

    min-height: 6.75rem;

    padding-bottom: 1.125rem

}

  }
@@ -99,7 +99,7 @@ 


.site-branding {

    min-width: calc(14.28571vw + 0.99107rem);

    height: 11.25rem;

    min-height: 11.25rem;

    padding-top: 0;

    padding-bottom: 0

}

core/themes/olivero/css/components/header-site-branding.pcss.css

+4 −4
Original line number Diff line number Diff line
@@ -10,7 +10,7 @@ 
  flex-shrink: 1;

  align-items: flex-end;

  min-width: calc((2 * var(--grid-col-width)) + (2 * var(--grid-gap)) + var(--container-padding));

  height: var(--sp3);

  min-height: var(--sp3);

  margin-inline: calc(-1 * var(--container-padding)) var(--sp);

  padding-block: 0 var(--sp0-5);

  padding-inline-start: var(--container-padding);
@@ -20,11 +20,11 @@ 
  background-image: linear-gradient(160deg, var(--color--blue-50) 0%, #0d7ab8 78.66%);



  @media (--sm) {

    height: var(--sp4);

    min-height: var(--sp4);

  }



  @media (--md) {

    height: var(--sp6);

    min-height: var(--sp6);

    padding-block-end: var(--sp);

  }
@@ -34,7 +34,7 @@ 


  @media (--nav) {

    min-width: calc((2 * var(--grid-col-width--nav)) + (2 * var(--grid-gap--nav)) + var(--container-padding-nav));

    height: var(--site-header-height-wide);

    min-height: var(--site-header-height-wide);

    margin-inline-start: calc(-1 * var(--container-padding-nav));

    padding-block: 0;

    padding-inline-start: var(--container-padding-nav);