164 lines
3.3 KiB
CSS
164 lines
3.3 KiB
CSS
@tailwind base;
|
|
@tailwind components;
|
|
@tailwind utilities;
|
|
|
|
@layer components {
|
|
/* .btn-outline-primary {
|
|
@apply bg-transparent hover:bg-sky-400 text-sky-400 hover:text-white border-2 border-sky-400 border-opacity-60 rounded-full py-2 transition;
|
|
}
|
|
.btn-primary {
|
|
@apply bg-sky-400 hover:bg-sky-400 text-white hover:text-white border-2 border-sky-400 border-opacity-60 rounded-full py-2 transition;
|
|
} */
|
|
.btn {
|
|
@apply font-bold py-2 px-4 rounded transition-all;
|
|
}
|
|
|
|
.btn-primary {
|
|
@apply bg-primary-200 text-white;
|
|
}
|
|
.btn-primary:hover {
|
|
@apply bg-primary-300;
|
|
}
|
|
|
|
.btn-secondary {
|
|
@apply bg-secondary-100 text-white;
|
|
}
|
|
.btn-secondary:hover {
|
|
@apply bg-secondary-200;
|
|
}
|
|
|
|
.btn-info {
|
|
@apply bg-info-100 text-white;
|
|
}
|
|
.btn-info:hover {
|
|
@apply bg-info-200;
|
|
}
|
|
|
|
.form-control {
|
|
@apply !appearance-none !border-[2px] !bg-body-100 !border-gray-300 !rounded-2xl !w-full !py-4 !px-3 !text-gray-700 !leading-tight focus:!border-[2px] focus:!border-red-600 focus:!outline-none !transition-all;
|
|
}
|
|
|
|
.form-control-white {
|
|
@apply !appearance-none !border-[2px] !bg-white !border-gray-300 !rounded-2xl !w-full !py-4 px-3 !text-gray-700 !leading-tight focus:!border-[2px] focus:!border-red-600 focus:!outline-none !transition-all;
|
|
}
|
|
}
|
|
|
|
input[type="checkbox"] {
|
|
/* Hide the default checkbox appearance */
|
|
appearance: inherit;
|
|
/* -webkit-appearance: none; */
|
|
/* -moz-appearance: none; */
|
|
|
|
/* Set the desired size and border radius */
|
|
width: 40px;
|
|
height: 40px;
|
|
border-radius: 30px; /* Use a percentage for a circular shape */
|
|
|
|
/* Add custom styling */
|
|
border: 2px solid hsl(14, 82%, 47%);
|
|
background-color: #fff;
|
|
}
|
|
input[type="checkbox"]:checked {
|
|
background-color: #da4215;
|
|
}
|
|
|
|
body {
|
|
font-family: KalamehWeb !important;
|
|
background: #eeeeee;
|
|
--toastify-font-family: KalamehWeb !important;
|
|
}
|
|
|
|
.rtl {
|
|
direction: rtl;
|
|
}
|
|
|
|
.ltr {
|
|
direction: ltr;
|
|
}
|
|
|
|
.tr2 {
|
|
transition: 2s;
|
|
}
|
|
|
|
.tr03 {
|
|
transition: 0.3s all;
|
|
}
|
|
|
|
.fuck-cick {
|
|
pointer-events: none;
|
|
}
|
|
|
|
.bg-BigPlus {
|
|
background: rgba(0, 0, 0, 0.9);
|
|
}
|
|
|
|
.loader {
|
|
width: 20px;
|
|
height: 20px;
|
|
border: 3px solid #fff;
|
|
border-bottom-color: transparent;
|
|
border-radius: 50%;
|
|
display: inline-block;
|
|
box-sizing: border-box;
|
|
animation: rotation 0.9s linear infinite;
|
|
}
|
|
|
|
@keyframes rotation {
|
|
0% {
|
|
transform: rotate(0deg);
|
|
}
|
|
100% {
|
|
transform: rotate(360deg);
|
|
}
|
|
}
|
|
|
|
[data-rsbs-backdrop] {
|
|
z-index: 20 !important;
|
|
background-color: rgba(0, 0, 0, 0.8) !important;
|
|
}
|
|
[data-rsbs-overlay] {
|
|
z-index: 999 !important;
|
|
overflow: hidden;
|
|
}
|
|
[data-rsbs-header] {
|
|
background-color: #356859;
|
|
}
|
|
|
|
.DatePicker {
|
|
width: 100%;
|
|
margin-top: 10px;
|
|
}
|
|
.responsive-datePicker {
|
|
/* by setting font-size, all the elements will correspond */
|
|
font-size: 9px !important; /* default to 10px */
|
|
}
|
|
|
|
@media (max-width: 1500px) {
|
|
.responsive-datePicker {
|
|
font-size: 8px !important;
|
|
}
|
|
}
|
|
|
|
@media (max-width: 1200px) {
|
|
.responsive-datePicker {
|
|
font-size: 7px !important;
|
|
}
|
|
}
|
|
|
|
@media (max-width: 768px) {
|
|
.responsive-datePicker {
|
|
font-size: 6px !important;
|
|
}
|
|
}
|
|
|
|
/* Large screens */
|
|
@media (min-width: 2500px) {
|
|
.responsive-datePicker {
|
|
font-size: 12px !important;
|
|
}
|
|
}
|
|
.DatePicker__CalenderContainer {
|
|
top: -100px !important;
|
|
z-index: 100000;
|
|
}
|