BetterDiscordApp-v2/client/src/styles/partials/generic/forms/text.scss

103 lines
2.3 KiB
SCSS
Raw Normal View History

.bd-form-textinput,
.bd-form-numberinput {
h3 {
+ .bd-textinput-wrapper,
+ .bd-textinput-wrapper input[type="text"],
+ .bd-textinput-wrapper input[type="number"] {
width: 180px;
}
}
input[type="text"],
input[type="number"] {
background: transparent;
border: none;
color: #b9bbbe;
border-bottom: 2px solid rgba(114, 118, 126, 0.3);
outline: none;
line-height: 24px;
font-size: 100%;
font-weight: 500;
width: 100%;
&:focus {
color: #fff;
border-color: $colbdblue;
}
}
}
.bd-textinput-wrapper {
width: 100%;
}
2018-02-05 02:14:19 +01:00
.bd-form-textarea {
.bd-form-textarea-wrap {
margin-top: 15px;
background: rgba(0, 0, 0, 0.1);
border: 1px solid rgba(0, 0, 0, 0.3);
border-radius: 3px;
color: #b9bbbe;
overflow-y: scroll;
max-height: 140px;
&:focus {
color: #fff;
border-color: #040405;
}
@include scrollbar;
}
div[contenteditable] {
padding: 11px;
cursor: text;
}
}
.bd-number {
position: relative;
input[type="number"] {
&::-webkit-inner-spin-button,
::-webkit-outer-spin-button {
-webkit-appearance: none;
margin: 0;
}
}
.bd-number-spinner {
position: absolute;
top: 0;
right: 0;
height: 100%;
justify-content: space-around;
.bd-arrow {
padding: 3px 5px;
cursor: pointer;
font-size: 0;
.bd-up-arrow {
border-color: transparent transparent rgb(153, 153, 153);
border-style: solid;
border-width: 2.5px 5px 5px;
}
&:hover .bd-up-arrow {
border-color: transparent transparent rgb(200, 200, 200);
}
.bd-down-arrow {
border-color: rgb(153, 153, 153) transparent transparent;
border-style: solid;
border-width: 5px 5px 2.5px;
}
&:hover .bd-down-arrow {
border-color: rgb(200, 200, 200) transparent transparent;
}
}
}
}