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

workaround for crbug.com/1288447

Browse Source
This commit is contained in:
tophf 2022-02-19 17:12:15 +03:00
parent 16f7e19915
commit b804e39de6
7 changed files with 38 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
edit.html
View File

@ -62,7 +62,6 @@
<script src="edit/sections-editor-section.js"></script> <script src="edit/sections-editor-section.js"></script>
<script src="edit/sections-editor.js"></script> <script src="edit/sections-editor.js"></script>
<script src="edit/usw-integration.js"></script> <script src="edit/usw-integration.js"></script>
<script src="edit/edit.js"></script>
<template data-id="appliesTo"> <template data-id="appliesTo">
<li class="applies-to-item"> <li class="applies-to-item">
@ -239,13 +238,16 @@
<link href="vendor/codemirror/addon/search/matchesonscrollbar.css" rel="stylesheet"> <link href="vendor/codemirror/addon/search/matchesonscrollbar.css" rel="stylesheet">
<link href="js/color/color-picker.css" rel="stylesheet"> <link href="js/color/color-picker.css" rel="stylesheet">
<link href="edit/codemirror-default.css" rel="stylesheet"> <link href="edit/codemirror-default.css" rel="stylesheet">
<link href="edit/edit.css" rel="stylesheet">
<script src="js/dark-themer.js"></script> <!-- must be last in HEAD to avoid FOUC -->
</head>
<body id="stylus-edit"> <template data-id="body"> <!-- https://crbug.com/1288447 -->
<div id="header"> <div id="header">
<h1 id="heading" i18n="data-edit:editStyleHeading, data-add:addStyleTitle"></h1> <h1 id="heading" i18n="data-edit:editStyleHeading, data-add:addStyleTitle">
<a class="usercss-only"
href="https://github.com/openstyles/stylus/wiki/Usercss"
i18n="title:externalUsercssDocument" target="_blank">
<svg class="svg-icon info"><use xlink:href="#svg-icon-help"/></svg>
</a>
</h1>
<section id="basic-info"> <section id="basic-info">
<div id="basic-info-name"> <div id="basic-info-name">
<input id="name" class="style-contributor" spellcheck="false"> <input id="name" class="style-contributor" spellcheck="false">
@ -474,13 +476,21 @@
</symbol> </symbol>
<symbol id="svg-icon-plus" viewBox="0 0 8 8"> <symbol id="svg-icon-plus" viewBox="0 0 8 8">
<path fill-rule="evenodd" d="M3 0v3h-3v2h3v3h2v-3h3v-2h-3v-3h-2z"/> <path d="M3 0v3h-3v2h3v3h2v-3h3v-2h-3v-3h-2z"/>
</symbol> </symbol>
<symbol id="svg-icon-minus" viewBox="0 0 8 8"> <symbol id="svg-icon-minus" viewBox="0 0 8 8">
<path fill-rule="evenodd" d="M0 3v2h8v-2h-8z"/> <path d="M0 3v2h8v-2h-8z"/>
</symbol> </symbol>
</svg> </svg>
</template>
<link href="edit/edit.css" rel="stylesheet">
<script src="js/dark-themer.js"></script> <!-- must be last in HEAD to avoid FOUC -->
</head>
<body id="stylus-edit">
<script src="edit/edit.js"></script>
</body> </body>
</html> </html>

4
edit/edit.css
View File

@ -42,7 +42,7 @@ html.is-new-style #publish,
html.is-new-style #heading::after { html.is-new-style #heading::after {
content: attr(data-add); content: attr(data-add);
} }
html:not(.is-new-style) #heading::after { html:not(.is-new-style) #heading::before {
content: attr(data-edit); content: attr(data-edit);
} }
@ -802,8 +802,6 @@ body:not(.find-open) [data-match-highlight-count="1"] .CodeMirror-selection-high
} }
#help-popup button[name^="import"] { #help-popup button[name^="import"] {
line-height: 1.5rem; line-height: 1.5rem;
padding: 0 0.5rem;
margin: 0.5rem 0 0 0.5rem;
pointer-events: none; pointer-events: none;
opacity: 0.5; opacity: 0.5;
} }

2
edit/edit.js
View File

@ -16,6 +16,8 @@
//#region init //#region init
document.body.appendChild(t.template.body);
baseInit.ready.then(async () => { baseInit.ready.then(async () => {
[editor.template] = await Promise.all([ [editor.template] = await Promise.all([
editor.isUsercss && !editor.style.id && chromeSync.getLZValue(chromeSync.LZ_KEY.usercssTemplate), editor.isUsercss && !editor.style.id && chromeSync.getLZValue(chromeSync.LZ_KEY.usercssTemplate),

7
js/dom.js
View File

@ -12,7 +12,6 @@
getEventKeyName getEventKeyName
messageBoxProxy messageBoxProxy
moveFocus moveFocus
onDOMready
scrollElementIntoView scrollElementIntoView
setupLivePrefs setupLivePrefs
showSpinner showSpinner
@ -275,12 +274,6 @@ function moveFocus(rootElement, step) {
} }
} }
function onDOMready() {
return document.readyState !== 'loading'
? Promise.resolve()
: new Promise(resolve => document.on('DOMContentLoaded', () => resolve(), {once: true}));
}
/** /**
* Scrolls `window` or the closest parent with `class="scroller"` if the element is not visible, * Scrolls `window` or the closest parent with `class="scroller"` if the element is not visible,
* centering the element in the view * centering the element in the view

15
manage.html
View File

@ -147,14 +147,8 @@
<script src="manage/filters.js"></script> <script src="manage/filters.js"></script>
<script src="manage/render.js"></script> <script src="manage/render.js"></script>
<script src="manage/sorter.js"></script> <script src="manage/sorter.js"></script>
<script src="manage/manage.js"></script>
<link rel="stylesheet" href="manage/manage.css">
<script src="js/dark-themer.js"></script> <!-- must be last in HEAD to avoid FOUC -->
</head>
<body id="stylus-manage" i18n="dragndrop-hint:dragDropMessage">
<template data-id="body"> <!-- https://crbug.com/1288447 -->
<div id="header"> <div id="header">
<h1 id="manage-heading" i18n="manageHeading"></h1> <h1 id="manage-heading" i18n="manageHeading"></h1>
@ -384,6 +378,13 @@
<path d="M0,16h7v-6H0V16z M1,11h5v4H1V11z M0,5h7V0H0V5z M1,1h5v3H1V1z M13,11v3l-4-3.5L13,7v3h2V3H8V2h8v9H13z M7,9H0V8h7V9z M7,7H0V6h7V7z"/> <path d="M0,16h7v-6H0V16z M1,11h5v4H1V11z M0,5h7V0H0V5z M1,1h5v3H1V1z M13,11v3l-4-3.5L13,7v3h2V3H8V2h8v9H13z M7,9H0V8h7V9z M7,7H0V6h7V7z"/>
</symbol> </symbol>
</svg> </svg>
</template>
<link rel="stylesheet" href="manage/manage.css">
<script src="js/dark-themer.js"></script> <!-- must be last in HEAD to avoid FOUC -->
</head>
<body id="stylus-manage" i18n="dragndrop-hint:dragDropMessage">
<script src="manage/manage.js"></script>
</body> </body>
</html> </html>

3
manage/manage.js
View File

@ -17,6 +17,8 @@
*/// dom.js */// dom.js
'use strict'; 'use strict';
document.body.appendChild(t.template.body);
/** @type {HTMLElement} */ /** @type {HTMLElement} */
let installed; let installed;
@ -66,6 +68,7 @@ newUI.renderClass();
window.on('pageshow', handleVisibilityChange); window.on('pageshow', handleVisibilityChange);
window.on('pagehide', handleVisibilityChange); window.on('pagehide', handleVisibilityChange);
setupLivePrefs(); setupLivePrefs();
sorter.init();
router.update(); router.update();
prefs.subscribe(newUI.ids.map(newUI.prefKeyForId), () => switchUI()); prefs.subscribe(newUI.ids.map(newUI.prefKeyForId), () => switchUI());
switchUI({styleOnly: true}); switchUI({styleOnly: true});

10
manage/sorter.js
View File

@ -1,4 +1,4 @@
/* global $ $create messageBoxProxy onDOMready */// dom.js /* global $ $create messageBoxProxy */// dom.js
/* global installed */// manage.js /* global installed */// manage.js
/* global prefs */ /* global prefs */
/* global t */// localization.js /* global t */// localization.js
@ -66,16 +66,16 @@ const sorter = (() => {
let columns = 1; let columns = 1;
onDOMready().then(() => { function init() {
prefs.subscribe(ID, sorter.update); prefs.subscribe(ID, sorter.update);
$('#sorter-help').onclick = showHelp; $('#sorter-help').onclick = showHelp;
addOptions(); addOptions();
updateColumnCount(); updateColumnCount();
}); }
function addOptions() { function addOptions() {
let container; let container;
const select = $('#manage.newUI.sort'); const select = $('#' + ID);
const renderBin = document.createDocumentFragment(); const renderBin = document.createDocumentFragment();
const option = $create('option'); const option = $create('option');
const optgroup = $create('optgroup'); const optgroup = $create('optgroup');
@ -118,6 +118,8 @@ const sorter = (() => {
return { return {
init,
sort({styles}) { sort({styles}) {
const sortBy = getPref().split(splitRegex); const sortBy = getPref().split(splitRegex);
const len = sortBy.length; const len = sortBy.length;