You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
168 lines
4.9 KiB
168 lines
4.9 KiB
$border-radiuses: ( "0": 0, "sm": 2px, "lg": 8px, "xl": 24px);
|
|
|
|
@each $size, $value in $border-radiuses {
|
|
.rounded-#{$size} {
|
|
border-radius: $value !important;
|
|
}
|
|
|
|
.rounded-t-#{$size} {
|
|
border-top-left-radius: $value !important;
|
|
border-top-right-radius: $value !important;
|
|
}
|
|
|
|
.rounded-r-#{$size}, .rounded-e-#{$size} {
|
|
border-top-right-radius: $value !important;
|
|
border-bottom-right-radius: $value !important;
|
|
}
|
|
|
|
.rounded-b-#{$size} {
|
|
border-bottom-right-radius: $value !important;
|
|
border-bottom-left-radius: $value !important;
|
|
}
|
|
|
|
.rounded-l-#{$size}, .rounded-s-#{$size} {
|
|
border-top-left-radius: $value !important;
|
|
border-bottom-left-radius: $value !important;
|
|
}
|
|
|
|
.rounded-tl-#{$size}, .rounded-ts-#{$size} {
|
|
border-top-left-radius: $value !important;
|
|
}
|
|
|
|
.rounded-tr-#{$size}, .rounded-te-#{$size} {
|
|
border-top-right-radius: $value !important;
|
|
}
|
|
|
|
.rounded-br-#{$size}, .rounded-be-#{$size} {
|
|
border-bottom-right-radius: $value !important;
|
|
}
|
|
|
|
.rounded-bl-#{$size}, .rounded-bs-#{$size} {
|
|
border-bottom-left-radius: $value !important;
|
|
}
|
|
|
|
//--------------------------- rtl styles ---------------------------
|
|
.application-layout-rtl {
|
|
.rounded-s-#{$size} {
|
|
border-top-right-radius: $value !important;
|
|
border-bottom-right-radius: $value !important;
|
|
border-top-left-radius: 0 !important;
|
|
border-bottom-left-radius: 0 !important;
|
|
}
|
|
|
|
.rounded-e-#{$size} {
|
|
border-top-left-radius: $value !important;
|
|
border-bottom-left-radius: $value !important;
|
|
border-top-right-radius: 0 !important;
|
|
border-bottom-right-radius: 0 !important;
|
|
}
|
|
|
|
.rounded-ts-#{$size} {
|
|
border-top-right-radius: $value !important;
|
|
border-top-left-radius: 0 !important;
|
|
}
|
|
|
|
.rounded-te-#{$size} {
|
|
border-top-left-radius: $value !important;
|
|
border-top-right-radius: 0 !important;
|
|
}
|
|
|
|
.rounded-bs-#{$size} {
|
|
border-bottom-right-radius: $value !important;
|
|
border-bottom-left-radius: 0 !important;
|
|
}
|
|
|
|
.rounded-be-#{$size} {
|
|
border-bottom-left-radius: $value !important;
|
|
border-bottom-right-radius: 0 !important;
|
|
}
|
|
}
|
|
//------------------------------------------------------------------
|
|
}
|
|
|
|
.rounded {
|
|
border-radius: var(--default-borderradius) !important;
|
|
}
|
|
|
|
.rounded-t {
|
|
border-top-left-radius: var(--default-borderradius) !important;
|
|
border-top-right-radius: var(--default-borderradius) !important;
|
|
}
|
|
|
|
.rounded-r, .rounded-e {
|
|
border-top-right-radius: var(--default-borderradius) !important;
|
|
border-bottom-right-radius: var(--default-borderradius) !important;
|
|
}
|
|
|
|
.rounded-b {
|
|
border-bottom-right-radius: var(--default-borderradius) !important;
|
|
border-bottom-left-radius: var(--default-borderradius) !important;
|
|
}
|
|
|
|
.rounded-l, .rounded-s {
|
|
border-top-left-radius: var(--default-borderradius) !important;
|
|
border-bottom-left-radius: var(--default-borderradius) !important;
|
|
}
|
|
|
|
.rounded-tl, .rounded-ts {
|
|
border-top-left-radius: var(--default-borderradius) !important;
|
|
}
|
|
|
|
.rounded-tr, .rounded-te {
|
|
border-top-right-radius: var(--default-borderradius) !important;
|
|
}
|
|
|
|
.rounded-br, .rounded-be {
|
|
border-bottom-right-radius: var(--default-borderradius) !important;
|
|
}
|
|
|
|
.rounded-bl, .rounded-bs {
|
|
border-bottom-left-radius: var(--default-borderradius) !important;
|
|
}
|
|
|
|
//--------------------------- rtl styles ---------------------------
|
|
.application-layout-rtl {
|
|
.rounded-s {
|
|
border-top-right-radius: var(--default-borderradius) !important;
|
|
border-bottom-right-radius: var(--default-borderradius) !important;
|
|
border-top-left-radius: 0 !important;
|
|
border-bottom-left-radius: 0 !important;
|
|
}
|
|
|
|
.rounded-e {
|
|
border-top-left-radius: var(--default-borderradius) !important;
|
|
border-bottom-left-radius: var(--default-borderradius) !important;
|
|
border-top-right-radius: 0 !important;
|
|
border-bottom-right-radius: 0 !important;
|
|
}
|
|
|
|
.rounded-ts {
|
|
border-top-right-radius: var(--default-borderradius) !important;
|
|
border-top-left-radius: 0 !important;
|
|
}
|
|
|
|
.rounded-te {
|
|
border-top-left-radius: var(--default-borderradius) !important;
|
|
border-top-right-radius: 0 !important;
|
|
}
|
|
|
|
.rounded-bs {
|
|
border-bottom-right-radius: var(--default-borderradius) !important;
|
|
border-bottom-left-radius: 0 !important;
|
|
}
|
|
|
|
.rounded-be {
|
|
border-bottom-left-radius: var(--default-borderradius) !important;
|
|
border-bottom-right-radius: 0 !important;
|
|
}
|
|
}
|
|
//------------------------------------------------------------------
|
|
|
|
|
|
.rounded-circle {
|
|
border-radius: 50% !important;
|
|
}
|
|
|
|
.rounded-pill {
|
|
border-radius: 9999px !important;
|
|
} |