Rounded form elements

master
David Benqué 3 years ago
parent f102520778
commit 5cc163baf1

@ -122,6 +122,7 @@
.dialog { .dialog {
& > div { & > div {
background-color: @cp_alertify-bg; background-color: @cp_alertify-bg;
border-radius: @variables_radius_L;
&.half { &.half {
width: 50%; width: 50%;
max-width: 50%; max-width: 50%;
@ -205,6 +206,8 @@
box-sizing: border-box; box-sizing: border-box;
padding: 0 15px; padding: 0 15px;
cursor: pointer; cursor: pointer;
border-top-left-radius: @variables_radius;
border-top-right-radius: @variables_radius;
&:not(.disabled):hover { &:not(.disabled):hover {
background-color: @cp_alertify-hover; background-color: @cp_alertify-hover;
} }

@ -1,5 +1,6 @@
@import (reference) "./colortheme-all.less"; @import (reference) "./colortheme-all.less";
@import (reference) "./tools.less"; @import (reference) "./tools.less";
@import (reference) "./variables.less";
.checkmark_vars( .checkmark_vars(
@size: 20px @size: 20px
@ -39,6 +40,9 @@
align-items: center; align-items: center;
position: relative; position: relative;
.tools_unselectable(); .tools_unselectable();
.cp-checkmark-mark {
border-radius: @variables_radius;
}
& > a { & > a {
margin-left: 0.25em; margin-left: 0.25em;

@ -14,6 +14,7 @@
color: @cp_forms-fg; color: @cp_forms-fg;
background-color: @cp_forms-bg; background-color: @cp_forms-bg;
border: 1px solid @cp_forms-border; border: 1px solid @cp_forms-border;
border-radius: @variables_radius;
font-size: 100%; font-size: 100%;
padding: @alertify_padding-base; padding: @alertify_padding-base;
&:not(.tui-full-calendar-content) { &:not(.tui-full-calendar-content) {
@ -79,11 +80,15 @@
} }
button { button {
margin: 0 !important; margin: 0 !important;
border-bottom-left-radius: 0px;
border-bottom-right-radius: 0px;
} }
.cp-button-timer { .cp-button-timer {
height: 3px; height: 3px;
& > div { & > div {
height: 100%; height: 100%;
border-bottom-left-radius: 3px;
border-bottom-right-radius: 3px;
background-color: @cp_buttons-primary; background-color: @cp_buttons-primary;
&.danger, &.btn-danger, &.danger-alt, &.btn-danger-alt { &.danger, &.btn-danger, &.danger-alt, &.btn-danger-alt {
background-color: @cp_buttons-red; background-color: @cp_buttons-red;
@ -109,7 +114,7 @@
font-size: 14px; font-size: 14px;
text-decoration: none; text-decoration: none;
cursor: pointer; cursor: pointer;
border-radius: 0; border-radius: @variables_radius;
transition: none; transition: none;
i, .fa, .cptools { i, .fa, .cptools {
@ -230,7 +235,7 @@
margin: 0px 0px @alertify_padding-base 0px; margin: 0px 0px @alertify_padding-base 0px;
font-size: 12px; font-size: 12px;
padding: 5px; padding: 5px;
border-radius: 0px; border-radius: @variables_radius;
i { i {
margin-right: 10px; margin-right: 10px;
} }
@ -303,7 +308,7 @@
.flatpickr-calendar { .flatpickr-calendar {
background: @cp_flatpickr-bg; background: @cp_flatpickr-bg;
color: @cryptpad_text_col; color: @cryptpad_text_col;
border-radius: 0; border-radius: @variables_radius;
box-shadow: @variables_shadow; box-shadow: @variables_shadow;
-webkit-box-shadow: @variables_shadow; -webkit-box-shadow: @variables_shadow;
&.arrowTop::before, &.arrowTop::after { &.arrowTop::before, &.arrowTop::after {

@ -35,6 +35,12 @@
flex: 1; flex: 1;
min-width: 0 !important; min-width: 0 !important;
} }
button {
// no radius in input + button combo
// input .token-input is styled at the bottom of this file
border-top-left-radius: 0px;
border-bottom-left-radius: 0px;
}
} }
.token { .token {
box-sizing: border-box; box-sizing: border-box;
@ -92,6 +98,8 @@
max-width: 100%; max-width: 100%;
width: 100%; width: 100%;
min-width: 100% !important; min-width: 100% !important;
border-top-right-radius: 0px !important;
border-bottom-right-radius: 0px !important;
&:focus { &:focus {
outline: 0; outline: 0;
box-shadow: none; box-shadow: none;

Loading…
Cancel
Save