Signal-Desktop/sticker-creator/elements/LabeledInput.scss

59 lines
1.0 KiB
SCSS

// Copyright 2019-2021 Signal Messenger, LLC
// SPDX-License-Identifier: AGPL-3.0-only
@import '../../stylesheets/variables';
@import '../mixins';
.container {
display: flex;
flex-direction: column;
align-items: flex-start;
justify-content: space-between;
height: 56px;
}
.label {
user-select: none;
font-size: 13px;
font-family: $inter;
font-weight: 500;
}
.input {
width: 448px;
height: 34px;
line-height: 34px;
padding: 0 12px;
border-radius: 4px;
background-color: transparent;
font-size: 14px;
font-family: $inter;
&::placeholder {
color: $color-gray-45;
}
@include light-theme() {
border: 1px solid $color-gray-15;
color: $color-gray-90;
}
@include dark-theme() {
border: 1px solid $color-gray-60;
color: $color-white;
}
&:focus {
outline: none;
padding: 0 11px;
@include light-theme() {
border: 2px solid $color-ultramarine;
}
@include dark-theme() {
border: 2px solid $color-ultramarine-light;
}
}
}