diff options
Diffstat (limited to 'browser/themes/windows/caption-buttons.svg')
-rw-r--r-- | browser/themes/windows/caption-buttons.svg | 133 |
1 files changed, 77 insertions, 56 deletions
diff --git a/browser/themes/windows/caption-buttons.svg b/browser/themes/windows/caption-buttons.svg index 3ba4f95a1..9cb42d539 100644 --- a/browser/themes/windows/caption-buttons.svg +++ b/browser/themes/windows/caption-buttons.svg @@ -1,49 +1,61 @@ +<svg width="12" height="12" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <!-- This Source Code Form is subject to the terms of the Mozilla Public - License, v. 2.0. If a copy of the MPL was not distributed with this - file, You can obtain one at http://mozilla.org/MPL/2.0/. --> -<svg width="12" height="12" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <style> + g { + stroke: ButtonText; + stroke-width: 0.9px; + fill: none; + } + g:not(:target) { display: none; } + use:target > g { display: initial; } - g { - stroke: ButtonText; - stroke-width: 0.9px; - fill: none; - } - g:not([id|="close"]) { - shape-rendering: crispEdges; + .highlight > g { + stroke: HighlightText; } - .highcontrast { - stroke-width: 1.9px; + .inactive > g { + stroke: black; } - .highcontrast-hover > g { - stroke: HighlightText; + + .bolder { + stroke-width: 1.6px; + stroke: black; } - .white > g { - stroke: #fff; + + .outline { + stroke-width: 4px; + stroke: white; + opacity: 0.75; } - .themes { - stroke: #fff; - stroke-width: 1.9px; + + .inverted { + stroke-width: 1.6px; + stroke: white; } - .outer-stroke { - stroke: #000; - stroke-width: 3.6; - opacity: .75; + .outline-inverted { + stroke-width: 4px; + stroke: black; + opacity: 0.75; } - .restore-background-window { - stroke-width: .9; + + .outline-thinner { + stroke-width: 3.6px; } + </style> + <g id="close"> - <path d="M1,1 l 10,10 M1,11 l 10,-10"/> + <line x1="1" y1="1" x2="11" y2="11" stroke-width="1px"/> + <line x1="11" y1="1" x2="1" y2="11" stroke-width="1px"/> </g> <g id="maximize"> <rect x="1.5" y="1.5" width="9" height="9"/> @@ -56,45 +68,54 @@ <polyline points="3.5,3.5 3.5,1.5 10.5,1.5 10.5,8.5 8.5,8.5"/> </g> - <use id="close-white" class="white" xlink:href="#close"/> - <use id="maximize-white" class="white" xlink:href="#maximize"/> - <use id="minimize-white" class="white" xlink:href="#minimize"/> - <use id="restore-white" class="white" xlink:href="#restore"/> - - <g id="close-highcontrast" class="highcontrast"> - <path d="M1,1 l 10,10 M1,11 l 10,-10"/> + <g id="close-outline"> + <line x1="1" y1="1" x2="11" y2="11" stroke-linecap="round" class="outline"/> + <line x1="11" y1="1" x2="1" y2="11" stroke-linecap="round" class="outline"/> + <line x1="1" y1="1" x2="11" y2="11" class="bolder"/> + <line x1="11" y1="1" x2="1" y2="11" class="bolder"/> </g> - <g id="maximize-highcontrast" class="highcontrast"> - <rect x="2" y="2" width="8" height="8"/> + <g id="maximize-outline"> + <rect x="1.2" y="1.2" width="9.6" height="9.6" stroke-linecap="round" class="outline"/> + <rect x="1.5" y="1.5" width="9" height="9" class="bolder"/> </g> - <g id="minimize-highcontrast" class="highcontrast"> - <line x1="1" y1="6" x2="11" y2="6"/> + <g id="minimize-outline"> + <line x1="1" y1="5.5" x2="11" y2="5.5" stroke-linecap="round" class="outline outline-thinner"/> + <line x1="1" y1="5.5" x2="11" y2="5.5" class="bolder"/> </g> - <g id="restore-highcontrast" class="highcontrast"> - <rect x="2" y="4" width="6" height="6"/> - <polyline points="3.5,1.5 10.5,1.5 10.5,8.5" class="restore-background-window"/> + <g id="restore-outline"> + <rect x="1.5" y="3.5" width="7" height="7" stroke-linecap="round" class="outline"/> + <polyline points="3.5,3.5 3.5,1.5 10.5,1.5 10.5,8.5 8.5,8.5" stroke-linecap="round" class="outline"/> + <rect x="1.5" y="3.5" width="7" height="7" class="bolder"/> + <polyline points="3.5,3.5 3.5,1.5 10.5,1.5 10.5,8.5 8.5,8.5" class="bolder"/> </g> - <use id="close-highcontrast-hover" class="highcontrast-hover" xlink:href="#close-highcontrast"/> - <use id="maximize-highcontrast-hover" class="highcontrast-hover" xlink:href="#maximize-highcontrast"/> - <use id="minimize-highcontrast-hover" class="highcontrast-hover" xlink:href="#minimize-highcontrast"/> - <use id="restore-highcontrast-hover" class="highcontrast-hover" xlink:href="#restore-highcontrast"/> - - <g id="close-themes" class="themes"> - <path d="M1,1 l 10,10 M1,11 l 10,-10" class="outer-stroke" /> - <path d="M1.75,1.75 l 8.5,8.5 M1.75,10.25 l 8.5,-8.5"/> + <g id="close-outline-inverted"> + <line x1="1" y1="1" x2="11" y2="11" stroke-linecap="round" class="outline-inverted"/> + <line x1="11" y1="1" x2="1" y2="11" stroke-linecap="round" class="outline-inverted"/> + <line x1="1" y1="1" x2="11" y2="11" class="inverted"/> + <line x1="11" y1="1" x2="1" y2="11" class="inverted"/> </g> - <g id="maximize-themes" class="themes"> - <rect x="2" y="2" width="8" height="8" class="outer-stroke"/> - <rect x="2" y="2" width="8" height="8"/> + <g id="maximize-outline-inverted"> + <rect x="1.2" y="1.2" width="9.6" height="9.6" stroke-linecap="round" class="outline-inverted"/> + <rect x="1.5" y="1.5" width="9" height="9" class="inverted"/> </g> - <g id="minimize-themes" class="themes"> - <line x1="0" y1="6" x2="12" y2="6" class="outer-stroke"/> - <line x1="1" y1="6" x2="11" y2="6"/> + <g id="minimize-outline-inverted"> + <line x1="1" y1="5.5" x2="11" y2="5.5" stroke-linecap="round" class="outline-inverted outline-thinner"/> + <line x1="1" y1="5.5" x2="11" y2="5.5" class="inverted"/> </g> - <g id="restore-themes" class="themes"> - <path d="M2,4 l 6,0 l 0,6 l -6,0z M2.5,1.5 l 8,0 l 0,8" class="outer-stroke"/> - <rect x="2" y="4" width="6" height="6"/> - <polyline points="3.5,1.5 10.5,1.5 10.5,8.5" class="restore-background-window"/> + <g id="restore-outline-inverted"> + <rect x="1.5" y="3.5" width="7" height="7" stroke-linecap="round" class="outline-inverted"/> + <polyline points="3.5,3.5 3.5,1.5 10.5,1.5 10.5,8.5 8.5,8.5" stroke-linecap="round" class="outline-inverted"/> + <rect x="1.5" y="3.5" width="7" height="7" class="inverted"/> + <polyline points="3.5,3.5 3.5,1.5 10.5,1.5 10.5,8.5 8.5,8.5" class="inverted"/> </g> + + <use id="close-highlight" class="highlight" xlink:href="#close"/> + <use id="maximize-highlight" class="highlight" xlink:href="#maximize"/> + <use id="minimize-highlight" class="highlight" xlink:href="#minimize"/> + <use id="restore-highlight" class="highlight" xlink:href="#restore"/> + <use id="close-inactive" class="inactive" xlink:href="#close"/> + <use id="maximize-inactive" class="inactive" xlink:href="#maximize"/> + <use id="minimize-inactive" class="inactive" xlink:href="#minimize"/> + <use id="restore-inactive" class="inactive" xlink:href="#restore"/> </svg> |