diff --git a/package.json b/package.json index aef3e01d..1688aa2f 100644 --- a/package.json +++ b/package.json @@ -9,22 +9,18 @@ "test": "eslint ./resources/scripts --ext .js,.vue" }, "devDependencies": { - "@rvxlab/tailwind-plugin-ios-full-height": "^1.1.0", - "@tailwindcss/aspect-ratio": "^0.4.2", "@tailwindcss/forms": "^0.5.10", "@tailwindcss/typography": "^0.5.16", - "@vitejs/plugin-vue": "^5.2.1", + "@tailwindcss/vite": "^4.0.0", + "@vitejs/plugin-vue": "^6.0.0", "@vue/compiler-sfc": "^3.5.13", - "autoprefixer": "^10.4.20", "cross-env": "^7.0.3", "eslint": "^9.18.0", "eslint-config-prettier": "^9.1.0", "eslint-plugin-vue": "^9.32.0", - "postcss": "^8.4.49", "prettier": "^3.4.2", - "sass": "^1.83.1", - "tailwind-scrollbar": "^3.1.0", - "tailwindcss": "^3.4.17" + "tailwind-scrollbar": "^4.0.0", + "tailwindcss": "^4.0.0" }, "dependencies": { "@headlessui/vue": "^1.7.23", @@ -45,7 +41,7 @@ "axios": "^1", "chart.js": "^2.9.4", "guid": "^0.0.12", - "laravel-vite-plugin": "^1.1.1", + "laravel-vite-plugin": "^3.0.0", "lodash": "^4.17.21", "maska": "^3.0.4", "mini-svg-data-uri": "^1.4.4", @@ -54,7 +50,7 @@ "pinia": "^2.3.0", "v-money3": "^3.24.1", "v-tooltip": "^4.0.0-beta.17", - "vite": "^6.0.7", + "vite": "^8.0.0", "vue": "^3.5", "vue-flatpickr-component": "^11.0.5", "vue-i18n": "^11.0.1", diff --git a/postcss.config.cjs b/postcss.config.cjs deleted file mode 100644 index 61bb5f95..00000000 --- a/postcss.config.cjs +++ /dev/null @@ -1,7 +0,0 @@ -// postcss.config.js -module.exports = { - plugins: { - tailwindcss: {}, - autoprefixer: {}, - }, -} diff --git a/resources/sass/components/animation.scss b/resources/css/components/animation.css similarity index 100% rename from resources/sass/components/animation.scss rename to resources/css/components/animation.css diff --git a/resources/css/components/pace-loader.css b/resources/css/components/pace-loader.css new file mode 100644 index 00000000..0ec870df --- /dev/null +++ b/resources/css/components/pace-loader.css @@ -0,0 +1,56 @@ +.pace { + -webkit-pointer-events: none; + pointer-events: none; + -webkit-user-select: none; + -moz-user-select: none; + user-select: none; +} + +.pace-inactive { + display: none; +} + +.pace .pace-progress { + background: #3f39ad; + position: fixed; + z-index: 2000; + top: 0; + right: 100%; + width: 100%; + height: 2px; +} + +.pace .pace-progress-inner { + display: block; + position: absolute; + right: 0px; + width: 100px; + height: 100%; + box-shadow: 0 0 10px #5851d8, 0 0 5px #5851d8; + opacity: 1; + transform: rotate(3deg) translate(0px, -4px); +} + +.pace .pace-activity { + display: block; + position: fixed; + z-index: 2000; + top: 15px; + right: 15px; + width: 14px; + height: 14px; + border: solid 2px transparent; + border-top-color: #5851d8; + border-left-color: #5851d8; + border-radius: 10px; + animation: pace-spinner 400ms linear infinite; +} + +@keyframes pace-spinner { + 0% { + transform: rotate(0deg); + } + 100% { + transform: rotate(360deg); + } +} diff --git a/resources/sass/components/v-tooltips.scss b/resources/css/components/v-tooltips.css similarity index 94% rename from resources/sass/components/v-tooltips.scss rename to resources/css/components/v-tooltips.css index 5c665e03..b6c6164b 100644 --- a/resources/sass/components/v-tooltips.scss +++ b/resources/css/components/v-tooltips.css @@ -80,18 +80,16 @@ } &.popover { - $color: #f9f9f9; - .popover-inner { - background: $color; + background: #f9f9f9; color: black; padding: 24px; border-radius: 5px; - box-shadow: 0 5px 30px rgba(black, .1); + box-shadow: 0 5px 30px rgba(0, 0, 0, 0.1); } .popover-arrow { - border-color: $color; + border-color: #f9f9f9; } } diff --git a/resources/css/invoiceshelf.css b/resources/css/invoiceshelf.css new file mode 100644 index 00000000..eb8a2b27 --- /dev/null +++ b/resources/css/invoiceshelf.css @@ -0,0 +1,98 @@ +@import "tailwindcss"; +@import "./themes.css"; +@import "./components/animation.css"; +@import "./components/pace-loader.css"; +@import "./components/v-tooltips.css"; + +@plugin "@tailwindcss/forms"; +@plugin "@tailwindcss/typography"; +@plugin "tailwind-scrollbar"; + +@source "../scripts/**/*.vue"; +@source "../scripts/**/*.js"; +@source "../../resources/views/**/*.php"; + +@theme inline { + --color-primary-50: var(--color-primary-50); + --color-primary-100: var(--color-primary-100); + --color-primary-200: var(--color-primary-200); + --color-primary-300: var(--color-primary-300); + --color-primary-400: var(--color-primary-400); + --color-primary-500: var(--color-primary-500); + --color-primary-600: var(--color-primary-600); + --color-primary-700: var(--color-primary-700); + --color-primary-800: var(--color-primary-800); + --color-primary-900: var(--color-primary-900); + --color-primary-950: var(--color-primary-950); + --color-black: #040405; +} + +@theme { + --spacing-88: 22rem; + --font-base: Poppins, sans-serif; +} + +@utility bg-multiselect-caret { + background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='h-5 w-5' viewBox='0 0 20 20' fill='currentColor'%3E%3Cpath fill-rule='evenodd' d='M10 3a1 1 0 01.707.293l3 3a1 1 0 01-1.414 1.414L10 5.414 7.707 7.707a1 1 0 01-1.414-1.414l3-3A1 1 0 0110 3zm-3.707 9.293a1 1 0 011.414 0L10 14.586l2.293-2.293a1 1 0 011.414 1.414l-3 3a1 1 0 01-1.414 0l-3-3a1 1 0 010-1.414z' clip-rule='evenodd'/%3E%3C/svg%3E"); +} + +@utility bg-multiselect-spinner { + background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 512 512' fill='%234a3dff' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M456.433 371.72l-27.79-16.045c-7.192-4.152-10.052-13.136-6.487-20.636 25.82-54.328 23.566-118.602-6.768-171.03-30.265-52.529-84.802-86.621-144.76-91.424C262.35 71.922 256 64.953 256 56.649V24.56c0-9.31 7.916-16.609 17.204-15.96 81.795 5.717 156.412 51.902 197.611 123.408 41.301 71.385 43.99 159.096 8.042 232.792-4.082 8.369-14.361 11.575-22.424 6.92z'/%3E%3C/svg%3E"); +} + +@utility bg-multiselect-remove { + background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 320 512' fill='white' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M207.6 256l107.72-107.72c6.23-6.23 6.23-16.34 0-22.58l-25.03-25.03c-6.23-6.23-16.34-6.23-22.58 0L160 208.4 52.28 100.68c-6.23-6.23-16.34-6.23-22.58 0L4.68 125.7c-6.23 6.23-6.23 16.34 0 22.58L112.4 256 4.68 363.72c-6.23 6.23-6.23 16.34 0 22.58l25.03 25.03c6.23 6.23 16.34 6.23 22.58 0L160 303.6l107.72 107.72c6.23 6.23 16.34 6.23 22.58 0l25.03-25.03c6.23-6.23 6.23-16.34 0-22.58L207.6 256z'/%3E%3C/svg%3E"); +} + +@font-face { + font-family: "Poppins"; + font-style: normal; + font-weight: 400; + font-display: swap; + src: url("$fonts/Poppins-Black.ttf") format("truetype"); +} + +@font-face { + font-family: "Poppins"; + font-style: normal; + font-weight: 300; + font-display: swap; + src: url("$fonts/Poppins-Light.ttf") format("truetype"); +} + +@font-face { + font-family: "Poppins"; + font-style: normal; + font-weight: 500; + font-display: swap; + src: url("$fonts/Poppins-Medium.ttf") format("truetype"); +} + +@font-face { + font-family: "Poppins"; + font-style: normal; + font-weight: 400; + font-display: swap; + src: url("$fonts/Poppins-Regular.ttf") format("truetype"); +} + +@font-face { + font-family: "Poppins"; + font-style: normal; + font-weight: 600; + font-display: swap; + src: url("$fonts/Poppins-SemiBold.ttf") format("truetype"); +} + +body { + min-height: 100vh; + min-height: -webkit-fill-available; +} + +html { + height: -webkit-fill-available; +} + +.h-screen-ios { + height: -webkit-fill-available; +} diff --git a/resources/css/themes.css b/resources/css/themes.css new file mode 100644 index 00000000..e911544e --- /dev/null +++ b/resources/css/themes.css @@ -0,0 +1,13 @@ +:root { + --color-primary-50: rgb(241, 243, 255); + --color-primary-100: rgb(229, 231, 255); + --color-primary-200: rgb(206, 209, 255); + --color-primary-300: rgb(167, 170, 255); + --color-primary-400: rgb(118, 117, 255); + --color-primary-500: rgb(74, 61, 255); + --color-primary-600: rgb(51, 22, 255); + --color-primary-700: rgb(33, 4, 253); + --color-primary-800: rgb(27, 3, 211); + --color-primary-900: rgb(25, 5, 173); + --color-primary-950: rgb(9, 0, 118); +} diff --git a/resources/sass/components/pace-loader.scss b/resources/sass/components/pace-loader.scss deleted file mode 100644 index 33999964..00000000 --- a/resources/sass/components/pace-loader.scss +++ /dev/null @@ -1,112 +0,0 @@ -$pace-loader-color: #5851d8; - -.pace { - -webkit-pointer-events: none; - pointer-events: none; - -webkit-user-select: none; - -moz-user-select: none; - user-select: none; -} - -.pace-inactive { - display: none; -} - -.pace .pace-progress { - background: darken($pace-loader-color, 10%); - position: fixed; - z-index: 2000; - top: 0; - right: 100%; - width: 100%; - height: 2px; -} - -.pace .pace-progress-inner { - display: block; - position: absolute; - right: 0px; - width: 100px; - height: 100%; - box-shadow: 0 0 10px $pace-loader-color, 0 0 5px $pace-loader-color; - opacity: 1; - -webkit-transform: rotate(3deg) translate(0px, -4px); - -moz-transform: rotate(3deg) translate(0px, -4px); - -ms-transform: rotate(3deg) translate(0px, -4px); - -o-transform: rotate(3deg) translate(0px, -4px); - transform: rotate(3deg) translate(0px, -4px); -} - -.pace .pace-activity { - display: block; - position: fixed; - z-index: 2000; - top: 15px; - right: 15px; - width: 14px; - height: 14px; - border: solid 2px transparent; - border-top-color: $pace-loader-color; - border-left-color: $pace-loader-color; - border-radius: 10px; - -webkit-animation: pace-spinner 400ms linear infinite; - -moz-animation: pace-spinner 400ms linear infinite; - -ms-animation: pace-spinner 400ms linear infinite; - -o-animation: pace-spinner 400ms linear infinite; - animation: pace-spinner 400ms linear infinite; -} - -@-webkit-keyframes pace-spinner { - 0% { - -webkit-transform: rotate(0deg); - transform: rotate(0deg); - } - 100% { - -webkit-transform: rotate(360deg); - transform: rotate(360deg); - } -} - -@-moz-keyframes pace-spinner { - 0% { - -moz-transform: rotate(0deg); - transform: rotate(0deg); - } - 100% { - -moz-transform: rotate(360deg); - transform: rotate(360deg); - } -} - -@-o-keyframes pace-spinner { - 0% { - -o-transform: rotate(0deg); - transform: rotate(0deg); - } - 100% { - -o-transform: rotate(360deg); - transform: rotate(360deg); - } -} - -@-ms-keyframes pace-spinner { - 0% { - -ms-transform: rotate(0deg); - transform: rotate(0deg); - } - 100% { - -ms-transform: rotate(360deg); - transform: rotate(360deg); - } -} - -@keyframes pace-spinner { - 0% { - transform: rotate(0deg); - transform: rotate(0deg); - } - 100% { - transform: rotate(360deg); - transform: rotate(360deg); - } -} diff --git a/resources/sass/invoiceshelf.scss b/resources/sass/invoiceshelf.scss deleted file mode 100644 index 52da6518..00000000 --- a/resources/sass/invoiceshelf.scss +++ /dev/null @@ -1,61 +0,0 @@ -@use "themes.scss"; -@use "components/animation.scss"; - -@tailwind base; - -@tailwind components; - -@tailwind utilities; - -@font-face { - font-family: "Poppins"; - font-style: normal; - font-weight: 400; - font-display: swap; - src: url("$fonts/Poppins-Black.ttf") format("truetype"); -} - -@font-face { - font-family: "Poppins"; - font-style: normal; - font-weight: 300; - font-display: swap; - src: url("$fonts/Poppins-Light.ttf") format("truetype"); -} - -@font-face { - font-family: "Poppins"; - font-style: normal; - font-weight: 500; - font-display: swap; - src: url("$fonts/Poppins-Medium.ttf") format("truetype"); -} - -@font-face { - font-family: "Poppins"; - font-style: normal; - font-weight: 400; - font-display: swap; - src: url("$fonts/Poppins-Regular.ttf") format("truetype"); -} - -@font-face { - font-family: "Poppins"; - font-style: normal; - font-weight: 600; - font-display: swap; - src: url("$fonts/Poppins-SemiBold.ttf") format("truetype"); -} - -body { - min-height: 100vh; - min-height: -webkit-fill-available; -} - -html { - height: -webkit-fill-available; -} - -.h-screen-ios { - height: -webkit-fill-available; -} diff --git a/resources/sass/themes.scss b/resources/sass/themes.scss deleted file mode 100644 index 7c3e8a86..00000000 --- a/resources/sass/themes.scss +++ /dev/null @@ -1,13 +0,0 @@ -:root { - --color-primary-50: 241, 243, 255; - --color-primary-100: 229, 231, 255; - --color-primary-200: 206, 209, 255; - --color-primary-300: 167, 170, 255; - --color-primary-400: 118, 117, 255; - --color-primary-500: 74, 61, 255; - --color-primary-600: 51, 22, 255; - --color-primary-700: 33, 4, 253; - --color-primary-800: 27, 3, 211; - --color-primary-900: 25, 5, 173; - --color-primary-950: 9, 0, 118; -} diff --git a/resources/scripts/admin/components/CopyInputField.vue b/resources/scripts/admin/components/CopyInputField.vue index a4995820..1227b63f 100644 --- a/resources/scripts/admin/components/CopyInputField.vue +++ b/resources/scripts/admin/components/CopyInputField.vue @@ -6,7 +6,7 @@ px-4 py-2 rounded-lg - bg-opacity-40 bg-gray-300 + bg-gray-300/40 whitespace-nowrap flex-col mt-1 @@ -33,7 +33,7 @@ h-full inset-y-0 cursor-pointer - focus:outline-none + focus:outline-hidden text-primary-500 " width="37" diff --git a/resources/scripts/admin/components/SelectNotePopup.vue b/resources/scripts/admin/components/SelectNotePopup.vue index 822a8e2c..a435e358 100644 --- a/resources/scripts/admin/components/SelectNotePopup.vue +++ b/resources/scripts/admin/components/SelectNotePopup.vue @@ -4,14 +4,14 @@ @@ -50,7 +50,7 @@ overflow-hidden rounded-md shadow-lg - ring-1 ring-black ring-opacity-5 + ring-1 ring-black/5 " >
@@ -117,7 +117,7 @@ py-3 bg-gray-200 border-none - outline-none + outline-hidden " @click="openNoteModal" > diff --git a/resources/scripts/admin/components/currency-exchange-rate/ExchangeRateBulkUpdate.vue b/resources/scripts/admin/components/currency-exchange-rate/ExchangeRateBulkUpdate.vue index 2f058ccc..3e202640 100644 --- a/resources/scripts/admin/components/currency-exchange-rate/ExchangeRateBulkUpdate.vue +++ b/resources/scripts/admin/components/currency-exchange-rate/ExchangeRateBulkUpdate.vue @@ -58,7 +58,7 @@ justify-end mt-4 pt-4 - border-t border-gray-200 border-solid border-modal-bg + border-t border-gray-200 border-solid " > diff --git a/resources/scripts/admin/components/estimate-invoice-common/CreateItemRow.vue b/resources/scripts/admin/components/estimate-invoice-common/CreateItemRow.vue index 0b0dd4c1..f0d971c1 100644 --- a/resources/scripts/admin/components/estimate-invoice-common/CreateItemRow.vue +++ b/resources/scripts/admin/components/estimate-invoice-common/CreateItemRow.vue @@ -143,7 +143,7 @@ diff --git a/resources/scripts/admin/components/estimate-invoice-common/CreateItemRowTax.vue b/resources/scripts/admin/components/estimate-invoice-common/CreateItemRowTax.vue index 222bf6dc..53c02f79 100644 --- a/resources/scripts/admin/components/estimate-invoice-common/CreateItemRowTax.vue +++ b/resources/scripts/admin/components/estimate-invoice-common/CreateItemRowTax.vue @@ -42,7 +42,7 @@