Skip to content

Commit

Permalink
Fix a few style issues
Browse files Browse the repository at this point in the history
  • Loading branch information
@Mottie
Mottie committed Jan 28, 2019
1 parent 055e871 commit 0fa447a
Show file tree
Hide file tree
Showing 4 changed files with 87 additions and 78 deletions.
112 changes: 55 additions & 57 deletions manage.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -415,68 +415,66 @@ <h1 id="main-header">
</div>

<div id="bulk-actions" class="manage-row">
<div>
<label class="checkmate toggle-all" tabindex="0">
<input id="toggle-all-filters" type="checkbox">
<svg class="svg-icon checkbox"viewBox="0 0 10 10">
<path class="filled-circle" d="M5 .86a4.14 4.14 0 0 0 0 8.28A4.14 4.14 0 1 0 5 .86z"/>
<path class="circle" d="M5 .86a4.14 4.14 0 0 0 0 8.28A4.14 4.14 0 1 0 5 .86zm0 7.5a3.36 3.36 0 1 1 0-6.72 3.36 3.36 0 0 1 0 6.72z"/>
<path class="checkmark" d="M6.86 3.21L4.14 5.93 3.07 4.86l-.57.57 1.64 1.71L7.5 3.8l-.64-.58z"/>
<path class="indeterminate" d="M2.5 4.5h5v1h-5v-1z"/>
</svg>
</label>
<span id="bulk-filter-count"></span>
<span i18n-text="bulkActions"></span>
<span class="select-resizer bulk-actions-select-wrapper">
<select id="bulk-actions-select">
<option i18n-text="bulkActionsSelect" value=""></option>
<option i18n-text="enableStyleLabel" value="enable"></option>
<option i18n-text="disableStyleLabel" value="disable"></option>
<option i18n-text="exportLabel" value="export"></option>
<option i18n-text="checkForUpdate" value="update"></option>
<!-- Plan: Reset UserCSS variables -->
<!-- <option i18n-text="genericResetLabel" value="reset"></option> -->
<option i18n-text="deleteStyleLabel" value="delete"></option>
</select>
<svg class="svg-icon select-arrow"><use xlink:href="#svg-icon-select-arrow"/></svg>
<label class="checkmate toggle-all" tabindex="0">
<input id="toggle-all-filters" type="checkbox">
<svg class="svg-icon checkbox"viewBox="0 0 10 10">
<path class="filled-circle" d="M5 .86a4.14 4.14 0 0 0 0 8.28A4.14 4.14 0 1 0 5 .86z"/>
<path class="circle" d="M5 .86a4.14 4.14 0 0 0 0 8.28A4.14 4.14 0 1 0 5 .86zm0 7.5a3.36 3.36 0 1 1 0-6.72 3.36 3.36 0 0 1 0 6.72z"/>
<path class="checkmark" d="M6.86 3.21L4.14 5.93 3.07 4.86l-.57.57 1.64 1.71L7.5 3.8l-.64-.58z"/>
<path class="indeterminate" d="M2.5 4.5h5v1h-5v-1z"/>
</svg>
</label>
<span id="bulk-filter-count"></span>
<span i18n-text="bulkActions"></span>
<span class="select-resizer bulk-actions-select-wrapper">
<select id="bulk-actions-select">
<option i18n-text="bulkActionsSelect" value=""></option>
<option i18n-text="enableStyleLabel" value="enable"></option>
<option i18n-text="disableStyleLabel" value="disable"></option>
<option i18n-text="exportLabel" value="export"></option>
<option i18n-text="checkForUpdate" value="update"></option>
<!-- Plan: Reset UserCSS variables -->
<!-- <option i18n-text="genericResetLabel" value="reset"></option> -->
<option i18n-text="deleteStyleLabel" value="delete"></option>
</select>
<svg class="svg-icon select-arrow"><use xlink:href="#svg-icon-select-arrow"/></svg>
</span>
<button id="bulk-actions-apply" i18n-text="bulkActionsApply" class="tt-e" disabled>
<span id="update-progress"></span>
</button>
<span id="bulk-info">
<!-- Bulk update -->
<span data-bulk="update">
<button id="apply-all-updates" class="hidden" i18n-text="applyAllUpdates"></button>
<span id="update-all-no-updates" class="tt-e hidden" i18n-text="updateAllCheckSucceededNoUpdate"></span>
<button id="check-all-updates-force" class="hidden" i18n-text="checkAllUpdatesForce"></button>
</span>
<button id="bulk-actions-apply" i18n-text="bulkActionsApply" class="tt-e" disabled>
<span id="update-progress"></span>
</button>
<span id="bulk-info">
<!-- Bulk update -->
<span data-bulk="update">
<button id="apply-all-updates" class="hidden" i18n-text="applyAllUpdates"></button>
<span id="update-all-no-updates" class="tt-e hidden" i18n-text="updateAllCheckSucceededNoUpdate"></span>
<button id="check-all-updates-force" class="hidden" i18n-text="checkAllUpdatesForce"></button>
</span>

<!-- Bulk export -->
<span data-bulk="export" class="dropdown export hidden">
Export to:
<span class="select-resizer">
<select id="manage.export.destination">
<option value="local" i18n-text="bckpInstStyles"></option>
<option value="dropbox" i18n-text="syncDropboxStyles"></option>
</select>
<svg class="svg-icon select-arrow"><use xlink:href="#svg-icon-select-arrow"/></svg>
</span>
<!-- Bulk export -->
<span data-bulk="export" class="dropdown export hidden">
Export to:
<span class="select-resizer">
<select id="manage.export.destination">
<option value="local" i18n-text="bckpInstStyles"></option>
<option value="dropbox" i18n-text="syncDropboxStyles"></option>
</select>
<svg class="svg-icon select-arrow"><use xlink:href="#svg-icon-select-arrow"/></svg>
</span>

</span>

<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?
<animateTransform attributeName="transform" attributeType="XML" type="rotate" from="0 0 0"
to="360 0 0" dur="1s" repeatCount="indefinite"/>
-->
</svg>
</div>
</span>

<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?
<animateTransform attributeName="transform" attributeType="XML" type="rotate" from="0 0 0"
to="360 0 0" dur="1s" repeatCount="indefinite"/>
-->
</svg>
</div>

</div>
Expand Down
36 changes: 23 additions & 13 deletions manage/manage.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -49,7 +49,7 @@ body.dark {

a,
.disabled a:hover {
color: #000;
color: #3c3c3c;
transition: color .5s;
}

Expand All @@ -58,7 +58,7 @@ a {
}

a:hover {
color: #666;
color: #000;
}

.invisible {
Expand Down Expand Up @@ -110,6 +110,17 @@ a:hover {
margin-left: 2px;
}

#bulk-actions {
justify-content: flex-start;
}

#bulk-info > span,
#bulk-info button {
display: flex;
align-items: center;
margin-left: 4px;
}

#bulk-actions .svg-icon.busy:not(.hidden) {
-webkit-animation:spin 1s linear infinite;
-moz-animation:spin 1s linear infinite;
Expand Down Expand Up @@ -186,7 +197,6 @@ a:hover {
#installed .entry,
#installed .entry-header {
width: 100%;
line-height: var(--entry-height);
display: flex;
flex: 0 0 var(--narrow-column);
flex-flow: row nowrap;
Expand Down Expand Up @@ -222,6 +232,7 @@ body.all-styles-hidden-by-filters #installed:after {
padding-left: 4px;
flex: 1;
justify-content: space-evenly;
line-height: var(--entry-height);
}

.center-text,
Expand All @@ -237,7 +248,7 @@ body.all-styles-hidden-by-filters #installed:after {
.header-last-update,
.entry-last-update {
/* inlcude update history link */
max-width: calc(var(--narrow-column) + 20px);
max-width: calc(var(--narrow-column) + 30px);
}

/* keep all icons on the same row */
Expand Down Expand Up @@ -272,8 +283,9 @@ body.all-styles-hidden-by-filters #installed:after {
overflow-wrap: break-word;
font-weight: 600;
text-decoration: none;
margin-right: 8px;
padding: 8px 0;
margin: auto 8px auto 0;
padding: 0;
align-self: normal;
}

.entry-name-text {
Expand Down Expand Up @@ -346,7 +358,9 @@ body.all-styles-hidden-by-filters #installed:after {

.applies-to-extra-expander {
text-decoration: none;
font-size: 1.5em;
font-size: 1.3em;
font-weight: bold;
line-height: normal;
}

.targets .target img,
Expand Down Expand Up @@ -400,7 +414,7 @@ body.all-styles-hidden-by-filters #installed:after {
padding: 2px 4px;
margin-left: 2px;
border-radius: 4px;
font-size: .8em;
font-size: .75em;
text-transform: lowercase;
}

Expand Down Expand Up @@ -640,10 +654,6 @@ a svg, .svg-icon.sort {
opacity: .35;
}

#check-all-updates-force {
margin-top: 1ex;
}

#update-all-no-updates[data-skipped-edited="true"] {
font-weight: bold;
}
Expand All @@ -661,7 +671,7 @@ a svg, .svg-icon.sort {
top: var(--header-height);
left: 0;
height: var(--toolbar-height);
padding: 4px 16px;
padding: 4px 0;
z-index: 100;
}

Expand Down
1 change: 1 addition & 0 deletions manage/tooltips.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,6 +19,7 @@
color: var(--tooltip-text);
content: attr(data-title);
font-size: 12px;
line-height: 1.5em;
letter-spacing: normal;
padding: .5em .75em;
text-align: center;
Expand Down
16 changes: 8 additions & 8 deletions options.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -124,10 +124,10 @@ <h1 i18n-text="optionsCustomizeUpdate"></h1>
<label>
<span i18n-text="optionsUpdateInterval">
<a data-cmd="note"
i18n-title="optionsUpdateImportNote"
href="#"
class="svg-inline-wrapper"
tabindex="0">
i18n-title="optionsUpdateImportNote"
href="#"
class="svg-inline-wrapper"
tabindex="0">
<svg class="svg-icon info"><use xlink:href="#svg-icon-help"/></svg>
</a>
</span>
Expand Down Expand Up @@ -155,10 +155,10 @@ <h1 i18n-text="optionsAdvanced">
<label>
<span i18n-text="optionsAdvancedExposeIframes">
<a data-cmd="note"
i18n-title="optionsAdvancedExposeIframesNote"
href="#"
class="svg-inline-wrapper"
tabindex="0">
i18n-title="optionsAdvancedExposeIframesNote"
href="#"
class="svg-inline-wrapper"
tabindex="0">
<svg class="svg-icon info"><use xlink:href="#svg-icon-help"/></svg>
</a>
</span>
Expand Down

0 comments on commit 0fa447a

Please sign in to comment.