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

focus tweaks

Browse Source
This commit is contained in:
narcolepticinsomniac 2020-10-13 00:41:17 -04:00
parent 1a2bc67acc
commit 0caf81fa46
5 changed files with 18 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
edit/codemirror-default.css
View File

@ -7,6 +7,7 @@
} }
.CodeMirror { .CodeMirror {
border: solid #CCC 1px; border: solid #CCC 1px;
transition: box-shadow .1s;
} }
#stylus#stylus .CodeMirror { #stylus#stylus .CodeMirror {
/* Using a specificity hack to override userstyles */ /* Using a specificity hack to override userstyles */

7
edit/edit.css
View File

@ -611,6 +611,9 @@ body:not(.find-open) [data-match-highlight-count="1"] .CodeMirror-selection-high
right: 4px; right: 4px;
top: .5em; top: .5em;
} }
#help-popup input[type="search"] {
margin: 3px;
}
.keymap-list { .keymap-list {
font-size: 12px; font-size: 12px;
@ -788,6 +791,10 @@ body:not(.find-open) [data-match-highlight-count="1"] .CodeMirror-selection-high
justify-items: normal; justify-items: normal;
} }
.usercss .CodeMirror-focused {
box-shadow: none;
}
html:not(.usercss) .usercss-only, html:not(.usercss) .usercss-only,
.usercss #mozilla-format-container, .usercss #mozilla-format-container,
.usercss #sections > h2 { .usercss #sections > h2 {

8
global.css
View File

@ -56,6 +56,8 @@ button:active {
input { input {
font: inherit; font: inherit;
border: 1px solid hsl(0, 0%, 66%);
transition: border-color .1s, box-shadow .1s;
} }
input:not([type]), input:not([type]),
@ -66,7 +68,6 @@ input[type=search] {
min-height: 22px!important; min-height: 22px!important;
line-height: 22px; line-height: 22px;
padding: 0 3px; padding: 0 3px;
font: inherit;
border: 1px solid hsl(0, 0%, 66%); border: 1px solid hsl(0, 0%, 66%);
} }
@ -210,11 +211,14 @@ select[disabled] + .select-arrow {
} }
:focus, :focus,
.CodeMirror-focused { .CodeMirror-focused,
[data-focused-via-click] input[type="text"]:focus,
[data-focused-via-click] input[type="number"]:focus {
/* Using box-shadow instead of the ugly outline in new Chrome */ /* Using box-shadow instead of the ugly outline in new Chrome */
outline: none; outline: none;
box-shadow: 0 0 0 1px hsl(180, 100%, 38%), 0 0 3px hsla(180, 100%, 60%, .5); box-shadow: 0 0 0 1px hsl(180, 100%, 38%), 0 0 3px hsla(180, 100%, 60%, .5);
} }
[data-focused-via-click] :focus, [data-focused-via-click] :focus,
[data-focused-via-click]:focus { [data-focused-via-click]:focus {
outline: none; outline: none;

3
js/dom.js
View File

@ -357,7 +357,8 @@ function focusAccessibility() {
const isOutlineAllowed = ({localName, type}) => const isOutlineAllowed = ({localName, type}) =>
!focusAccessibility.ELEMENTS.includes(localName) || !focusAccessibility.ELEMENTS.includes(localName) ||
// allow outline on text/search inputs in addition to textareas // allow outline on text/search inputs in addition to textareas
localName === 'input' && (type === 'text' || type === 'search'); localName === 'input' &&
!/^(button|checkbox|color|file|image|radio|submit|range)$/.test(type);
addEventListener('mousedown', suppressOutlineOnClick, {passive: true}); addEventListener('mousedown', suppressOutlineOnClick, {passive: true});
addEventListener('keydown', keepOutlineOnTab, {passive: true}); addEventListener('keydown', keepOutlineOnTab, {passive: true});

1
options/onoffswitch.css
View File

@ -16,6 +16,7 @@
bottom: -10px; bottom: -10px;
left: -10px; left: -10px;
width: calc(100% + 12px); width: calc(100% + 12px);
border: 0;
} }
#message-box .onoffswitch input { #message-box .onoffswitch input {