burkkyy/calebburke.dev
1
0
Fork 0
generated from alphane/template
Code Issues 2 Pull Requests Actions Packages Projects Releases Wiki Activity

Compare commits

base: burkkyy/calebburke.dev:3468df378218b9dec282e66aa89a003497775f90
Branches Tags
burkkyy/calebburke.dev:main burkkyy/calebburke.dev:blog
...
compare: burkkyy/calebburke.dev:9dfee98b84e9eeceac948c59ee44a583c50ae5ea
Branches Tags
burkkyy/calebburke.dev:main burkkyy/calebburke.dev:blog

3 Commits
3468df3782 ... 9dfee98b84

Author SHA1 Message Date
burkkyy 9dfee98b84 UI upgrades
Build and Push Docker Image / build (push) Successful in 52s
Details
2026-07-15 01:54:42 -07:00
burkkyy d33aef1680 formatting 2026-07-15 01:01:19 -07:00
burkkyy a0d5a7ec68 Prepping public app bar for mobile view 2026-07-15 00:45:28 -07:00
32 changed files with 1718 additions and 1731 deletions
Expand all files Collapse all files
web/src/components/layout/DefaultAppBar.vue
+1 -1
View File
@@ -46,7 +46,7 @@
<div class="mr-3"> <div class="mr-3">
<!-- <AppLogo /> --> <!-- <AppLogo /> -->
<PublicAppLogo <PublicAppLogo
to="/dashboard" to="/"
:animated="false" :animated="false"
/> />
</div> </div>
web/src/components/layout/ProfileMenu.vue
+2 -2
View File
@@ -106,9 +106,9 @@
<v-btn <v-btn
variant="outlined" variant="outlined"
block block
text="Logout"
@click="signOut" @click="signOut"
>Logout</v-btn />
>
</div> </div>
</v-sheet> </v-sheet>
</v-menu> </v-menu>
web/src/components/layout/PublicAppBar.vue
+54 -14
View File
@@ -1,27 +1,67 @@
<template> <template>
<v-app-bar <div v-if="mobile">
id="top" <v-app-bar
elevation="6" id="top"
height="60" elevation="6"
class="main-head pl-2" height="60"
> class="main-head pl-2"
<div class="mr-3"> >
<PublicAppLogo <div class="mr-3">
to="/" <PublicAppLogo to="/" />
:animated="isHomePage" </div>
/>
</div>
<v-spacer /> <v-spacer />
</v-app-bar>
<ProfileMenu v-if="isAuthenticated" />
<v-btn
v-else
color="primary"
variant="tonal"
text="Sign in"
:to="{ name: 'SignInPage' }"
/>
</v-app-bar>
</div>
<div v-else>
<v-app-bar
id="top"
elevation="6"
height="60"
class="main-head pl-2"
>
<div class="mr-3">
<PublicAppLogo
to="/"
:animated="isHomePage"
/>
</div>
<v-spacer />
<ProfileMenu v-if="isAuthenticated" />
<v-btn
v-else
color="primary"
variant="tonal"
text="Sign in"
:to="{ name: 'SignInPage' }"
/>
</v-app-bar>
</div>
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import { computed } from "vue" import { computed } from "vue"
import { useRoute } from "vue-router" import { useRoute } from "vue-router"
import { useDisplay } from "vuetify"
import { useAuth0 } from "@auth0/auth0-vue"
import ProfileMenu from "@/components/layout/ProfileMenu.vue"
import PublicAppLogo from "@/components/common/PublicAppLogo.vue" import PublicAppLogo from "@/components/common/PublicAppLogo.vue"
const route = useRoute() const route = useRoute()
const isHomePage = computed(() => route.name === "HomePage") const isHomePage = computed(() => route.name === "HomePage")
const { mobile } = useDisplay()
const { isAuthenticated } = useAuth0()
</script> </script>
web/src/pages/HomePage.vue
+28 -1
View File
@@ -1 +1,28 @@
<template><div></div></template> <template>
<div>
<v-row>
<v-col
cols="12"
sm="6"
md="4"
lg="2"
>
<AppCard
v-if="isAuthenticated"
:to="{ name: 'DashboardPage' }"
elevation="6"
>
You are signed in. Go to Dashboard
</AppCard>
</v-col>
</v-row>
</div>
</template>
<script setup lang="ts">
import { useAuth0 } from "@auth0/auth0-vue"
import AppCard from "@/components/common/AppCard.vue"
const { isAuthenticated } = useAuth0()
</script>
web/src/pages/SignInPage.vue
+2 -30
View File
@@ -16,17 +16,7 @@
class="px-8" class="px-8"
style="max-width: 500px" style="max-width: 500px"
> >
<!-- <img <PublicAppLogo />
class="d-inline-block d-lg-none"
src="@/assets/app_logo_small.png"
style="height: 66px; transform: rotate(-12deg)"
/> -->
<h2
class="text-h1 textPrimary font-weight-semibold mb-0"
style="font-size: 2.5rem !important"
>
{{ APPLICATION_NAME }}
</h2>
<h6 class="text-h6 text-medium-emphasis d-flex align-center mt-6 font-weight-medium"> <h6 class="text-h6 text-medium-emphasis d-flex align-center mt-6 font-weight-medium">
<v-btn <v-btn
block block
@@ -37,10 +27,6 @@
</h6> </h6>
<!-- <!--
<div class="my-6 text-medium-emphasis">
If you don't have an account, create one to get started using ROTYR. It's free to sign
up and only takes a few seconds.
</div>
<v-btn <v-btn
block block
variant="outlined" variant="outlined"
@@ -63,20 +49,6 @@
</div> </div>
</div> </div>
</v-col> </v-col>
<!-- <v-col
cols="12"
lg="7"
xl="8"
class="d-none d-lg-flex align-center justify-center authentication position-relative"
>
<div class="text-center">
<img
src="@/assets/app_logo_splash.png"
class="position-relative"
style="opacity: 0.15; width: 80%"
/>
</div>
</v-col> -->
</v-row> </v-row>
</div> </div>
</template> </template>
@@ -85,7 +57,7 @@
import { onMounted } from "vue" import { onMounted } from "vue"
import { useAuth0 } from "@auth0/auth0-vue" import { useAuth0 } from "@auth0/auth0-vue"
import { APPLICATION_NAME } from "@/config" import PublicAppLogo from "@/components/common/PublicAppLogo.vue"
import useCurrentUser from "@/use/use-current-user" import useCurrentUser from "@/use/use-current-user"
const { reset: resetCurrentUser } = useCurrentUser() const { reset: resetCurrentUser } = useCurrentUser()
web/src/scss/components/_VAlert.scss
+17 -17
View File
@@ -1,24 +1,24 @@
.single-line-alert { .single-line-alert {
.v-alert__close, .v-alert__close,
.v-alert__prepend { .v-alert__prepend {
align-self: center !important; align-self: center !important;
} }
} }
@media (max-width: 500px) { @media (max-width: 500px) {
.single-line-alert { .single-line-alert {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
.v-alert__append { .v-alert__append {
margin-inline-start: 0px; margin-inline-start: 0px;
}
.v-alert__close {
margin-left: auto;
}
.v-alert__content {
width: 100%;
margin-top: 5px;
}
} }
.v-alert__close {
margin-left: auto;
}
.v-alert__content {
width: 100%;
margin-top: 5px;
}
}
} }
web/src/scss/components/_VBreadcrumb.scss
+7 -8
View File
@@ -1,9 +1,8 @@
.v-breadcrumbs {
.v-breadcrumbs{ .v-breadcrumbs-divider {
.v-breadcrumbs-divider{ padding: 0 0 !important;
padding: 0 0 !important; }
} .v-breadcrumbs-item--link {
.v-breadcrumbs-item--link{ text-decoration: none;
text-decoration: none; }
}
} }
web/src/scss/components/_VButtons.scss
+14 -14
View File
@@ -1,22 +1,22 @@
.v-btn-group .v-btn { .v-btn-group .v-btn {
height: inherit !important; height: inherit !important;
} }
.v-btn-group { .v-btn-group {
border-color: rgb(var(--v-theme-borderColor)) !important; border-color: rgb(var(--v-theme-borderColor)) !important;
} }
.v-btn{ .v-btn {
text-transform: capitalize; text-transform: capitalize;
letter-spacing: 0; letter-spacing: 0;
border-radius: 30px; border-radius: 30px;
&.v-btn--variant-elevated{ &.v-btn--variant-elevated {
box-shadow: none !important; box-shadow: none !important;
} }
.v-btn--slim{ .v-btn--slim {
padding: 0 15px; padding: 0 15px;
} }
} }
.v-btn--elevated:hover{ .v-btn--elevated:hover {
box-shadow: none; box-shadow: none;
} }
web/src/scss/components/_VCard.scss
+46 -45
View File
@@ -1,69 +1,70 @@
// Outline Card // Outline Card
.v-card--variant-outlined { .v-card--variant-outlined {
border-color: rgba(var(--v-theme-borderColor)) !important; border-color: rgba(var(--v-theme-borderColor)) !important;
} }
.v-card--variant-elevated, .v-card--variant-elevated,
.v-card--variant-flat { .v-card--variant-flat {
color: rgb(var(--v-theme-textPrimary)); color: rgb(var(--v-theme-textPrimary));
} }
.card-hover { .card-hover {
transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms; transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
&:hover { &:hover {
scale: 1.01; scale: 1.01;
transition: all 0.1s ease-in 0s; transition: all 0.1s ease-in 0s;
} }
} }
.v-card { .v-card {
width: 100%; width: 100%;
overflow: visible; overflow: visible;
.color-inherits { .color-inherits {
color: inherit; color: inherit;
} }
.feature-card { .feature-card {
.v-responsive__content { .v-responsive__content {
height: 100%; height: 100%;
}
}
.v-timeline-divider__before,.v-timeline-divider__after {
background: rgba(var(--v-border-color), 1);
}
.v-card-text{
padding: 24px 24px;
}
.v-card-item{
padding: 24px 24px;
} }
}
.v-timeline-divider__before,
.v-timeline-divider__after {
background: rgba(var(--v-border-color), 1);
}
.v-card-text {
padding: 24px 24px;
}
.v-card-item {
padding: 24px 24px;
}
} }
// Theme cards // Theme cards
.cardBordered { .cardBordered {
.v-card { .v-card {
box-shadow: none !important; box-shadow: none !important;
border: 1px solid rgb(var(--v-theme-borderColor)); border: 1px solid rgb(var(--v-theme-borderColor));
} }
} }
.elevation-o-card{ .elevation-o-card {
.v-card-item{ .v-card-item {
padding: 0.625rem 1rem; padding: 0.625rem 1rem;
} }
} }
.card-title{ .card-title {
font-size: 18px; font-size: 18px;
font-weight: 500; font-weight: 500;
color:rgb(var(--v-theme-textPrimary)); color: rgb(var(--v-theme-textPrimary));
} }
.card-subtitle{ .card-subtitle {
font-size: 14px; font-size: 14px;
font-weight: 400; font-weight: 400;
color:rgb(var(--v-theme-textSecondary)); color: rgb(var(--v-theme-textSecondary));
} }
.dark-card-title{ .dark-card-title {
font-size: 18px; font-size: 18px;
font-weight: 500; font-weight: 500;
color:rgb(var(--v-theme-textPrimary)); color: rgb(var(--v-theme-textPrimary));
} }
web/src/scss/components/_VDatatable.scss
+1 -1
View File
@@ -1,3 +1,3 @@
.v-pagination__item--is-active .v-btn__overlay { .v-pagination__item--is-active .v-btn__overlay {
opacity: 0.15 !important; opacity: 0.15 !important;
} }
web/src/scss/components/_VDatatables.scss
+68 -81
View File
@@ -1,99 +1,86 @@
.v-table { .v-table {
&.datatabels {
&.productlist {
.v-data-table-header__content span {
color: rgb(var(--v-theme-textPrimary));
}
&.datatabels { .v-toolbar {
.v-input__control {
&.productlist { max-width: 300px;
.v-data-table-header__content span {
color: rgb(var(--v-theme-textPrimary));
}
.v-toolbar {
.v-input__control {
max-width: 300px;
}
.v-toolbar__content {
height: auto !important;
}
}
thead tr th:first-child {
padding-left: 0px !important;
}
tbody tr td:first-child {
padding-left: 0px !important;
}
tbody tr td{
padding: 15px;
}
} }
.v-selection-control--dirty .v-selection-control__input>.v-icon { .v-toolbar__content {
color: rgb(var(--v-theme-primary)); height: auto !important;
} }
}
thead tr th:first-child {
padding-left: 0px !important;
}
tbody tr td:first-child {
padding-left: 0px !important;
}
tbody tr td {
padding: 15px;
}
} }
.v-selection-control--dirty .v-selection-control__input > .v-icon {
color: rgb(var(--v-theme-primary));
}
}
} }
@media screen and (max-width: 1368px) {
@media screen and (max-width:1368px) { .v-table {
&.datatabels {
.v-table { &.productlist {
.v-data-table-header__content span {
&.datatabels { color: rgb(var(--v-theme-textPrimary));
&.productlist {
.v-data-table-header__content span {
color: rgb(var(--v-theme-textPrimary));
}
table {
tbody {
tr {
td {
padding: 14px 5px !important;
&:first-child {
padding-left: 15px !important;
}
}
}
}
thead {
tr {
th {
padding: 14px 5px !important;
&:first-child {
padding-left: 15px !important;
}
}
}
}
}
}
} }
} table {
tbody {
tr {
td {
padding: 14px 5px !important;
&:first-child {
padding-left: 15px !important;
}
}
}
}
thead {
tr {
th {
padding: 14px 5px !important;
&:first-child {
padding-left: 15px !important;
}
}
}
}
}
}
}
}
} }
.v-pagination { .v-pagination {
.v-pagination__list { .v-pagination__list {
.v-pagination__item--is-active { .v-pagination__item--is-active {
.v-btn { .v-btn {
.v-btn__overlay { .v-btn__overlay {
opacity: 0; opacity: 0;
}
background-color: rgb(var(--v-theme-grey100)) !important;
}
} }
background-color: rgb(var(--v-theme-grey100)) !important;
}
} }
}
} }
web/src/scss/components/_VExpansionpanel.scss
+3 -3
View File
@@ -1,6 +1,6 @@
.v-expansion-panel-title__overlay{ .v-expansion-panel-title__overlay {
background: rgba(var(--v-theme-primary)); background: rgba(var(--v-theme-primary));
} }
.v-expansion-panel:not(:first-child)::after { .v-expansion-panel:not(:first-child)::after {
border-color: transparent !important; border-color: transparent !important;
} }
web/src/scss/components/_VField.scss
+7 -8
View File
@@ -2,17 +2,17 @@
.v-field--variant-outlined .v-field__outline__start.v-locale--is-ltr, .v-field--variant-outlined .v-field__outline__start.v-locale--is-ltr,
.v-locale--is-ltr .v-field--variant-outlined .v-field__outline__start { .v-locale--is-ltr .v-field--variant-outlined .v-field__outline__start {
border-radius: $border-radius-root 0 0 $border-radius-root; border-radius: $border-radius-root 0 0 $border-radius-root;
} }
.v-field--variant-outlined .v-field__outline__end.v-locale--is-ltr, .v-field--variant-outlined .v-field__outline__end.v-locale--is-ltr,
.v-locale--is-ltr .v-field--variant-outlined .v-field__outline__end { .v-locale--is-ltr .v-field--variant-outlined .v-field__outline__end {
border-radius: 0 $border-radius-root $border-radius-root 0; border-radius: 0 $border-radius-root $border-radius-root 0;
} }
.v-field { .v-field {
font-size: 14px; font-size: 14px;
color: rgba(var(--v-theme-textPrimary)); color: rgba(var(--v-theme-textPrimary));
} }
// select outlined // select outlined
@@ -20,10 +20,9 @@
.v-field--variant-outlined .v-field__outline__notch::before, .v-field--variant-outlined .v-field__outline__notch::before,
.v-field--variant-outlined .v-field__outline__notch::after, .v-field--variant-outlined .v-field__outline__notch::after,
.v-field--variant-outlined .v-field__outline__end { .v-field--variant-outlined .v-field__outline__end {
opacity: 1; opacity: 1;
} }
.v-field--active .v-label.v-field-label {
.v-field--active .v-label.v-field-label{ color: rgb(var(--v-theme-textPrimary));
color: rgb(var(--v-theme-textPrimary));
} }
web/src/scss/components/_VInput.scss
+11 -11
View File
@@ -2,34 +2,34 @@
.v-input--density-default, .v-input--density-default,
.v-field--variant-solo, .v-field--variant-solo,
.v-field--variant-filled { .v-field--variant-filled {
--v-input-control-height: 51px; --v-input-control-height: 51px;
--v-input-padding-top: 14px; --v-input-padding-top: 14px;
} }
// comfortable // comfortable
.v-input--density-comfortable { .v-input--density-comfortable {
--v-input-control-height: 44px; --v-input-control-height: 44px;
} }
// compact // compact
.v-input--density-compact { .v-input--density-compact {
--v-input-padding-top: 10px; --v-input-padding-top: 10px;
} }
.v-label { .v-label {
font-size: 14px; font-size: 14px;
opacity: 0.7; opacity: 0.7;
font-weight: 500 !important; font-weight: 500 !important;
} }
.v-switch .v-label, .v-switch .v-label,
.v-checkbox .v-label { .v-checkbox .v-label {
opacity: 1; opacity: 1;
} }
.v-text-field__suffix { .v-text-field__suffix {
opacity: 1; opacity: 1;
padding-left: 20px; padding-left: 20px;
} }
.shadow-none .v-field--variant-solo { .shadow-none .v-field--variant-solo {
box-shadow: none !important; box-shadow: none !important;
} }
web/src/scss/components/_VLabs.scss
+11 -10
View File
@@ -1,18 +1,19 @@
.v-time-picker-clock{ .v-time-picker-clock {
background: rgb(var(--v-theme-grey100)) ; background: rgb(var(--v-theme-grey100));
} }
.v-time-picker-controls__ampm__btn.v-btn.v-btn--density-default{ .v-time-picker-controls__ampm__btn.v-btn.v-btn--density-default {
border: 0 !important; border: 0 !important;
} }
.v-stepper-header,.v-stepper.v-sheet{ .v-stepper-header,
box-shadow: none !important; .v-stepper.v-sheet {
box-shadow: none !important;
} }
.v-time-picker-controls__time__btn.v-btn--density-default.v-btn { .v-time-picker-controls__time__btn.v-btn--density-default.v-btn {
width: 55px !important; width: 55px !important;
height: 55px !important; height: 55px !important;
font-size: 30px; font-size: 30px;
} }
.v-time-picker-controls__time__separator { .v-time-picker-controls__time__separator {
font-size: 36px !important; font-size: 36px !important;
} }
web/src/scss/components/_VList.scss
+27 -27
View File
@@ -1,34 +1,34 @@
.v-list.theme-list { .v-list.theme-list {
.v-list-item:hover > .v-list-item__overlay { .v-list-item:hover > .v-list-item__overlay {
opacity: 1; opacity: 1;
z-index: 1; z-index: 1;
} }
.v-list-item--variant-text { .v-list-item--variant-text {
.v-list-item__overlay {
background: rgb(var(--v-theme-hoverColor));
}
}
.v-list-item__prepend,
.v-list-item__content {
z-index: 2;
}
.v-list-item__overlay { .v-list-item__overlay {
background-color: rgb(var(--v-theme-hoverColor)); background: rgb(var(--v-theme-hoverColor));
}
.v-list-item.v-list-item--active{
.v-list-item__overlay{
opacity: 1;
}
} }
}
.mail-items{ .v-list-item__prepend,
min-height: 40px !important; .v-list-item__content {
margin-bottom: 5px !important; z-index: 2;
} }
.v-list-item__overlay {
background-color: rgb(var(--v-theme-hoverColor));
}
.v-list-item.v-list-item--active {
.v-list-item__overlay {
opacity: 1;
}
}
.mail-items {
min-height: 40px !important;
margin-bottom: 5px !important;
}
} }
.v-list-item-title{ .v-list-item-title {
font-size: 14px; font-size: 14px;
} }
web/src/scss/components/_VSelectionControl.scss
+2 -2
View File
@@ -1,6 +1,6 @@
// For checkbox & radios // For checkbox & radios
.v-selection-control__input > .v-icon.mdi-checkbox-blank-outline, .v-selection-control__input > .v-icon.mdi-checkbox-blank-outline,
.v-selection-control__input > .v-icon.mdi-radiobox-blank { .v-selection-control__input > .v-icon.mdi-radiobox-blank {
color: rgb(var(--v-theme-inputBorder)); color: rgb(var(--v-theme-inputBorder));
opacity: 1; opacity: 1;
} }
web/src/scss/components/_VShadow.scss
+10 -10
View File
@@ -8,26 +8,26 @@
box-shadow: $box-shadow !important; box-shadow: $box-shadow !important;
} }
.elevation-1 { .elevation-1 {
box-shadow:0px 12px 30px -2px rgba(58,75,116,0.14) !important box-shadow: 0px 12px 30px -2px rgba(58, 75, 116, 0.14) !important;
} }
.elevation-2 { .elevation-2 {
box-shadow:0px 24px 24px -12px rgba(0, 0, 0, .05) !important box-shadow: 0px 24px 24px -12px rgba(0, 0, 0, 0.05) !important;
} }
.elevation-3 { .elevation-3 {
box-shadow: rgba(145,158,171,0.2) 0px 0px 2px 0px, rgba(145,158,171,0.12) 0px 12px 24px -4px !important; box-shadow:
rgba(145, 158, 171, 0.2) 0px 0px 2px 0px,
rgba(145, 158, 171, 0.12) 0px 12px 24px -4px !important;
} }
.elevation-4{ .elevation-4 {
box-shadow: 0px 12px 12px -6px rgba(0,0,0,0.15) !important; box-shadow: 0px 12px 12px -6px rgba(0, 0, 0, 0.15) !important;
} }
.elevation-5 .elevation-5 {
{ box-shadow: 1px 0 7px rgba(0, 0, 0, 0.05) !important;
box-shadow: 1px 0 7px rgba(0, 0, 0, .05)!important;
} }
.primary-shadow { .primary-shadow {
box-shadow: rgba(var(--v-theme-primary), 0.30) 0px 12px 14px 0px; box-shadow: rgba(var(--v-theme-primary), 0.3) 0px 12px 14px 0px;
&:hover { &:hover {
box-shadow: none; box-shadow: none;
} }
} }
web/src/scss/components/_VStepper.scss
+5 -4
View File
@@ -1,8 +1,9 @@
.v-stepper-item--selected .v-stepper-item__avatar.v-avatar, .v-stepper-item--complete .v-stepper-item__avatar.v-avatar { .v-stepper-item--selected .v-stepper-item__avatar.v-avatar,
background: rgb(var(--v-theme-primary)) !important; .v-stepper-item--complete .v-stepper-item__avatar.v-avatar {
background: rgb(var(--v-theme-primary)) !important;
} }
.v-stepper-item__avatar.v-avatar { .v-stepper-item__avatar.v-avatar {
background: rgba(var(--v-theme-primary), var(--v-medium-emphasis-opacity)) !important; background: rgba(var(--v-theme-primary), var(--v-medium-emphasis-opacity)) !important;
color: rgb(var(--v-theme-on-primary)) !important; color: rgb(var(--v-theme-on-primary)) !important;
} }
web/src/scss/components/_VTable.scss
+64 -76
View File
@@ -1,99 +1,87 @@
.v-table .v-table__wrapper > table > tbody > tr:not(:last-child) > td, .v-table .v-table__wrapper > table > tbody > tr:not(:last-child) > td,
.v-table .v-table__wrapper > table > tbody > tr:not(:last-child) > th, .v-table .v-table__wrapper > table > tbody > tr:not(:last-child) > th,
.v-table .v-table__wrapper > table > thead > tr:last-child > th { .v-table .v-table__wrapper > table > thead > tr:last-child > th {
border-bottom: thin solid rgba(var(--v-border-color)) !important; border-bottom: thin solid rgba(var(--v-border-color)) !important;
} }
.v-data-table{ .v-data-table {
th.v-data-table__th{ th.v-data-table__th {
font-size:16px; font-size: 16px;
color: rgba(var(--v-theme-on-surface), var(--v-medium-emphasis-opacity)); color: rgba(var(--v-theme-on-surface), var(--v-medium-emphasis-opacity));
} }
td.v-data-table__td{ td.v-data-table__td {
font-size: 14px; font-size: 14px;
text-wrap: nowrap; text-wrap: nowrap;
} }
.v-data-table-footer{ .v-data-table-footer {
padding: 15px 8px; padding: 15px 8px;
} }
.v-data-table-header__sort-badge{ .v-data-table-header__sort-badge {
background-color:rgb(var(--v-theme-borderColor)) !important; background-color: rgb(var(--v-theme-borderColor)) !important;
} }
.tdhead{ .tdhead {
font-size:16px; font-size: 16px;
} }
} }
@media screen and (max-width:767px) { @media screen and (max-width: 767px) {
.v-data-table-footer{ .v-data-table-footer {
justify-content: center; justify-content: center;
} }
} }
.v-table { .v-table {
&.ticket-table {
table {
thead {
th {
font-weight: 600 !important;
}
}
tbody {
tr {
td {
padding: 16px 16px !important;
}
}
}
}
}
&.ticket-table { &.invoice-table {
.v-table__wrapper {
table {
thead {
th {
font-weight: 600 !important;
padding: 0px 24px !important;
table { &:first-child {
thead { padding-left: 0 !important;
th {
font-weight: 600 !important;
}
} }
tbody { &:last-child {
tr { padding-right: 0 !important;
td {
padding: 16px 16px !important;
}
}
} }
}
} }
} tbody {
tr {
td {
padding: 8px 24px !important;
&.invoice-table { &:first-child {
.v-table__wrapper { padding-left: 0 !important;
table { }
thead {
th {
font-weight: 600 !important;
padding: 0px 24px !important;
&:first-child { &:last-child {
padding-left: 0 !important; padding-right: 0 !important;
} }
&:last-child {
padding-right: 0 !important;
}
}
}
tbody {
tr {
td {
padding: 8px 24px !important;
&:first-child {
padding-left: 0 !important;
}
&:last-child {
padding-right: 0 !important;
}
}
}
}
} }
}
} }
}
} }
}
} }
web/src/scss/components/_VTabs.scss
+8 -9
View File
@@ -1,14 +1,13 @@
@use "../variables" as *; @use "../variables" as *;
.theme-tab { .theme-tab {
&.v-tabs { &.v-tabs {
.v-tab { .v-tab {
border-radius: $border-radius-root !important; border-radius: $border-radius-root !important;
min-width: auto !important; min-width: auto !important;
&.v-slide-group-item--active { &.v-slide-group-item--active {
background: rgb(var(--v-theme-primary)); background: rgb(var(--v-theme-primary));
}
}
}
} }
}
} }
web/src/scss/components/_VTextField.scss
-1
View File
@@ -10,4 +10,3 @@
background-color: rgba(0, 0, 0, 0.025); background-color: rgba(0, 0, 0, 0.025);
} }
} }
web/src/scss/front/_general.scss
+453 -466
View File
File diff suppressed because it is too large Load Diff
web/src/scss/front/_header.scss
+73 -78
View File
@@ -1,104 +1,99 @@
@use "../variables" as *; @use "../variables" as *;
.front-lp-header { .front-lp-header {
.v-toolbar {
background: rgb(var(--v-theme-surface));
}
.v-toolbar{ &.v-app-bar .v-toolbar__content {
background: rgb(var(--v-theme-surface)); padding: 0;
} }
&.v-app-bar .v-toolbar__content { .v-toolbar__content {
padding: 0; background: transparent !important;
box-shadow: none !important;
}
} &.v-toolbar {
background: transparent !important;
top: 0 !important;
}
.v-toolbar__content { .v-toolbar {
background: transparent !important; background: transparent !important;
box-shadow: none !important; }
}
&.v-toolbar {
background: transparent !important;
top: 0 !important;
}
.v-toolbar {
background: transparent !important;
}
&.sticky-header {
position: fixed !important;
top: 0 !important;
transition: 0.5s;
background-color: rgba(var(--v-theme-surface)) !important;
box-shadow: 0 4px 29px -11px #3a4b7424 !important;
}
&.sticky-header {
position: fixed !important;
top: 0 !important;
transition: 0.5s;
background-color: rgba(var(--v-theme-surface)) !important;
box-shadow: 0 4px 29px -11px #3a4b7424 !important;
}
} }
// //
// mega menu // mega menu
// //
.white-btn{ .white-btn {
background-color: #769CFF; background-color: #769cff;
} }
.front_wrapper { .front_wrapper {
&.v-menu .v-overlay__content {
&.v-menu .v-overlay__content { margin: 0 auto;
margin: 0 auto; left: 0 !important;
left: 0 !important; right: 0;
right: 0; }
.megamenu {
&::before {
content: "";
position: absolute;
top: 0px;
left: 0px;
width: 100%;
height: 96%;
background-color: rgba(55, 114, 255, 0.2);
border-radius: 7px;
opacity: 0;
} }
.megamenu { .v-btn {
&::before { top: 50%;
content: ''; transform: translateY(-50%);
position: absolute; z-index: 1;
top: 0px; left: 0;
left: 0px; right: 0;
width: 100%; min-width: 100px;
height: 96%; opacity: 0;
background-color: rgba(55, 114, 255, 0.2); font-size: 13px;
border-radius: 7px;
opacity: 0;
}
.v-btn {
top: 50%;
transform: translateY(-50%);
z-index: 1;
left: 0;
right: 0;
min-width: 100px;
opacity: 0;
font-size: 13px;
}
&:hover {
&::before,
.v-btn {
opacity: 1;
}
}
} }
&:hover {
&::before,
.v-btn {
opacity: 1;
}
}
}
} }
.lp-drawer { .lp-drawer {
&.v-navigation-drawer { &.v-navigation-drawer {
top: 0 !important; top: 0 !important;
height: 100% !important; height: 100% !important;
z-index: 1007 !important; z-index: 1007 !important;
} }
} }
.lp-mobile-sidebar { .lp-mobile-sidebar {
.v-list { .v-list {
.v-list-item__content { .v-list-item__content {
overflow: inherit; overflow: inherit;
}
}
.v-list-group__items .v-list-item {
padding-inline-start: 25px !important;
} }
}
.v-list-group__items .v-list-item {
padding-inline-start: 25px !important;
}
} }
.v-btn--size-default { .v-btn--size-default {
&.nav-links { &.nav-links {
font-size: $font-size-root !important; font-size: $font-size-root !important;
} }
} }
web/src/scss/layout/_container.scss
+20 -20
View File
@@ -1,40 +1,40 @@
html { html {
overflow-y: auto; overflow-y: auto;
} }
.v-main{ .v-main {
background:rgb(var(--v-theme-background)) !important; ; background: rgb(var(--v-theme-background)) !important;
} }
@media (max-width: 1279px) { @media (max-width: 1279px) {
.v-main { .v-main {
margin: 0 10px; margin: 0 10px;
} }
} }
.cursor-pointer { .cursor-pointer {
cursor: pointer; cursor: pointer;
} }
.page-wrapper { .page-wrapper {
min-height: calc(100vh - 100px); min-height: calc(100vh - 100px);
padding: 24px; padding: 24px;
// border-radius: $border-radius-root; // border-radius: $border-radius-root;
@media screen and (max-width: 767px) { @media screen and (max-width: 767px) {
padding: 20px 10px; padding: 20px 10px;
} }
} }
.maxWidth { .maxWidth {
max-width: 1200px; max-width: 1200px;
margin: 0 auto; margin: 0 auto;
} }
.fixed-width { .fixed-width {
max-width: 1300px; max-width: 1300px;
} }
.right-pos-img { .right-pos-img {
position: absolute; position: absolute;
right: 0; right: 0;
top: 0; top: 0;
height: 100%; height: 100%;
} }
web/src/scss/layout/_customizer.scss
+64 -55
View File
@@ -1,93 +1,102 @@
.v-btn.customizer-btn { .v-btn.customizer-btn {
position: fixed; position: fixed;
bottom: 30px; bottom: 30px;
right: 30px; right: 30px;
border-radius: 50%; border-radius: 50%;
// .icon-tabler-settings { // .icon-tabler-settings {
// animation: progress-circular-rotate 1.4s linear infinite; // animation: progress-circular-rotate 1.4s linear infinite;
// transform-origin: center center; // transform-origin: center center;
// transition: all 0.2s ease-in-out; // transition: all 0.2s ease-in-out;
// } // }
} }
.btn-group-custom { .btn-group-custom {
&.v-btn-group { &.v-btn-group {
height: 66px !important; height: 66px !important;
overflow: unset !important; overflow: unset !important;
.v-btn { .v-btn {
height: 66px !important; height: 66px !important;
padding: 0 20px; padding: 0 20px;
border: 1px solid rgb(var(--v-theme-borderColor), 0.7) !important; border: 1px solid rgb(var(--v-theme-borderColor), 0.7) !important;
transition: all 0.1s ease-in 0s; transition: all 0.1s ease-in 0s;
&:hover { &:hover {
transform: scale(1.05); transform: scale(1.05);
} }
&.text-primary { &.text-primary {
.v-btn__overlay { .v-btn__overlay {
background: transparent !important; background: transparent !important;
}
.icon {
color: rgb(var(--v-theme-primary)) !important;
fill: rgb(var(--v-theme-primary), 0.2);
}
color: rgb(var(--v-theme-primary)) !important;
}
} }
.icon {
color: rgb(var(--v-theme-primary)) !important;
fill: rgb(var(--v-theme-primary), 0.2);
}
color: rgb(var(--v-theme-primary)) !important;
}
} }
}
} }
.hover-btns { .hover-btns {
transition: all 0.1s ease-in 0s; transition: all 0.1s ease-in 0s;
&:hover { &:hover {
transform: scale(1.05); transform: scale(1.05);
} }
} }
// all theme colors // all theme colors
.v-avatar.themeBlue, .v-avatar.themeBlue,
.v-avatar.themeDarkBlue { .v-avatar.themeDarkBlue {
background: #1e88e5; background: #1e88e5;
} }
.v-avatar.themeAqua, .v-avatar.themeAqua,
.v-avatar.themeDarkAqua { .v-avatar.themeDarkAqua {
background: #0074ba; background: #0074ba;
} }
.v-avatar.themePurple, .v-avatar.themePurple,
.v-avatar.themeDarkPurple { .v-avatar.themeDarkPurple {
background: #763ebd; background: #763ebd;
} }
.v-avatar.themeGreen, .v-avatar.themeGreen,
.v-avatar.themeDarkGreen { .v-avatar.themeDarkGreen {
background: #0a7ea4; background: #0a7ea4;
} }
.v-avatar.themeCyan, .v-avatar.themeCyan,
.v-avatar.themeDarkCyan { .v-avatar.themeDarkCyan {
background: #01c0c8; background: #01c0c8;
} }
.v-avatar.themeOrange, .v-avatar.themeOrange,
.v-avatar.themeDarkOrange { .v-avatar.themeDarkOrange {
background: #fa896b; background: #fa896b;
} }
.DARK_BLUE_THEME,
.DARK_AQUA_THEME,
.DARK_ORANGE_THEME,
.DARK_PURPLE_THEME,
.DARK_GREEN_THEME,
.DARK_CYAN_THEME {
.togglethemeBlue {
display: block !important;
}
.DARK_BLUE_THEME, .DARK_AQUA_THEME, .DARK_ORANGE_THEME, .DARK_PURPLE_THEME, .DARK_GREEN_THEME, .DARK_CYAN_THEME { .togglethemeDarkBlue {
.togglethemeBlue { display: none !important;
display: block !important; }
}
.togglethemeDarkBlue {
display: none !important;
}
} }
.BLUE_THEME, .AQUA_THEME, .ORANGE_THEME, .PURPLE_THEME, .GREEN_THEME, .CYAN_THEME { .BLUE_THEME,
.togglethemeDarkBlue { .AQUA_THEME,
display: block !important; .ORANGE_THEME,
} .PURPLE_THEME,
.GREEN_THEME,
.CYAN_THEME {
.togglethemeDarkBlue {
display: block !important;
}
.togglethemeBlue { .togglethemeBlue {
display: none !important; display: none !important;
} }
} }
web/src/scss/layout/_reboot.scss
+42 -40
View File
@@ -1,109 +1,111 @@
.h-100 { .h-100 {
height: 100%; height: 100%;
} }
.w-100 { .w-100 {
width: 100%; width: 100%;
} }
.h-100vh { .h-100vh {
height: 100vh; height: 100vh;
} }
.gap-2 { .gap-2 {
gap: 8px; gap: 8px;
} }
.gap-3 { .gap-3 {
gap: 16px; gap: 16px;
} }
.gap-4 { .gap-4 {
gap: 24px; gap: 24px;
} }
.text-white { .text-white {
color: rgb(255, 255, 255) !important; color: rgb(255, 255, 255) !important;
} }
// border // border
.border-bottom { .border-bottom {
border-bottom: 1px solid rgba(0, 0, 0, .05); border-bottom: 1px solid rgba(0, 0, 0, 0.05);
} }
.opacity-1 { .opacity-1 {
opacity: 1 !important; opacity: 1 !important;
} }
.opacity-50 { .opacity-50 {
opacity: 0.5; opacity: 0.5;
} }
.z-auto.v-card { .z-auto.v-card {
z-index: auto; z-index: auto;
} }
.obj-cover { .obj-cover {
object-fit: cover; object-fit: cover;
} }
.cursor-move { .cursor-move {
cursor: move; cursor: move;
} }
body { body {
cursor: default; cursor: default;
} }
input:not([type="checkbox"]):not([type="radio"]):not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="file"]):not([type="range"]):not([type="color"]), input:not([type="checkbox"]):not([type="radio"]):not([type="button"]):not([type="submit"]):not(
[type="reset"]
):not([type="file"]):not([type="range"]):not([type="color"]),
textarea, textarea,
[contenteditable="true"] { [contenteditable="true"] {
cursor: text; cursor: text;
} }
//Date time picker //Date time picker
input[type="date"], input[type="date"],
input[type="time"] { input[type="time"] {
display: block !important; display: block !important;
} }
input[type="date"]::-webkit-calendar-picker-indicator, input[type="date"]::-webkit-calendar-picker-indicator,
input[type="time"]::-webkit-calendar-picker-indicator { input[type="time"]::-webkit-calendar-picker-indicator {
display: block !important; display: block !important;
} }
.ProseMirror { .ProseMirror {
min-height: 150px; min-height: 150px;
} }
.upload-btn-wrapper { .upload-btn-wrapper {
width: 150px; width: 150px;
height: 140px; height: 140px;
margin: 0 auto; margin: 0 auto;
box-shadow: 0 0.5rem 1.5rem 0.5rem rgba(0, 0, 0, 0.075); box-shadow: 0 0.5rem 1.5rem 0.5rem rgba(0, 0, 0, 0.075);
input[type=file] { input[type="file"] {
position: absolute; position: absolute;
left: 0; left: 0;
top: 0; top: 0;
opacity: 0; opacity: 0;
height: 100%; height: 100%;
width: 100%; width: 100%;
} }
} }
.bg-transparent { .bg-transparent {
background-color: transparent !important; background-color: transparent !important;
} }
.bg-dark{ .bg-dark {
background-color: rgba(0, 0, 0, .08); background-color: rgba(0, 0, 0, 0.08);
} }
.bg-white-opacity{ .bg-white-opacity {
background-color: rgba(255, 255, 255, 0.2); background-color: rgba(255, 255, 255, 0.2);
} }
@media screen and (max-width:1368px) and (min-width:1200px) { @media screen and (max-width: 1368px) and (min-width: 1200px) {
.space-20 { .space-20 {
padding: 30px 20px !important; padding: 30px 20px !important;
} }
} }
web/src/scss/layout/_rtl.scss
+313 -320
View File
@@ -1,341 +1,334 @@
.v-locale--is-rtl { .v-locale--is-rtl {
.customizer-btn { .customizer-btn {
left: 30px; left: 30px;
right: unset; right: unset;
}
.horizontal-navbar .icon-box {
margin-left: 12px;
}
.bg-img-1 {
position: absolute;
bottom: 0;
left: 0;
right: unset !important;
transform: scaleX(-1);
}
.ml-1 {
margin-left: unset !important;
margin-right: 4px;
}
.ml-2 {
margin-left: unset !important;
margin-right: 8px;
}
.mr-1 {
margin-right: unset !important;
margin-left: 4px;
}
.mr-2 {
margin-right: unset !important;
margin-left: 8px;
}
.mr-sm-2 {
margin-right: unset !important;
margin-left: 8px;
}
.mr-3 {
margin-right: unset !important;
margin-left: 12px !important;
}
.mr-4 {
margin-right: unset !important;
margin-left: 16px !important;
}
.ml-3 {
margin-left: unset !important;
margin-right: 12px !important;
}
.mr-auto {
margin-left: auto !important;
margin-right: unset !important;
}
.ml-4 {
margin-left: unset !important;
margin-right: 16px;
}
.ml-sm-4 {
margin-left: unset !important;
margin-right: 16px;
}
.ml-md-4 {
margin-left: unset !important;
margin-right: 16px;
}
.ml-sm-3 {
margin-left: unset !important;
margin-right: 12px;
}
.ml-5 {
margin-left: unset !important;
margin-right: 20px;
}
.ml-6 {
margin-left: unset !important;
margin-right: 24px;
}
.ml-10 {
margin-left: unset !important;
margin-right: 40px;
}
.pl-1 {
padding-left: unset !important;
padding-right: 4px !important;
}
.pl-2 {
padding-left: unset !important;
padding-right: 8px !important;
}
.pr-2 {
padding-left: 8px !important;
}
.pr-4 {
padding-left: 16px !important;
padding-right: unset !important;
}
.pl-4 {
padding-left: unset !important;
padding-right: 16px !important;
}
.right-pos-img {
right: unset;
left: 0;
transform: scaleX(-1);
top: 0;
}
.badg-dotDetail {
left: 0;
right: -8px;
}
.text-right {
text-align: left !important;
}
.text-sm-right,
.text-md-right {
text-align: left !important;
}
.text-sm-left {
text-align: right !important;
}
.text-left {
text-align: right !important;
}
.ml-auto,
.ml-sm-auto {
margin-left: unset !important;
margin-right: auto !important;
}
.justify-start {
justify-content: flex-end !important;
}
.vertical-table .v-table > .v-table__wrapper > table > tbody > tr > th {
border-left: thin solid rgba(var(--v-border-color), 1) !important;
}
.authentication .auth-header {
left: unset;
right: 0;
}
.horizontal-navbar li a {
padding: 10px 13px;
}
.horizontal-navbar {
li {
margin-right: 0;
margin-left: 15px;
}
}
// &.v-menu .v-overlay__content,
// &.search_popup .v-overlay__content,
// &.language_dropdown .v-overlay__content,
// &.notification_popup .v-overlay__content,
// &.profile_popup .v-overlay__content {
// left: inherit;
// }
.related-Product {
.carousel__prev.navarrow {
top: 0;
right: unset !important;
left: 0;
} }
.horizontal-navbar .icon-box { .carousel__next.navarrow {
margin-left: 12px; top: 0;
right: unset !important;
left: 45px;
}
}
//RTL mode minisidebar hover to active scrollbar
.ps--active-y > .ps__rail-y {
right: unset !important;
left: 0;
}
//RTL mode sidebar scrollbar on right side
.left-customizer {
.ps__rail-y {
right: 0 !important;
}
}
.horizontal-navbar .ddMenu {
padding: 10px 15px 10px 0px;
}
.v-list-group__items {
.iconClass {
position: relative;
left: unset;
right: -2px;
}
}
@media (min-width: 960px) {
.horizontal-navbar .ddLevel-2,
.horizontal-navbar .ddLevel-3 {
top: -5px;
right: 212px;
} }
.horizontal-navbar li a .navIcon {
margin-right: 0;
margin-left: 10px;
}
}
.leftSidebar .profile-name h5 {
direction: ltr;
}
.bg-img-1 { .horizontal-navbar {
position: absolute; .ddMenu {
bottom: 0; .navItemLink {
left: 0; padding-right: 15px;
right: unset !important; }
transform: scaleX(-1); }
}
@media screen and (max-width: 1279px) {
.mini-sidebar {
.v-navigation-drawer.v-navigation-drawer--right {
width: 270px !important;
}
.v-navigation-drawer.v-navigation-drawer--left {
width: 320px !important;
}
}
}
.rtlImg {
transform: scaleX(-1);
}
.marquee1-group {
animation: marquee-rtl 45s linear infinite;
}
.marquee2-group {
animation: marquee2-rtl 45s linear infinite;
}
@keyframes marquee-rtl {
0% {
transform: translate3d(0, 0, 0);
} }
.ml-1 { 100% {
margin-left: unset !important; transform: translate3d(2086px, 0, 0);
margin-right: 4px; }
}
@keyframes marquee2-rtl {
0% {
transform: translate3d(2086px, 0, 0);
} }
.ml-2 { 100% {
margin-left: unset !important; transform: translate3d(0, 0, 0);
margin-right: 8px;
} }
}
.mr-1 { .front-wraper {
margin-right: unset !important; .testimonials {
margin-left: 4px; .slide-counter {
} left: -50px;
}
.mr-2 { .carousel__prev {
margin-right: unset !important; right: -74%;
margin-left: 8px;
}
.mr-sm-2 {
margin-right: unset !important;
margin-left: 8px;
}
.mr-3 {
margin-right: unset !important;
margin-left: 12px !important;
}
.mr-4 {
margin-right: unset !important;
margin-left: 16px !important;
}
.ml-3 {
margin-left: unset !important;
margin-right: 12px !important;
}
.mr-auto {
margin-left: auto !important;
margin-right: unset !important;
}
.ml-4 {
margin-left: unset !important;
margin-right: 16px;
}
.ml-sm-4 {
margin-left: unset !important;
margin-right: 16px;
}
.ml-md-4 {
margin-left: unset !important;
margin-right: 16px;
}
.ml-sm-3 {
margin-left: unset !important;
margin-right: 12px;
}
.ml-5 {
margin-left: unset !important;
margin-right: 20px;
}
.ml-6 {
margin-left: unset !important;
margin-right: 24px;
}
.ml-10 {
margin-left: unset !important;
margin-right: 40px;
}
.pl-1 {
padding-left: unset !important;
padding-right: 4px !important;
}
.pl-2 {
padding-left: unset !important;
padding-right: 8px !important;
}
.pr-2 {
padding-left: 8px !important;
}
.pr-4 {
padding-left: 16px !important;
padding-right: unset !important;
}
.pl-4 {
padding-left: unset !important;
padding-right: 16px !important;
}
.right-pos-img {
right: unset;
left: 0;
transform: scaleX(-1);
top: 0;
}
.badg-dotDetail {
left: 0;
right: -8px;
}
.text-right {
text-align: left !important;
}
.text-sm-right,
.text-md-right {
text-align: left !important;
}
.text-sm-left {
text-align: right !important;
}
.text-left {
text-align: right !important;
}
.ml-auto,
.ml-sm-auto {
margin-left: unset !important;
margin-right: auto !important;
}
.justify-start {
justify-content: flex-end !important;
}
.vertical-table .v-table>.v-table__wrapper>table>tbody>tr>th {
border-left: thin solid rgba(var(--v-border-color), 1) !important;
}
.authentication .auth-header {
left: unset; left: unset;
right: 0;
}
.horizontal-navbar li a { .rtlnav {
padding: 10px 13px; transform: scaleX(-1);
}
.horizontal-navbar {
li {
margin-right: 0;
margin-left: 15px;
} }
} }
// &.v-menu .v-overlay__content, .carousel__next {
// &.search_popup .v-overlay__content, right: -60%;
// &.language_dropdown .v-overlay__content,
// &.notification_popup .v-overlay__content,
// &.profile_popup .v-overlay__content {
// left: inherit;
// }
.related-Product {
.carousel__prev.navarrow {
top: 0;
right: unset !important;
left: 0;
}
.carousel__next.navarrow {
top: 0;
right: unset !important;
left: 45px;
}
}
//RTL mode minisidebar hover to active scrollbar
.ps--active-y>.ps__rail-y {
right: unset !important;
left: 0;
}
//RTL mode sidebar scrollbar on right side
.left-customizer {
.ps__rail-y {
right: 0 !important;
}
}
.horizontal-navbar .ddMenu {
padding: 10px 15px 10px 0px;
}
.v-list-group__items {
.iconClass {
position: relative;
left: unset;
right: -2px;
}
}
@media (min-width: 960px) {
.horizontal-navbar .ddLevel-2,
.horizontal-navbar .ddLevel-3 {
top: -5px;
right: 212px;
}
.horizontal-navbar li a .navIcon {
margin-right: 0;
margin-left: 10px;
}
}
.leftSidebar .profile-name h5 {
direction: ltr;
}
.horizontal-navbar {
.ddMenu {
.navItemLink {
padding-right: 15px;
}
}
}
@media screen and (max-width:1279px) {
.mini-sidebar {
.v-navigation-drawer.v-navigation-drawer--right {
width: 270px !important;
}
.v-navigation-drawer.v-navigation-drawer--left {
width: 320px !important;
}
}
}
.rtlImg {
transform: scaleX(-1);
}
.marquee1-group {
animation: marquee-rtl 45s linear infinite;
}
.marquee2-group {
animation: marquee2-rtl 45s linear infinite;
}
@keyframes marquee-rtl {
0% {
transform: translate3d(0, 0, 0);
}
100% {
transform: translate3d(2086px, 0, 0);
}
}
@keyframes marquee2-rtl {
0% {
transform: translate3d(2086px, 0, 0);
}
100% {
transform: translate3d(0, 0, 0);
}
}
.front-wraper {
.testimonials {
.slide-counter {
left: -50px;
}
.carousel__prev {
right: -74%;
left: unset;
.rtlnav {
transform: scaleX(-1);
}
}
.carousel__next {
right: -60%;
left: unset;
.rtlnav {
transform: scaleX(-1);
}
}
}
}
//For Rtl Chart
.rtl-me-n7 {
margin-inline-start: -28px !important;
margin-inline-end: unset !important;
}
.profile-img::before {
left: unset; left: unset;
right: 14px;
}
.rtlnav {
transform: scaleX(-1);
}
}
}
}
//For Rtl Chart
.rtl-me-n7 {
margin-inline-start: -28px !important;
margin-inline-end: unset !important;
}
.profile-img::before {
left: unset;
right: 14px;
}
} }
web/src/scss/layout/_text.scss
+60 -60
View File
@@ -1,98 +1,98 @@
$sizes: ( $sizes: (
'display-1': 44px, "display-1": 44px,
'display-2': 40px, "display-2": 40px,
'display-3': 30px, "display-3": 30px,
'h1': 36px, "h1": 36px,
'h2': 30px, "h2": 30px,
'h3': 21px, "h3": 21px,
'h4': 18px, "h4": 18px,
'h5': 16px, "h5": 16px,
'h6': 14px, "h6": 14px,
'text-10': 10px, "text-10": 10px,
'text-12': 12px, "text-12": 12px,
'text-13': 13px, "text-13": 13px,
'text-14': 14px, "text-14": 14px,
'text-15': 15px, "text-15": 15px,
'text-16': 16px, "text-16": 16px,
'text-17': 17px, "text-17": 17px,
'text-18': 18px, "text-18": 18px,
'text-20': 20px, "text-20": 20px,
'text-22': 22px, "text-22": 22px,
'text-24': 24px, "text-24": 24px,
'text-28': 28px, "text-28": 28px,
'text-34': 34px, "text-34": 34px,
'text-40': 40px, "text-40": 40px,
'text-44': 44px, "text-44": 44px,
'text-48': 48px, "text-48": 48px,
'text-50': 50px, "text-50": 50px,
'text-52': 52px, "text-52": 52px,
'text-56': 56px, "text-56": 56px,
'text-64': 64px, "text-64": 64px,
'body-text-1': 10px "body-text-1": 10px,
); );
@each $pixel, $size in $sizes { @each $pixel, $size in $sizes {
.#{$pixel} { .#{$pixel} {
font-size: $size; font-size: $size;
line-height: $size + 10; line-height: $size + 10;
} }
} }
$height: ( $height: (
'h-10': 10px, "h-10": 10px,
'h-12': 12px, "h-12": 12px,
'h-15': 15px, "h-15": 15px,
); );
@each $pixel, $size in $height { @each $pixel, $size in $height {
.#{$pixel} { .#{$pixel} {
height: $size; height: $size;
width: $size ; width: $size;
} }
} }
.textSecondary { .textSecondary {
color: rgb(var(--v-theme-textSecondary)) !important; color: rgb(var(--v-theme-textSecondary)) !important;
} }
.textPrimary { .textPrimary {
color: rgb(var(--v-theme-textPrimary)) !important; color: rgb(var(--v-theme-textPrimary)) !important;
} }
// line height // line height
.lh-md { .lh-md {
line-height: 1.57; line-height: 1.57;
} }
.lh-normal{ .lh-normal {
line-height: normal; line-height: normal;
} }
.font-weight-semibold { .font-weight-semibold {
font-weight: 600; font-weight: 600;
} }
// hover text // hover text
.text-hover-primary { .text-hover-primary {
color: rgb(var(--v-theme-textPrimary)); color: rgb(var(--v-theme-textPrimary));
&:hover { &:hover {
color: rgb(var(--v-theme-primary)); color: rgb(var(--v-theme-primary));
} }
} }
.link { .link {
color: rgb(var(--v-theme-textSecondary)); color: rgb(var(--v-theme-textSecondary));
text-decoration: none; text-decoration: none;
&:hover { &:hover {
color: rgb(var(--v-theme-primary)); color: rgb(var(--v-theme-primary));
} }
} }
.hover-primary { .hover-primary {
&:hover { &:hover {
color: rgb(var(--v-theme-primary)) !important; color: rgb(var(--v-theme-primary)) !important;
opacity: 1; opacity: 1;
} }
} }
web/src/scss/layout/_topbar.scss
+88 -89
View File
@@ -1,110 +1,109 @@
.v-app-bar { .v-app-bar {
.v-toolbar__content { .v-toolbar__content {
padding: 0 15px; padding: 0 15px;
> .v-btn:first-child { > .v-btn:first-child {
margin-inline-start: 0; margin-inline-start: 0;
}
.v-btn {
color: rgba(var(--v-theme-textsurface)) !important;
}
} }
// .v-btn {
// color: rgba(var(--v-theme-textsurface)) !important;
// }
}
} }
.custom-text-primary { .custom-text-primary {
&.v-list-item:hover > .v-list-item__overlay { &.v-list-item:hover > .v-list-item__overlay {
display: none; display: none;
} }
.custom-title {
color: rgb(var(--v-theme-textPrimary)) !important;
}
&:hover {
.custom-title { .custom-title {
color: rgb(var(--v-theme-textPrimary)) !important; color: rgb(var(--v-theme-primary)) !important;
}
&:hover {
.custom-title {
color: rgb(var(--v-theme-primary)) !important;
}
} }
}
} }
@media screen and (max-width:1279px) { @media screen and (max-width: 1279px) {
.mini-sidebar { .mini-sidebar {
.v-navigation-drawer.v-navigation-drawer--left { .v-navigation-drawer.v-navigation-drawer--left {
width: 270px !important; width: 270px !important;
}
} }
}
} }
.notify { .notify {
position: relative; position: relative;
top: -20px; top: -20px;
right: -8px; right: -8px;
.heartbit { .heartbit {
position: absolute; position: absolute;
top: -5px; top: -5px;
right: -2px; right: -2px;
height: 18px; height: 18px;
width: 18px; width: 18px;
z-index: 10; z-index: 10;
border: 2px solid rgb(var(--v-theme-error)); border: 2px solid rgb(var(--v-theme-error));
border-radius: 70px; border-radius: 70px;
animation: heartbit 1s ease-out; animation: heartbit 1s ease-out;
-moz-animation: heartbit 1s ease-out; -moz-animation: heartbit 1s ease-out;
-moz-animation-iteration-count: infinite; -moz-animation-iteration-count: infinite;
-o-animation: heartbit 1s ease-out; -o-animation: heartbit 1s ease-out;
-o-animation-iteration-count: infinite; -o-animation-iteration-count: infinite;
-webkit-animation: heartbit 1s ease-out; -webkit-animation: heartbit 1s ease-out;
-webkit-animation-iteration-count: infinite; -webkit-animation-iteration-count: infinite;
animation-iteration-count: infinite; animation-iteration-count: infinite;
}
.point {
width: 4px;
height: 4px;
border-radius: 30px;
position: absolute;
right: 5px;
top: 2px;
background-color: rgb(var(--v-theme-error));
position: absolute;
}
} }
@keyframes heartbit { .point {
0% { width: 4px;
transform: scale(0); height: 4px;
opacity: 0; border-radius: 30px;
} position: absolute;
right: 5px;
top: 2px;
background-color: rgb(var(--v-theme-error));
position: absolute;
}
}
25% { @keyframes heartbit {
transform: scale(0.1); 0% {
opacity: 0.1; transform: scale(0);
} opacity: 0;
50% {
transform: scale(0.5);
opacity: 0.3;
}
75% {
transform: scale(0.8);
opacity: 0.5;
}
100% {
transform: scale(1);
opacity: 0;
}
} }
.v-menu.mobile_popup .v-overlay__content { 25% {
width: 100%; transform: scale(0.1);
opacity: 0.1;
}
50% {
transform: scale(0.5);
opacity: 0.3;
}
75% {
transform: scale(0.8);
opacity: 0.5;
}
100% {
transform: scale(1);
opacity: 0;
}
} }
@media (max-width: 1199px) { .v-menu.mobile_popup .v-overlay__content {
.main-head{ width: 100%;
&.v-app-bar .v-toolbar__content{ }
width: 100%;
justify-content: space-between; @media (max-width: 1199px) {
padding: 0 10px; .main-head {
} &.v-app-bar .v-toolbar__content {
} width: 100%;
justify-content: space-between;
padding: 0 10px;
}
}
} }
web/src/scss/pages/_dashboards.scss
+161 -172
View File
@@ -1,90 +1,84 @@
.month-table { .month-table {
&.custom-px-0 { &.custom-px-0 {
thead { thead {
tr { tr {
th:first-child { th:first-child {
padding-left: 0 !important; padding-left: 0 !important;
}
th:last-child {
padding-right: 0 !important;
}
}
} }
tr.month-item { th:last-child {
td:first-child { padding-right: 0 !important;
padding-left: 0 !important;
}
td:last-child {
padding-right: 0 !important;
}
} }
}
} }
tr.month-item { tr.month-item {
td { td:first-child {
padding-top: 16px !important; padding-left: 0 !important;
padding-bottom: 16px !important; }
}
&:hover { td:last-child {
background: transparent !important; padding-right: 0 !important;
} }
}
}
tr.month-item {
td {
padding-top: 16px !important;
padding-bottom: 16px !important;
} }
tr.month-item-0 { &:hover {
td { background: transparent !important;
padding-top: 12px !important; }
padding-bottom: 12px !important; }
}
&:hover { tr.month-item-0 {
background: transparent !important; td {
} padding-top: 12px !important;
padding-bottom: 12px !important;
} }
tr.month-item-hover { &:hover {
background: transparent !important;
}
}
td { tr.month-item-hover {
padding-top: 12px !important; td {
padding-bottom: 12px !important; padding-top: 12px !important;
} padding-bottom: 12px !important;
border-left: 4px solid transparent;
&:hover {
border-left: 4px solid rgba(var(--v-theme-primary)) !important;
}
} }
border-left: 4px solid transparent;
&:hover {
border-left: 4px solid rgba(var(--v-theme-primary)) !important;
}
}
} }
.no-line { .no-line {
.v-table .v-table__wrapper > table > tbody > tr:not(:last-child) > td {
border-bottom: 0 !important;
}
.v-table .v-table__wrapper>table>tbody>tr:not(:last-child)>td { .v-table .v-table__wrapper > table > tbody > tr > td {
border-bottom: 0 !important; padding: 12px;
} }
.v-table .v-table__wrapper>table>tbody>tr>td {
padding: 12px;
}
} }
.recent-transaction { .recent-transaction {
.line { .line {
width: 2px; width: 2px;
height: 35px; height: 35px;
} }
} }
.chip-label { .chip-label {
width: 80px; width: 80px;
justify-content: center; justify-content: center;
} }
// //
@@ -92,136 +86,131 @@
// //
body { body {
.apexcharts-tooltip { .apexcharts-tooltip {
border-radius: 16px; border-radius: 16px;
} }
.apexcharts-tooltip-marker { .apexcharts-tooltip-marker {
border-radius: 4px; border-radius: 4px;
width: 12px; width: 12px;
height: 4px; height: 4px;
} }
.apexcharts-tooltip.apexcharts-theme-dark { .apexcharts-tooltip.apexcharts-theme-dark {
background: rgba(17, 28, 45, 0.8); background: rgba(17, 28, 45, 0.8);
.apexcharts-tooltip-title {
border-bottom: 0;
background: rgba(17, 28, 45, 0.7);
}
}
.apexcharts-tooltip-series-group {
padding: 0 14px;
}
.apexcharts-tooltip-title { .apexcharts-tooltip-title {
padding: 10px 14px; border-bottom: 0;
background: rgba(17, 28, 45, 0.7);
} }
}
.apexcharts-tooltip-series-group {
padding: 0 14px;
}
.apexcharts-tooltip-title {
padding: 10px 14px;
}
} }
.profile-activity { .profile-activity {
.v-tab {
&.v-btn {
border: 1px dashed rgba(var(--v-theme-borderColor));
border-radius: 8px;
min-width: 90px;
overflow: hidden;
padding: 15px 20px;
overflow: hidden;
.v-tab { .v-btn__content {
display: block;
&.v-btn { }
border: 1px dashed rgba(var(--v-theme-borderColor));
border-radius: 8px;
min-width: 90px;
overflow: hidden;
padding: 15px 20px;
overflow: hidden;
.v-btn__content {
display: block;
}
&.v-tab--selected{
border: 1px solid rgba(var(--v-theme-borderColor));
border-bottom: 2px solid;
}
.v-tab__slider{
opacity: 0;
}
}
&.v-tab--selected {
border: 1px solid rgba(var(--v-theme-borderColor));
border-bottom: 2px solid;
}
.v-tab__slider {
opacity: 0;
}
} }
}
.v-slide-group__content { .v-slide-group__content {
gap: 16px; gap: 16px;
} }
} }
.comment-box { .comment-box {
border-bottom: 1px solid rgba(var(--v-theme-borderColor)); border-bottom: 1px solid rgba(var(--v-theme-borderColor));
padding-bottom: 20px; padding-bottom: 20px;
margin-bottom: 20px; margin-bottom: 20px;
cursor: pointer; cursor: pointer;
&:last-child { &:last-child {
border-bottom: 0; border-bottom: 0;
padding-bottom: 0px; padding-bottom: 0px;
margin-bottom: 0px; margin-bottom: 0px;
} }
.comment-action {
opacity: 0;
transition: 0.5s;
}
&:hover {
.comment-action { .comment-action {
opacity: 0; opacity: 1;
transition: 0.5s; }
} }
}
&:hover {
.comment-action { .todo-list {
opacity: 1; border-bottom: 1px solid rgba(var(--v-theme-borderColor));
} padding-bottom: 25px;
} margin-bottom: 25px;
} cursor: pointer;
.todo-list { &:last-child {
border-bottom: 1px solid rgba(var(--v-theme-borderColor)); border-bottom: 0;
padding-bottom: 25px; padding-bottom: 20px;
margin-bottom: 25px; margin-bottom: 20px;
cursor: pointer; }
}
&:last-child {
border-bottom: 0; .progress-cards {
padding-bottom: 20px; border-inline-end: 1px solid rgba(var(--v-theme-borderColor));
margin-bottom: 20px;
} &:last-child {
border: 0;
} }
.progress-cards { @media screen and (max-width: 991px) {
border-inline-end: 1px solid rgba(var(--v-theme-borderColor)); border-inline-end: 0 !important;
}
&:last-child { }
border: 0;
} .notification {
border-bottom: 1px solid rgba(var(--v-theme-borderColor));
@media screen and (max-width:991px) {
border-inline-end: 0 !important &:last-child {
} border: 0;
} }
}
.notification {
border-bottom: 1px solid rgba(var(--v-theme-borderColor)); .earning-cards {
@media screen and (max-width: 991px) {
&:last-child { .w-25 {
border: 0; width: 100% !important;
} &.border-e {
} border: 0 !important;
}
.mobile-border {
.earning-cards { border-bottom: 1px solid rgba(var(--v-theme-borderColor));
@media screen and (max-width:991px){ padding-bottom: 8px !important;
.w-25{ }
width: 100% !important;
&.border-e{
border: 0 !important;
}
.mobile-border{
border-bottom:1px solid rgba(var(--v-theme-borderColor));
padding-bottom: 8px !important;
}
} }
} }
} }
web/src/scss/pages/_editor.scss
+51 -51
View File
@@ -1,61 +1,61 @@
.ProseMirror { .ProseMirror {
padding: 20px; padding: 20px;
border: 1px solid rgb(var(--v-theme-inputBorder), 0.3); border: 1px solid rgb(var(--v-theme-inputBorder), 0.3);
border-radius: 0 0 12px 12px; border-radius: 0 0 12px 12px;
&.ProseMirror-focused { &.ProseMirror-focused {
outline-color: rgb(var(--v-theme-primary), 0.3) !important; outline-color: rgb(var(--v-theme-primary), 0.3) !important;
} }
> * + * { > * + * {
margin-top: 0.75em; margin-top: 0.75em;
} }
ul, ul,
ol { ol {
padding: 0 1rem; padding: 0 1rem;
} }
h1, h1,
h2, h2,
h3, h3,
h4, h4,
h5, h5,
h6 { h6 {
line-height: 1.1; line-height: 1.1;
} }
code {
background-color: rgba(#616161, 0.1);
color: #616161;
}
pre {
background: #0d0d0d;
color: #fff;
font-family: "JetBrainsMono", monospace;
padding: 0.75rem 1rem;
border-radius: 0.5rem;
code { code {
background-color: rgba(#616161, 0.1); color: inherit;
color: #616161; padding: 0;
background: none;
font-size: 0.8rem;
} }
}
pre { img {
background: #0d0d0d; max-width: 100%;
color: #fff; height: auto;
font-family: 'JetBrainsMono', monospace; }
padding: 0.75rem 1rem;
border-radius: 0.5rem;
code { blockquote {
color: inherit; padding-left: 1rem;
padding: 0; border-left: 2px solid rgba(#0d0d0d, 0.1);
background: none; }
font-size: 0.8rem;
}
}
img { hr {
max-width: 100%; border: none;
height: auto; border-top: 2px solid rgba(#0d0d0d, 0.1);
} margin: 2rem 0;
}
blockquote {
padding-left: 1rem;
border-left: 2px solid rgba(#0d0d0d, 0.1);
}
hr {
border: none;
border-top: 2px solid rgba(#0d0d0d, 0.1);
margin: 2rem 0;
}
} }