morgan pushed to branch tor-browser-128.1.0esr-14.0-1 at The Tor Project / Applications / Tor Browser

Commits:

9 changed files:

Changes:

  • browser/components/torpreferences/content/builtinBridgeDialog.js
    ... ... @@ -70,6 +70,13 @@ const gBuiltinBridgeDialog = {
    70 70
           this._result.accepted = true;
    
    71 71
         });
    
    72 72
     
    
    73
    +    // Add styling for tor-button to the dialog shadow root.
    
    74
    +    const styleLink = document.createElement("link");
    
    75
    +    styleLink.rel = "stylesheet";
    
    76
    +    styleLink.href =
    
    77
    +      "chrome://browser/content/torpreferences/torPreferences.css";
    
    78
    +    dialog.shadowRoot.append(styleLink);
    
    79
    +
    
    73 80
         this._acceptButton = dialog.getButton("accept");
    
    74 81
     
    
    75 82
         Services.obs.addObserver(this, TorConnectTopics.StateChange);
    
    ... ... @@ -95,6 +102,7 @@ const gBuiltinBridgeDialog = {
    95 102
           "data-l10n-id",
    
    96 103
           connect ? "bridge-dialog-button-connect" : "bridge-dialog-button-accept"
    
    97 104
         );
    
    105
    +    this._acceptButton.classList.toggle("tor-button", connect);
    
    98 106
       },
    
    99 107
     
    
    100 108
       observe(subject, topic) {
    

  • browser/components/torpreferences/content/connectionPane.xhtml
    ... ... @@ -133,7 +133,7 @@
    133 133
           </menulist>
    
    134 134
           <button
    
    135 135
             id="torPreferences-bridges-buttonChooseBridgeForMe"
    
    136
    -        class="primary"
    
    136
    +        class="primary tor-button"
    
    137 137
           />
    
    138 138
         </hbox>
    
    139 139
         <html:moz-toggle
    

  • browser/components/torpreferences/content/provideBridgeDialog.js
    ... ... @@ -85,7 +85,7 @@ const gProvideBridgeDialog = {
    85 85
         this._acceptButton = this._dialog.getButton("accept");
    
    86 86
     
    
    87 87
         // Inject our stylesheet into the shadow root so that the accept button can
    
    88
    -    // take the spoof-button-disabled styling.
    
    88
    +    // take the spoof-button-disabled styling and tor-button styling.
    
    89 89
         const styleLink = document.createElement("link");
    
    90 90
         styleLink.rel = "stylesheet";
    
    91 91
         styleLink.href =
    
    ... ... @@ -183,22 +183,21 @@ const gProvideBridgeDialog = {
    183 183
        * Callback for whenever the accept button may need to change.
    
    184 184
        */
    
    185 185
       onAcceptStateChange() {
    
    186
    +    let connect = false;
    
    186 187
         if (this._page === "entry") {
    
    187
    -      document.l10n.setAttributes(
    
    188
    -        this._acceptButton,
    
    188
    +      this._acceptButton.setAttribute(
    
    189
    +        "data-l10n-id",
    
    189 190
             "user-provide-bridge-dialog-next-button"
    
    190 191
           );
    
    191
    -      this._result.connect = false;
    
    192 192
         } else {
    
    193
    -      this._acceptButton.removeAttribute("data-l10n-id");
    
    194
    -      const connect = TorConnect.canBeginBootstrap;
    
    195
    -      this._result.connect = connect;
    
    196
    -
    
    193
    +      connect = TorConnect.canBeginBootstrap;
    
    197 194
           this._acceptButton.setAttribute(
    
    198 195
             "data-l10n-id",
    
    199 196
             connect ? "bridge-dialog-button-connect" : "bridge-dialog-button-accept"
    
    200 197
           );
    
    201 198
         }
    
    199
    +    this._result.connect = connect;
    
    200
    +    this._acceptButton.classList.toggle("tor-button", connect);
    
    202 201
       },
    
    203 202
     
    
    204 203
       /**
    

  • browser/components/torpreferences/content/requestBridgeDialog.js
    ... ... @@ -33,6 +33,13 @@ const gRequestBridgeDialog = {
    33 33
           "torPreferences-requestBridge-dialog"
    
    34 34
         );
    
    35 35
     
    
    36
    +    // Add styling for tor-button to the dialog shadow root.
    
    37
    +    const styleLink = document.createElement("link");
    
    38
    +    styleLink.rel = "stylesheet";
    
    39
    +    styleLink.href =
    
    40
    +      "chrome://browser/content/torpreferences/torPreferences.css";
    
    41
    +    this._dialog.shadowRoot.append(styleLink);
    
    42
    +
    
    36 43
         // user may have opened a Request Bridge dialog in another tab, so update the
    
    37 44
         // CAPTCHA image or close out the dialog if we have a bridge list
    
    38 45
         this._dialog.addEventListener("focusin", () => {
    
    ... ... @@ -101,6 +108,7 @@ const gRequestBridgeDialog = {
    101 108
           "data-l10n-id",
    
    102 109
           connect ? "bridge-dialog-button-connect" : "bridge-dialog-button-submit"
    
    103 110
         );
    
    111
    +    this._submitButton.classList.toggle("tor-button", connect);
    
    104 112
       },
    
    105 113
     
    
    106 114
       observe(subject, topic) {
    

  • browser/themes/shared/tor-urlbar-button.css
    ... ... @@ -26,7 +26,6 @@
    26 26
        * urlbar background, but we keep the rounded corners. */
    
    27 27
       outline: var(--focus-outline);
    
    28 28
       outline-offset: var(--focus-outline-offset);
    
    29
    -  outline-color: var(--tor-focus-outline-color);
    
    30 29
       /* Calculate the difference between the button's border area and the outline
    
    31 30
        * area. */
    
    32 31
       --tor-urlbar-focus-outline-difference: calc(
    

  • toolkit/components/torconnect/content/aboutTorConnect.css
    ... ... @@ -116,10 +116,6 @@ html {
    116 116
       list-style-image: url("chrome://global/content/torconnect/bridge.svg");
    
    117 117
     }
    
    118 118
     
    
    119
    -button, select {
    
    120
    -  --in-content-focus-outline-color: var(--tor-focus-outline-color);
    
    121
    -}
    
    122
    -
    
    123 119
     #locationDropdownLabel {
    
    124 120
       margin-block: auto;
    
    125 121
       margin-inline: 4px;
    

  • toolkit/components/torconnect/content/aboutTorConnect.html
    ... ... @@ -75,8 +75,16 @@
    75 75
                 <button id="restartButton" hidden="true"></button>
    
    76 76
                 <button id="configureButton" hidden="true"></button>
    
    77 77
                 <button id="cancelButton" hidden="true"></button>
    
    78
    -            <button id="connectButton" hidden="true"></button>
    
    79
    -            <button id="tryBridgeButton" hidden="true"></button>
    
    78
    +            <button
    
    79
    +              id="connectButton"
    
    80
    +              hidden="true"
    
    81
    +              class="tor-button"
    
    82
    +            ></button>
    
    83
    +            <button
    
    84
    +              id="tryBridgeButton"
    
    85
    +              hidden="true"
    
    86
    +              class="tor-button"
    
    87
    +            ></button>
    
    80 88
               </span>
    
    81 89
             </div>
    
    82 90
           </div>
    

  • toolkit/components/torconnect/content/aboutTorConnect.js
    ... ... @@ -190,7 +190,6 @@ class AboutTorConnect {
    190 190
     
    
    191 191
       show(element, primary = false) {
    
    192 192
         element.classList.toggle("primary", primary);
    
    193
    -    element.classList.toggle("tor-button", primary);
    
    194 193
         element.removeAttribute("hidden");
    
    195 194
       }
    
    196 195
     
    

  • toolkit/themes/shared/tor-colors.css
    1
    +@namespace xul "http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul";
    
    2
    +
    
    1 3
     :root {
    
    2 4
       /* Photon colors not available in Firefox. */
    
    3 5
       --purple-30: #c069ff;
    
    ... ... @@ -126,19 +128,34 @@
    126 128
     
    
    127 129
     /* Has a higher specificity than `button` and `button.primary`. */
    
    128 130
     button.tor-button:is(*, .primary),
    
    131
    +xul|button.tor-button:is(*, [default]),
    
    129 132
     .tor-button {
    
    130 133
       color: var(--tor-button-text-color);
    
    131 134
       background-color: var(--tor-button-background-color);
    
    132 135
     }
    
    133 136
     
    
    134
    -button.tor-button:is(*, .primary):hover,
    
    135
    -.tor-button:hover {
    
    137
    +:is(
    
    138
    +  button.tor-button:is(*, .primary),
    
    139
    +  xul|button.tor-button:is(*, [default]),
    
    140
    +  .tor-button
    
    141
    +):not([disabled]):hover {
    
    136 142
       color: var(--tor-button-text-color-hover);
    
    137 143
       background-color: var(--tor-button-background-color-hover);
    
    138 144
     }
    
    139 145
     
    
    140
    -button.tor-button:is(*, .primary):hover:active,
    
    141
    -.tor-button:hover:active {
    
    146
    +:is(
    
    147
    +  button.tor-button:is(*, .primary),
    
    148
    +  xul|button.tor-button:is(*, [default]),
    
    149
    +  .tor-button
    
    150
    +):not([disabled]):hover:active {
    
    142 151
       color: var(--tor-button-text-color-active);
    
    143 152
       background-color: var(--tor-button-background-color-active);
    
    144 153
     }
    
    154
    +
    
    155
    +:is(
    
    156
    +  button.tor-button:is(*, .primary),
    
    157
    +  xul|button.tor-button:is(*, [default]),
    
    158
    +  .tor-button
    
    159
    +):focus-visible {
    
    160
    +  outline-color: var(--tor-focus-outline-color);
    
    161
    +}