| Server IP : 108.170.25.35 / Your IP : 3.143.4.99 Web Server : Apache/2 System : Linux gains.winzonesoftech.com 4.18.0-513.24.1.el8_9.x86_64 #1 SMP Mon Apr 8 11:23:13 EDT 2024 x86_64 User : studio ( 1434) PHP Version : 8.1.28 Disable Function : exec,system,passthru,shell_exec,proc_close,proc_open,dl,popen,show_source,posix_kill,posix_mkfifo,posix_getpwuid,posix_setpgid,posix_setsid,posix_setuid,posix_setgid,posix_seteuid,posix_setegid,posix_uname MySQL : OFF | cURL : ON | WGET : OFF | Perl : OFF | Python : OFF | Sudo : OFF | Pkexec : OFF Directory : /home/studio/domains/studio7eleven.com/private_html/admin/scss/components/ui/ |
Upload File : |
// .qx_btn{
// min-height: 50px;
// min-width: 100px;
// // font-weight: 700;
// font-size: 16px;
// }
button{
cursor: pointer;
&:focus{
outline: 0;
box-shadow: none;
}
}
.btn {
// border-radius: 0px;
// box-shadow: 0 4px 6px rgba(50,50,93,.05), 0 1px 3px rgba(0,0,0,.08);
&:hover, &:focus, &:active, &.active{
outline: 0!important;
// box-shadow: 0 4px 05x rgba(50,50,93,.05), 0 1px 3px rgba(0,0,0,.08);
}
&-transparent {
background-color: transparent;
}
}
// .btn-primary {
// -webkit-box-shadow: 0 2px 6px 0 rgba(114,124,245,.5);
// box-shadow: 0 2px 6px 0 rgba(114,124,245,.5);
// }
// .btn-secondary {
// -webkit-box-shadow: 0 2px 6px 0 rgba(108,117,125,.5);
// box-shadow: 0 2px 6px 0 rgba(108,117,125,.5);
// }
// .btn-success {
// -webkit-box-shadow: 0 2px 6px 0 rgba(10,207,151,.5);
// box-shadow: 0 2px 6px 0 rgba(10,207,151,.5);
// }
// .btn-danger {
// -webkit-box-shadow: 0 2px 6px 0 rgba(250,92,124,.5);
// box-shadow: 0 2px 6px 0 rgba(250,92,124,.5);
// }
// .btn-warning {
// -webkit-box-shadow: 0 2px 6px 0 rgba(255,188,0,.5);
// box-shadow: 0 2px 6px 0 rgba(255,188,0,.5);
// }
// .btn-info {
// -webkit-box-shadow: 0 2px 6px 0 rgba(57,175,209,.5);
// box-shadow: 0 2px 6px 0 rgba(57,175,209,.5);
// }
// .btn-light {
// -webkit-box-shadow: 0 2px 6px 0 rgba(227,234,239,.5);
// box-shadow: 0 2px 6px 0 rgba(227,234,239,.5);
// }
// .btn-dark {
// -webkit-box-shadow: 0 2px 6px 0 rgba(49,58,70,.5);
// box-shadow: 0 2px 6px 0 rgba(49,58,70,.5);
// }
.btn-xs {
font-size: 0.75rem;
padding-top: .2rem;
padding-bottom: .2rem;
// padding : 0.5 2.5rem !important;
}
.btn-sm {
font-size: 0.875rem !important;
}
.btn-lg{
padding: 0.58rem 1rem;
font-size: 0.875rem !important;
}
.btn-xl{
padding: 0.6rem 1rem;
&.btn-default{
font-weight: 600;
}
}
.btn-square {
border-radius: 0;
}
.btn-rounded {
border-radius: 30px !important;
}
.btn-icon-right {
border-left: 1px solid rgba($white, 22%);
display : inline-block;
margin : -.8rem 0 -.8rem 1.3rem;
padding : 0.4375rem 0 0.4375rem 1.3rem;
}
.btn-icon-left {
background : $white;
border-radius: 10rem;
display : inline-block;
margin : -.5rem 1.3rem -.5rem -1.5rem;
padding : .5rem 1rem .6rem;
}
.toggle-dropdown::after {
margin-left: 0.755em;
}
.social-btn-icon {
.btn {
min-width : 7.5rem;
margin-bottom: 1.5rem;
}
}
.social-icon {
.btn {
padding: .7rem 1.4rem;
}
}
.btn-circle {
height : 5rem;
width : 5rem;
border-radius: 50% !important;
&-sm {
width: 4.5rem;
height: 4.5rem;
font-size: 1.8rem;
}
&-md {
width: 6rem;
height: 6rem;
font-size: 2.5rem;
i{
font-size: 2.4rem;
}
}
&-lg {
width: 8rem;
height: 8rem;
font-size: 3.2rem;
i{
font-size: 3.1rem;
}
}
}
.btn-page{
.btn{
min-width: 110px;
margin-right: 4px;
margin-bottom: 8px;
}
}
// btn sizes
.size-1{
min-width: 160px !important;
font-size: 24px;
padding: 0.68rem 0.75rem;
}
.size-2{
font-size: 20px;
min-width: 130px !important;
padding: 0.57rem 0.75rem;
}
.size-3{
font-size: 14px;
min-width: 110px !important;
padding: 0.536rem 0.75rem;
}
.size-4{
font-size: 14px;
min-width: 100px !important;
}
.size-5{
font-size: 14px;
min-width: 90px !important;
padding: .22rem 0.75rem;
}
.size-6{
font-size: 13px;
min-width: 80px !important;
padding: 0.097rem 0.75rem;
}
.size-7{
font-size: 12px;
min-width: 60px !important;
padding: 0.001rem 0.75rem;
}
.btn-light {
background : $light;
border-color: $border;
color : $dark;
&:active,
&:focus,
&:hover {
background : lighten($light, 25%);
color : $dark;
border-color: lighten($light, 25%);
}
}
.btn-outline-light{
color: $dark;
}
.btn-dark {
background : $dark;
border-color: $dark;
color : $white;
&:active,
&:focus,
&:hover {
background : darken($dark, 10%);
color : $white;
border-color: darken($dark, 10%);
}
}
.btn-group{
&.btn-rounded{
.btn:first-child{
border-top-left-radius: 30px;
border-bottom-left-radius: 30px;
}
.btn:last-child{
border-top-right-radius: 30px;
border-bottom-right-radius: 30px;
}
}
}
///////////////////
// Social Buttons
///////////////////
.btn-facebook {
background : $facebook;
border-color: $facebook;
color : $white;
&:active,
&:focus,
&:hover {
background : darken($facebook, 10%);
color : $white;
border-color: darken($facebook, 10%);
}
}
.btn-twitter {
background : $twitter;
border-color: $twitter;
color : $white;
&:active,
&:focus,
&:hover {
background : darken($twitter, 10%);
color : $white;
border-color: darken($twitter, 10%);
}
}
.btn-youtube {
background : $youtube;
border-color: $youtube;
color : $white;
&:active,
&:focus,
&:hover {
background : darken($youtube, 10%);
color : $white;
border-color: darken($youtube, 10%);
}
}
.btn-instagram {
background : $instagram;
border-color: $instagram;
color : $white;
&:active,
&:focus,
&:hover {
background : darken($instagram, 10%);
color : $white;
border-color: darken($instagram, 10%);
}
}
.btn-pinterest {
background : $pinterest;
border-color: $pinterest;
color : $white;
&:active,
&:focus,
&:hover {
background : darken($pinterest, 10%);
color : $white;
border-color: darken($pinterest, 10%);
}
}
.btn-linkedin {
background : $linkedin;
border-color: $linkedin;
color : $white;
&:active,
&:focus,
&:hover {
background : darken($linkedin, 10%);
color : $white;
border-color: darken($linkedin, 10%);
}
}
.btn-google-plus {
background : $google-plus;
border-color: $google-plus;
color : $white;
&:active,
&:focus,
&:hover {
background : darken($google-plus, 10%);
color : $white;
border-color: darken($google-plus, 10%);
}
}
.btn-google {
background : $google;
border-color: $google;
color : $white;
&:active,
&:focus,
&:hover {
background : darken($google, 10%);
color : $white;
border-color: darken($google, 10%);
}
}
.btn-snapchat {
background : $snapchat;
border-color: $snapchat;
color : $black;
&:active,
&:focus,
&:hover {
background : darken($snapchat, 10%);
color : $black;
border-color: darken($snapchat, 10%);
}
}
.btn-whatsapp {
background : $whatsapp;
border-color: $whatsapp;
color : $white;
&:active,
&:focus,
&:hover {
background : darken($whatsapp, 10%);
color : $white;
border-color: darken($whatsapp, 10%);
}
}
.btn-tumblr {
background : $tumblr;
border-color: $tumblr;
color : $white;
&:active,
&:focus,
&:hover {
background : darken($tumblr, 10%);
color : $white;
border-color: darken($tumblr, 10%);
}
}
.btn-reddit {
background : $reddit;
border-color: $reddit;
color : $white;
&:active,
&:focus,
&:hover {
background : darken($reddit, 10%);
color : $white;
border-color: darken($reddit, 10%);
}
}
.btn-spotify {
background : $spotify;
border-color: $spotify;
color : $white;
&:active,
&:focus,
&:hover {
background : darken($spotify, 10%);
color : $white;
border-color: darken($spotify, 10%);
}
}
.btn-yahoo {
background : $yahoo;
border-color: $yahoo;
color : $white;
&:active,
&:focus,
&:hover {
background : darken($yahoo, 10%);
color : $white;
border-color: darken($yahoo, 10%);
}
}
.btn-dribbble {
background : $dribbble;
border-color: $dribbble;
color : $white;
&:active,
&:focus,
&:hover {
background : darken($dribbble, 10%);
color : $white;
border-color: darken($dribbble, 10%);
}
}
.btn-skype {
background : $skype;
border-color: $skype;
color : $white;
&:active,
&:focus,
&:hover {
background : darken($skype, 10%);
color : $white;
border-color: darken($skype, 10%);
}
}
.btn-quora {
background : $quora;
border-color: $quora;
color : $white;
&:active,
&:focus,
&:hover {
background : darken($quora, 10%);
color : $white;
border-color: darken($quora, 10%);
}
}
.btn-vimeo {
background : $vimeo;
border-color: $vimeo;
color : $white;
&:active,
&:focus,
&:hover {
background : darken($vimeo, 10%);
color : $white;
border-color: darken($vimeo, 10%);
}
}