open.source/stylus
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity
7ecfd0fa80
stylus/popup.html

148 lines
5.8 KiB
HTML
Raw Normal View History

Add <html id="stylus"> to all pages
2017-03-23 03:41:50 +00:00
<html id="stylus">
initial commit
2012-04-16 01:56:12 +00:00
Options UI discoverability and other fixes #34
2017-02-28 23:57:03 +00:00
<head>
polish popup/manage/edit css/svg/etc. * restore the correct width of svg icons * popup: use the standard formatting & SVG <symbol> * popup .breadcrumbs hover highlight * manage: black links, transitions; use <p> in #options; trim .homepage * edit: move regexp tester info link to a template
2017-04-01 04:37:25 +00:00
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
Fix links & split out edit.css
2017-07-12 18:52:44 +00:00
<link rel="stylesheet" href="popup/popup.css">
Move html templates to html file
2015-07-19 15:27:19 +00:00
improve CSS transition suppression on own pages in FF
2017-09-03 20:52:06 +00:00
<style id="firefox-transitions-bug-suppressor">
/* restrict to FF */
@-moz-document url-prefix("") {
/* increased specificity to override sane selectors in user styles */
html#stylus.firefox #stylus-popup #actions * {
transition: none !important;
}
}
</style>
embed SVG to help buggy Chrome's GC Chrome doesn't garbage-collect (or even leaks) SVG <symbol> referenced via <use> so we'll embed the code directly on manage and popup pages where dozens/hundreds of svgs are displayed.
2017-04-08 17:45:45 +00:00
<!-- Notes:
* Chrome doesn't garbage-collect (or even leaks) SVG <symbol> referenced via <use> so we'll embed the code directly
* inter-tag whitespace in templates is automatically removed in localization.js
* i18n-anything attribute automatically creates "anything" attribute
-->
polish popup/manage/edit css/svg/etc. * restore the correct width of svg icons * popup: use the standard formatting & SVG <symbol> * popup .breadcrumbs hover highlight * manage: black links, transitions; use <p> in #options; trim .homepage * edit: move regexp tester info link to a template
2017-04-01 04:37:25 +00:00
<template data-id="style">
<div class="entry">
<div class="left-gutter">
<input class="checker" type="checkbox">
</div>
<div class="main-controls">
<label class="style-name"></label>
<div class="actions">
<a href="#" class="enable" i18n-text="enableStyleLabel"></a>
<a href="#" class="disable" i18n-text="disableStyleLabel"></a>
<a class="style-edit-link" href="edit.html?id=" i18n-title="editStyleLabel">
embed SVG to help buggy Chrome's GC Chrome doesn't garbage-collect (or even leaks) SVG <symbol> referenced via <use> so we'll embed the code directly on manage and popup pages where dozens/hundreds of svgs are displayed.
2017-04-08 17:45:45 +00:00
<svg class="svg-icon edit" viewBox="0 0 14 16">
<path fill-rule="evenodd" d="M0 12v3h3l8-8-3-3-8 8zm3 2H1v-2h1v1h1v1zm10.3-9.3L12 6 9 3l1.3-1.3a.996.996 0 0 1 1.41 0l1.59 1.59c.39.39.39 1.02 0 1.41z"/>
</svg>
polish popup/manage/edit css/svg/etc. * restore the correct width of svg icons * popup: use the standard formatting & SVG <symbol> * popup .breadcrumbs hover highlight * manage: black links, transitions; use <p> in #options; trim .homepage * edit: move regexp tester info link to a template
2017-04-01 04:37:25 +00:00
</a>
<a href="#" class="delete" i18n-title="deleteStyleLabel">
embed SVG to help buggy Chrome's GC Chrome doesn't garbage-collect (or even leaks) SVG <symbol> referenced via <use> so we'll embed the code directly on manage and popup pages where dozens/hundreds of svgs are displayed.
2017-04-08 17:45:45 +00:00
<svg class="svg-icon remove" viewBox="0 0 14 16">
<path fill-rule="evenodd" d="M11 2H9c0-.55-.45-1-1-1H5c-.55 0-1 .45-1 1H2c-.55 0-1 .45-1 1v1c0 .55.45 1 1 1v9c0 .55.45 1 1 1h7c.55 0 1-.45 1-1V5c.55 0 1-.45 1-1V3c0-.55-.45-1-1-1zm-1 12H3V5h1v8h1V5h1v8h1V5h1v8h1V5h1v9zm1-10H2V3h9v1z"/>
</svg>
polish popup/manage/edit css/svg/etc. * restore the correct width of svg icons * popup: use the standard formatting & SVG <symbol> * popup .breadcrumbs hover highlight * manage: black links, transitions; use <p> in #options; trim .homepage * edit: move regexp tester info link to a template
2017-04-01 04:37:25 +00:00
</a>
Options UI discoverability and other fixes #34
2017-02-28 23:57:03 +00:00
</div>
polish popup/manage/edit css/svg/etc. * restore the correct width of svg icons * popup: use the standard formatting & SVG <symbol> * popup .breadcrumbs hover highlight * manage: black links, transitions; use <p> in #options; trim .homepage * edit: move regexp tester info link to a template
2017-04-01 04:37:25 +00:00
</div>
</div>
</template>
initial commit
2012-04-16 01:56:12 +00:00
polish popup/manage/edit css/svg/etc. * restore the correct width of svg icons * popup: use the standard formatting & SVG <symbol> * popup .breadcrumbs hover highlight * manage: black links, transitions; use <p> in #options; trim .homepage * edit: move regexp tester info link to a template
2017-04-01 04:37:25 +00:00
<template data-id="writeStyle">
<a class="write-style-link"></a>
</template>
Refactor and speed up popup & manager Popup: * Enforce 200-800px range for the popup width option Manage: * faster search via cachedStyles.byId * faster restoration of search results on history nav * style name is clickable and opens the editor * animated highlight of style element on update/add/save * expandable extra applies-to targets * remember scroll position on normal history navigation * boz-sizing in #header, also in editor * applies-to targets use structured markup * get*Tab*, enableStyle and deleteStyle are promisified
2017-03-21 01:32:38 +00:00
polish popup/manage/edit css/svg/etc. * restore the correct width of svg icons * popup: use the standard formatting & SVG <symbol> * popup .breadcrumbs hover highlight * manage: black links, transitions; use <p> in #options; trim .homepage * edit: move regexp tester info link to a template
2017-04-01 04:37:25 +00:00
<template data-id="noStyles">
<div id="no-styles" class="entry" i18n-text="noStylesForSite"></div>
</template>
confirmDelete: extract, refactor, use in manage
2017-03-25 03:04:24 +00:00
polish popup/manage/edit css/svg/etc. * restore the correct width of svg icons * popup: use the standard formatting & SVG <symbol> * popup .breadcrumbs hover highlight * manage: black links, transitions; use <p> in #options; trim .homepage * edit: move regexp tester info link to a template
2017-04-01 04:37:25 +00:00
<template data-id="regexpProblemIndicator">
<div class="regexp-problem-indicator" i18n-title="styleRegexpProblemTooltip"></div>
</template>
Remove code:false mode; show sloppy regexps in popup * Now that our own pages retrieve the styles directly via getStylesSafe the only 0.001% of cases where code:false would be needed (the browser is starting up with some of the tabs showing our built-in pages like editor or manage) is not worth optimizing for. * According to CSS4 @document specification the entire URL must match. Stylish-for-Chrome implemented it incorrectly since the very beginning. We detect styles that abuse the bug by finding the sections that would have been applied by Stylish but not by us as we follow the spec. Additionally we'll check for invalid regexps.
2017-03-30 23:18:41 +00:00
polish popup/manage/edit css/svg/etc. * restore the correct width of svg icons * popup: use the standard formatting & SVG <symbol> * popup .breadcrumbs hover highlight * manage: black links, transitions; use <p> in #options; trim .homepage * edit: move regexp tester info link to a template
2017-04-01 04:37:25 +00:00
<template data-id="regexpProblemExplanation">
<div id="regexp-explanation">
<div id="regexp-partial" i18n-html="styleRegexpPartialExplanation"></div>
<div id="regexp-invalid" i18n-text="styleRegexpInvalidExplanation"></div>
<button i18n-text="confirmOK"></button>
</div>
</template>
Remove code:false mode; show sloppy regexps in popup * Now that our own pages retrieve the styles directly via getStylesSafe the only 0.001% of cases where code:false would be needed (the browser is starting up with some of the tabs showing our built-in pages like editor or manage) is not worth optimizing for. * According to CSS4 @document specification the entire URL must match. Stylish-for-Chrome implemented it incorrectly since the very beginning. We detect styles that abuse the bug by finding the sections that would have been applied by Stylish but not by us as we follow the spec. Additionally we'll check for invalid regexps.
2017-03-30 23:18:41 +00:00
abandon automatic translation in CSS * it fails with some languages in some versions of FF * it's not as flexible as HTML templates * we were only using it for a few messages
2017-08-27 09:56:09 +00:00
<template data-id="unavailableInfo">
<div class="blocked-info">
<label i18n-text="stylusUnavailableForURL"></label>
<p i18n-text="stylusUnavailableForURLdetails"></p>
</div>
</template>
<template data-id="unreachableInfo">
<div class="blocked-info">
<label i18n-text="unreachableContentScript"></label>
<p i18n-text="unreachableFileHint"></p>
</div>
</template>
Fix links & split out edit.css
2017-07-12 18:52:44 +00:00
<script src="js/dom.js"></script>
Move messaging.js file & references
2017-07-14 00:52:40 +00:00
<script src="js/messaging.js"></script>
Fix links & split out edit.css
2017-07-12 18:52:44 +00:00
<script src="js/localization.js"></script>
<script src="js/prefs.js"></script>
<script src="content/apply.js"></script>
<script src="popup/popup.js"></script>
Options UI discoverability and other fixes #34
2017-02-28 23:57:03 +00:00
</head>
initial commit
2012-04-16 01:56:12 +00:00
Change 'body' id
2017-03-05 14:40:48 +00:00
<body id="stylus-popup">
polish popup/manage/edit css/svg/etc. * restore the correct width of svg icons * popup: use the standard formatting & SVG <symbol> * popup .breadcrumbs hover highlight * manage: black links, transitions; use <p> in #options; trim .homepage * edit: move regexp tester info link to a template
2017-04-01 04:37:25 +00:00
<div id="confirm">
<div>
<b>Style's Name</b>
<span i18n-text="deleteStyleConfirm"></span>
<div>
<button i18n-text="confirmDelete" data-cmd="ok"></button>
<button i18n-text="confirmCancel" data-cmd="cancel"></button>
</div>
new fix for https://github.com/schomery/stylish-chrome/issues/43#issuecomment-286154032
2017-03-13 19:26:43 +00:00
</div>
polish popup/manage/edit css/svg/etc. * restore the correct width of svg icons * popup: use the standard formatting & SVG <symbol> * popup .breadcrumbs hover highlight * manage: black links, transitions; use <p> in #options; trim .homepage * edit: move regexp tester info link to a template
2017-04-01 04:37:25 +00:00
</div>
<div id="installed"></div>
<div class="actions">
<div id="disable-all-wrapper">
<div class="left-gutter">
<input id="disableAll" type="checkbox">
</div>
<div class="main-controls">
<label id="disableAll-label" for="disableAll" i18n-text="disableAllStyles"></label>
</div>
</div>
<div class="left-gutter"></div>
<div class="main-controls">
<div id="find-styles">
popup: USO workaround for finding extension styles
2017-09-30 00:01:07 +00:00
<a id="find-styles-link" href="https://userstyles.org/styles/browse/"
i18n-text="findStylesForSite"></a>
add support for freestyler.ws * handle style action buttons on the site pages * popup find-styles links with icons * auto-updater
2017-08-19 17:41:50 +00:00
<span i18n-title="findStylesSiteSelectorTooltip"
data-toggle-on-click="#find-styles-sources">
<svg class="svg-icon info" viewBox="0 0 14 16" i18n-alt="helpAlt">
<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>
</svg>
</span>
<div id="find-styles-sources" class="hidden">
<a href="https://userstyles.org/styles/browse/all/"
data-pref-value="userstyles"><img src="images/world-userstyles.png"><span>userstyles.org</span></a>
<a href="http://freestyler.ws/search?q="
data-pref-value="freestyler"><img src="images/world-freestyler.png"><span>freestyler.ws</span></a>
</div>
polish popup/manage/edit css/svg/etc. * restore the correct width of svg icons * popup: use the standard formatting & SVG <symbol> * popup .breadcrumbs hover highlight * manage: black links, transitions; use <p> in #options; trim .homepage * edit: move regexp tester info link to a template
2017-04-01 04:37:25 +00:00
</div>
<div id="write-style">
<span id="write-style-for" i18n-text="writeStyleFor"></span>
</div>
Options UI discoverability and other fixes #34
2017-02-28 23:57:03 +00:00
</div>
a few changes in the popup look based on #38
2017-03-06 13:54:56 +00:00
<!-- Actions -->
<div id="popup-options">
use optionsOpenManager message in popup's "manage" button tooltip
2017-08-18 11:47:23 +00:00
<button id="popup-manage-button" i18n-text="openManage"
URL-mode in manager's search and popup's manage button * in manager use search query like url:https://github.com/openstyles/stylus * in popup shift-click or right-click on manager button opens it and applies the filter
2017-08-22 16:29:26 +00:00
data-href="manage.html" i18n-title="popupManageTooltip"></button>
polish popup/manage/edit css/svg/etc. * restore the correct width of svg icons * popup: use the standard formatting & SVG <symbol> * popup .breadcrumbs hover highlight * manage: black links, transitions; use <p> in #options; trim .homepage * edit: move regexp tester info link to a template
2017-04-01 04:37:25 +00:00
<button id="popup-options-button" i18n-text="openOptionsPopup"></button>
optionsUI: make "Shortcuts" a button; unify translations
2017-04-29 16:27:42 +00:00
<button id="popup-shortcuts-button" class="chromium-only"
i18n-text="shortcuts"
i18n-title="shortcutsNote"></button>
Options UI discoverability and other fixes #34
2017-02-28 23:57:03 +00:00
</div>
polish popup/manage/edit css/svg/etc. * restore the correct width of svg icons * popup: use the standard formatting & SVG <symbol> * popup .breadcrumbs hover highlight * manage: black links, transitions; use <p> in #options; trim .homepage * edit: move regexp tester info link to a template
2017-04-01 04:37:25 +00:00
</div>
</body>
a few changes in the popup look based on #38
2017-03-06 13:54:56 +00:00
</html>
Reference in New Issue Copy Permalink