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

Style sync select (#803)

Browse Source 
* Style sync select

* Style sync select

* cleanup
This commit is contained in:
narcolepticinsomniac 2019-11-14 00:50:38 -05:00 committed by GitHub
parent f9db43a2e9
commit 41aa869c33
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 22 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
global.css
View File

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

7
options.html
View File

@ -142,12 +142,15 @@
<div class="items"> <div class="items">
<label> <label>
<span class="sync-status"></span> <span class="sync-status"></span>
<div class="select-resizer">
<select class="cloud-name"> <select class="cloud-name">
<option value="none" i18n-text="optionsSyncNone"></option> <option value="none" i18n-text="optionsSyncNone"></option>
<option value="dropbox">Dropbox</option> <option value="dropbox">Dropbox</option>
<option value="google">Google Drive</option> <option value="google">Google Drive</option>
<option value="onedrive">OneDrive</option> <option value="onedrive">OneDrive</option>
</select> </select>
<svg class="svg-icon select-arrow"><use xlink:href="#svg-icon-select-arrow"/></svg>
</div>
</label> </label>
<div class="actions"> <div class="actions">
<button type="button" class="connect" i18n-text="optionsSyncConnect"></button> <button type="button" class="connect" i18n-text="optionsSyncConnect"></button>
@ -216,6 +219,10 @@
<symbol id="svg-icon-help" viewBox="0 0 14 16"> <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> <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>
<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> </svg>
<script src="options/options.js"></script> <script src="options/options.js"></script>

4
options/options.css
View File

@ -109,6 +109,10 @@ select,
flex-shrink: 0; flex-shrink: 0;
} }
select.cloud-name {
width: auto;
}
button { button {
text-align: center; text-align: center;
} }