Compare commits
19 commits
main
...
focus-styl
Author | SHA1 | Date | |
---|---|---|---|
|
9a44a2a7ad | ||
|
08aeefed1d | ||
|
b1927f8078 | ||
|
d7dd367fa3 | ||
|
c98542e043 | ||
|
9ddd8cd5a1 | ||
|
4716cac217 | ||
|
9eb9259ce6 | ||
|
7e17111412 | ||
|
a55cad0339 | ||
|
3765e7b7b2 | ||
|
3d3f800395 | ||
|
b7565a41da | ||
|
be807d884a | ||
|
4a289d003d | ||
|
a4171d19eb | ||
|
471e3954eb | ||
|
546ccd63f7 | ||
|
7c57db6420 |
14 changed files with 95 additions and 27 deletions
|
@ -200,8 +200,8 @@
|
||||||
}
|
}
|
||||||
.cp-usergrid-user, textarea, a, .fa-times {
|
.cp-usergrid-user, textarea, a, .fa-times {
|
||||||
outline: none;
|
outline: none;
|
||||||
&:focus {
|
&:focus-visible {
|
||||||
outline: @cryptpad_color_brand solid 2px;
|
outline: @variables_focus_style;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -244,8 +244,8 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
outline: none;
|
outline: none;
|
||||||
&:focus {
|
&:focus-visible {
|
||||||
outline: @cryptpad_color_brand solid 2px;
|
outline: @variables_focus_style;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
span.alertify-tabs-active {
|
span.alertify-tabs-active {
|
||||||
|
@ -275,7 +275,7 @@
|
||||||
.tools_placeholder-color();
|
.tools_placeholder-color();
|
||||||
outline: none;
|
outline: none;
|
||||||
&:focus-visible {
|
&:focus-visible {
|
||||||
outline: @cryptpad_color_brand solid 2px;
|
outline: @variables_focus_style;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -129,8 +129,8 @@
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
}
|
}
|
||||||
outline: none;
|
outline: none;
|
||||||
&:focus {
|
&:focus-visible {
|
||||||
outline: @cryptpad_color_brand solid 2px;
|
outline: @variables_focus_style;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -217,8 +217,8 @@
|
||||||
height: var(--checkmark-dim1);
|
height: var(--checkmark-dim1);
|
||||||
}
|
}
|
||||||
outline: none;
|
outline: none;
|
||||||
&:focus {
|
&:focus-visible {
|
||||||
outline: @cryptpad_color_brand solid 2px;
|
outline: @variables_focus_style;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -30,6 +30,11 @@
|
||||||
.cp-unselectable {
|
.cp-unselectable {
|
||||||
.tools_unselectable();
|
.tools_unselectable();
|
||||||
}
|
}
|
||||||
|
.btn-primary{
|
||||||
|
&:focus-visible {
|
||||||
|
outline: @variables_focus_style;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
/* local mixins */
|
/* local mixins */
|
||||||
@drive_icon-margin: 10px;
|
@drive_icon-margin: 10px;
|
||||||
|
@ -329,11 +334,10 @@
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
text-overflow: ellipsis;
|
text-overflow: ellipsis;
|
||||||
.leftside-menu-category_main();
|
.leftside-menu-category_main();
|
||||||
margin: 0;
|
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
margin-left: -5px;
|
margin: 0 0 2px -5px;
|
||||||
padding-left: 5px;
|
padding-left: 5px;
|
||||||
.fa, .cptools {
|
.fa, .cptools {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
|
@ -348,6 +352,9 @@
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
text-overflow: ellipsis;
|
text-overflow: ellipsis;
|
||||||
}
|
}
|
||||||
|
&:focus-visible {
|
||||||
|
outline: @variables_focus_style;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -373,6 +380,9 @@
|
||||||
padding-left: 20px;
|
padding-left: 20px;
|
||||||
.leftside-menu-category_main();
|
.leftside-menu-category_main();
|
||||||
margin: 0;
|
margin: 0;
|
||||||
|
&:focus-visible {
|
||||||
|
outline: @variables_focus_style;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -399,6 +409,10 @@
|
||||||
position: relative;
|
position: relative;
|
||||||
top: -1px;
|
top: -1px;
|
||||||
}
|
}
|
||||||
|
&:focus-visible {
|
||||||
|
outline: @variables_focus_style;
|
||||||
|
border-radius: @variables_radius_S;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
.cp-app-drive-tree-docs {
|
.cp-app-drive-tree-docs {
|
||||||
box-shadow: @cryptpad_ui_shadow;
|
box-shadow: @cryptpad_ui_shadow;
|
||||||
|
|
|
@ -28,6 +28,9 @@
|
||||||
}
|
}
|
||||||
&.tui-full-calendar-content {
|
&.tui-full-calendar-content {
|
||||||
font-size: @colortheme_app-font-size;
|
font-size: @colortheme_app-font-size;
|
||||||
|
&:focus-visible {
|
||||||
|
outline: @variables_focus_style;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
&[readonly] {
|
&[readonly] {
|
||||||
//margin-top:1rem;
|
//margin-top:1rem;
|
||||||
|
@ -138,8 +141,8 @@
|
||||||
color: @cryptpad_text_col;
|
color: @cryptpad_text_col;
|
||||||
}
|
}
|
||||||
outline: none;
|
outline: none;
|
||||||
&:focus {
|
&:focus-visible {
|
||||||
outline: @cryptpad_color_brand solid 2px;
|
outline: @variables_focus_style;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -257,8 +260,8 @@
|
||||||
|
|
||||||
|
|
||||||
outline: none;
|
outline: none;
|
||||||
&:focus {
|
&:focus-visible {
|
||||||
outline: @cryptpad_color_brand solid 2px;
|
outline: @variables_focus_style;
|
||||||
}
|
}
|
||||||
&::-moz-focus-inner {
|
&::-moz-focus-inner {
|
||||||
border: 0;
|
border: 0;
|
||||||
|
|
|
@ -6,6 +6,7 @@
|
||||||
|
|
||||||
@import (reference) "./colortheme-all.less";
|
@import (reference) "./colortheme-all.less";
|
||||||
@import (reference) "./font.less";
|
@import (reference) "./font.less";
|
||||||
|
@import (reference) "./variables.less";
|
||||||
|
|
||||||
@infopages-radius: 5px;
|
@infopages-radius: 5px;
|
||||||
@infopages-radius-L: 10px;
|
@infopages-radius-L: 10px;
|
||||||
|
@ -46,6 +47,10 @@ body.html {
|
||||||
a:hover {
|
a:hover {
|
||||||
opacity: 1;
|
opacity: 1;
|
||||||
}
|
}
|
||||||
|
a:focus-visible {
|
||||||
|
outline: @variables_focus_style;
|
||||||
|
border-radius: @variables_radius;
|
||||||
|
}
|
||||||
border: 0;
|
border: 0;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
|
@ -231,6 +236,9 @@ body.html {
|
||||||
border: 0px;
|
border: 0px;
|
||||||
border-radius: @infopages-radius;
|
border-radius: @infopages-radius;
|
||||||
padding: 0.5em 0.7em;
|
padding: 0.5em 0.7em;
|
||||||
|
&:focus-visible {
|
||||||
|
outline: @variables_focus_style;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.cp-footer-version {
|
.cp-footer-version {
|
||||||
|
@ -293,6 +301,9 @@ body.html {
|
||||||
&:hover {
|
&:hover {
|
||||||
color: @cryptpad_text_col;
|
color: @cryptpad_text_col;
|
||||||
}
|
}
|
||||||
|
&:focus-visible {
|
||||||
|
outline: @variables_focus_style;
|
||||||
|
}
|
||||||
i {
|
i {
|
||||||
margin-right: 5px;
|
margin-right: 5px;
|
||||||
}
|
}
|
||||||
|
|
|
@ -47,6 +47,9 @@
|
||||||
align-items: center;
|
align-items: center;
|
||||||
.leftside-menu-category_main();
|
.leftside-menu-category_main();
|
||||||
box-shadow: @cryptpad_ui_shadow;
|
box-shadow: @cryptpad_ui_shadow;
|
||||||
|
&:focus-visible {
|
||||||
|
outline: @variables_focus_style;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
&.cp-leftside-narrow {
|
&.cp-leftside-narrow {
|
||||||
|
|
|
@ -81,8 +81,8 @@
|
||||||
padding-left: 4px;
|
padding-left: 4px;
|
||||||
vertical-align: middle;
|
vertical-align: middle;
|
||||||
outline: none;
|
outline: none;
|
||||||
&:focus {
|
&:focus-visible {
|
||||||
outline: @cryptpad_color_brand solid 2px;
|
outline: @variables_focus_style;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.close {
|
.close {
|
||||||
|
|
|
@ -77,8 +77,8 @@
|
||||||
&:hover {
|
&:hover {
|
||||||
background-color: contrast(@cp_toolbar-bg, darken(@cp_toolbar-bg, 5%), lighten(@cp_toolbar-bg, 5%));
|
background-color: contrast(@cp_toolbar-bg, darken(@cp_toolbar-bg, 5%), lighten(@cp_toolbar-bg, 5%));
|
||||||
}
|
}
|
||||||
&:focus {
|
&:focus-visible {
|
||||||
outline: @cryptpad_color_brand solid 2px;
|
outline: @variables_focus_style;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
button:nth-of-type(1) {
|
button:nth-of-type(1) {
|
||||||
|
@ -373,7 +373,7 @@
|
||||||
* {
|
* {
|
||||||
outline-style: none;
|
outline-style: none;
|
||||||
&:focus-visible {
|
&:focus-visible {
|
||||||
outline: @cryptpad_color_brand solid 2px;
|
outline: @variables_focus_style;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -676,6 +676,10 @@
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
text-overflow: ellipsis;
|
text-overflow: ellipsis;
|
||||||
border-collapse: collapse;
|
border-collapse: collapse;
|
||||||
|
&:focus {
|
||||||
|
margin: 2px;
|
||||||
|
border-radius: @variables_radius;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
input {
|
input {
|
||||||
color: @cryptpad_text_col;
|
color: @cryptpad_text_col;
|
||||||
|
|
|
@ -18,6 +18,8 @@
|
||||||
@variables_shadow: 0 8px 32px 0 @cp_shadow-color;
|
@variables_shadow: 0 8px 32px 0 @cp_shadow-color;
|
||||||
|
|
||||||
// Rounded corners
|
// Rounded corners
|
||||||
|
@variables_radius_S: 3px;
|
||||||
@variables_radius: 5px;
|
@variables_radius: 5px;
|
||||||
@variables_radius_L: 10px;
|
@variables_radius_L: 10px;
|
||||||
|
|
||||||
|
@variables_focus_style: @cryptpad_color_brand solid 2px;
|
||||||
|
|
|
@ -22,6 +22,11 @@
|
||||||
flex-flow: column;
|
flex-flow: column;
|
||||||
font: @colortheme_app-font;
|
font: @colortheme_app-font;
|
||||||
|
|
||||||
|
input, textarea, .cp-appblock {
|
||||||
|
&:focus-visible {
|
||||||
|
outline: @variables_focus_style;
|
||||||
|
}
|
||||||
|
}
|
||||||
.cp-admin-customize-logo {
|
.cp-admin-customize-logo {
|
||||||
padding: 1em;
|
padding: 1em;
|
||||||
img {
|
img {
|
||||||
|
|
|
@ -633,6 +633,9 @@
|
||||||
color: @cp_sidebar-left-active-fg;
|
color: @cp_sidebar-left-active-fg;
|
||||||
border: 0px;
|
border: 0px;
|
||||||
}
|
}
|
||||||
|
&:focus-visible {
|
||||||
|
outline: @variables_focus_style;
|
||||||
|
}
|
||||||
i {
|
i {
|
||||||
margin-left: 5px;
|
margin-left: 5px;
|
||||||
}
|
}
|
||||||
|
|
|
@ -177,8 +177,8 @@
|
||||||
align-self: flex-start;
|
align-self: flex-start;
|
||||||
outline-style: none;
|
outline-style: none;
|
||||||
border-radius: @variables_radius;
|
border-radius: @variables_radius;
|
||||||
&:focus {
|
&:focus-visible {
|
||||||
outline: @cryptpad_color_brand solid 2px;
|
outline: @variables_focus_style;
|
||||||
}
|
}
|
||||||
@media (hover: none) {
|
@media (hover: none) {
|
||||||
margin-right: 20px;
|
margin-right: 20px;
|
||||||
|
@ -413,8 +413,8 @@
|
||||||
.fa {
|
.fa {
|
||||||
margin-right: 5px;
|
margin-right: 5px;
|
||||||
}
|
}
|
||||||
&:focus{
|
&:focus-visible {
|
||||||
outline: @cryptpad_color_brand solid 2px;
|
outline: @variables_focus_style;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -651,8 +651,8 @@
|
||||||
&:hover {
|
&:hover {
|
||||||
background-color: @cp_kanban-add-hover;
|
background-color: @cp_kanban-add-hover;
|
||||||
}
|
}
|
||||||
&:focus {
|
&:focus-visible {
|
||||||
outline: @cryptpad_color_brand solid 2px;
|
outline: @variables_focus_style;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -40,6 +40,11 @@
|
||||||
|
|
||||||
#cp-sidebarlayout-container {
|
#cp-sidebarlayout-container {
|
||||||
#cp-sidebarlayout-rightside {
|
#cp-sidebarlayout-rightside {
|
||||||
|
input, button, span[tabindex="0"] {
|
||||||
|
&:focus-visible {
|
||||||
|
outline: @variables_focus_style;
|
||||||
|
}
|
||||||
|
}
|
||||||
input[type="checkbox"] {
|
input[type="checkbox"] {
|
||||||
vertical-align: middle;
|
vertical-align: middle;
|
||||||
margin-right: 5px;
|
margin-right: 5px;
|
||||||
|
@ -112,6 +117,9 @@
|
||||||
margin-top:0;
|
margin-top:0;
|
||||||
margin-left: 10px;
|
margin-left: 10px;
|
||||||
}
|
}
|
||||||
|
.cp-password-reveal {
|
||||||
|
border-radius:@variables_radius;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
@media (max-width: 840px) {
|
@media (max-width: 840px) {
|
||||||
|
|
||||||
|
|
|
@ -62,6 +62,14 @@
|
||||||
div#cp-sidebarlayout-leftside {
|
div#cp-sidebarlayout-leftside {
|
||||||
background-color: @cp_teams-leftside-bg;
|
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 {
|
div#cp-sidebarlayout-rightside.cp-rightside-drive {
|
||||||
padding: 0;
|
padding: 0;
|
||||||
& > .cp-team-chat {
|
& > .cp-team-chat {
|
||||||
|
@ -73,7 +81,11 @@
|
||||||
}
|
}
|
||||||
.cp-app-contacts-input {
|
.cp-app-contacts-input {
|
||||||
textarea {
|
textarea {
|
||||||
border: 0px;
|
border: 0;
|
||||||
|
margin-right: 2px;
|
||||||
|
}
|
||||||
|
.fa-paper-plane{
|
||||||
|
border-radius: @variables_radius;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -142,6 +154,9 @@
|
||||||
height: 384px;
|
height: 384px;
|
||||||
padding: 50px;
|
padding: 50px;
|
||||||
margin: 5px;
|
margin: 5px;
|
||||||
|
&:focus-visible {
|
||||||
|
outline: @variables_focus_style;
|
||||||
|
}
|
||||||
&.create, &:not(.empty) {
|
&.create, &:not(.empty) {
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
&:hover {
|
&:hover {
|
||||||
|
|
Loading…
Reference in a new issue