2031 lines
34 KiB
SCSS
2031 lines
34 KiB
SCSS
/**=====================
|
|
53. Dashboard CSS Start
|
|
==========================**/
|
|
//index dashboard css start
|
|
|
|
.form-control-plaintext {
|
|
width: auto !important;
|
|
}
|
|
|
|
@keyframes bounce-effect {
|
|
0% {
|
|
transform: translateY(0);
|
|
transition: 0.5s;
|
|
}
|
|
50% {
|
|
transform: translateY(-5px);
|
|
transition: 0.5s;
|
|
}
|
|
100% {
|
|
transform: translateY(0);
|
|
transition: 0.5s;
|
|
}
|
|
}
|
|
|
|
@keyframes round {
|
|
0% {
|
|
transform: scale(1);
|
|
}
|
|
50% {
|
|
transform: scale(1.2);
|
|
}
|
|
100% {
|
|
transform: scale(1);
|
|
}
|
|
}
|
|
|
|
@each $badge-light-name,
|
|
$badge-light-color in (primary, $primary-color),
|
|
(secondary, $secondary-color),
|
|
(success, $success-color),
|
|
(danger, $danger-color),
|
|
(info, $info-color),
|
|
(light, $badge-light-color),
|
|
(dark, $dark-color),
|
|
(warning, $warning-color) {
|
|
.badge-light-#{$badge-light-name} {
|
|
background-color: lighten($badge-light-color, 38%);
|
|
color: $badge-light-color;
|
|
}
|
|
}
|
|
.badge-light-light {
|
|
background-color: lighten($badge-light-color, 55%);
|
|
}
|
|
.badge-light-primary {
|
|
background-color: rgba($primary-color, 0.1);
|
|
}
|
|
|
|
.badge-light-success {
|
|
background-color: rgba($success-color, 0.15);
|
|
}
|
|
.badge-light-secondary {
|
|
background-color: rgba($secondary-color, 0.08);
|
|
}
|
|
|
|
.table {
|
|
thead {
|
|
th {
|
|
border-bottom: 2px solid $light-gray;
|
|
}
|
|
}
|
|
}
|
|
.overall-card {
|
|
.balance-card {
|
|
@media (max-width:1712px) {
|
|
padding: 12px;
|
|
}
|
|
}
|
|
@media (max-width: 1662px) and (min-width:1600px) {
|
|
.col-xl-9 {
|
|
width: 73%;
|
|
}
|
|
.col-xl-3 {
|
|
width: 27%;
|
|
}
|
|
}
|
|
@media (max-width: 1650px) and (min-width:1600px) {
|
|
.col-xl-9 {
|
|
width: 72%;
|
|
}
|
|
.col-xl-3 {
|
|
width: 28%;
|
|
}
|
|
}
|
|
@media (max-width: 1600px) and (min-width:1500px) {
|
|
.col-xl-9 {
|
|
width: 70%;
|
|
}
|
|
.col-xl-3 {
|
|
width: 30%;
|
|
}
|
|
}
|
|
@media (max-width: 1500px) and (min-width:1200px) {
|
|
.col-xl-9 {
|
|
width: 65%;
|
|
}
|
|
.col-xl-3 {
|
|
width: 35%;
|
|
}
|
|
}
|
|
}
|
|
/* Clock styles */
|
|
.clockbox {
|
|
margin-bottom: -5px;
|
|
svg {
|
|
width: 45px;
|
|
height: 45px;
|
|
@media (max-width: 767px) {
|
|
height: 36px;
|
|
}
|
|
}
|
|
}
|
|
.clockbox,
|
|
#clock {
|
|
width: 100%;
|
|
}
|
|
.circle {
|
|
fill: $white;
|
|
stroke: rgba($white,0.4);
|
|
stroke-width: 80px;
|
|
stroke-miterlimit: 10;
|
|
}
|
|
|
|
.mid-circle {
|
|
fill: #000;
|
|
}
|
|
.hour-marks {
|
|
fill: none;
|
|
stroke: $theme-body-sub-title-color;
|
|
stroke-width: 9;
|
|
stroke-miterlimit: 10;
|
|
}
|
|
|
|
.hour-hand {
|
|
fill: none;
|
|
stroke: #ff7e00;
|
|
stroke-width: 17;
|
|
stroke-miterlimit: 10;
|
|
}
|
|
|
|
.minute-hand {
|
|
fill: none;
|
|
stroke: #ff7e00;
|
|
stroke-width: 11;
|
|
stroke-miterlimit: 10;
|
|
}
|
|
|
|
.second-hand {
|
|
fill: none;
|
|
stroke: $warning-color;
|
|
stroke-width: 15px;
|
|
stroke-miterlimit: 10;
|
|
}
|
|
.sizing-box {
|
|
fill: none;
|
|
}
|
|
#hour,
|
|
#minute,
|
|
#second {
|
|
transform-origin: 300px 300px;
|
|
transition: transform .5s ease-in-out;
|
|
}
|
|
.widget-grid {
|
|
.height-equal {
|
|
@media (min-width: 1400px) {
|
|
min-height: unset !important;
|
|
}
|
|
}
|
|
> .col-xxl-auto {
|
|
@media (min-width: 1400px) {
|
|
width: 22.22%;
|
|
}
|
|
}
|
|
}
|
|
.order-chart {
|
|
> div {
|
|
margin-top: -25px;
|
|
margin-bottom: -43px;
|
|
}
|
|
svg {
|
|
path {
|
|
clip-path: inset(7% 0% 0% 0% round 0.6rem);
|
|
}
|
|
}
|
|
}
|
|
.growth-wrap {
|
|
.card-header {
|
|
position: relative;
|
|
z-index: 1;
|
|
}
|
|
}
|
|
.growth-wrapper {
|
|
> div {
|
|
margin-top: -54px;
|
|
margin-bottom: -25px;
|
|
@media (max-width: 1481px) {
|
|
margin-top: -50px;
|
|
}
|
|
}
|
|
}
|
|
.profit-chart {
|
|
> div {
|
|
margin-top: -45px;
|
|
margin-bottom: -48px;
|
|
}
|
|
.apexcharts-canvas {
|
|
.apexcharts-tooltip-text-label {
|
|
display: none;
|
|
}
|
|
}
|
|
}
|
|
.widget-1 {
|
|
background-image: url(../images/dashboard/widget-bg.png);
|
|
background-size: cover;
|
|
margin-bottom: 25px;
|
|
i {
|
|
font-weight: 700;
|
|
font-size: 12px;
|
|
}
|
|
.f-w-500 {
|
|
display: flex;
|
|
align-items: center;
|
|
@media (max-width: 1580px) and (min-width: 1200px) {
|
|
display: none;
|
|
}
|
|
}
|
|
.card-body {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: flex-end;
|
|
padding: 18px 25px;
|
|
@media (max-width: 1720px) {
|
|
padding: 18px;
|
|
}
|
|
}
|
|
.widget-round {
|
|
position: relative;
|
|
display: inline-block;
|
|
border-width: 1px;
|
|
border-style: solid;
|
|
border-radius: 100%;
|
|
.bg-round {
|
|
width: 56px;
|
|
height: 56px;
|
|
box-shadow: $widget-shadow;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
border-radius: 100%;
|
|
margin: 6px;
|
|
position: relative;
|
|
z-index: 1;
|
|
svg {
|
|
width: 24px;
|
|
height: 24px;
|
|
}
|
|
.half-circle {
|
|
height: 52px;
|
|
position: absolute;
|
|
left: -9px;
|
|
width: 35px;
|
|
bottom: -8px;
|
|
background: $white;
|
|
z-index: -1;
|
|
}
|
|
@media (max-width:1600px) {
|
|
width: 40px;
|
|
height: 40px;
|
|
svg {
|
|
width: 22px;
|
|
height: 22px;
|
|
}
|
|
.half-circle {
|
|
height: 40px;
|
|
left: -10px;
|
|
width: 30px;
|
|
bottom: -8px;
|
|
}
|
|
}
|
|
}
|
|
&.primary {
|
|
border-color: var(--theme-deafult);
|
|
}
|
|
&.secondary {
|
|
border-color: var(--theme-secondary);
|
|
}
|
|
&.success {
|
|
border-color: $success-color;
|
|
}
|
|
&.warning {
|
|
border-color: $warning-color;
|
|
}
|
|
}
|
|
.widget-content {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 15px;
|
|
@media (max-width:1600px) {
|
|
gap: 10px;
|
|
}
|
|
h4 {
|
|
margin-bottom: 4px;
|
|
}
|
|
}
|
|
&:hover {
|
|
transform: translateY(-5px);
|
|
transition: 0.5s;
|
|
.widget-round {
|
|
.svg-fill:not(.half-circle) {
|
|
animation: tada 1.5s ease infinite;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
.widget-with-chart {
|
|
.card-body {
|
|
align-items: center;
|
|
}
|
|
}
|
|
|
|
.profile-box {
|
|
background: $gradient-bg-primary;
|
|
color: $white;
|
|
.cartoon {
|
|
position: absolute;
|
|
bottom: -15px;
|
|
right: 20px;
|
|
animation: bounce-effect 5s infinite ease-in;
|
|
[dir="rtl"] & {
|
|
right: unset !important;
|
|
left: 5px;
|
|
}
|
|
@media (max-width: 1660px) {
|
|
right: 30px;
|
|
text-align: right;
|
|
[dir="rtl"] & {
|
|
left: -6px;
|
|
text-align: left;
|
|
}
|
|
img {
|
|
width: 80%;
|
|
}
|
|
}
|
|
@media (max-width: 1500px) {
|
|
img {
|
|
width: 60%;
|
|
}
|
|
}
|
|
@media (max-width: 767px) {
|
|
right: 10px;
|
|
[dir="rtl"] & {
|
|
left: -10px;
|
|
}
|
|
img {
|
|
width: 52%;
|
|
}
|
|
}
|
|
@media (max-width: 575px) {
|
|
right: 30px;
|
|
[dir="rtl"] & {
|
|
left: 10px;
|
|
}
|
|
img {
|
|
width: 48%;
|
|
}
|
|
}
|
|
}
|
|
.greeting-user {
|
|
p {
|
|
width: 60%;
|
|
@media (max-width: 1500px) {
|
|
width: 70%;
|
|
}
|
|
@media (max-width: 1199px) {
|
|
width: 80%;
|
|
}
|
|
@media (max-width: 767px) {
|
|
width: 98%;
|
|
}
|
|
@media (max-width: 600px) {
|
|
width: 100%;
|
|
}
|
|
@media (max-width: 575px) {
|
|
width: 98%;
|
|
}
|
|
}
|
|
}
|
|
.whatsnew-btn {
|
|
margin-top: 3.5rem;
|
|
@media (max-width: 1500px) {
|
|
margin-top: 1.7rem;
|
|
}
|
|
@media (max-width: 991px) {
|
|
margin-top: 3.5rem;
|
|
}
|
|
@media (max-width: 638px) {
|
|
margin-top: 2rem;
|
|
}
|
|
.btn {
|
|
@media (max-width: 767px) {
|
|
padding: 6px 10px;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.header-top {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
gap: 4px;
|
|
a {
|
|
i {
|
|
font-size: 14px;
|
|
margin-bottom: -2px;
|
|
}
|
|
&.btn {
|
|
padding: 8px 12px;
|
|
@media (max-width:575px) {
|
|
padding: 5px;
|
|
}
|
|
&.badge-light-primary {
|
|
&:hover {
|
|
background-color: var(--theme-deafult);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
.user-details {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 15px;
|
|
@media (max-width: 1399px) {
|
|
gap: 6px;
|
|
}
|
|
.customers {
|
|
width: 200px;
|
|
}
|
|
@media (max-width: 575px) {
|
|
flex-wrap: wrap;
|
|
}
|
|
}
|
|
.papernote-wrap {
|
|
.banner-img {
|
|
border-radius: 15px;
|
|
width: 100%;
|
|
}
|
|
.note-labels {
|
|
display: flex;
|
|
align-items: center;
|
|
> * {
|
|
padding: 3px 0;
|
|
}
|
|
ul {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 10px;
|
|
flex-wrap: wrap;
|
|
@media (max-width: 575px) {
|
|
gap: 4px;
|
|
}
|
|
}
|
|
.badge {
|
|
font-size: 14px;
|
|
padding: 6px 12px;
|
|
@media (max-width: 575px) {
|
|
font-size: 12px;
|
|
padding: 5px 6px;
|
|
}
|
|
}
|
|
.last-label {
|
|
padding-left: 16px;
|
|
margin-left: 16px;
|
|
border-left: 1px dashed rgba($theme-body-sub-title-color, 0.7);
|
|
[dir="rtl"] & {
|
|
padding-left: unset;
|
|
margin-left: unset;
|
|
margin-right: 16px;
|
|
padding-right: 16px;
|
|
border-left: none;
|
|
border-right: 1px dashed rgba($theme-body-sub-title-color, 0.7);
|
|
}
|
|
@media (max-width: 575px) {
|
|
padding-left: 8px;
|
|
margin-left: 8px;
|
|
[dir="rtl"] & {
|
|
margin-right: 8px;
|
|
padding-right: 8px;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
.light-card {
|
|
width: 40px;
|
|
height: 40px;
|
|
border-radius: 100%;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
background: var(--light2);
|
|
border: 1px solid rgba($theme-body-sub-title-color, 0.2);
|
|
}
|
|
}
|
|
.appointment-sec {
|
|
.card-header-right-icon {
|
|
select {
|
|
background-color: rgba($primary-color, 0.08) !important;
|
|
border: none;
|
|
color: var(--theme-deafult) !important;
|
|
width: auto !important;
|
|
height: 32px !important;
|
|
border-radius: 10px;
|
|
padding: 5px 10px;
|
|
line-height: 50px !important;
|
|
font-weight: 500;
|
|
border: none;
|
|
outline: none !important;
|
|
|
|
&:hover {
|
|
background-color: rgba($primary-color, 0.08) !important;
|
|
color: var(--theme-deafult) !important;
|
|
}
|
|
}
|
|
}
|
|
.bottom-btn {
|
|
text-align: center;
|
|
a {
|
|
font-family: $font-roboto, $font-serif;
|
|
font-weight: bold;
|
|
font-size: 14px;
|
|
line-height: 16px;
|
|
letter-spacing: 0.3px;
|
|
text-decoration-line: underline;
|
|
text-transform: uppercase;
|
|
}
|
|
}
|
|
}
|
|
|
|
.notification {
|
|
ul {
|
|
position: relative;
|
|
&::before {
|
|
position: absolute;
|
|
content: "";
|
|
border: 1px dashed $theme-body-sub-title-color;
|
|
opacity: 0.3;
|
|
top: 12px;
|
|
left: 2px;
|
|
height: calc(100% - 12px);
|
|
[dir="rtl"] & {
|
|
left: unset;
|
|
right: 2px;
|
|
}
|
|
}
|
|
}
|
|
li {
|
|
padding-bottom: 22px;
|
|
}
|
|
div[class*="activity-dot-"] {
|
|
margin-top: 12px;
|
|
animation: round 1.3s ease-in-out infinite;
|
|
}
|
|
.card {
|
|
.d-flex {
|
|
.w-100 {
|
|
p {
|
|
.badge {
|
|
color: $white;
|
|
margin-left: 10px;
|
|
font-weight: 500;
|
|
}
|
|
}
|
|
|
|
h6 {
|
|
margin-bottom: 5px;
|
|
position: relative;
|
|
~ p {
|
|
-webkit-box-orient: vertical;
|
|
-webkit-line-clamp: 1;
|
|
text-emphasis: inherit;
|
|
white-space: nowrap;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
display: block;
|
|
width: 260px;
|
|
@media (max-width: 767px) {
|
|
-webkit-line-clamp: unset;
|
|
text-emphasis: unset;
|
|
white-space: unset;
|
|
text-overflow: unset;
|
|
display: block;
|
|
width: unset;
|
|
overflow: visible;
|
|
}
|
|
}
|
|
|
|
@keyframes round {
|
|
0% {
|
|
transform: scale(1);
|
|
}
|
|
|
|
50% {
|
|
transform: scale(1.2);
|
|
}
|
|
|
|
100% {
|
|
transform: scale(1);
|
|
}
|
|
|
|
}
|
|
}
|
|
|
|
span {
|
|
color: $theme-body-sub-title-color;
|
|
}
|
|
}
|
|
|
|
&:nth-child(2) {
|
|
.media-body {
|
|
h6 {
|
|
.dot-notification {
|
|
background-color: $warning-color;
|
|
border: 5px solid lighten($warning-color, 30%);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
&:last-child {
|
|
margin-bottom: 0 !important;
|
|
}
|
|
}
|
|
}
|
|
.date-content {
|
|
padding: 4px 8px;
|
|
border-radius: 5px;
|
|
}
|
|
}
|
|
|
|
.schedule-container {
|
|
> div {
|
|
margin-bottom: -40px;
|
|
}
|
|
svg {
|
|
path {
|
|
clip-path: inset(1% 0% 0% 0% round 1.5rem);
|
|
}
|
|
}
|
|
}
|
|
|
|
.purchase-card {
|
|
text-align: center;
|
|
margin-top: 200px;
|
|
@media (max-width:1560px) {
|
|
margin-top: 170px;
|
|
}
|
|
@media (max-width:1399px) {
|
|
margin-top: 160px;
|
|
}
|
|
@media (max-width: 500px) {
|
|
margin-top: 110px;
|
|
}
|
|
@media (max-width: 420px) {
|
|
margin-top: 90px;
|
|
}
|
|
img {
|
|
margin-top: -208px;
|
|
@media (max-width:1560px) {
|
|
margin-top: -170px;
|
|
}
|
|
@media (max-width: 1399px) {
|
|
width: 70%;
|
|
margin: -160px auto 0 auto;
|
|
}
|
|
@media (max-width: 1366px) {
|
|
width: 76%;
|
|
}
|
|
@media (max-width: 1199px) {
|
|
width: 86%;
|
|
}
|
|
@media (max-width: 991px) {
|
|
width: 72%;
|
|
}
|
|
@media (max-width: 767px) {
|
|
width: 50%;
|
|
}
|
|
@media (max-width: 500px) {
|
|
margin-top: -110px;
|
|
}
|
|
@media (max-width: 420px) {
|
|
margin-top: -90px;
|
|
width: 60%;
|
|
}
|
|
}
|
|
.purchase-btn {
|
|
min-width: auto;
|
|
}
|
|
}
|
|
|
|
.user-list {
|
|
column-count: 2;
|
|
column-rule-style: dashed;
|
|
column-rule-color: rgba($theme-body-sub-title-color, 0.7);
|
|
column-gap: 120px;
|
|
column-rule-width: 1px;
|
|
@media (max-width: 1780px) {
|
|
column-gap: 80px;
|
|
}
|
|
@media (max-width: 1660px) {
|
|
column-gap: 40px;
|
|
}
|
|
@media (max-width: 360px) {
|
|
column-gap: 25px;
|
|
}
|
|
li {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
gap: 10px;
|
|
width: 100%;
|
|
@media (max-width: 1540px) {
|
|
gap: 5px;
|
|
}
|
|
i {
|
|
font-size: 12px;
|
|
font-weight: 700;
|
|
}
|
|
h5 {
|
|
@media (max-width: 360px) {
|
|
font-size: 16px;
|
|
}
|
|
}
|
|
span {
|
|
@media (max-width: 360px) {
|
|
font-size: 13px;
|
|
}
|
|
}
|
|
&:hover {
|
|
.user-box {
|
|
svg {
|
|
animation: tada 1.5s ease infinite;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
.user-icon {
|
|
border-radius: 100%;
|
|
display: inline-block;
|
|
.user-box {
|
|
margin: 3px;
|
|
width: 47px;
|
|
height: 47px;
|
|
border-radius: 100%;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
@media (max-width: 1540px) {
|
|
width: 30px;
|
|
height: 30px;
|
|
svg {
|
|
width: 18px;
|
|
height: 18px;
|
|
}
|
|
}
|
|
}
|
|
&.primary {
|
|
border: 1px solid $primary-color;
|
|
.user-box {
|
|
background: lighten($primary-color, 25%);
|
|
}
|
|
}
|
|
&.success {
|
|
border: 1px solid $success-color;
|
|
.user-box {
|
|
background: lighten($success-color, 40%);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.appointment-table {
|
|
table {
|
|
tr {
|
|
td {
|
|
position: relative;
|
|
border-top: none;
|
|
padding: 15px 0;
|
|
vertical-align: middle;
|
|
&:first-child {
|
|
width: 50px;
|
|
}
|
|
|
|
.status-circle {
|
|
top: 1px;
|
|
left: 35px;
|
|
border-width: 3px;
|
|
}
|
|
|
|
p,
|
|
.btn {
|
|
font-weight: 500;
|
|
font-size: 12px;
|
|
}
|
|
|
|
.btn {
|
|
padding: 4px 12px;
|
|
}
|
|
}
|
|
.img-content-box {
|
|
a {
|
|
color: var(--body-font-color);
|
|
transition: 0.5s;
|
|
display: inline-block !important;
|
|
}
|
|
span {
|
|
display: block;
|
|
}
|
|
}
|
|
&:hover {
|
|
.img-content-box {
|
|
a {
|
|
color: var(--theme-deafult);
|
|
transition: 0.5s;
|
|
}
|
|
}
|
|
}
|
|
&:first-child {
|
|
td {
|
|
padding-top: 0 !important;
|
|
}
|
|
}
|
|
&:last-child {
|
|
td {
|
|
padding-bottom: 0 !important;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
&.customer-table {
|
|
table {
|
|
tr {
|
|
td {
|
|
padding: 10px 0;
|
|
img {
|
|
min-width: 40px;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.icon-box {
|
|
width: 50px;
|
|
height: 32px;
|
|
background-color: rgba($primary-color, 0.08);
|
|
border-radius: 10px;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
|
|
i {
|
|
color: var(--theme-deafult);
|
|
font-size: 22px;
|
|
}
|
|
svg {
|
|
stroke: var(--theme-deafult);
|
|
}
|
|
}
|
|
.balance-card {
|
|
display: flex;
|
|
padding: 15px;
|
|
border-radius: 5px;
|
|
gap: 15px;
|
|
transition: 0.5s;
|
|
@media (max-width: 1199px) {
|
|
gap: 8px;
|
|
}
|
|
.svg-box {
|
|
width: 43px;
|
|
height: 43px;
|
|
background: $white;
|
|
box-shadow: 0px 71.2527px 51.5055px rgba(229, 229, 245, 0.189815), 0px 42.3445px 28.0125px rgba(229, 229, 245, 0.151852), 0px 21.9866px 14.2913px rgba(229, 229, 245, 0.125), 0px 8.95749px 7.16599px rgba(229, 229, 245, 0.0981481), 0px 2.03579px 3.46085px rgba(229, 229, 245, 0.0601852);
|
|
border-radius: 10px;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
@media (max-width: 1199px) {
|
|
width: 35px;
|
|
height: 35px;
|
|
}
|
|
svg {
|
|
height: 20px;
|
|
fill: rgba($theme-body-sub-title-color, 0.85);
|
|
@media (max-width: 1199px) {
|
|
height: 17px;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
.btn-light-secondary {
|
|
background-color: rgba(var(--theme-secondary), 0.1);
|
|
font-size: 12px;
|
|
padding: 6px 12px;
|
|
font-weight: 600;
|
|
}
|
|
|
|
//index dashboard css ends
|
|
|
|
|
|
.crm-activity {
|
|
>li {
|
|
+li {
|
|
border-top: 1px solid $light-semi-gray;
|
|
margin-top: 10px;
|
|
padding-top: 10px;
|
|
|
|
h6 {
|
|
font-size: 14px;
|
|
line-height: 18px;
|
|
margin-bottom: 5px;
|
|
}
|
|
}
|
|
|
|
h6 {
|
|
font-size: 14px;
|
|
}
|
|
}
|
|
|
|
span {
|
|
font-size: 40px;
|
|
}
|
|
|
|
ul.dates {
|
|
h6 {
|
|
color: $theme-body-font-color;
|
|
}
|
|
|
|
li {
|
|
color: $theme-body-sub-title-color;
|
|
font-size: 12px;
|
|
display: inline-block;
|
|
line-height: 1;
|
|
|
|
+li {
|
|
border-left: 1px solid $light-semi-gray;
|
|
padding-left: 10px;
|
|
margin-left: 5px;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
//general widget css start
|
|
|
|
.fill-primary {
|
|
fill: $primary-color;
|
|
}
|
|
.fill-secondary {
|
|
fill: $secondary-color;
|
|
}
|
|
.fill-success {
|
|
fill: $success-color;
|
|
}
|
|
.fill-warning {
|
|
fill: $warning-color;
|
|
}
|
|
.fill-info {
|
|
fill: $info-color;
|
|
}
|
|
.fill-danger {
|
|
fill: $danger-color;
|
|
}
|
|
|
|
.ecommerce-widget {
|
|
box-shadow: none;
|
|
border: 1px solid #f1f3ff !important;
|
|
border-radius: 5px;
|
|
.total-num {
|
|
color: $theme-body-font-color;
|
|
margin: 0;
|
|
letter-spacing: 1px;
|
|
|
|
span {
|
|
color: $black;
|
|
}
|
|
}
|
|
|
|
.row {
|
|
align-items: center;
|
|
}
|
|
|
|
.progress-showcase {
|
|
margin-top: 30px;
|
|
}
|
|
|
|
span {
|
|
color: $theme-body-sub-title-color;
|
|
margin: 0;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.icon {
|
|
color: $light-semi-gray;
|
|
font-size: 40px;
|
|
}
|
|
|
|
.flot-chart-container {
|
|
height: 100px;
|
|
padding: 0;
|
|
margin: 0;
|
|
border: transparent;
|
|
}
|
|
|
|
.morris-default-style {
|
|
display: none !important;
|
|
}
|
|
|
|
svg {
|
|
-webkit-filter: drop-shadow(12px 12px 7px rgba(0, 0, 0, 0.3));
|
|
filter: drop-shadow(12px 12px 7px rgba(0, 0, 0, 0.3));
|
|
}
|
|
}
|
|
|
|
.redial-social-widget {
|
|
border-radius: 100%;
|
|
width: 100px;
|
|
height: 100px;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
font-size: 25px;
|
|
margin: 0 auto;
|
|
background-image: linear-gradient(90deg, $light-color 50%, transparent 50%, transparent), linear-gradient(90deg, $light-gray 50%, $light-color 50%, $light-color);
|
|
|
|
i {
|
|
background-color: $white;
|
|
height: 80px;
|
|
width: 80px;
|
|
border-radius: 100%;
|
|
text-align: center;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
}
|
|
|
|
&.radial-bar-70 {
|
|
background-image: linear-gradient(342deg, var(--theme-deafult) 50%, transparent 50%, transparent), linear-gradient(270deg, var(--theme-deafult) 50%, $light-color 50%, $light-color);
|
|
}
|
|
}
|
|
|
|
.browser-widget {
|
|
&:hover {
|
|
img {
|
|
-webkit-filter: grayscale(0%);
|
|
filter: grayscale(0%);
|
|
transition: all 0.3s ease;
|
|
transform: scale(1.1) rotate(5deg);
|
|
}
|
|
}
|
|
|
|
img {
|
|
height: 80px;
|
|
filter: grayscale(100%);
|
|
transform: scale(1) rotate(0deg);
|
|
transition: all 0.3s ease;
|
|
}
|
|
|
|
.media-body {
|
|
text-align: center;
|
|
column-count: 3;
|
|
column-rule: 1px solid $light-color;
|
|
p {
|
|
margin-bottom: 5px;
|
|
}
|
|
span {
|
|
margin-bottom: 0;
|
|
color: $theme-body-sub-title-color;
|
|
}
|
|
|
|
h4 {
|
|
color: $theme-body-font-color;
|
|
margin-bottom: 0;
|
|
font-size: $btn-lg-font-size;
|
|
|
|
span {
|
|
color: #333333;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.testimonial {
|
|
i {
|
|
font-size: 60px;
|
|
color: rgba(43,43,43,0.7);
|
|
position: absolute;
|
|
left: 0;
|
|
top: 0;
|
|
opacity: 0.1;
|
|
z-index: -1;
|
|
}
|
|
|
|
p {
|
|
color: $theme-body-sub-title-color;
|
|
font-style: italic;
|
|
margin-bottom: 30px;
|
|
margin-top: 30px;
|
|
}
|
|
|
|
h5 {
|
|
color: $theme-body-font-color;
|
|
padding-top: 10px;
|
|
}
|
|
|
|
span {
|
|
color: $theme-body-sub-title-color;
|
|
}
|
|
|
|
img {
|
|
margin: 0 auto;
|
|
}
|
|
}
|
|
|
|
//general widget css start
|
|
.widget-charts {
|
|
.widget-1 {
|
|
.card-body {
|
|
padding: 30px 25px;
|
|
}
|
|
}
|
|
}
|
|
|
|
//chart widget css
|
|
.chart-widget-top {
|
|
#chart-widget1,
|
|
#chart-widget2,
|
|
#chart-widget3 {
|
|
margin-bottom: -14px;
|
|
.apexcharts-xaxistooltip {
|
|
display: none;
|
|
}
|
|
}
|
|
span {
|
|
color: $font-gray-color;
|
|
}
|
|
}
|
|
.bar-chart-widget {
|
|
.apexcharts-legend {
|
|
bottom: 0 !important;
|
|
.apexcharts-legend-series {
|
|
margin: 0 10px !important;
|
|
}
|
|
.apexcharts-legend-marker {
|
|
margin-right: 5px ;
|
|
}
|
|
}
|
|
.top-content {
|
|
border-top-left-radius: 4px;
|
|
border-top-right-radius: 4px;
|
|
}
|
|
|
|
.earning-details {
|
|
height: 100%;
|
|
align-items: center;
|
|
justify-content: center;
|
|
text-align: center;
|
|
display: flex;
|
|
letter-spacing: 1px;
|
|
|
|
i {
|
|
font-size: 230px;
|
|
position: absolute;
|
|
opacity: 0.1;
|
|
right: -30px;
|
|
top: 0;
|
|
|
|
&:hover {
|
|
transform: rotate(-5deg) scale(1.1);
|
|
transition: all 0.3s ease;
|
|
}
|
|
}
|
|
}
|
|
|
|
.num {
|
|
font-weight: 600;
|
|
|
|
.color-bottom {
|
|
color: $black;
|
|
}
|
|
}
|
|
|
|
}
|
|
.skill-chart {
|
|
margin-bottom: -48px;
|
|
.apexcharts-legend {
|
|
.apexcharts-legend-series {
|
|
span {
|
|
display: block;
|
|
}
|
|
.apexcharts-legend-text {
|
|
margin: 10px 0 20px;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
.progress-chart {
|
|
margin: -11px 0 -20px;
|
|
.apexcharts-canvas {
|
|
svg {
|
|
path, rect {
|
|
clip-path: inset(1% 0% 0% 0% round 1rem);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
.bottom-content {
|
|
span {
|
|
color: $theme-body-sub-title-color;
|
|
}
|
|
.block-bottom {
|
|
display: block;
|
|
}
|
|
}
|
|
|
|
@keyframes am-moving-dashes {
|
|
100% {
|
|
stroke-dashoffset: -30px;
|
|
}
|
|
}
|
|
|
|
@-webkit-keyframes am-pulsating {
|
|
0% {
|
|
stroke-opacity: 1;
|
|
stroke-width: 0;
|
|
}
|
|
|
|
100% {
|
|
stroke-opacity: 0;
|
|
stroke-width: 50px;
|
|
}
|
|
}
|
|
|
|
@keyframes am-pulsating {
|
|
0% {
|
|
stroke-opacity: 1;
|
|
stroke-width: 0;
|
|
}
|
|
|
|
100% {
|
|
stroke-opacity: 0;
|
|
stroke-width: 50px;
|
|
}
|
|
}
|
|
|
|
@-webkit-keyframes am-draw {
|
|
0% {
|
|
stroke-dashoffset: 500%;
|
|
}
|
|
|
|
100% {
|
|
stroke-dashoffset: 0;
|
|
}
|
|
}
|
|
|
|
@keyframes am-draw {
|
|
0% {
|
|
stroke-dashoffset: 500%;
|
|
}
|
|
|
|
100% {
|
|
stroke-dashoffset: 0;
|
|
}
|
|
}
|
|
|
|
.serial-chart .chart-container {
|
|
width: 100%;
|
|
height: 500px;
|
|
|
|
.lastBullet {
|
|
animation: am-pulsating 1s ease-out infinite;
|
|
}
|
|
|
|
.amcharts-graph-column-front {
|
|
transition: all .3s .3s ease-out;
|
|
|
|
&:hover {
|
|
fill: var(--theme-secondary);
|
|
stroke: var(--theme-secondary);
|
|
transition: all .3s ease-out;
|
|
}
|
|
}
|
|
|
|
.amcharts-graph-g3 {
|
|
stroke-linejoin: round;
|
|
stroke-linecap: round;
|
|
stroke-dasharray: 0;
|
|
stroke-dashoffset: 0;
|
|
animation: am-draw 40s;
|
|
}
|
|
|
|
.amcharts-graph-g2 .amcharts-graph-stroke {
|
|
stroke-dasharray: 3px 3px;
|
|
stroke-linejoin: round;
|
|
stroke-linecap: round;
|
|
animation: am-moving-dashes 1s linear infinite;
|
|
}
|
|
}
|
|
.chart-container {
|
|
.apexcharts-xaxis-label , .apexcharts-yaxis-label {
|
|
font-size: 14px !important;
|
|
color: $font-gray-color !important;
|
|
}
|
|
.apexcharts-xaxis-annotations {
|
|
rect {
|
|
clip-path: inset(1% 0% 0% 0% round 0.2rem);
|
|
}
|
|
}
|
|
}
|
|
|
|
.crypto-chart {
|
|
margin-left: -20px;
|
|
.apexcharts-tooltip-title {
|
|
display: none;
|
|
}
|
|
.apexcharts-tooltip-series-group {
|
|
&:last-child, &.active {
|
|
padding-bottom: 0;
|
|
}
|
|
}
|
|
}
|
|
|
|
.speed-chart {
|
|
.chart-container {
|
|
width: 100%;
|
|
height: 530px;
|
|
}
|
|
|
|
.content {
|
|
margin-top: -200px;
|
|
margin-bottom: 20px;
|
|
|
|
h4 {
|
|
font-weight: 600;
|
|
padding-top: 2px;
|
|
}
|
|
}
|
|
}
|
|
|
|
.status-widget {
|
|
svg {
|
|
width: 20px;
|
|
height: 20px;
|
|
vertical-align: text-top;
|
|
}
|
|
|
|
.card {
|
|
.card-header {
|
|
h5 {
|
|
line-height: 1.38;
|
|
}
|
|
}
|
|
}
|
|
|
|
.status-chart {
|
|
border-bottom-left-radius: 8px;
|
|
border-bottom-right-radius: 8px;
|
|
overflow: hidden;
|
|
}
|
|
}
|
|
|
|
.small-chart-widget .chart-container {
|
|
height: 311px;
|
|
padding: 0;
|
|
margin: 0;
|
|
border: none;
|
|
}
|
|
|
|
.small-chart-widget {
|
|
.card {
|
|
.card-body {
|
|
border-bottom-left-radius: 8px;
|
|
border-bottom-right-radius: 8px;
|
|
}
|
|
}
|
|
}
|
|
|
|
.donut-chart-widget .chart-container {
|
|
height: 300px;
|
|
border: 0;
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
|
|
.status-details {
|
|
h4 {
|
|
font-weight: 600;
|
|
|
|
span {
|
|
color: inherit;
|
|
}
|
|
}
|
|
|
|
span {
|
|
color: $theme-body-sub-title-color;
|
|
}
|
|
}
|
|
|
|
.status-chart .chart-container {
|
|
height: 200px;
|
|
border: 0;
|
|
padding: 0;
|
|
margin: 0;
|
|
}
|
|
|
|
.map-chart .chart-container {
|
|
width: 100%;
|
|
height: 500px;
|
|
}
|
|
|
|
.serial-chart {
|
|
width: 100%;
|
|
}
|
|
|
|
.live-products,
|
|
.turnover,
|
|
.uses,
|
|
.monthly {
|
|
height: 300px;
|
|
}
|
|
|
|
.live-products {
|
|
.ct-series-a {
|
|
|
|
.ct-area,
|
|
.ct-point,
|
|
.ct-line,
|
|
.ct-bar,
|
|
.ct-slice-donut {
|
|
stroke: rgba(255, 255, 255, 0.77);
|
|
}
|
|
}
|
|
|
|
.ct-label {
|
|
fill: $white;
|
|
color: $white;
|
|
}
|
|
|
|
.ct-grid {
|
|
stroke: rgba(255, 255, 255, 0.7);
|
|
}
|
|
}
|
|
|
|
.turnover,
|
|
.uses,
|
|
.monthly {
|
|
.ct-series-a {
|
|
|
|
.ct-area,
|
|
.ct-point,
|
|
.ct-line,
|
|
.ct-bar,
|
|
.ct-slice-donut {
|
|
stroke: rgba(255, 255, 255, 1);
|
|
fill: transparent;
|
|
}
|
|
}
|
|
|
|
.ct-series-b {
|
|
|
|
.ct-area,
|
|
.ct-point,
|
|
.ct-line,
|
|
.ct-bar,
|
|
.ct-slice-donut {
|
|
stroke: rgba(255, 255, 255, 0.70);
|
|
fill: transparent;
|
|
}
|
|
}
|
|
|
|
.ct-series-c {
|
|
|
|
.ct-area,
|
|
.ct-point,
|
|
.ct-line,
|
|
.ct-bar,
|
|
.ct-slice-donut {
|
|
stroke: rgba(255, 255, 255, 0.40);
|
|
fill: transparent;
|
|
}
|
|
}
|
|
|
|
.ct-label {
|
|
fill: $white;
|
|
color: $white;
|
|
}
|
|
|
|
.ct-grid {
|
|
stroke: rgba(255, 255, 255, 0.7);
|
|
}
|
|
}
|
|
|
|
// draggable card
|
|
#draggableMultiple {
|
|
.ui-sortable-handle {
|
|
.card {
|
|
cursor: move;
|
|
}
|
|
}
|
|
}
|
|
|
|
// tilt page
|
|
.tilt-showcase {
|
|
ul {
|
|
li {
|
|
.line {
|
|
padding-top: 10px;
|
|
}
|
|
}
|
|
}
|
|
|
|
.pre-mt {
|
|
margin-top: 5px;
|
|
}
|
|
}
|
|
|
|
// wow page
|
|
.wow-title {
|
|
h5 {
|
|
display: flex;
|
|
align-items: center;
|
|
font-size: 18px;
|
|
|
|
.badge {
|
|
-webkit-text-fill-color: $white;
|
|
}
|
|
}
|
|
}
|
|
|
|
// alert page
|
|
.alert-center {
|
|
display: flex !important;
|
|
align-items: center;
|
|
}
|
|
|
|
// box-shadow
|
|
.box-shadow-title {
|
|
.sub-title {
|
|
margin: 30px 0;
|
|
}
|
|
}
|
|
|
|
// tour page
|
|
.hovercard {
|
|
.info {
|
|
.social-media {
|
|
ul {
|
|
li {
|
|
padding-top: 3px;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.cardheader {
|
|
border-top-left-radius: 5px;
|
|
border-top-right-radius: 5px;
|
|
}
|
|
}
|
|
|
|
// sticky page
|
|
.sticky-header-main {
|
|
.card {
|
|
.card-header {
|
|
h5 {
|
|
line-height: 35px;
|
|
|
|
a {
|
|
color: $white;
|
|
-webkit-text-fill-color: $white;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
// radio-checkbox-control page
|
|
.custom-radio-ml {
|
|
margin-left: 3px;
|
|
}
|
|
|
|
// date range picker page
|
|
.daterangepicker {
|
|
.ltr {
|
|
tr {
|
|
td {
|
|
&.active {
|
|
color: $white;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
// typeahead page
|
|
// typeahead page
|
|
.twitter-typeahead {
|
|
display: block !important;
|
|
}
|
|
|
|
span.twitter-typeahead {
|
|
.league-name {
|
|
font-size: 16px;
|
|
padding: 6px 10px 0;
|
|
}
|
|
|
|
.tt-menu {
|
|
float: left;
|
|
width: 100%;
|
|
min-width: 10rem;
|
|
margin: 0.125rem 0 0;
|
|
font-size: 1rem;
|
|
color: #212529;
|
|
text-align: left;
|
|
list-style: none;
|
|
background-color: $white;
|
|
background-clip: padding-box;
|
|
border-radius: 0.25rem;
|
|
-webkit-box-shadow: 0 0 20px rgba(89,102,122,0.1);
|
|
box-shadow: 0 0 20px rgba(89,102,122,0.1);
|
|
border: none;
|
|
padding: 0;
|
|
}
|
|
|
|
.tt-suggestion {
|
|
color: $dark-editor-document;
|
|
opacity: 0.6;
|
|
font-size: 13px;
|
|
padding: 6px 12px;
|
|
border-top: 1px solid $light-semi-gray;
|
|
background: $white;
|
|
cursor: pointer;
|
|
&:hover,
|
|
&:focus {
|
|
background-color: $white;
|
|
}
|
|
|
|
&.active,
|
|
&:active {
|
|
color: $white;
|
|
background-color: var(--theme-deafult);
|
|
}
|
|
}
|
|
}
|
|
|
|
#scrollable-dropdown-menu {
|
|
.twitter-typeahead {
|
|
.tt-menu {
|
|
.tt-dataset {
|
|
max-height: 100px;
|
|
overflow-y: auto;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
.chart-right {
|
|
position: relative;
|
|
}
|
|
.balance-data {
|
|
display: flex;
|
|
gap: 15px;
|
|
position: absolute;
|
|
top: -50px;
|
|
right: 2%;
|
|
[dir="rtl"] & {
|
|
right: unset;
|
|
left: 2%;
|
|
}
|
|
@media (max-width:991px) {
|
|
top: -42px;
|
|
right: -65%;
|
|
[dir="rtl"] & {
|
|
left: -65%;
|
|
}
|
|
}
|
|
@media (max-width: 575px) {
|
|
display: none;
|
|
}
|
|
li {
|
|
display: flex;
|
|
align-items: center;
|
|
font-weight: 500;
|
|
}
|
|
.circle {
|
|
display:inline-block;
|
|
width: 6px;
|
|
height: 6px;
|
|
border-radius: 100%;
|
|
}
|
|
}
|
|
.current-sale-container {
|
|
padding-right: 12px;
|
|
[dir="rtl"] & {
|
|
padding-right: unset;
|
|
padding-left: 12px;
|
|
}
|
|
> div {
|
|
margin: -22px 0 -30px -16px;
|
|
@media (max-width: 1199px) {
|
|
margin-bottom: 0;
|
|
}
|
|
@media (max-width: 404px) {
|
|
margin-bottom: -30px;
|
|
}
|
|
}
|
|
.apexcharts-xaxistooltip {
|
|
color: var(--theme-deafult);
|
|
background: rgba($primary-color, 0.1);
|
|
border: 1px solid var(--theme-deafult);
|
|
}
|
|
|
|
.apexcharts-xaxistooltip-bottom:before {
|
|
border-bottom-color: var(--theme-deafult);
|
|
}
|
|
|
|
.apexcharts-tooltip.light .apexcharts-tooltip-title {
|
|
background: rgba($primary-color, 0.1);
|
|
color: var(--theme-deafult);
|
|
}
|
|
&.order-container {
|
|
@media (max-width:575px) {
|
|
padding-right: 0;
|
|
[dir="rtl"] & {
|
|
padding-left: 0;
|
|
}
|
|
}
|
|
> div {
|
|
@media (max-width:404px) {
|
|
margin-bottom: 0;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
.recent-circle {
|
|
min-width: 10px;
|
|
height: 10px;
|
|
border-radius: 100%;
|
|
display: inline-block;
|
|
margin-top: 5px;
|
|
}
|
|
.recent-wrapper {
|
|
align-items: center;
|
|
.order-content {
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
gap: 36px;
|
|
@media (max-width: 1199px) {
|
|
gap: 20px;
|
|
}
|
|
@media (max-width: 575px) {
|
|
justify-content: center;
|
|
flex-wrap: wrap;
|
|
flex-direction: row;
|
|
}
|
|
li {
|
|
display: flex;
|
|
align-items: flex-start;
|
|
gap: 8px;
|
|
}
|
|
}
|
|
.recent-chart {
|
|
.apexcharts-canvas {
|
|
.apexcharts-datalabel-label {
|
|
@media (max-width: 1660px) {
|
|
font-size: 15px;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
> div {
|
|
@media (max-width: 1560px) and (min-width: 1400px) {
|
|
width: 100%;
|
|
}
|
|
&:last-child {
|
|
@media (max-width: 1560px) and (min-width: 1400px) {
|
|
display: none;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
.apexcharts-series.apexcharts-radial-series {
|
|
position: relative;
|
|
&::after {
|
|
position: absolute;
|
|
content: '';
|
|
background: linear-gradient(0deg, #FFFFFF 0.05%, #F4F4F4 19.91%, #F5F6F9 55.02%, #EAECF4 100%);
|
|
width: calc(100% + 10px);
|
|
height: calc(100% + 10px);
|
|
top: 0;
|
|
left: 0;
|
|
}
|
|
}
|
|
|
|
// bootstrap basic table page
|
|
.card-block {
|
|
.table-responsive {
|
|
.table {
|
|
caption {
|
|
padding-left: 10px;
|
|
}
|
|
}
|
|
|
|
.table-bordered {
|
|
td {
|
|
vertical-align: middle;
|
|
}
|
|
}
|
|
}
|
|
|
|
.table-border-radius {
|
|
border-bottom-left-radius: 4px;
|
|
border-bottom-right-radius: 4px;
|
|
}
|
|
|
|
.default-checkbox-align {
|
|
#checkbox1 {
|
|
margin-right: 10px;
|
|
}
|
|
|
|
#radio {
|
|
margin-right: 5px;
|
|
}
|
|
}
|
|
}
|
|
|
|
// datatable styling page
|
|
#example-style-3_wrapper {
|
|
#example-style-3 {
|
|
tfoot {
|
|
border-top: 2px solid $light-semi-gray;
|
|
}
|
|
}
|
|
}
|
|
|
|
// chartjs page
|
|
.chart-vertical-center {
|
|
display: flex;
|
|
justify-content: center;
|
|
|
|
#myDoughnutGraph,
|
|
#myPolarGraph {
|
|
width: auto !important;
|
|
}
|
|
}
|
|
|
|
// ckeditor page
|
|
.cke_focus {
|
|
padding: 15px;
|
|
margin-top: 13px;
|
|
}
|
|
|
|
// ace-code-editor page
|
|
#editor {
|
|
.ace_scroller {
|
|
.ace_content {
|
|
.ace_layer {
|
|
.ace_print-margin {
|
|
visibility: hidden !important;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
// Helper classes page css
|
|
.helper-classes {
|
|
padding: 30px;
|
|
margin-bottom: 0;
|
|
white-space: pre-line;
|
|
}
|
|
|
|
// starter kit page css
|
|
.starter-kit-fix {
|
|
.page-body {
|
|
margin-bottom: 52px;
|
|
}
|
|
}
|
|
|
|
.starter-main {
|
|
.card-body {
|
|
p {
|
|
font-size: 14px;
|
|
}
|
|
|
|
ul {
|
|
padding-left: 30px;
|
|
list-style-type: disc;
|
|
margin-bottom: 15px;
|
|
}
|
|
|
|
h5 {
|
|
font-size: 18px;
|
|
}
|
|
|
|
pre {
|
|
white-space: pre-line;
|
|
padding: 30px;
|
|
}
|
|
|
|
.alert-primary {
|
|
&.inverse {
|
|
&:before {
|
|
top: 32px;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.alert {
|
|
background-color: rgba(68, 102, 242, 0.2) !important;
|
|
|
|
i {
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
}
|
|
}
|
|
|
|
//typography//
|
|
footer {
|
|
&.blockquote-footer {
|
|
bottom: unset;
|
|
}
|
|
}
|
|
|
|
// index responsive css
|
|
|
|
@media only screen and (max-width: 991px) {
|
|
.notification {
|
|
li {
|
|
padding-bottom: 20px;
|
|
}
|
|
.card {
|
|
.card-body {
|
|
.d-flex {
|
|
.w-100 {
|
|
p {
|
|
margin: 0;
|
|
}
|
|
|
|
h6 {
|
|
margin-top: 10px;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
@media only screen and (max-width: 767px) {
|
|
|
|
.footer-fix {
|
|
.pull-right {
|
|
float: none !important;
|
|
text-align: center !important;
|
|
}
|
|
}
|
|
}
|
|
|
|
@media only screen and (max-width: 575px) {
|
|
.notification {
|
|
li {
|
|
padding-bottom: 15px;
|
|
}
|
|
}
|
|
|
|
.media-dropdown {
|
|
display: block;
|
|
|
|
.media-body {
|
|
margin-bottom: 15px;
|
|
}
|
|
}
|
|
}
|
|
|
|
@media only screen and (max-width: 360px) {
|
|
.footer {
|
|
padding-left: 0 !important;
|
|
padding-right: 0 !important;
|
|
|
|
p {
|
|
font-size: 12px;
|
|
}
|
|
}
|
|
|
|
.appointment-table {
|
|
table {
|
|
tr {
|
|
td {
|
|
min-width: 103px;
|
|
|
|
&:first-child {
|
|
min-width: 50px;
|
|
}
|
|
|
|
&:nth-child(2) {
|
|
min-width: 120px;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
/**=====================
|
|
53. Dashboard CSS Ends
|
|
==========================**/ |