Ditch tabs & add header icons
This commit is contained in:
Rob Garrison
parent
8f87494dec
commit
596d6a9ca9
|
|
@ -554,6 +554,10 @@
|
|||
"message": "Get help",
|
||||
"description": "Homepage link text on the manage page e.g. https://add0n.com/stylus.html#features with chat/FAQ/intro/info"
|
||||
},
|
||||
"linkChat": {
|
||||
"message": "Chat with us",
|
||||
"description": "Link to open a new browser tab to chat with users & developers on Discord"
|
||||
},
|
||||
"linkGetStyles": {
|
||||
"message": "Get styles",
|
||||
"description": "Help link text on the manage page e.g. https://userstyles.org"
|
||||
|
|
|
|||
153
manage.html
153
manage.html
|
|
@ -54,19 +54,19 @@
|
|||
<span class="entry-labels"></span>
|
||||
</div>
|
||||
<div class="entry-col entry-actions">
|
||||
<a href="#" class="entry-homepage">
|
||||
<a href="#" class="entry-homepage tt-w">
|
||||
<svg class="svg-icon home" viewBox="0 0 24 24">
|
||||
<path d="M20 21h-7v-6h-2v6H4v-8H0L12 2l12 11h-4v8zm-5-2h3v-8h1l-7-6-7 6h1v8h3v-6h6v6z"/>
|
||||
</svg>
|
||||
</a>
|
||||
<a href="#" class="entry-support">
|
||||
<a href="#" class="entry-support tt-w">
|
||||
<svg class="svg-icon help" viewBox="0 0 24 24">
|
||||
<path d="M11 18h2v-2h-2v2zm1-16a10 10 0 1 0 0 20 10 10 0 0 0 0-20zm0 18a8.01 8.01 0 0 1
|
||||
0-16 8.01 8.01 0 0 1 0 16zm0-14a4 4 0 0 0-4 4h2c0-1.1.9-2 2-2s2 .9 2 2c0 2-3 1.75-3
|
||||
5h2c0-2.25 3-2.5 3-5a4 4 0 0 0-4-4z"/>
|
||||
</svg>
|
||||
</a>
|
||||
<a href="#" class="entry-configure-usercss" i18n-data-title="configureStyle">
|
||||
<a href="#" class="entry-configure-usercss tt-e" i18n-data-title="configureStyle">
|
||||
<svg class="svg-icon config" viewBox="0 0 24 24">
|
||||
<path d="M19.43 12.98a7.8 7.8 0 0 0 0-1.96l2.11-1.65a.5.5 0 0 0 .12-.64l-2-3.46a.5.5
|
||||
0 0 0-.61-.22l-2.49 1a7.3 7.3 0 0 0-1.69-.98l-.38-2.65A.49.49 0 0 0 14 2h-4a.49.49
|
||||
|
|
@ -85,14 +85,14 @@
|
|||
1.13zM12 8a4 4 0 1 0 0 8 4 4 0 0 0 0-8zm0 6c-1.1 0-2-.9-2-2s.9-2 2-2 2 .9 2 2-.9 2-2 2z"/>
|
||||
</svg>
|
||||
</a>
|
||||
<a href="#" class="entry-edit" i18n-data-title="editStyleLabel">
|
||||
<a href="#" class="entry-edit tt-e" i18n-data-title="editStyleLabel">
|
||||
<svg class="svg-icon edit" viewBox="0 0 24 24">
|
||||
<path d="M3 17.25V21h3.75L17.81 9.94l-3.75-3.75L3 17.25zM5.92 19H5v-.92l9.06-9.06.92.92L5.92
|
||||
19zM20.71 5.63l-2.34-2.34c-.2-.2-.45-.29-.71-.29s-.51.1-.7.29l-1.83 1.83 3.75 3.75
|
||||
1.83-1.83a1 1 0 0 0 0-1.41z"/>
|
||||
</svg>
|
||||
</a>
|
||||
<a href="#" class="entry-delete" i18n-data-title="deleteStyleLabel">
|
||||
<a href="#" class="entry-delete tt-e" i18n-data-title="deleteStyleLabel">
|
||||
<svg class="svg-icon remove" viewBox="0 0 24 24">
|
||||
<path d="M6 19c0 1.1.9 2 2 2h8a2 2 0 0 0 2-2V7H6v12zM8 9h8v10H8V9zm7.5-5l-1-1h-5l-1 1H5v2h14V4z"/>
|
||||
</svg>
|
||||
|
|
@ -104,7 +104,7 @@
|
|||
</svg>
|
||||
</div>
|
||||
<div class="entry-col entry-version"></div>
|
||||
<div class="entry-col entry-last-update"></div>
|
||||
<div class="entry-col entry-last-update tt-w"></div>
|
||||
<div class="entry-col entry-applies-to">
|
||||
<div class="targets"></div>
|
||||
</div>
|
||||
|
|
@ -113,7 +113,7 @@
|
|||
|
||||
<template data-id="updaterIcons">
|
||||
<span class="updater-icons entry-col entry-update-state">
|
||||
<a href="#" class="check-update" i18n-data-title="checkForUpdate" tabindex="0">
|
||||
<a href="#" class="check-update tt-e" i18n-data-title="checkForUpdate" tabindex="0">
|
||||
<svg class="svg-icon" viewBox="0 0 20 20">
|
||||
<path d="M18,16.6l-3.1-3.1c0.5-0.7,0.9-1.5,1-2.5h-2.1c-0.4,1.7-2,3-3.9,3c-0.8,0-1.6-0.3-2.3-0.7
|
||||
L10,11H6.1H4.1H4v6l2.3-2.3c1,0.8,2.3,1.3,3.7,1.3c1.3,0,2.5-0.4,3.5-1.1l3.1,3.1L18,16.6z"/>
|
||||
|
|
@ -121,18 +121,18 @@
|
|||
C7,4,4.6,6.2,4.1,9h2.1C6.6,7.3,8.1,6,10,6z"/>
|
||||
</svg>
|
||||
</a>
|
||||
<a href="#" class="update" i18n-data-title="installUpdate" tabindex="0">
|
||||
<a href="#" class="update tt-e" i18n-data-title="installUpdate" tabindex="0">
|
||||
<svg class="svg-icon" viewBox="0 0 20 20">
|
||||
<polygon points="16,8 12,8 12,3 8,3 8,8 4,8 10,14 "/>
|
||||
<rect shape-rendering="crispEdges" x="4" y="15" width="12" height="2"/>
|
||||
</svg>
|
||||
</a>
|
||||
<span class="up-to-date" i18n-data-title="updateCheckSucceededNoUpdate">
|
||||
<span class="up-to-date tt-e" i18n-data-title="updateCheckSucceededNoUpdate">
|
||||
<svg class="svg-icon" viewBox="0 0 20 20">
|
||||
<polygon points="15.83 4.75 8.76 11.82 5.2 8.26 3.51 9.95 8.76 15.19 17.52 6.43 15.83 4.75"/>
|
||||
</svg>
|
||||
</span>
|
||||
<span class="updated" i18n-data-title="updateCompleted">
|
||||
<span class="updated tt-e" i18n-data-title="updateCompleted">
|
||||
<svg class="svg-icon" viewBox="0 0 20 20">
|
||||
<polygon points="15.83 4.75 8.76 11.82 5.2 8.26 3.51 9.95 8.76 15.19 17.52 6.43 15.83 4.75"/>
|
||||
</svg>
|
||||
|
|
@ -141,7 +141,11 @@
|
|||
</template>
|
||||
|
||||
<template data-id="appliesToTarget">
|
||||
<img class="target" src="data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='%23666' d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20zm7 6h-3l-1-4 4 4zm-7-4l2 4h-4l2-4zM4 14a8 8 0 0 1 0-4h4a17 17 0 0 0 0 4H4zm1 2h3l1 4-4-4zm3-8H5l4-4-1 4zm4 12l-2-4h4l-2 4zm2-6h-4a15 15 0 0 1 0-4h4a15 15 0 0 1 0 4zm1 6l1-4h3l-4 4zm1-6a17 17 0 0 0 0-4h4a8 8 0 0 1 0 4h-4z'/></svg>" async="true"/>
|
||||
<span class="target tt-w">
|
||||
<svg class="svg-icon" viewBox="0 0 24 24">
|
||||
<path fill="#666" d="M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20zm7 6h-3l-1-4 4 4zm-7-4l2 4h-4l2-4zM4 14a8 8 0 0 1 0-4h4a17 17 0 0 0 0 4H4zm1 2h3l1 4-4-4zm3-8H5l4-4-1 4zm4 12l-2-4h4l-2 4zm2-6h-4a15 15 0 0 1 0-4h4a15 15 0 0 1 0 4zm1 6l1-4h3l-4 4zm1-6a17 17 0 0 0 0-4h4a8 8 0 0 1 0 4h-4z"/>
|
||||
</svg>
|
||||
</span>
|
||||
</template>
|
||||
|
||||
<template data-id="appliesToEverything">
|
||||
|
|
@ -192,38 +196,71 @@
|
|||
<body id="stylus-manage" i18n-dragndrop-hint="dragDropMessage">
|
||||
|
||||
<h1 id="main-header">
|
||||
<svg id="stylus-logo" width="32" height="32" viewBox="0 0 48 48">
|
||||
<path fill="#285959" d="M44.59 20.14c-.02-.86 0-13.6 0-13.6-.02-4.13-2.5-5.62-6.6-5.64H11.28C7.17.92
|
||||
4.59 2.44 4.65 6.54v14.2c0 1.64-3.02 1.55-3.02 1.55v3.48s3.05.03 3.02 1.97v13.88c0 4.15 2.5 5.63
|
||||
6.63 5.63h26.71c4.13.02 6.6-1.45 6.6-5.63V27.35c0-1.54 2.98-1.57 2.98-1.57l.04-3.84s-3-.07-3.02-1.8z"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" fill="#28FEFE" d="M46 20.98V5.62A5.72 5.72 0 0 0
|
||||
40.22.03H8.66a5.63 5.63 0 0 0-5.68 5.59v15.37H0v6h2.98v15.4a5.67 5.67 0 0 0 5.68 5.64h31.56A5.76
|
||||
5.76 0 0 0 46 42.39V26.94h2.03v-5.98l-2.03.02zm-2 5.65v13.76c0 4.19-2.43 5.65-6.56 5.64H10.66c-4.13
|
||||
0-5.69-1.48-5.69-5.64V27.1c.04-1.94-2.93-1.97-2.93-1.97v-2.21s2.93.09 2.93-1.54c.05-.52 0-13.84
|
||||
0-13.84-.05-4.1 1.57-5.57 5.68-5.59h26.79c4.1.02 6.54 1.46 6.56 5.59 0 0 .08 12.87 0 13.4.02 1.73
|
||||
1.98 1.94 1.98 1.94v2.19S44 25.09 44 26.63zm-16.76-6.2c-4.56-1.71-6.47-2.7-6.47-4.92 0-1.77 1.65-3.37
|
||||
5.07-3.37 3.37 0 5.9.98 7.26 1.66l1.76-6.33c-2.08-.98-4.92-1.76-8.91-1.76-8.19 0-13.22 4.51-13.22
|
||||
10.47 0 5.08 3.84 8.29 9.64 10.36 4.2 1.45 5.86 2.7 5.86 4.87 0 2.28-1.92 3.78-5.55 3.78-3.37
|
||||
0-6.68-1.09-8.75-2.17l-1.61 6.47c1.97 1.1 5.9 2.18 9.9 2.18 9.58 0 14.04-4.98 14.04-10.83
|
||||
0-4.92-2.85-8.13-9.02-10.41z"/>
|
||||
</svg>
|
||||
<span class="ext-name">Stylus</span>
|
||||
<span class="ext-version"></span>
|
||||
<span class="filter-stats-wrapper">
|
||||
<span id="filters-stats"></span>
|
||||
<a id="reset-filters" href="#" tabindex="0">
|
||||
<svg class="svg-icon" viewBox="0 0 20 20">
|
||||
<title i18n-text="genericResetLabel"></title>
|
||||
<polygon points="16.2,5.5 14.5,3.8 10,8.3 5.5,3.8 3.8,5.5 8.3,10 3.8,14.5
|
||||
5.5,16.2 10,11.7 14.5,16.2 16.2,14.5 11.7,10 "/>
|
||||
<div>
|
||||
<svg id="stylus-logo" width="32" height="32" viewBox="0 0 48 48">
|
||||
<path fill="#285959" d="M44.59 20.14c-.02-.86 0-13.6 0-13.6-.02-4.13-2.5-5.62-6.6-5.64H11.28C7.17.92
|
||||
4.59 2.44 4.65 6.54v14.2c0 1.64-3.02 1.55-3.02 1.55v3.48s3.05.03 3.02 1.97v13.88c0 4.15 2.5 5.63
|
||||
6.63 5.63h26.71c4.13.02 6.6-1.45 6.6-5.63V27.35c0-1.54 2.98-1.57 2.98-1.57l.04-3.84s-3-.07-3.02-1.8z"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" fill="#28FEFE" d="M46 20.98V5.62A5.72 5.72 0 0 0
|
||||
40.22.03H8.66a5.63 5.63 0 0 0-5.68 5.59v15.37H0v6h2.98v15.4a5.67 5.67 0 0 0 5.68 5.64h31.56A5.76
|
||||
5.76 0 0 0 46 42.39V26.94h2.03v-5.98l-2.03.02zm-2 5.65v13.76c0 4.19-2.43 5.65-6.56 5.64H10.66c-4.13
|
||||
0-5.69-1.48-5.69-5.64V27.1c.04-1.94-2.93-1.97-2.93-1.97v-2.21s2.93.09 2.93-1.54c.05-.52 0-13.84
|
||||
0-13.84-.05-4.1 1.57-5.57 5.68-5.59h26.79c4.1.02 6.54 1.46 6.56 5.59 0 0 .08 12.87 0 13.4.02 1.73
|
||||
1.98 1.94 1.98 1.94v2.19S44 25.09 44 26.63zm-16.76-6.2c-4.56-1.71-6.47-2.7-6.47-4.92 0-1.77 1.65-3.37
|
||||
5.07-3.37 3.37 0 5.9.98 7.26 1.66l1.76-6.33c-2.08-.98-4.92-1.76-8.91-1.76-8.19 0-13.22 4.51-13.22
|
||||
10.47 0 5.08 3.84 8.29 9.64 10.36 4.2 1.45 5.86 2.7 5.86 4.87 0 2.28-1.92 3.78-5.55 3.78-3.37
|
||||
0-6.68-1.09-8.75-2.17l-1.61 6.47c1.97 1.1 5.9 2.18 9.9 2.18 9.58 0 14.04-4.98 14.04-10.83
|
||||
0-4.92-2.85-8.13-9.02-10.41z"/>
|
||||
</svg>
|
||||
<span class="ext-name">Stylus</span>
|
||||
<span class="ext-version"></span>
|
||||
<span class="filter-stats-wrapper">
|
||||
<span id="filters-stats"></span>
|
||||
<a id="reset-filters" class="tt-e" href="#" tabindex="0" i18n-data-title="genericResetLabel">
|
||||
<svg class="svg-icon" viewBox="0 0 20 20">
|
||||
<polygon points="16.2,5.5 14.5,3.8 10,8.3 5.5,3.8 3.8,5.5 8.3,10 3.8,14.5
|
||||
5.5,16.2 10,11.7 14.5,16.2 16.2,14.5 11.7,10 "/>
|
||||
</svg>
|
||||
</a>
|
||||
</span>
|
||||
</div>
|
||||
<div id="main-actions">
|
||||
<a href="edit.html" i18n-data-title="addStyleLabel" class="new-style tt-w">
|
||||
<svg class="svg-icon" viewBox="0 0 24 24">
|
||||
<path d="M19 3H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V5a2 2 0 0 0-2-2zm0 16H5V5h14v14zm-8-2h2v-4h4v-2h-4V7h-2v4H7v2h4z"/>
|
||||
</svg>
|
||||
</a>
|
||||
</span>
|
||||
<span class="tabs">
|
||||
<a href="#" class="active">Manage</a>
|
||||
<a href="#">Options</a>
|
||||
<a href="#">Backup</a>
|
||||
</span>
|
||||
<span class="spacer"></span>
|
||||
<a href="https://add0n.com/stylus.html#features" target="_blank" i18n-data-title="linkGetHelp" class="tt-w">
|
||||
<svg class="svg-icon" viewBox="0 0 24 24">
|
||||
<path d="M15 4v7H5.17L4 12.17V4h11m1-2H3a1 1 0 0 0-1 1v14l4-4h10a1 1 0 0 0 1-1V3a1 1 0 0 0-1-1zm5 4h-2v9H6v2a1 1 0 0 0 1 1h11l4 4V7a1 1 0 0 0-1-1z"/>
|
||||
</svg>
|
||||
</a>
|
||||
<a href="https://discordapp.com/widget?id=379521691774353408" target="_blank" i18n-data-title="linkChat" class="tt-w">
|
||||
<svg class="svg-icon" viewBox="0 0 24 24">
|
||||
<path d="M11 23.59v-3.6c-5.01-.26-9-4.42-9-9.49C2 5.26 6.26 1 11.5 1S21 5.26 21 10.5c0 4.95-3.44 9.93-8.57 12.4l-1.43.69zM11.5 3C7.36 3 4 6.36 4 10.5S7.36 18 11.5 18H13v2.3c3.64-2.3 6-6.08 6-9.8C19 6.36 15.64 3 11.5 3zm-1 11.5h2v2h-2zm2-1.5h-2c0-3.25 3-3 3-5 0-1.1-.9-2-2-2s-2 .9-2 2h-2c0-2.21 1.79-4 4-4s4 1.79 4 4c0 2.5-3 2.75-3 5z"/>
|
||||
</svg>
|
||||
</a>
|
||||
<a href="https://github.com/openstyles/stylus/wiki" target="_blank" i18n-data-title="linkStylusWiki" class="tt-w">
|
||||
<svg class="svg-icon" viewBox="0 0 24 24">
|
||||
<path d="M6 2c-1.1 0-2 .9-2 2v16c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V8l-6-6H6zm0 2h7v5h5v11H6V4zm2 8v2h8v-2H8zm0 4v2h8v-2H8z"/>
|
||||
</svg>
|
||||
</a>
|
||||
<a href="https://www.transifex.com/github-7/Stylus" target="_blank" i18n-data-title="linkTranslate" class="tt-w">
|
||||
<svg class="svg-icon" viewBox="0 0 24 24">
|
||||
<path d="M4 2a2 2 0 0 0-2 2v9c0 1.1.9 2 2 2h1v2l2 2h2v1c0 1.1.9 2 2 2h9a2 2 0 0 0 2-2v-9a2 2 0 0 0-2-2h-5V4a2 2 0 0 0-2-2zm0 2h9v5h-2c-.66 0-1.23.32-1.6.81-.15-.1-.3-.24-.43-.34C9.6 8.8 10.23 8 10.75 7H12V6H9V5H8v1H5v1h1.13a.5.5 0 0 0-.1.5s.17.5.69 1.19c.19.24.45.52.75.81-1.15.97-2.13 1.4-2.13 1.4a.5.5 0 0 0 .38.94s1.2-.48 2.53-1.65c.23.18.5.35.78.53-.01.1-.03.18-.03.28v2H4zm2.88 3h2.68A9.8 9.8 0 0 1 8.2 8.84a6.59 6.59 0 0 1-.69-.75c-.44-.57-.5-.87-.5-.87A.53.53 0 0 0 6.87 7zm7.96 5h1.32L19 20h-1.16l-.75-2.19h-3.25L13.13 20H12zm.6.9c-.13.48-1.28 4.1-1.28 4.1h2.65s-1.22-3.63-1.34-4.1zM7 15h2v2H7z"/>
|
||||
</svg>
|
||||
|
||||
</a>
|
||||
<a href="https://userstyles.org" target="_blank" i18n-data-title="linkGetStyles" class="tt-w">
|
||||
<svg class="svg-icon" viewBox="0 0 24 24">
|
||||
<path d="M2.53 19.65l1.34.56v-9.03l-2.43 5.86a2.02 2.02 0 0 0 1.09 2.61zm19.5-3.7L17.07 3.98a2.01 2.01 0 0 0-2.6-1.08L7.1 5.95a2 2 0 0 0-1.08 2.6l4.96 11.97a2 2 0 0 0 2.6 1.08l7.36-3.05a2 2 0 0 0 1.09-2.6zm-9.2 3.8L7.87 7.79l7.35-3.04h.01l4.95 11.95-7.35 3.05z"/>
|
||||
<circle cx="11" cy="9" r="1"/>
|
||||
<path d="M5.88 19.75c0 1.1.9 2 2 2h1.45l-3.45-8.34v6.34z"/>
|
||||
</svg>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
</h1>
|
||||
|
||||
<div id="tools-wrapper" class="hidden">
|
||||
|
|
@ -254,6 +291,7 @@
|
|||
<svg class="svg-icon select-arrow"><use xlink:href="#svg-icon-select-arrow"/></svg>
|
||||
</span>
|
||||
<button id="bulk-actions-apply" i18n-text="bulkActionsApply"></button>
|
||||
<button id="apply-all-updates" class="hidden" i18n-text="applyAllUpdates"></button>
|
||||
<svg class="svg-icon busy hidden" viewBox="0 0 24 24">
|
||||
<path d="M12 23h-1v-6.57A5.97 5.97 0 0 1 7 18c-3.25 0-6-2.75-6-6v-1h6.57A5.97 5.97 0 0 1 6 7c0-3.25 2.75-6 6-6h1v6.57A5.97 5.97 0 0 1 17 6c3.25 0 6 2.75 6 6v1h-6.57A5.97 5.97 0 0 1 18 17c0 3.25-2.75 6-6 6zm1-9.87v7.74c1.7-.46 3-2.04 3-3.87s-1.3-3.41-3-3.87zM3.13 13c.46 1.7 2.04 3 3.87 3s3.41-1.3 3.87-3H3.13zm10-2h7.74c-.46-1.7-2.05-3-3.87-3s-3.41 1.3-3.87 3zM11 3.13C9.3 3.59 8 5.18 8 7s1.3 3.41 3 3.87V3.13z"/>
|
||||
<!-- supported everwhere?
|
||||
|
|
@ -348,24 +386,6 @@
|
|||
</span>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<div style="display: none">
|
||||
<!-- <button id="reset-filters"></button> -->
|
||||
<button id="apply-all-updates"></button>
|
||||
<button id="check-all-updates"></button>
|
||||
<button id="check-all-updates-force"></button>
|
||||
<button id="file-all-styles"></button>
|
||||
<button id="unfile-all-styles"></button>
|
||||
<button id="manage-options-button"></button>
|
||||
<button id="manage-shortcuts-button"></button>
|
||||
<button id="sorter-help"></button>
|
||||
<input id="manage.newUI" type="checkbox">
|
||||
<input id="manage.newUI.faviconsGray" type="checkbox">
|
||||
<input id="manage.newUI.targets" type="number" min="1" max="100" value="3">
|
||||
<input id="manage.newUI.favicons" type="checkbox">
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div id="installed" class="manage-col-entries">
|
||||
|
|
@ -400,6 +420,21 @@
|
|||
</header>
|
||||
</div>
|
||||
|
||||
<div style="display: none">
|
||||
<button id="apply-all-updates"></button>
|
||||
<button id="check-all-updates"></button>
|
||||
<button id="check-all-updates-force"></button>
|
||||
<button id="file-all-styles"></button>
|
||||
<button id="unfile-all-styles"></button>
|
||||
<button id="manage-options-button"></button>
|
||||
<button id="manage-shortcuts-button"></button>
|
||||
<button id="sorter-help"></button>
|
||||
<input id="manage.newUI" type="checkbox">
|
||||
<input id="manage.newUI.faviconsGray" type="checkbox">
|
||||
<input id="manage.newUI.targets" type="number" min="1" max="100" value="3">
|
||||
<input id="manage.newUI.favicons" type="checkbox">
|
||||
</div>
|
||||
|
||||
<!-- <div id="manage-settings">
|
||||
<div class="settings-column">
|
||||
|
||||
|
|
|
|||
|
|
@ -279,7 +279,7 @@ Object.assign(handleEvent, {
|
|||
config(event, {styleMeta}) {
|
||||
event.preventDefault();
|
||||
configDialog(styleMeta);
|
||||
}
|
||||
},
|
||||
|
||||
});
|
||||
|
||||
|
|
|
|||
|
|
@ -215,8 +215,7 @@ const UI = {
|
|||
}
|
||||
if (numTargets) {
|
||||
entryTargets.parentElement.replaceChild(targets, entryTargets);
|
||||
} else if (!entry.classList.contains('global') ||
|
||||
!entryTargets.firstElementChild) {
|
||||
} else if (!entry.classList.contains('global') || !entryTargets.firstElementChild) {
|
||||
if (entryTargets.firstElementChild) {
|
||||
entryTargets.textContent = '';
|
||||
}
|
||||
|
|
@ -233,6 +232,8 @@ const UI = {
|
|||
const regexpReplaceExtraCharacters = /[\\(]|((\|\w+)+\))/g;
|
||||
const regexpMatchRegExp = /[\w-]+[.(]+(com|org|co|net|im|io|edu|gov|biz|info|de|cn|uk|nl|eu|ru)\b/g;
|
||||
const regexpMatchDomain = /^.*?:\/\/([^/]+)/;
|
||||
const image = document.createElement('img');
|
||||
image.async = true;
|
||||
for (const target of $$('.target', container)) {
|
||||
const type = target.dataset.type;
|
||||
const targetValue = target.dataset.title;
|
||||
|
|
@ -253,13 +254,16 @@ const UI = {
|
|||
favicon = favicon ? UI.GET_FAVICON_URL + favicon[1] : '';
|
||||
}
|
||||
if (favicon) {
|
||||
const img = target.children[0];
|
||||
if (!img || img.localName !== 'img') {
|
||||
target.insertAdjacentElement('afterbegin', document.createElement('img'))
|
||||
.dataset.src = favicon;
|
||||
} else if ((img.dataset.src || img.src) !== favicon) {
|
||||
img.src = '';
|
||||
const el = $('img, svg', target);
|
||||
if (!el || el.localName === 'svg') {
|
||||
const img = image.cloneNode();
|
||||
img.dataset.src = favicon;
|
||||
el.replaceWith(img);
|
||||
//target.insertAdjacentElement('afterbegin', document.createElement('img'))
|
||||
//.dataset.src = favicon;
|
||||
} else if ((target.dataset.src || target.src) !== favicon) {
|
||||
el.src = '';
|
||||
el.dataset.src = favicon;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -55,6 +55,21 @@ a:hover {
|
|||
fill: #666;
|
||||
}
|
||||
|
||||
#main-actions {
|
||||
display: flex;
|
||||
width: 200px;
|
||||
height: 40px;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.spacer {
|
||||
width: 10px;
|
||||
height: 1em;
|
||||
border-right: 1px solid #777;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.entry-actions > a,
|
||||
.bulk-actions-select-wrapper,
|
||||
#bulk-actions-apply {
|
||||
|
|
@ -86,11 +101,14 @@ a:hover {
|
|||
color: #ddd;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
width: 100vw;
|
||||
width: 100%;
|
||||
height: var(--header-height);
|
||||
z-index: 100;
|
||||
padding: 2px 8px;
|
||||
margin: 0;
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
#main-header .ext-version {
|
||||
|
|
@ -101,20 +119,14 @@ a:hover {
|
|||
vertical-align: bottom;
|
||||
}
|
||||
|
||||
#main-header .tabs {
|
||||
float: right;
|
||||
margin-right: 20px;
|
||||
}
|
||||
|
||||
#main-header .tabs a {
|
||||
#main-header a {
|
||||
font-size: .7em;
|
||||
color: #aaa;
|
||||
color: #999;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
#main-header .tabs a.active,
|
||||
#main-header .tabs a:hover {
|
||||
color: #c0fff0;
|
||||
#main-header a:hover {
|
||||
color: hsla(180, 50%, 50%, 1);
|
||||
}
|
||||
|
||||
#main-header:lang(ja) {
|
||||
|
|
@ -140,7 +152,7 @@ a:hover {
|
|||
justify-content: center;
|
||||
}
|
||||
|
||||
#installed {
|
||||
#installed, #options, #backup {
|
||||
margin-top: calc(var(--header-height) + var(--entry-header-height));
|
||||
}
|
||||
|
||||
|
|
@ -271,17 +283,21 @@ a:hover {
|
|||
}
|
||||
|
||||
.targets .target {
|
||||
display: inline-block;
|
||||
padding: 0 2px;
|
||||
}
|
||||
|
||||
.targets .applies-to-extra .target {
|
||||
padding: 2px;
|
||||
}
|
||||
|
||||
.targets .target img {
|
||||
max-width: var(--icon-size);
|
||||
max-height: var(--icon-size);
|
||||
width: var(--icon-size);
|
||||
margin-left: 2px;
|
||||
}
|
||||
|
||||
.applies-to-extra img.target {
|
||||
margin-bottom: 2px;
|
||||
}
|
||||
|
||||
#installed.faviconsGray img.target {
|
||||
#installed.faviconsGray .target img {
|
||||
-webkit-filter: grayscale(1);
|
||||
filter: grayscale(1);
|
||||
}
|
||||
|
|
@ -457,11 +473,11 @@ a svg, .svg-icon.sort {
|
|||
fill: #ef6969;
|
||||
}
|
||||
|
||||
img.target:hover {
|
||||
.target:hover img {
|
||||
background-color: inherit;
|
||||
}
|
||||
|
||||
img.target {
|
||||
.target img{
|
||||
width: var(--icon-size);
|
||||
height: var(--icon-size);
|
||||
vertical-align: sub;
|
||||
|
|
@ -474,7 +490,7 @@ img.target {
|
|||
opacity: .5;
|
||||
}
|
||||
|
||||
.entry:hover img.target {
|
||||
.entry:hover .target img {
|
||||
opacity: 1;
|
||||
/* unprefixed since Chrome 53 */
|
||||
-webkit-filter: grayscale(0);
|
||||
|
|
@ -669,7 +685,7 @@ details.applies-to-extra[open] {
|
|||
}
|
||||
|
||||
#reset-filters svg {
|
||||
fill: hsla(180, 50%, 27%, .5);
|
||||
fill: hsla(180, 50%, 50%, .7);
|
||||
width: 24px; /* widen the click area a bit */
|
||||
height: 20px;
|
||||
padding: 2px;
|
||||
|
|
@ -677,7 +693,7 @@ details.applies-to-extra[open] {
|
|||
}
|
||||
|
||||
#reset-filters:hover svg {
|
||||
fill: hsla(180, 50%, 27%, 1);
|
||||
fill: hsla(180, 50%, 50%, 1);
|
||||
}
|
||||
|
||||
.filter-stats-wrapper:not(.active) #reset-filters,
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user