Compare commits

...

19 commits

Author SHA1 Message Date
daria
9a44a2a7ad change focus to focus-visible 2024-08-19 16:52:20 +03:00
daria
08aeefed1d fix focus style on the home page 2024-08-19 16:37:49 +03:00
daria
b1927f8078 fix focus style on the home page 2024-08-19 16:29:46 +03:00
daria
d7dd367fa3 add focus outline to elements on the admin page 2024-08-19 13:43:43 +03:00
daria
c98542e043 fix focus style on pad titles 2024-08-19 13:02:46 +03:00
daria
9ddd8cd5a1 add border radius to focused icons on drive sidebar 2024-08-07 12:14:00 +03:00
daria
4716cac217 add focus style to focusable elements on the settings page #1506 2024-08-05 14:11:40 +03:00
daria
9eb9259ce6 ad focus style to focusable elements on home page #1506
+ add border radius to match elements
2024-08-05 13:53:03 +03:00
daria
7e17111412 add focus style to focusable elements on teams #1506
+ fix overlapping focus on teams chat
2024-08-05 13:29:44 +03:00
daria
a55cad0339 add focus style to teams cards #1506 2024-08-05 13:06:50 +03:00
daria
3765e7b7b2 add focus style to teams sidebar #1506 2024-08-05 13:03:44 +03:00
daria
3d3f800395 add focus style variable #1506 2024-08-05 12:51:13 +03:00
daria
b7565a41da Merge branch 'refs/heads/calendar-fixes' into focus-style-fixes 2024-07-16 14:55:19 +03:00
daria
be807d884a fix overlapping focus on drive sidebar 2024-07-11 15:26:43 +03:00
daria
4a289d003d fix focus style on drive sidebar #1506 2024-07-11 14:56:01 +03:00
daria
a4171d19eb fix focus style on new calendar button #1506 2024-07-11 14:28:55 +03:00
daria
471e3954eb fix error 2024-07-10 17:01:18 +03:00
daria
546ccd63f7 Revert "change focus style for inputs on calendar modals #1506"
This reverts commit 7c57db6420.
2024-07-10 16:58:27 +03:00
daria
7c57db6420 change focus style for inputs on calendar modals #1506 2024-07-10 16:27:41 +03:00
14 changed files with 95 additions and 27 deletions

View file

@ -200,8 +200,8 @@
}
.cp-usergrid-user, textarea, a, .fa-times {
outline: none;
&:focus {
outline: @cryptpad_color_brand solid 2px;
&:focus-visible {
outline: @variables_focus_style;
}
}
}
@ -244,8 +244,8 @@
}
}
outline: none;
&:focus {
outline: @cryptpad_color_brand solid 2px;
&:focus-visible {
outline: @variables_focus_style;
}
}
span.alertify-tabs-active {
@ -275,7 +275,7 @@
.tools_placeholder-color();
outline: none;
&:focus-visible {
outline: @cryptpad_color_brand solid 2px;
outline: @variables_focus_style;
}
}

View file

@ -129,8 +129,8 @@
box-sizing: border-box;
}
outline: none;
&:focus {
outline: @cryptpad_color_brand solid 2px;
&:focus-visible {
outline: @variables_focus_style;
}
}
@ -217,8 +217,8 @@
height: var(--checkmark-dim1);
}
outline: none;
&:focus {
outline: @cryptpad_color_brand solid 2px;
&:focus-visible {
outline: @variables_focus_style;
}
}

View file

@ -30,6 +30,11 @@
.cp-unselectable {
.tools_unselectable();
}
.btn-primary{
&:focus-visible {
outline: @variables_focus_style;
}
}
/* local mixins */
@drive_icon-margin: 10px;
@ -329,11 +334,10 @@
overflow: hidden;
text-overflow: ellipsis;
.leftside-menu-category_main();
margin: 0;
display: flex;
align-items: center;
cursor: pointer;
margin-left: -5px;
margin: 0 0 2px -5px;
padding-left: 5px;
.fa, .cptools {
display: inline-block;
@ -348,6 +352,9 @@
overflow: hidden;
text-overflow: ellipsis;
}
&:focus-visible {
outline: @variables_focus_style;
}
}
}
}
@ -373,6 +380,9 @@
padding-left: 20px;
.leftside-menu-category_main();
margin: 0;
&:focus-visible {
outline: @variables_focus_style;
}
}
}
}
@ -399,6 +409,10 @@
position: relative;
top: -1px;
}
&:focus-visible {
outline: @variables_focus_style;
border-radius: @variables_radius_S;
}
}
.cp-app-drive-tree-docs {
box-shadow: @cryptpad_ui_shadow;

View file

@ -28,6 +28,9 @@
}
&.tui-full-calendar-content {
font-size: @colortheme_app-font-size;
&:focus-visible {
outline: @variables_focus_style;
}
}
&[readonly] {
//margin-top:1rem;
@ -138,8 +141,8 @@
color: @cryptpad_text_col;
}
outline: none;
&:focus {
outline: @cryptpad_color_brand solid 2px;
&:focus-visible {
outline: @variables_focus_style;
}
}
}
@ -257,8 +260,8 @@
outline: none;
&:focus {
outline: @cryptpad_color_brand solid 2px;
&:focus-visible {
outline: @variables_focus_style;
}
&::-moz-focus-inner {
border: 0;

View file

@ -6,6 +6,7 @@
@import (reference) "./colortheme-all.less";
@import (reference) "./font.less";
@import (reference) "./variables.less";
@infopages-radius: 5px;
@infopages-radius-L: 10px;
@ -46,6 +47,10 @@ body.html {
a:hover {
opacity: 1;
}
a:focus-visible {
outline: @variables_focus_style;
border-radius: @variables_radius;
}
border: 0;
padding: 0;
margin: 0;
@ -231,6 +236,9 @@ body.html {
border: 0px;
border-radius: @infopages-radius;
padding: 0.5em 0.7em;
&:focus-visible {
outline: @variables_focus_style;
}
}
}
.cp-footer-version {
@ -293,6 +301,9 @@ body.html {
&:hover {
color: @cryptpad_text_col;
}
&:focus-visible {
outline: @variables_focus_style;
}
i {
margin-right: 5px;
}

View file

@ -47,6 +47,9 @@
align-items: center;
.leftside-menu-category_main();
box-shadow: @cryptpad_ui_shadow;
&:focus-visible {
outline: @variables_focus_style;
}
}
}
&.cp-leftside-narrow {

View file

@ -81,8 +81,8 @@
padding-left: 4px;
vertical-align: middle;
outline: none;
&:focus {
outline: @cryptpad_color_brand solid 2px;
&:focus-visible {
outline: @variables_focus_style;
}
}
.close {

View file

@ -77,8 +77,8 @@
&:hover {
background-color: contrast(@cp_toolbar-bg, darken(@cp_toolbar-bg, 5%), lighten(@cp_toolbar-bg, 5%));
}
&:focus {
outline: @cryptpad_color_brand solid 2px;
&:focus-visible {
outline: @variables_focus_style;
}
}
button:nth-of-type(1) {
@ -373,7 +373,7 @@
* {
outline-style: none;
&:focus-visible {
outline: @cryptpad_color_brand solid 2px;
outline: @variables_focus_style;
}
}
@ -676,6 +676,10 @@
overflow: hidden;
text-overflow: ellipsis;
border-collapse: collapse;
&:focus {
margin: 2px;
border-radius: @variables_radius;
}
}
input {
color: @cryptpad_text_col;

View file

@ -18,6 +18,8 @@
@variables_shadow: 0 8px 32px 0 @cp_shadow-color;
// Rounded corners
@variables_radius_S: 3px;
@variables_radius: 5px;
@variables_radius_L: 10px;
@variables_focus_style: @cryptpad_color_brand solid 2px;

View file

@ -22,6 +22,11 @@
flex-flow: column;
font: @colortheme_app-font;
input, textarea, .cp-appblock {
&:focus-visible {
outline: @variables_focus_style;
}
}
.cp-admin-customize-logo {
padding: 1em;
img {

View file

@ -633,6 +633,9 @@
color: @cp_sidebar-left-active-fg;
border: 0px;
}
&:focus-visible {
outline: @variables_focus_style;
}
i {
margin-left: 5px;
}

View file

@ -177,8 +177,8 @@
align-self: flex-start;
outline-style: none;
border-radius: @variables_radius;
&:focus {
outline: @cryptpad_color_brand solid 2px;
&:focus-visible {
outline: @variables_focus_style;
}
@media (hover: none) {
margin-right: 20px;
@ -413,8 +413,8 @@
.fa {
margin-right: 5px;
}
&:focus{
outline: @cryptpad_color_brand solid 2px;
&:focus-visible {
outline: @variables_focus_style;
}
}
}
@ -651,8 +651,8 @@
&:hover {
background-color: @cp_kanban-add-hover;
}
&:focus {
outline: @cryptpad_color_brand solid 2px;
&:focus-visible {
outline: @variables_focus_style;
}
}

View file

@ -40,6 +40,11 @@
#cp-sidebarlayout-container {
#cp-sidebarlayout-rightside {
input, button, span[tabindex="0"] {
&:focus-visible {
outline: @variables_focus_style;
}
}
input[type="checkbox"] {
vertical-align: middle;
margin-right: 5px;
@ -112,6 +117,9 @@
margin-top:0;
margin-left: 10px;
}
.cp-password-reveal {
border-radius:@variables_radius;
}
}
@media (max-width: 840px) {

View file

@ -62,6 +62,14 @@
div#cp-sidebarlayout-leftside {
background-color: @cp_teams-leftside-bg;
}
#cp-sidebarlayout-rightside{
input, button, textarea {
&:focus-visible {
outline: @variables_focus_style;
}
}
}
div#cp-sidebarlayout-rightside.cp-rightside-drive {
padding: 0;
& > .cp-team-chat {
@ -73,7 +81,11 @@
}
.cp-app-contacts-input {
textarea {
border: 0px;
border: 0;
margin-right: 2px;
}
.fa-paper-plane{
border-radius: @variables_radius;
}
}
}
@ -142,6 +154,9 @@
height: 384px;
padding: 50px;
margin: 5px;
&:focus-visible {
outline: @variables_focus_style;
}
&.create, &:not(.empty) {
cursor: pointer;
&:hover {