|
|
|
@ -6,10 +6,17 @@ $alertContentColor: #646464; |
|
|
|
|
$white: #fff; |
|
|
|
|
// $BgHeaderColor |
|
|
|
|
|
|
|
|
|
// ? bluee alert Box , error1 |
|
|
|
|
// ? blue alert Box , error1 |
|
|
|
|
$lightBlue: #06bace; |
|
|
|
|
$confirmBtnBgColor: #f6feff; |
|
|
|
|
$blueTitleBgColor: #dfe6e9; |
|
|
|
|
|
|
|
|
|
// ? green alert Box , error1 |
|
|
|
|
$lightGreen: #3ee924; |
|
|
|
|
$darkGreen: #21ae0b; |
|
|
|
|
$greenTitleBgColor: #91ff5233; |
|
|
|
|
|
|
|
|
|
$darkRed: #e92424; |
|
|
|
|
$headerBgClr: #dfe6e9; |
|
|
|
|
|
|
|
|
|
// $errorcolor1: #06bace; |
|
|
|
|
// $errorcolor2: #3ee924; |
|
|
|
@ -21,17 +28,17 @@ $headerBgClr: #dfe6e9; |
|
|
|
|
// $toastbgerror: #ffeaea; |
|
|
|
|
// $toastbgsuccess: #c3ffb9; |
|
|
|
|
// $toastsuccesscolor: #21ae0b; |
|
|
|
|
|
|
|
|
|
// ! common styles |
|
|
|
|
|
|
|
|
|
// alert box |
|
|
|
|
// * alert box |
|
|
|
|
.swal2-container.swal2-center > .swal2-popup { |
|
|
|
|
border: solid 2px $alertBorderClr !important; |
|
|
|
|
border-top-right-radius: 10px !important; |
|
|
|
|
border-top-left-radius: 10px !important; |
|
|
|
|
// |
|
|
|
|
position: relative; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
/* ? کلاس تمامی تایتل ها */ |
|
|
|
|
// * کلاس تمامی تایتل ها |
|
|
|
|
.swal2-title { |
|
|
|
|
text-align: right !important; |
|
|
|
|
font-size: 20px !important; |
|
|
|
@ -42,7 +49,7 @@ $headerBgClr: #dfe6e9; |
|
|
|
|
border-top-left-radius: 10px !important; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
/* ? کلاس متن داخل الرت باکس */ |
|
|
|
|
// * کلاس متن داخل الرت باکس |
|
|
|
|
.swal2-html-container { |
|
|
|
|
text-align: justify !important; |
|
|
|
|
line-height: 1.8 !important; |
|
|
|
@ -50,7 +57,7 @@ $headerBgClr: #dfe6e9; |
|
|
|
|
font-size: 16px !important; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
/* ? کلاس ایکن کنسل یا ضربدر بالا سمت چپ الرت باکس */ |
|
|
|
|
// * کلاس ایکن کنسل یا ضربدر بالا سمت چپ الرت باکس |
|
|
|
|
.swal2-rtl .swal2-close { |
|
|
|
|
width: 31px !important; |
|
|
|
|
height: 30px !important; |
|
|
|
@ -66,93 +73,102 @@ $headerBgClr: #dfe6e9; |
|
|
|
|
z-index: 2; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
/* ? کلاس کانفرم باتن */ |
|
|
|
|
// * کلاس کانفرم باتن |
|
|
|
|
.swal2-styled.swal2-confirm { |
|
|
|
|
transition: all 0.4s !important; |
|
|
|
|
outline: none !important; |
|
|
|
|
border-radius: 4px !important; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
/* ? کلاس هاور کانفرم باتن */ |
|
|
|
|
// * کلاس هاور کانفرم باتن |
|
|
|
|
.swal2-styled.swal2-confirm:hover { |
|
|
|
|
transform: translateY(-5px) !important; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
/* ? کلاس کنسل باتن */ |
|
|
|
|
// * کلاس کنسل باتن |
|
|
|
|
.swal2-styled.swal2-cancel { |
|
|
|
|
transition: all 0.4s !important; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
/* ? کلاس هاور کنسل باتن */ |
|
|
|
|
// * کلاس هاور کنسل باتن |
|
|
|
|
.swal2-styled.swal2-cancel:hover { |
|
|
|
|
transform: translateY(-5px) !important; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
/* ? ایکن اررور */ |
|
|
|
|
// * ایکن اررور |
|
|
|
|
.swal2-icon.swal2-error { |
|
|
|
|
border-color: $darkRed !important; |
|
|
|
|
color: $darkRed !important; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
// ? error 1 lightBlue |
|
|
|
|
// به اررور های ابی رنگ کلاس هایی دادم که اخرش با 1 تمام میشود |
|
|
|
|
// * به اررور های ابی رنگ کلاس هایی دادم که اخرش با 1 تمام میشود |
|
|
|
|
// TODO باکس اول از سمت راست در فایل پی اس دی |
|
|
|
|
// ? تایتل |
|
|
|
|
.title-error-1 { |
|
|
|
|
color: $lightBlue !important; |
|
|
|
|
background-color: $headerBgClr !important; |
|
|
|
|
background-color: $blueTitleBgColor !important; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.eroorr:focus { |
|
|
|
|
outline: none !important; |
|
|
|
|
box-shadow: 0px 0px 0px black !important; |
|
|
|
|
border: 0px !important; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
/* ? دکمه ضربدر بالا سمت چپ */ |
|
|
|
|
// * دکمه ضربدر بالا سمت چپ |
|
|
|
|
.close-button-1 { |
|
|
|
|
background-color: $lightBlue !important; |
|
|
|
|
color: $white !important; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
/* ? هاور دکمه ضربدر بالا سمت چپ */ |
|
|
|
|
// * هاور دکمه ضربدر بالا سمت چپ |
|
|
|
|
.close-button-1:hover { |
|
|
|
|
background-color: var(--white) !important; |
|
|
|
|
background-color: $white !important; |
|
|
|
|
color: $lightBlue !important; |
|
|
|
|
border: solid 2px $lightBlue !important; |
|
|
|
|
} |
|
|
|
|
/* ? کانفرم باتن */ |
|
|
|
|
|
|
|
|
|
// * کانفرم باتن |
|
|
|
|
.confirm-button-1 { |
|
|
|
|
background-color: var(--white) !important; |
|
|
|
|
border: solid 2px var(--error-color1) !important; |
|
|
|
|
color: var(--error-color1) !important; |
|
|
|
|
text-align: left !important; |
|
|
|
|
background-color: $confirmBtnBgColor !important; |
|
|
|
|
border: solid 1px $lightBlue !important; |
|
|
|
|
color: $lightBlue !important; |
|
|
|
|
// |
|
|
|
|
position: absolute !important; |
|
|
|
|
left: 20px !important; |
|
|
|
|
margin-bottom: 33px !important; |
|
|
|
|
} |
|
|
|
|
/* ? هاور کانفرم باتن */ |
|
|
|
|
|
|
|
|
|
// * هاور کانفرم باتن |
|
|
|
|
.confirm-button-1:hover { |
|
|
|
|
background-color: var(--error-color1) !important; |
|
|
|
|
color: var(--white) !important; |
|
|
|
|
background-color: $lightBlue !important; |
|
|
|
|
color: $white !important; |
|
|
|
|
} |
|
|
|
|
/* !error 2 */ |
|
|
|
|
/* ? کنسل باتن */ |
|
|
|
|
|
|
|
|
|
// ? error 2 lightBlue |
|
|
|
|
// TODO کنسل باتن |
|
|
|
|
.cancle-button1 { |
|
|
|
|
background-color: var(--error-color1) !important; |
|
|
|
|
color: var(--white) !important; |
|
|
|
|
border: solid 2px var(--error-color1) !important; |
|
|
|
|
background-color: $lightBlue !important; |
|
|
|
|
color: $white !important; |
|
|
|
|
border: solid 1px $lightBlue !important; |
|
|
|
|
// |
|
|
|
|
position: absolute !important; |
|
|
|
|
left: 33% !important; |
|
|
|
|
margin-bottom: 33px !important; |
|
|
|
|
} |
|
|
|
|
/* ? هاور کنسل باتن */ |
|
|
|
|
|
|
|
|
|
// TODO هاور کنسل باتن |
|
|
|
|
.cancle-button1:hover { |
|
|
|
|
background-color: var(--white) !important; |
|
|
|
|
color: var(--error-color1) !important; |
|
|
|
|
background: $white !important; |
|
|
|
|
color: $lightBlue !important; |
|
|
|
|
} |
|
|
|
|
/* !error3 */ |
|
|
|
|
/* ? تایتل */ |
|
|
|
|
|
|
|
|
|
// ? error3 |
|
|
|
|
// TODO تایتل |
|
|
|
|
.title-error-2 { |
|
|
|
|
color: var(--error-color2) !important; |
|
|
|
|
color: $darkGreen !important; |
|
|
|
|
background-color: $greenTitleBgColor !important; |
|
|
|
|
} |
|
|
|
|
/* ? دکمه ضربدر بالا سمت چپ */ |
|
|
|
|
|
|
|
|
|
// * دکمه ضربدر بالا سمت چپ |
|
|
|
|
.close-button-2 { |
|
|
|
|
background-color: var(--error-color2) !important; |
|
|
|
|
color: var(--white) !important; |
|
|
|
|
background-color: $lightGreen !important; |
|
|
|
|
color: $white !important; |
|
|
|
|
} |
|
|
|
|
/* ? هاور دکمه ضربدر بالا سمت چپ */ |
|
|
|
|
.close-button-2:hover { |
|
|
|
|