keeweb
/
keeweb
mirror of https://github.com/keeweb/keeweb.git
1
0
Fork 0
Code Issues Releases Wiki Activity

better detail editor styles on mobile

This commit is contained in:
antelle 2019-03-30 23:39:33 +01:00
parent a7d7400309
commit fb418d3aa0
1 changed files with 30 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

39
app/styles/areas/_details.scss
View File

@ -41,6 +41,9 @@
@include th {
border: 1px solid th(light-border-color);
}
@include mobile {
border-color: transparent;
}
}
}
input.details__header-title-input {
@ -52,6 +55,9 @@
font-weight: bold;
position: relative;
top: -2px;
@include mobile {
width: 100%;
}
}
&-color, &-icon {
@include user-select(none);
@ -147,6 +153,9 @@
align-items: stretch;
flex-direction: column;
justify-content: flex-start;
@include mobile {
width: 100%;
}
}
&-after {
@ -208,15 +217,19 @@
.details__field--editable & {
border-radius: $base-border-radius;
&:hover {
transition: border-color $base-duration $base-timing;
border: 1px solid;
@include th {
border-color: th(light-border-color);
box-shadow: 0 0 3px rgba(0, 0, 0, 0.06);
}
.details__field-value-add-label {
@include th { color: th(muted-color); }
transition: color $base-duration $base-timing;
@include nomobile {
transition: border-color $base-duration $base-timing;
border: 1px solid;
@include th {
border-color: th(light-border-color);
box-shadow: 0 0 3px rgba(0, 0, 0, 0.06);
}
.details__field-value-add-label {
@include th {
color: th(muted-color);
}
transition: color $base-duration $base-timing;
}
}
}
}
@ -250,6 +263,9 @@
.details__field--edit[active-mobile-action=cancel] & {
@include th { background: th(error-color); border-color: th(error-color); }
}
@include mobile {
border-color: transparent !important;
}
}
>input {
.chrome & { padding-bottom: 1px; } // TODO: find a better cross-browser way to do it
@ -333,6 +349,11 @@
@include user-select(none);
}
}
@include mobile {
@include th { border-bottom: light-border(); }
padding-bottom: .5em;
}
}
&__attachments {