Commit e867f2ac authored by henry's avatar henry Committed by morgan
Browse files

fixup! Bug 40925: Implemented the Security Level component 

Bug 42705: Adopt the same markup as "Enhanced Tracking Protection" and
"DNS over HTTPS" for the security level preferences.

We inherit all the rules for spacing and highlighting.

We also update the radio disabled opacity rule following bugzilla
bug 1869233.
parent 2c237b4a

browser/components/securitylevel/content/securityLevel.js

+1 −5
Original line number Diff line number Diff line
@@ -195,7 +195,6 @@ var SecurityLevelPanel = { 


  _configUIFromPrefs() {

    if (!this._populated) {

      console.warn("_configUIFromPrefs before XUL was populated.");

      return;

    }
@@ -353,10 +352,7 @@ var SecurityLevelPreferences = { 
    // Have the container's selection CSS class match the selection state of the

    // radio elements.

    for (const { container, radio } of this._radioOptions) {

      container.classList.toggle(

        "securityLevel-radio-option-selected",

        radio.selected

      );

      container.classList.toggle("selected", radio.selected);

    }

  },

browser/components/securitylevel/content/securityLevelPreferences.css

+1 −33
Original line number Diff line number Diff line
@@ -15,44 +15,12 @@ 
  font-weight: bold;

}



/* Overwrite indent rule from preferences.css */

#securityLevel-radiogroup description.indent {

  color: var(--in-content-page-color);

}



#securityLevel-radiogroup radio {

  font-weight: bold;

}



#securityLevel-radiogroup[disabled] {

  opacity: 0.5;

}



/* Overwrite the rule in common-shared.css so we don't get 0.25 opacity overall

 * on the radio text. */

#securityLevel-radiogroup[disabled] radio[disabled] {

#securityLevel-radiogroup[disabled] radio[disabled] .radio-label-box {

  opacity: 1.0;

}
 


.securityLevel-radio-option {

  border: 1px solid var(--in-content-box-border-color);

  border-radius: 4px;

  margin: 3px 0;

  padding: 9px;

}



.securityLevel-radio-option.securityLevel-radio-option-selected {

  background-color: var(--section-highlight-background-color);

  border: 1px solid var(--in-content-accent-color);



}



.securityLevel-radio-option:not(

  .securityLevel-radio-option-selected

) .securityLevel-descriptionList {

  display: none;

}



.securityLevel-descriptionList description {

  display: list-item;

}

browser/components/securitylevel/content/securityLevelPreferences.inc.xhtml

+54 −50
Original line number Diff line number Diff line
@@ -45,78 +45,82 @@ 
      </hbox>

    </hbox>

    <radiogroup id="securityLevel-radiogroup">

      <vbox class="securityLevel-radio-option">

      <vbox class="securityLevel-radio-option privacy-detailedoption info-box-container">

        <radio

          value="standard"

          data-l10n-id="security-level-preferences-level-standard"

          aria-describedby="securityLevelSummary-standard"

        />

        <vbox id="securityLevelSummary-standard">

          <description

            class="summary indent"

            flex="1"

            data-l10n-id="security-level-summary-standard"

          />

        <vbox id="securityLevelSummary-standard" class="indent">

          <label data-l10n-id="security-level-summary-standard" />

        </vbox>

      </vbox>

      <vbox class="securityLevel-radio-option">

      <vbox class="securityLevel-radio-option privacy-detailedoption info-box-container">

        <!-- NOTE: We point the accessible description to the wrapping vbox

          - rather than its first description element. This means that when the

          - securityLevel-descriptionList is shown or hidden, its text content

          - is included or excluded from the accessible description,

          - respectively. -->

          - privacy-extra-information is shown or hidden, its text content is

          - included or excluded from the accessible description, respectively.

          -->

        <radio

          value="safer"

          data-l10n-id="security-level-preferences-level-safer"

          aria-describedby="securityLevelSummary-safer"

        />

        <vbox id="securityLevelSummary-safer">

          <description

            class="summary indent"

            flex="1"

            data-l10n-id="security-level-summary-safer"

          />

          <vbox class="securityLevel-descriptionList indent">

            <description

              class="indent"

        <vbox id="securityLevelSummary-safer" class="indent">

          <label data-l10n-id="security-level-summary-safer" />

          <vbox class="privacy-extra-information">

            <vbox class="indent">

              <hbox class="extra-information-label">

                <label

                  class="content-blocking-label"

                  data-l10n-id="security-level-preferences-bullet-https-only-javascript"

                />

            <description

              class="indent"

              </hbox>

              <hbox class="extra-information-label">

                <label

                  class="content-blocking-label"

                  data-l10n-id="security-level-preferences-bullet-limit-font-and-symbols"

                />

            <description

              class="indent"

              </hbox>

              <hbox class="extra-information-label">

                <label

                  class="content-blocking-label"

                  data-l10n-id="security-level-preferences-bullet-limit-media"

                />

              </hbox>

            </vbox>

          </vbox>

        </vbox>

      <vbox class="securityLevel-radio-option">

      </vbox>

      <vbox class="securityLevel-radio-option privacy-detailedoption info-box-container">

        <radio

          value="safest"

          data-l10n-id="security-level-preferences-level-safest"

          aria-describedby="securityLevelSummary-safest"

        />

        <vbox id="securityLevelSummary-safest">

          <description

            class="summary indent"

            flex="1"

            data-l10n-id="security-level-summary-safest"

          />

          <vbox class="securityLevel-descriptionList indent">

            <description

              class="indent"

        <vbox id="securityLevelSummary-safest" class="indent">

          <label data-l10n-id="security-level-summary-safest" />

          <vbox class="privacy-extra-information">

            <vbox class="indent">

              <hbox class="extra-information-label">

                <label

                  class="content-blocking-label"

                  data-l10n-id="security-level-preferences-bullet-disabled-javascript"

                />

            <description

              class="indent"

              </hbox>

              <hbox class="extra-information-label">

                <label

                  class="content-blocking-label"

                  data-l10n-id="security-level-preferences-bullet-limit-font-and-symbols-and-images"

                />

            <description

              class="indent"

              </hbox>

              <hbox class="extra-information-label">

                <label

                  class="content-blocking-label"

                  data-l10n-id="security-level-preferences-bullet-limit-media"

                />

              </hbox>

            </vbox>

          </vbox>

        </vbox>

      </vbox>