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

47 lines
886 B
SCSS
Raw Normal View History

2019-09-08 18:57:57 +02:00
.editable-input {
height: 70%;
display: flex;
align-items: center;
}
2020-04-27 22:48:55 +02:00
button.editable-input__label {
2020-01-15 12:09:30 +01:00
display: flex;
2019-09-08 18:57:57 +02:00
@include themify() {
color: getThemifyVariable('inactive-text-color');
2020-04-27 22:48:55 +02:00
& path {
fill: getThemifyVariable('inactive-text-color');
}
2019-09-08 18:57:57 +02:00
&:hover {
2020-04-27 22:48:55 +02:00
color: getThemifyVariable('logo-color');
& path {
fill: getThemifyVariable('logo-color');
2019-09-08 18:57:57 +02:00
}
}
}
cursor: pointer;
line-height: #{18 / $base-font-size}rem;
font-size: unset;
font-weight: unset;
}
2020-04-27 22:48:55 +02:00
.editable-input__input {
width: 100%;
}
2020-04-30 00:34:37 +02:00
.editable-input__icon {
2019-09-08 18:57:57 +02: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 22:48:55 +02:00
display: flex;
2019-09-08 18:57:57 +02:00
}