p5.js-web-editor/client/styles/components/_editable-input.scss

47 lines
886 B
SCSS
Raw Normal View History

2019-09-08 16:57:57 +00:00
.editable-input {
height: 70%;
display: flex;
align-items: center;
}
2020-04-27 20:48:55 +00:00
button.editable-input__label {
2020-01-15 11:09:30 +00:00
display: flex;
2019-09-08 16:57:57 +00:00
@include themify() {
color: getThemifyVariable('inactive-text-color');
2020-04-27 20:48:55 +00:00
& path {
fill: getThemifyVariable('inactive-text-color');
}
2019-09-08 16:57:57 +00:00
&:hover {
2020-04-27 20:48:55 +00:00
color: getThemifyVariable('logo-color');
& path {
fill: getThemifyVariable('logo-color');
2019-09-08 16:57:57 +00:00
}
}
}
cursor: pointer;
line-height: #{18 / $base-font-size}rem;
font-size: unset;
font-weight: unset;
}
2020-04-27 20:48:55 +00:00
.editable-input__input {
width: 100%;
}
2020-04-29 22:34:37 +00:00
.editable-input__icon {
2019-09-08 16:57:57 +00:00
width: 1.5rem;
height: 1.5rem;
}
.editable-input--is-not-editing .editable-input__input,
.editable-input--is-editing .editable-input__label {
display: none;
}
.editable-input--is-editing .editable-input__input,
.editable-input--is-not-editing .editable-input__label {
2020-04-27 20:48:55 +00:00
display: flex;
2019-09-08 16:57:57 +00:00
}