unify markup and CSS for icons within options

This commit is contained in:
tophf 2017-11-21 18:17:56 +03:00
parent aa1ac63c1c
commit 7f37b8d1dd
2 changed files with 9 additions and 10 deletions

View File

@ -201,7 +201,9 @@
<div class="option aligned">
<label id="keyMap-label" for="editor.keyMap" i18n-text="cm_keyMap"></label>
<select id="editor.keyMap"></select>
<svg id="keyMap-help" class="svg-icon info"><use xlink:href="#svg-icon-help"/></svg>
<span class="svg-inline-wrapper">
<svg id="keyMap-help" class="svg-icon info"><use xlink:href="#svg-icon-help"/></svg>
</span>
</div>
<div class="option aligned">
<label id="theme-label" for="editor.theme" i18n-text="cm_theme"></label>
@ -222,10 +224,10 @@
<option value="stylelint">Stylelint</option>
<option value="" i18n-text="genericDisabledLabel"></option>
</select>
<span class="linter-settings" i18n-title="linterConfigTooltip">
<span class="svg-inline-wrapper" i18n-title="linterConfigTooltip">
<svg id="linter-settings" class="svg-icon settings">
<use xlink:href="#svg-icon-settings"/>
</svg>&nbsp;
</svg>
</span>
</div>
</details>

View File

@ -44,7 +44,7 @@ body {
.aligned {
display: table-row;
}
.aligned > *:not(svg) {
.aligned > *:not(.svg-inline-wrapper) {
display: table-cell;
margin-top: 0.1rem;
min-height: 1.4rem;
@ -83,8 +83,6 @@ input[type="checkbox"] {
transition: fill .5s;
width: 16px;
height: 16px;
}
.svg-icon:not(.dismiss) {
margin-left: 0.2rem;
}
h2 .svg-icon, label .svg-icon {
@ -132,7 +130,7 @@ h2 .svg-icon, label .svg-icon {
text-align: left;
padding-left: .25em;
}
#options .option > * {
#options .option.aligned > * {
padding-right: 0.25rem;
}
.set-option-progress {
@ -400,8 +398,7 @@ body[data-match-highlight="selection"] .CodeMirror-selection-highlight-scrollbar
margin-left: 10px;
font-weight: bold;
}
#help-popup .saved-message.show,
#options .linter-settings {
#help-popup .saved-message.show {
display: inline-block;
}
@ -601,7 +598,7 @@ body[data-match-highlight="selection"] .CodeMirror-selection-highlight-scrollbar
#options h2 {
margin: 0 0 .5em;
}
#options .aligned > *:not(svg) {
#options .aligned > *:not(.svg-inline-wrapper) {
margin: 1px 0 0 0; /* workaround the flowing-padding column bug in webkit */
padding-right: 0.4rem;
vertical-align: baseline;