243 lines
11 KiB
HTML
243 lines
11 KiB
HTML
<!DOCTYPE html>
|
|
<html id="stylus">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title i18n-text-append="optionsHeading">Stylus </title>
|
|
<link rel="stylesheet" href="global.css">
|
|
<link rel="stylesheet" href="options/options.css">
|
|
<link rel="stylesheet" href="options/onoffswitch.css">
|
|
<link rel="stylesheet" href="msgbox/msgbox.css">
|
|
|
|
<style id="firefox-transitions-bug-suppressor">
|
|
/* restrict to FF */
|
|
@supports (-moz-appearance:none) {
|
|
/* increased specificity to override sane selectors in user styles */
|
|
html#stylus.firefox #options *, #stylus #notes * {
|
|
transition: none !important;
|
|
}
|
|
}
|
|
</style>
|
|
|
|
<script src="js/dom.js"></script>
|
|
<script src="js/messaging.js"></script>
|
|
<script src="js/localization.js"></script>
|
|
<script src="js/prefs.js"></script>
|
|
<script src="js/storage-util.js" async></script>
|
|
<script src="msgbox/msgbox.js" async></script>
|
|
<script src="content/apply.js"></script>
|
|
</head>
|
|
|
|
<body id="stylus-options" class="truegray-alpha-2">
|
|
<div id="options">
|
|
|
|
<div class="block">
|
|
<h1 i18n-text="optionsCustomizeIcon"></h1>
|
|
<div class="items">
|
|
<label>
|
|
<span i18n-text="optionsIconDark"></span>
|
|
<div class="iconset">
|
|
<input type="radio" name="iconset">
|
|
<img src="/images/icon/16.png">
|
|
<img src="/images/icon/16w.png">
|
|
<img src="/images/icon/16x.png">
|
|
</div>
|
|
</label>
|
|
<label>
|
|
<span i18n-text="optionsIconLight"></span>
|
|
<div class="iconset">
|
|
<input type="radio" name="iconset">
|
|
<img src="/images/icon/light/16.png">
|
|
<img src="/images/icon/light/16w.png">
|
|
<img src="/images/icon/light/16x.png">
|
|
</div>
|
|
</label>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="block">
|
|
<h1 i18n-text="optionsCustomizeBadge"></h1>
|
|
<div class="items">
|
|
<label>
|
|
<span i18n-text="prefShowBadge"></span>
|
|
<span class="onoffswitch">
|
|
<input type="checkbox" id="show-badge" class="slider">
|
|
<span></span>
|
|
</span>
|
|
</label>
|
|
<label>
|
|
<span i18n-text="optionsBadgeNormal"></span>
|
|
<input type="color" id="badgeNormal">
|
|
</label>
|
|
<label>
|
|
<span i18n-text="optionsBadgeDisabled"></span>
|
|
<input type="color" id="badgeDisabled">
|
|
</label>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="block">
|
|
<h1 i18n-text="optionsCustomizePopup"></h1>
|
|
<div class="items">
|
|
<label>
|
|
<span i18n-text="optionsPopupWidth"></span>
|
|
<input type="number" id="popupWidth" min="200" max="800">
|
|
</label>
|
|
<label>
|
|
<span i18n-text="popupOpenEditInWindow"
|
|
i18n-title="popupOpenEditInWindowTooltip"></span>
|
|
<span class="onoffswitch">
|
|
<input type="checkbox" id="openEditInWindow" class="slider">
|
|
<span></span>
|
|
</span>
|
|
</label>
|
|
<label>
|
|
<span i18n-text="popupStylesFirst"></span>
|
|
<span class="onoffswitch">
|
|
<input type="checkbox" id="popup.stylesFirst" class="slider">
|
|
<span></span>
|
|
</span>
|
|
</label>
|
|
<label class="chromium-only">
|
|
<span i18n-text="popupBorders" i18n-title="popupBordersTooltip"></span>
|
|
<span class="onoffswitch">
|
|
<input type="checkbox" id="popup.borders" class="slider">
|
|
<span></span>
|
|
</span>
|
|
</label>
|
|
<div class="radio-outer-wrapper action-elements">
|
|
<div class="radio-title" i18n-text="optionsPopupTitle"></div>
|
|
<div class="radio-inner-wrapper">
|
|
<label i18n-title="optionsPopupIconUI">
|
|
<div class="popupui">
|
|
<input type="radio" name="popupui">
|
|
<div class="icon-wrapper use-svg">
|
|
<svg class="svg-icon vector" viewBox="0 0 40 22">
|
|
<path fill-rule="evenodd" clip-rule="evenodd" d="m 36.9,0.95 c -1.2,0 -2.4,0.8 -2.9,1.9 H 23.8 v -2.5 h -7.5 v 2.5 H 6 C 5.5,1.75 4.4,0.95 3.1,0.95 1.3,0.95 0,2.35 0,4.05 c 0,1.7 1.4,3.1 3.1,3.1 1.2,0 2.4,-0.8 2.9,-1.9 h 6.4 c -3,2 -5.2,5.1 -6.2,8.8 H 3.8 v 7.6 h 7.5 v -7.5 H 8.8 c 1.1,-3.6 4,-6.6 7.5,-7.9 v 1.6 h 7.5 v -1.6 c 3.6,1.4 6.4,4.2 7.5,7.9 h -2.5 v 7.5 h 7.5 v -7.5 h -2.4 c -1,-3.6 -3.2,-6.8 -6.2,-8.8 H 34 c 0.5,1.1 1.6,1.9 2.9,1.9 1.8,0 3.1,-1.4 3.1,-3.1 0,-1.8 -1.4,-3.2 -3.1,-3.2 z"/>
|
|
</svg>
|
|
</div>
|
|
</div>
|
|
</label>
|
|
<label i18n-title="optionsPopupClassicUI">
|
|
<div class="popupui">
|
|
<input type="radio" name="popupui">
|
|
<div class="icon-wrapper use-text">
|
|
<svg class="svg-icon text" viewBox="0 0 8 8">
|
|
<path d="M0 0v2h.5c0-.55.45-1 1-1h1.5v5.5c0 .28-.22.5-.5.5h-.5v1h4v-1h-.5c-.28 0-.5-.22-.5-.5v-5.5h1.5c.55 0 1 .45 1 1h.5v-2h-8z"/>
|
|
</svg>
|
|
</div>
|
|
</div>
|
|
</label>
|
|
</div>
|
|
</div>
|
|
<div class="radio-outer-wrapper style-name-action">
|
|
<div class="radio-title" i18n-text="optionsPopupTitleClickAction"></div>
|
|
<div class="radio-inner-wrapper">
|
|
<label i18n-title="optionsPopupClickActionLink">
|
|
<div class="popupclick ">
|
|
<input type="radio" name="popupclick">
|
|
<div class="icon-wrapper use-edit">
|
|
<svg class="svg-icon edit" viewBox="0 0 1024 1024">
|
|
<path d="M 920,920 H 104 V 104 l 344,0 V 0 H 0 V 1024 H 1024 V 576 H 920 Z"/>
|
|
<path d="M1088 448M256 593.152 256 768l179.712 0L1024 182.784l-180.352-179.456L256 593.152zM843.008 276.352l-407.296 407.296L345.152 593.152l407.296-407.296L843.008 276.352zM933.504 185.856l-45.248 45.248-90.496-90.496 45.248-45.248L933.504 185.856z"/>
|
|
</svg>
|
|
</div>
|
|
</div>
|
|
</label>
|
|
<label i18n-title="optionsPopupClickActionToggle">
|
|
<div class="popupclick">
|
|
<input type="radio" name="popupclick">
|
|
<div class="icon-wrapper use-toggle">
|
|
<svg class="svg-icon double-toggle" viewBox="0 0 1024 1024">
|
|
<path d="M692.053333 474.502095 331.897905 474.502095c-119.369143 0-216.088381-100.766476-216.088381-225.060571S212.528762 24.380952 331.897905 24.380952l360.131048 0c119.369143 0 216.137143 100.766476 216.137143 225.060571S811.398095 474.502095 692.053333 474.502095zM692.053333 61.878857 331.897905 61.878857c-99.449905 0-180.077714 83.992381-180.077714 187.562667s80.62781 187.562667 180.077714 187.562667l360.131048 0c99.474286 0 180.077714-83.992381 180.077714-187.562667S791.527619 61.878857 692.053333 61.878857zM331.897905 399.433143c-79.579429 0-144.067048-67.145143-144.067048-149.991619s64.512-150.064762 144.067048-150.064762c79.555048 0 144.042667 67.193905 144.042667 150.064762S411.452952 399.433143 331.897905 399.433143zM331.897905 549.497905l360.131048 0c119.369143 0 216.137143 100.790857 216.137143 225.060571S811.398095 999.619048 692.053333 999.619048L331.897905 999.619048c-119.369143 0-216.088381-100.766476-216.088381-225.03619S212.528762 549.497905 331.897905 549.497905zM692.053333 924.623238c79.60381 0 144.11581-67.193905 144.11581-150.040381s-64.512-150.064762-144.11581-150.064762c-79.579429 0-144.042667 67.218286-144.042667 150.064762S612.473905 924.623238 692.053333 924.623238z"/>
|
|
</svg>
|
|
</div>
|
|
</div>
|
|
</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="block" id="updates">
|
|
<h1 i18n-text="optionsCustomizeUpdate"></h1>
|
|
<div class="items">
|
|
<label>
|
|
<span i18n-text="optionsUpdateInterval">
|
|
<a data-cmd="note"
|
|
i18n-title="optionsUpdateImportNote"
|
|
href="#"
|
|
class="svg-inline-wrapper"
|
|
tabindex="0">
|
|
<svg class="svg-icon info"><use xlink:href="#svg-icon-help"/></svg>
|
|
</a>
|
|
</span>
|
|
<input type="number" min="0" id="updateInterval">
|
|
</label>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="block" id="advanced">
|
|
<div class="collapsible-resizer">
|
|
<h1 i18n-text="optionsAdvanced">
|
|
<a href="#" class="svg-inline-wrapper is-collapsed" tabindex="0">
|
|
<svg class="svg-icon" viewBox="0 0 1792 1792">
|
|
<path fill-rule="evenodd" d="M1408 704q0 26-19 45l-448 448q-19 19-45 19t-45-19l-448-448q-19-19-19-45t19-45 45-19h896q26 0 45 19t19 45z"/>
|
|
</svg>
|
|
</a>
|
|
<a href="#" class="svg-inline-wrapper is-expanded" tabindex="0">
|
|
<svg class="svg-icon" viewBox="0 0 1792 1792">
|
|
<path fill-rule="evenodd" d="M1408 1216q0 26-19 45t-45 19h-896q-26 0-45-19t-19-45 19-45l448-448q19-19 45-19t45 19l448 448q19 19 19 45z"/>
|
|
</svg>
|
|
</a>
|
|
</h1>
|
|
</div>
|
|
<div class="items">
|
|
<label>
|
|
<span i18n-text="optionsAdvancedExposeIframes">
|
|
<a data-cmd="note"
|
|
i18n-title="optionsAdvancedExposeIframesNote"
|
|
href="#"
|
|
class="svg-inline-wrapper"
|
|
tabindex="0">
|
|
<svg class="svg-icon info"><use xlink:href="#svg-icon-help"/></svg>
|
|
</a>
|
|
</span>
|
|
<span class="onoffswitch">
|
|
<input type="checkbox" id="exposeIframes" class="slider">
|
|
<span></span>
|
|
</span>
|
|
</label>
|
|
<label class="chromium-only">
|
|
<span i18n-text="optionsAdvancedContextDelete"></span>
|
|
<span class="onoffswitch">
|
|
<input type="checkbox" id="editor.contextDelete" class="slider">
|
|
<span></span>
|
|
</span>
|
|
</label>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="block truegray-alpha-2" id="actions">
|
|
<button data-cmd="reset" i18n-text="optionsResetButton" i18n-title="optionsReset"></button>
|
|
<button data-cmd="open-manage" i18n-text="optionsOpenManager"></button>
|
|
<div data-cmd="check-updates">
|
|
<button i18n-text="optionsCheck" i18n-title="optionsCheckUpdate">
|
|
<span id="update-progress"></span>
|
|
</button>
|
|
<div id="updates-installed" i18n-text="updatesCurrentlyInstalled"></div>
|
|
</div>
|
|
<button data-cmd="open-keyboard" class="chromium-only" i18n-text="shortcuts" i18n-title="shortcutsNote"></button>
|
|
</div>
|
|
</div>
|
|
|
|
<svg xmlns="http://www.w3.org/2000/svg" style="display: none !important;">
|
|
<symbol id="svg-icon-help" viewBox="0 0 14 16">
|
|
<path fill-rule="evenodd" d="M6.3 5.69a.942.942 0 0 1-.28-.7c0-.28.09-.52.28-.7.19-.18.42-.28.7-.28.28 0 .52.09.7.28.18.19.28.42.28.7 0 .28-.09.52-.28.7a1 1 0 0 1-.7.3c-.28 0-.52-.11-.7-.3zM8 7.99c-.02-.25-.11-.48-.31-.69-.2-.19-.42-.3-.69-.31H6c-.27.02-.48.13-.69.31-.2.2-.3.44-.31.69h1v3c.02.27.11.5.31.69.2.2.42.31.69.31h1c.27 0 .48-.11.69-.31.2-.19.3-.42.31-.69H8V7.98v.01zM7 2.3c-3.14 0-5.7 2.54-5.7 5.68 0 3.14 2.56 5.7 5.7 5.7s5.7-2.55 5.7-5.7c0-3.15-2.56-5.69-5.7-5.69v.01zM7 .98c3.86 0 7 3.14 7 7s-3.14 7-7 7-7-3.12-7-7 3.14-7 7-7z"></path>
|
|
</symbol>
|
|
</svg>
|
|
|
|
<script src="options/options.js"></script>
|
|
</body>
|
|
</html>
|