Style sync select

This commit is contained in:
narcolepticinsomniac 2019-11-14 00:42:33 -05:00 committed by GitHub
parent f9db43a2e9
commit 5e9af73fc5
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 19 additions and 6 deletions

View File

@ -198,6 +198,11 @@ select[disabled] > option {
color: graytext;
}
select:disabled + .select-arrow,
select[disabled] + .select-arrow {
fill: hsl(0, 0%, 50%);
}
/* global stuff we use everywhere */
.hidden {
display: none !important;

View File

@ -142,12 +142,15 @@
<div class="items">
<label>
<span class="sync-status"></span>
<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>
<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>
</label>
<div class="actions">
<button type="button" class="connect" i18n-text="optionsSyncConnect"></button>
@ -212,10 +215,15 @@
</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>