Commit 454c7d36 authored by henry's avatar henry Committed by brizental
Browse files

fixup! BB 32308: Use direct browser sizing for letterboxing. 

TB 44214: Use CSS nesting. Part 2.
parent 7d628b03

toolkit/components/resistfingerprinting/content/letterboxing.css

+29 −30
Original line number Diff line number Diff line
@@ -61,46 +61,45 @@ 
      border-radius: var(--letterboxing-border-radius);

      border-top-left-radius: var(--letterboxing-border-top-radius);

      border-top-right-radius: var(--letterboxing-border-top-radius);

      box-shadow: var(--letterboxing-border-color) 0 0 .1px inset, var(--letterboxing-border-color) 0 0 .1px;

      border: .1px solid var(--letterboxing-border-color);

      outline: .1px solid var(--letterboxing-bgcolor);

    }

      box-shadow:

        var(--letterboxing-border-color) 0 0 0.1px inset,

        var(--letterboxing-border-color) 0 0 0.1px;

      border: 0.1px solid var(--letterboxing-border-color);

      outline: 0.1px solid var(--letterboxing-bgcolor);

    }



    #statuspanel:not([mirror]) #statuspanel-label {

      border-end-start-radius: var(--letterboxing-border-radius);

    }



.browserDecorator {

  display: none;

  pointer-events: none;

  background: transparent;

  position: relative;

  z-index: 1;

    #statuspanel[mirror] #statuspanel-label {

      border-end-end-radius: var(--letterboxing-border-radius);

    }

  }



/*

  Align status bar with content.

  TODO: switch to nested CSS selectors for conciseness when available (Firefox >= 117)

*/

.letterboxing .browserContainer:not(.responsive-mode) > .browserStack:not(.exclude-letterboxing) > #statuspanel {

  #statuspanel {

    position: relative;

    place-self: end start;

    z-index: 2;

}

.letterboxing .browserContainer:not(.responsive-mode) > .browserStack:not(.exclude-letterboxing) > #statuspanel[mirror] {



    &[mirror] {

      justify-self: end;

    }

  }



.letterboxing .browserContainer:not(.responsive-mode) > .browserStack:not(.exclude-letterboxing) #statuspanel-label {

  #statuspanel-label {

    margin: 0;

    border: 1px solid var(--letterboxing-border-color);

    max-width: calc(var(--letterboxing-width) * 0.5);

  }



.letterboxing .browserContainer:not(.responsive-mode) > .browserStack:not(.exclude-letterboxing) > #statuspanel:not([mirror]) #statuspanel-label {

  border-end-start-radius: var(--letterboxing-border-radius);

}



.letterboxing .browserContainer:not(.responsive-mode) > .browserStack:not(.exclude-letterboxing) > #statuspanel[mirror] #statuspanel-label {

  border-end-end-radius: var(--letterboxing-border-radius);

.browserDecorator {

  display: none;

  pointer-events: none;

  background: transparent;

  position: relative;

  z-index: 1;

}



browser:fullscreen {