Apq
/
stylus
mirror da https://github.com/openstyles/stylus.git


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325
							<!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">

  <script src="js/polyfill.js"></script>
  <script src="js/toolbox.js"></script>
  <script src="js/msg.js"></script>
  <script src="js/localization.js"></script>
  <script src="js/prefs.js"></script>
  <script src="js/dom.js"></script>

  <script src="content/style-injector.js"></script>
  <script src="content/apply.js"></script>

  <link rel="stylesheet" href="options/onoffswitch.css">
  <link rel="stylesheet" href="options/options.css">
</head>

<body id="stylus-options">

  <div id="options-header">
    <div id="options-title" i18n-text-append="optionsHeading">
      <div id="options-close-icon">
        <svg viewBox="0 0 20 20" class="svg-icon">
          <path d="M11.69,10l4.55,4.55-1.69,1.69L10,11.69,5.45,16.23,3.77,14.55,8.31,10,3.77,5.45,5.45,3.77,10,8.31l4.55-4.55,1.69,1.69Z"></path>
        </svg>
      </div>
    </div>
  </div>

  <div id="options">

    <div class="options-wrapper">

      <div class="block">
        <h1 i18n-text="cm_theme"></h1>
        <div class="items">
          <div class="label">
            <a i18n-text="optionsStylusThemes" target="_blank"
               href="https://33kk.github.io/uso-archive/?category=chrome-extension&search=Stylus"></a>
          </div>
        </div>
      </div>

      <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" value="0" data-value-type="number">
              <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" value="1" data-value-type="number">
              <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="popupOpenEditInPopup"></span>
            <span class="onoffswitch">
              <input type="checkbox" id="openEditInWindow.popup" 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>
            <span i18n-text="popupAutoResort"></span>
            <span class="onoffswitch">
              <input type="checkbox" id="popup.autoResort" class="slider">
              <span></span>
            </span>
          </label>
          <label class="chromium-only chrome-no-popup-border">
            <span i18n-text="popupBorders" i18n-title="popupBordersTooltip"></span>
            <span class="onoffswitch">
              <input type="checkbox" id="popup.borders" class="slider">
              <span></span>
            </span>
          </label>
        </div>
      </div>

      <div class="block">
        <h1 i18n-text="openManage"></h1>
        <div class="items">
          <label>
            <span i18n-text="manageNewUI"></span>
            <span class="onoffswitch">
              <input type="checkbox" id="manage.newUI" class="slider">
              <span></span>
            </span>
          </label>
          <label>
            <span i18n-text="manageFavicons">
              <a i18n-title="manageFaviconsHelp"
                 data-cmd="note" 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="manage.newUI.favicons" class="slider">
              <span></span>
            </span>
          </label>
          <label>
            <span i18n-text="manageFaviconsGray"></span>
            <span class="onoffswitch">
              <input type="checkbox" id="manage.newUI.faviconsGray" class="slider">
              <span></span>
            </span>
          </label>
          <label>
            <span i18n-text="manageMaxTargets"></span>
            <input id="manage.newUI.targets" type="number" min="1" max="99">
          </label>
        </div>
      </div>

      <div class="block" id="updates">
        <h1 i18n-text="optionsCustomizeUpdate"></h1>
        <div class="items">
          <label>
            <span i18n-text="optionsUpdateInterval">
              <a i18n-title="optionsUpdateImportNote"
                 data-cmd="note" 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 sync-options">
        <h1 i18n-text="optionsCustomizeSync"></h1>
        <div class="items">
          <div class="label">
            <span class="sync-status"></span>
            <div class="select-resizer">
              <select class="cloud-name">
                <option value="none" i18n-text="optionsSyncNone"></option>
                <option value="dropbox">Dropbox</option>
                <option value="google">Google Drive</option>
                <option value="onedrive">OneDrive</option>
              </select>
              <svg class="svg-icon select-arrow"><use xlink:href="#svg-icon-select-arrow"/></svg>
            </div>
          </div>
          <div class="actions">
            <button type="button" class="connect" i18n-text="optionsSyncConnect"></button>
            <button type="button" class="disconnect" i18n-text="optionsSyncDisconnect"></button>
            <button type="button" class="sync-now" i18n-text="optionsSyncSyncNow"></button>
            <button type="button" class="sync-login" i18n-text="optionsSyncLogin"></button>
          </div>
        </div>
      </div>

      <div class="block" id="advanced">
        <div class="collapsible-resizer">
          <h1 i18n-text="optionsAdvanced">
            <a 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 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 class="chromium-only">
            <span i18n-text="optionsAdvancedStyleViaXhr">
              <a i18n-title="optionsAdvancedStyleViaXhrNote"
                 data-cmd="note" 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="styleViaXhr" class="slider">
              <span></span>
            </span>
          </label>
          <label>
            <span>
              <span i18n-html="optionsAdvancedPatchCsp"></span>
              <a i18n-title="optionsAdvancedPatchCspNote"
                 data-cmd="note" 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="patchCsp" class="slider">
              <span></span>
            </span>
          </label>
          <label>
            <span i18n-text="optionsAdvancedExposeIframes">
              <a i18n-title="optionsAdvancedExposeIframesNote"
                 data-cmd="note" 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 class="radio-group">
            <span i18n-text="optionsAdvancedAutoSwitchScheme" class="radio-group-label"></span>
            <label class="radio-group-item">
              <input type="radio" value="never" name="schemeSwitcher.enabled" class="radio">
              <span i18n-text="optionsAdvancedAutoSwitchSchemeNever"></span>
            </label>
            <label class="radio-group-item">
              <input type="radio" value="system" name="schemeSwitcher.enabled" class="radio">
              <span i18n-text="optionsAdvancedAutoSwitchSchemeBySystem"></span>
            </label>
            <label class="radio-group-item">
              <input type="radio" value="time" name="schemeSwitcher.enabled" class="radio">
              <span>
                <span i18n-text="optionsAdvancedAutoSwitchSchemeByTime"></span>
                <input type="text" pattern="\d{2}:\d{2}" required id="schemeSwitcher.nightStart" class="input-sm">
                ~
                <input type="text" pattern="\d{2}:\d{2}" required id="schemeSwitcher.nightEnd" class="input-sm">
              </span>
            </label>
          </div>
        </div>
      </div>

    </div>

    <div class="block" id="actions">
      <button data-cmd="reset" i18n-text="optionsResetButton" i18n-title="optionsReset"></button>
      <button data-cmd="open-manage" i18n-text="styleCancelEditLabel"></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>

    <symbol id="svg-icon-select-arrow" 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"/>
    </symbol>
  </svg>

  <script src="options/options.js"></script>
</body>
</html>