scinote-web/app/assets/stylesheets/shared/inline_edit.scss
2022-06-21 11:32:27 +02:00

61 lines
1.1 KiB
SCSS

// scss-lint:disable SelectorDepth
// scss-lint:disable NestingDepth
.sci-inline-edit {
column-gap: .25em;
display: grid;
grid-template-columns: auto repeat(2, max-content);
transition: .4s $timing-function-sharp;
.sci-inline-edit__content {
border: $border-transparent;
display: flex;
flex-direction: column;
justify-content: center;
line-height: 1em;
margin-left: -.25em;
min-height: 36px;
padding-left: .25em;
width: 100%;
.sci-inline-edit__view {
cursor: pointer;
width: 100%;
&.blank {
color: $color-silver-chalice;
}
}
textarea {
background: transparent;
border: 0;
line-height: 1em;
min-height: 1em;
outline: none;
overflow: hidden;
padding: 0;
padding-top: 2px;
width: 100%;
&:focus {
outline: none;
}
&.error {
border-color: $brand-danger;
}
}
.sci-inline-edit__error {
color: $brand-danger;
font-size: .8em;
}
}
&.editing {
.sci-inline-edit__content {
border-color: $brand-focus;
}
}
}