Prop	Values	Default	Description
`selectedIndex`	`index`, `null`	`0`	+ `Number`, `Object` + Specifies the index of the selected accordion. +
`tag`	`div`	`div`	+ `String` + Specifies HTML tag to use. +

Event	Description
`change`	+ This event fires immediately when there is a change in active + accordion. +

+ Size +	+ + Color + +	+ Price +	+ + + Stock + +	+ Variant Code +
Small	Black	+ + $ + + +	+ +	+ +
White	+ + $ + + +	+ +	+ +
Gray	+ + $ + + +	+ +	+ +
Medium	Black	+ + $ + + +	+ +	+ +
White	+ + $ + + +	+ +	+ +
Gray	+ + $ + + +	+ +	+ +
Large	Black	+ + $ + + +	+ +	+ +
White	+ + $ + + +	+ +	+ +
Gray	+ + $ + + +	+ +	+ +

		+ Min. +	+ Max. +	+ Unit Price +
1.	Wholesale Price 1	+ +	+ +	+ + $ + + +	+ + + +
2.	Wholesale Price 2	+ +	+ +	+ + $ + + +	+ + + +
3.	Wholesale Price 3	+ +	+ +	+ + $ + + +	+ + + +

Prop	Values	Default	Description
`show`	`true`, `false`	`false`	+ `Boolean` + Whether the Alert is open or not. +

Event	Description
`show`	+ This event fires immediately when the + show instance method is + called. +
`shown`	+ This event is fired when the alert has been made visible to + the user (will wait for CSS transitions to complete) +
`hide`	+ This event is fired immediately when the + hide instance method has + been called. +
`hidden`	+ This event is fired when the alert has finished being hidden + from the user (will wait for CSS transitions to complete). +

Slot Prop	Description
`dismiss`	Manually hides an alert.

IMAGES	CATEGORY NAME	SLUG	STATUS	ACTIONS
+ + + + + + + + + + + +	+ {{ + faker.categories[0].name + }} + + Tags: {{ faker.categories[0].tags }} + +	+ + + /categories/{{ faker.categories[0].slug }} + +	+ + + {{ faker.trueFalse[0] ? "Active" : "Inactive" }} + +	+ + + Edit + + + Delete + + +

IMAGES	PRODUCT NAME	STOCK	STATUS	ACTIONS
+ + + + + + + + + + + +	+ {{ + faker.products[0].name + }} + + {{ faker.products[0].category }} + +	{{ faker.stocks[0] }}	+ + + {{ faker.trueFalse[0] ? "Active" : "Inactive" }} + +	+ + + Edit + + + Delete + + +

IMAGES	PRODUCT NAME	STOCK	STATUS	ACTIONS
+ + + + + + + + + + + +	+ {{ + faker.products[0].name + }} + + {{ faker.products[0].category }} + +	{{ faker.stocks[0] }}	+ + + {{ faker.trueFalse[0] ? "Active" : "Inactive" }} + +	+ + + + Edit + + + Delete + + +

IMAGES	PRODUCT NAME	STOCK	STATUS	ACTIONS
+ + + + + + + + + + + +	+ {{ + faker.products[0].name + }} + + {{ faker.products[0].category }} + +	{{ faker.stocks[0] }}	+ + + {{ faker.trueFalse[0] ? "Active" : "Inactive" }} + +	+ + + + Edit + + + Delete + + +

IMAGES	PRODUCT NAME	STOCK	STATUS	ACTIONS
+ + + + + + + + + + + +	+ {{ + faker.products[0].name + }} + + {{ faker.products[0].category }} + +	{{ faker.stocks[0] }}	+ + + {{ faker.trueFalse[0] ? "Active" : "Inactive" }} + +	+ + + + Edit + + + Delete + + +

IMAGES	PRODUCT NAME	STOCK	STATUS	ACTIONS
+ + + + + + + + + + + +	+ {{ + faker.products[0].name + }} + + {{ faker.products[0].category }} + +	{{ faker.stocks[0] }}	+ + + {{ faker.trueFalse[0] ? "Active" : "Inactive" }} + +	+ + + + Edit + + + Delete + + +

Prop	Values	Default	Description
`show`	`true`, `false`	`false`	+ `Boolean` + Whether the Dropdown is open or not. +
`placement`	+ `top-start`, `top`, `top-end`, `right-start`, `right`, + `right-end`, `bottom-end`, `bottom`, `bottom-start`, + `left-start`, `left`, `left-end`, +	-	+ `String` + Dropdown position when displayed. +
`refKey`	-	`null`	+ `String` + A ref to the Dropdown element. +

Event	Description
`show`	+ This event fires immediately when the + show instance method is + called. +
`shown`	+ This event is fired when the dropdown has been made visible to + the user (will wait for CSS transitions to complete) +
`hide`	+ This event is fired immediately when the + hide instance method has + been called. +
`hidden`	+ This event is fired when the dropdown has finished being + hidden from the user (will wait for CSS transitions to + complete). +

Slot Prop	Description
`dismiss`	Manually hides a dropdown.

+ DESCRIPTION +	+ QTY +	+ PRICE +	+ SUBTOTAL +
+ + Midone HTML Admin Template + + + Regular License + +	+ 2 +	+ $25 +	+ $50 +
+ + Vuejs Admin Template + + + Regular License + +	+ 1 +	+ $25 +	+ $25 +
+ + React Admin Template + + + Regular License + +	+ 1 +	+ $25 +	+ $25 +
+ + Laravel Admin Template + + + Regular License + +	3	$25	$75

+ DESCRIPTION +	+ QTY +	+ PRICE +	+ SUBTOTAL +
+ + Midone HTML Admin Template + + + Regular License + +	+ 2 +	+ $25 +	+ $50 +
+ + Vuejs Admin Template + + + Regular License + +	+ 1 +	+ $25 +	+ $25 +
+ + React Admin Template + + + Regular License + +	+ 1 +	+ $25 +	+ $25 +
+ + Laravel Admin Template + + + Regular License + +	3	$25	$75

Prop	Values	Default	Description
`show`	`true`, `false`	`false`	+ `Boolean` + Whether the Modal is open or not. +
`size`	`modal-sm`, `modal-lg`, `modal-xl`	-	+ `String` + Size of Modal wrapper/content. +
`backdrop`	`static`	-	+ `String` + Whether the Modal backdrop is static or not. When backdrop is + set to static, the Modal will not close when clicking outside + it. +
`slideOver`	`true`, `false`	`false`	+ `Boolean` + Whether the Modal appears as a slideover or not. +
`refKey`	-	`null`	+ `String` + A ref to the Modal element. +

Event	Description
`show`	+ This event fires immediately when the + show instance method is + called. +
`shown`	+ This event is fired when the modal has been made visible to + the user (will wait for CSS transitions to complete) +
`hide`	+ This event is fired immediately when the + hide instance method has + been called. +
`hidden`	+ This event is fired when the modal has finished being hidden + from the user (will wait for CSS transitions to complete). +

Slot Prop	Description
`dismiss`	Manually hides a modal.

IMAGES	PRODUCT NAME	STOCK	PRICE	STATUS	ACTIONS
+ + + + + + + + + + + +	+ {{ + faker.products[0].name + }} + + {{ faker.products[0].category }} + +	{{ faker.stocks[0] }}	${{ faker.totals[0] }}	+ + + {{ faker.trueFalse[0] ? "Active" : "Inactive" }} + +	+ + + Edit + + + Delete + + +

#	First Name	Last Name	Username
1	Angelina	Jolie	@angelinajolie
2	Brad	Pitt	@bradpitt
3	Charlie	Hunnam	@charliehunnam

#	First Name	Last Name	Username
1	Angelina	Jolie	@angelinajolie
2	Brad	Pitt	@bradpitt
3	Charlie	Hunnam	@charliehunnam

#	First Name	Last Name	Username
1	Angelina	Jolie	@angelinajolie
2	Brad	Pitt	@bradpitt
3	Charlie	Hunnam	@charliehunnam

#	First Name	Last Name	Username
1	Angelina	Jolie	@angelinajolie
2	Brad	Pitt	@bradpitt
3	Charlie	Hunnam	@charliehunnam

#	First Name	Last Name	Username
1	Angelina	Jolie	@angelinajolie
2	Brad	Pitt	@bradpitt
3	Charlie	Hunnam	@charliehunnam

#	First Name	Last Name	Username
1	Angelina	Jolie	@angelinajolie
2	Brad	Pitt	@bradpitt
3	Charlie	Hunnam	@charliehunnam

#	First Name	Last Name	Username
1	Angelina	Jolie	@angelinajolie
2	Brad	Pitt	@bradpitt
3	Charlie	Hunnam	@charliehunnam

#	First Name	Last Name	Username
1	Angelina	Jolie	@angelinajolie
2	Brad	Pitt	@bradpitt
3	Charlie	Hunnam	@charliehunnam

#	First Name	Last Name	Username
1	Angelina	Jolie	@angelinajolie
2	Brad	Pitt	@bradpitt
3	Charlie	Hunnam	@charliehunnam

#	First Name	Last Name	Username
1	Angelina	Jolie	@angelinajolie
2	Brad	Pitt	@bradpitt
3	Charlie	Hunnam	@charliehunnam

#	First Name	Last Name	Username
1	Angelina	Jolie	@angelinajolie
2	Brad	Pitt	@bradpitt
3	Charlie	Hunnam	@charliehunnam

#	First Name	Last Name	Username
1	Angelina	Jolie	@angelinajolie
2	Brad	Pitt	@bradpitt
3	Charlie	Hunnam	@charliehunnam

#	First Name	Last Name	Username
1	Angelina	Jolie	@angelinajolie
2	Brad	Pitt	@bradpitt
3	Charlie	Hunnam	@charliehunnam

#	First Name	Last Name	Username
1	Angelina	Jolie	@angelinajolie
2	Brad	Pitt	@bradpitt
3	Charlie	Hunnam	@charliehunnam

#	First Name	Last Name	Username	Email	Address
1	Angelina	Jolie	@angelinajolie	angelinajolie@gmail.com	+ 260 W. Storm Street New York, NY 10025. +
2	Brad	Pitt	@bradpitt	bradpitt@gmail.com	+ 47 Division St. Buffalo, NY 14241. +
3	Charlie	Hunnam	@charliehunnam	charliehunnam@gmail.com	+ 8023 Amerige Street Harriman, NY 10926. +

#	First Name	Last Name	Username	Email	Address
1	Angelina	Jolie	@angelinajolie	angelinajolie@gmail.com	+ 260 W. Storm Street New York, NY 10025. +
2	Brad	Pitt	@bradpitt	bradpitt@gmail.com	+ 47 Division St. Buffalo, NY 14241. +
3	Charlie	Hunnam	@charliehunnam	charliehunnam@gmail.com	+ 8023 Amerige Street Harriman, NY 10926. +

#	First Name	Last Name	Username
1	Angelina	Jolie	@angelinajolie
2	Brad	Pitt	@bradpitt
3	Charlie	Hunnam	@charliehunnam

#	First Name	Last Name	Username
1	Angelina	Jolie	@angelinajolie
2	Brad	Pitt	@bradpitt
3	Charlie	Hunnam	@charliehunnam

#	First Name	Last Name	Username
1	Angelina	Jolie	@angelinajolie
2	Brad	Pitt	@bradpitt
3	Charlie	Hunnam	@charliehunnam

#	First Name	Last Name	Username
1	Angelina	Jolie	@angelinajolie
2	Brad	Pitt	@bradpitt
3	Charlie	Hunnam	@charliehunnam

+ +	PRODUCT	NAME	RATING	POSTED TIME	STATUS	ACTIONS
+ +	+ + + + + {{ + faker.products[0].name + }} + +	+ {{ faker.users[0].name }} +	+ + + + + + + + + (4.5+) + +	+ {{ faker.formattedTimes[0] }} +	+ + + {{ faker.trueFalse[0] ? "Active" : "Removed" }} + +	+ + + View Details + + +

+ +	SELLER	STORE	GENDER	STATUS	TOTAL PRODUCTS	ACTIONS
+ +	+ + + + + + {{ + faker.users[0].name + }} + + {{ faker.users[0].email }} + + + +	+ {{ + ["Themeforest", "Codecanyon", "Graphicriver"][$_.random(0, 2)] + }} +	+ {{ faker.users[0].gender }} +	+ + + {{ faker.trueFalse[0] ? "Active" : "Inactive" }} + +	{{ faker.totals[0] }} Items	+ + + Edit + + + Delete + + +

Prop	Values	Default	Description
`show`	`true`, `false`	`false`	+ `Boolean` + Whether the Modal is open or not. +
`size`	`modal-sm`, `modal-lg`, `modal-xl`	-	+ `String` + Size of Modal wrapper/content. +
`backdrop`	`static`	-	+ `String` + Whether the Modal backdrop is static or not. When backdrop is + set to static, the Modal will not close when clicking outside + it. +
`slideOver`	`true`, `false`	`false`	+ `Boolean` + Whether the Modal appears as a slideover or not. +
`refKey`	-	`null`	+ `String` + A ref to the Modal element. +

Event	Description
`show`	+ This event fires immediately when the + show instance method is + called. +
`shown`	+ This event is fired when the modal has been made visible to + the user (will wait for CSS transitions to complete) +
`hide`	+ This event is fired immediately when the + hide instance method has + been called. +
`hidden`	+ This event is fired when the modal has finished being hidden + from the user (will wait for CSS transitions to complete). +

Slot Prop	Description
`dismiss`	Manually hides a modal.

Prop	Values	Default	Description
`selectedIndex`	`index`	`0`	+ `Number` + Specifies the index of the selected tab. +
`tag`	`div`	`div`	+ `String` + Specifies HTML tag to use. +

Event	Description
`change`	+ This event fires immediately when there is a change in + active tab. +

Prop	Values	Default	Description
`fullWidth`	`true`, `false`	`true`	+ `Boolean` + Whether the Tab appears as full width or not. +
`tag`	`a`	`a`	+ `String` + Specifies HTML tag to use. +

commit 3b432c97d4519d30f7c7fb889e557aa2301202c1 Author: Komek Hayytnazarov Date: Sat Jul 2 18:27:23 2022 +0500 first commit diff --git a/README.md b/README.md new file mode 100644 index 0000000..c0793a8 --- /dev/null +++ b/README.md @@ -0,0 +1,7 @@ +# Vue 3 + Vite + +This template should help get you started developing with Vue 3 in Vite. The template uses Vue 3 ` + + diff --git a/package.json b/package.json new file mode 100644 index 0000000..956615f --- /dev/null +++ b/package.json @@ -0,0 +1,57 @@ +{ + "name": "icewall-vue", + "version": "0.0.0", + "scripts": { + "dev": "vite", + "build": "vite build", + "preview": "vite preview" + }, + "dependencies": { + "@ckeditor/ckeditor5-build-balloon": "^29.1.0", + "@ckeditor/ckeditor5-build-balloon-block": "^29.1.0", + "@ckeditor/ckeditor5-build-classic": "^29.1.0", + "@ckeditor/ckeditor5-build-decoupled-document": "^29.1.0", + "@ckeditor/ckeditor5-build-inline": "^29.1.0", + "@fullcalendar/core": "^5.5.1", + "@fullcalendar/daygrid": "^5.5.0", + "@fullcalendar/interaction": "^5.5.0", + "@fullcalendar/list": "^5.5.0", + "@fullcalendar/timegrid": "^5.5.1", + "@googlemaps/js-api-loader": "^1.11.4", + "@googlemaps/markerclustererplus": "^1.1.0", + "@left4code/tw-starter": "^3.1.35", + "@popperjs/core": "^2.7.0", + "@vuelidate/core": "^2.0.0-alpha.12", + "@vuelidate/validators": "^2.0.0-alpha.11", + "chart.js": "^3.7.1", + "dayjs": "^1.10.4", + "dropzone": "^5.7.6", + "highlight.js": "^10.6.0", + "js-beautify": "^1.13.5", + "litepicker": "^2.0.11", + "lucide": "^0.17.3", + "lucide-vue-next": "^0.17.3", + "pinia": "^2.0.9", + "simplebar": "^5.3.6", + "tabulator-tables": "^4.9.3", + "tiny-slider": "^2.9.3", + "tippy.js": "^6.2.7", + "toastify-js": "^1.9.3", + "tom-select": "^1.7.5", + "vue": "^3.2.25", + "vue-router": "4", + "xlsx": "^0.16.9", + "zoom-vanilla.js": "^2.0.6" + }, + "devDependencies": { + "@tailwindcss/forms": "^0.5.1", + "@vitejs/plugin-vue": "^2.0.0", + "autoprefixer": "10.4.6", + "lodash": "^4.17.21", + "postcss": "^8.4.5", + "postcss-advanced-variables": "^3.0.1", + "postcss-import": "^14.0.2", + "tailwindcss": "^3.0.24", + "vite": "^2.7.2" + } +} diff --git a/postcss.config.js b/postcss.config.js new file mode 100755 index 0000000..3fd95b3 --- /dev/null +++ b/postcss.config.js @@ -0,0 +1,9 @@ +module.exports = { + plugins: [ + require("postcss-import"), + require("postcss-advanced-variables"), + require("tailwindcss/nesting"), + require("tailwindcss")("./tailwind.config.js"), + require("autoprefixer"), + ], +}; diff --git a/public/favicon.ico b/public/favicon.ico new file mode 100644 index 0000000..df36fcf Binary files /dev/null and b/public/favicon.ico differ diff --git a/src/.DS_Store b/src/.DS_Store new file mode 100644 index 0000000..ae22730 Binary files /dev/null and b/src/.DS_Store differ diff --git a/src/App.vue b/src/App.vue new file mode 100644 index 0000000..98240ae --- /dev/null +++ b/src/App.vue @@ -0,0 +1,3 @@ + diff --git a/src/assets/.DS_Store b/src/assets/.DS_Store new file mode 100644 index 0000000..3207e04 Binary files /dev/null and b/src/assets/.DS_Store differ diff --git a/src/assets/css/.DS_Store b/src/assets/css/.DS_Store new file mode 100755 index 0000000..e07a551 Binary files /dev/null and b/src/assets/css/.DS_Store differ diff --git a/src/assets/css/_colors.css b/src/assets/css/_colors.css new file mode 100644 index 0000000..a43f837 --- /dev/null +++ b/src/assets/css/_colors.css @@ -0,0 +1,102 @@ +/* Default colors */ +:root { + --color-primary: theme("colors.rgb.blue.900"); + --color-secondary: theme("colors.rgb.slate.200"); + --color-success: theme("colors.rgb.teal.600"); + --color-info: theme("colors.rgb.cyan.500"); + --color-warning: theme("colors.rgb.amber.500"); + --color-pending: theme("colors.rgb.orange.500"); + --color-danger: theme("colors.rgb.red.700"); + --color-light: theme("colors.rgb.slate.100"); + --color-dark: theme("colors.rgb.slate.800"); + --color-slate-50: theme("colors.rgb.slate.50"); + --color-slate-100: theme("colors.rgb.slate.100"); + --color-slate-200: theme("colors.rgb.slate.200"); + --color-slate-300: theme("colors.rgb.slate.300"); + --color-slate-400: theme("colors.rgb.slate.400"); + --color-slate-500: theme("colors.rgb.slate.500"); + --color-slate-600: theme("colors.rgb.slate.600"); + --color-slate-700: theme("colors.rgb.slate.700"); + --color-slate-800: theme("colors.rgb.slate.800"); + --color-slate-900: theme("colors.rgb.slate.900"); +} + +/* Default dark-mode colors */ +.dark { + --color-primary: theme("colors.rgb.blue.800"); + --color-slate-500: theme("colors.rgb.slate.400"); + --color-darkmode-50: 87 103 132; + --color-darkmode-100: 74 90 121; + --color-darkmode-200: 65 81 114; + --color-darkmode-300: 53 69 103; + --color-darkmode-400: 48 61 93; + --color-darkmode-500: 41 53 82; + --color-darkmode-600: 40 51 78; + --color-darkmode-700: 35 45 69; + --color-darkmode-800: 27 37 59; + --color-darkmode-900: 15 23 42; +} + +/* Theme 1 colors */ +.theme-1 { + --color-primary: theme("colors.rgb.emerald.900"); + --color-secondary: theme("colors.rgb.slate.200"); + --color-success: theme("colors.rgb.emerald.600"); + --color-info: theme("colors.rgb.cyan.500"); + --color-warning: theme("colors.rgb.yellow.400"); + --color-pending: theme("colors.rgb.amber.500"); + --color-danger: theme("colors.rgb.rose.600"); + --color-light: theme("colors.rgb.slate.100"); + --color-dark: theme("colors.rgb.slate.800"); + &.dark { + --color-primary: theme("colors.rgb.emerald.800"); + } +} + +/* Theme 2 colors */ +.theme-2 { + --color-primary: theme("colors.rgb.blue.800"); + --color-secondary: theme("colors.rgb.slate.200"); + --color-success: theme("colors.rgb.lime.500"); + --color-info: theme("colors.rgb.cyan.500"); + --color-warning: theme("colors.rgb.yellow.400"); + --color-pending: theme("colors.rgb.orange.500"); + --color-danger: theme("colors.rgb.red.600"); + --color-light: theme("colors.rgb.slate.100"); + --color-dark: theme("colors.rgb.slate.800"); + &.dark { + --color-primary: theme("colors.rgb.blue.700"); + } +} + +/* Theme 3 colors */ +.theme-3 { + --color-primary: theme("colors.rgb.cyan.900"); + --color-secondary: theme("colors.rgb.slate.200"); + --color-success: theme("colors.rgb.teal.600"); + --color-info: theme("colors.rgb.cyan.500"); + --color-warning: theme("colors.rgb.amber.500"); + --color-pending: theme("colors.rgb.amber.600"); + --color-danger: theme("colors.rgb.red.700"); + --color-light: theme("colors.rgb.slate.100"); + --color-dark: theme("colors.rgb.slate.800"); + &.dark { + --color-primary: theme("colors.rgb.cyan.800"); + } +} + +/* Theme 4 colors */ +.theme-4 { + --color-primary: theme("colors.rgb.indigo.900"); + --color-secondary: theme("colors.rgb.slate.200"); + --color-success: theme("colors.rgb.emerald.600"); + --color-info: theme("colors.rgb.cyan.500"); + --color-warning: theme("colors.rgb.yellow.500"); + --color-pending: theme("colors.rgb.orange.600"); + --color-danger: theme("colors.rgb.red.700"); + --color-light: theme("colors.rgb.slate.100"); + --color-dark: theme("colors.rgb.slate.800"); + &.dark { + --color-primary: theme("colors.rgb.indigo.700"); + } +} diff --git a/src/assets/css/_tailwind.css b/src/assets/css/_tailwind.css new file mode 100755 index 0000000..b5c61c9 --- /dev/null +++ b/src/assets/css/_tailwind.css @@ -0,0 +1,3 @@ +@tailwind base; +@tailwind components; +@tailwind utilities; diff --git a/src/assets/css/app.css b/src/assets/css/app.css new file mode 100755 index 0000000..e0914e7 --- /dev/null +++ b/src/assets/css/app.css @@ -0,0 +1,150 @@ +/* + |-------------------------------------------------------------------------- + | TailwindCSS Directives + |-------------------------------------------------------------------------- + | + | Import TailwindCSS directives and swipe out at build-time with all of + | the styles it generates based on your configured design system. + | + | Please check this link for more details: + | https://tailwindcss.com/docs/installation#include-tailwind-in-your-css + | + */ +@import "./_tailwind.css"; + +/* + |-------------------------------------------------------------------------- + | Colors + |-------------------------------------------------------------------------- + | + | Configuration of the main and dark-mode colors. + | + | Please check this link for more details: + | https://tailwindcss.com/docs/customizing-colors#using-css-variables + | + */ +@import "./_colors.css"; + +/* + |-------------------------------------------------------------------------- + | Fonts + |-------------------------------------------------------------------------- + | + | Import all fonts used in the template, the font configuration can be + | seen in "tailwind.config.js". + | + | Please check this link for more details: + | https://tailwindcss.com/docs/theme + | + */ +@import "./fonts/_roboto.css"; + +/* + |-------------------------------------------------------------------------- + | Mixins + |-------------------------------------------------------------------------- + | + | Import helper mixins. + | + */ +@import "@left4code/tw-starter/dist/css/mixins/_media.css"; + +/* + |-------------------------------------------------------------------------- + | 3rd Party Libraries + |-------------------------------------------------------------------------- + | + | Import 3rd party library CSS files. + | + */ +@import "@left4code/tw-starter/dist/css/_breadcrumb.css"; +@import "@left4code/tw-starter/dist/css/_accordion.css"; +@import "@left4code/tw-starter/dist/css/_alert.css"; +@import "@left4code/tw-starter/dist/css/_btn.css"; +@import "@left4code/tw-starter/dist/css/_dropdown.css"; +@import "@left4code/tw-starter/dist/css/_file.css"; +@import "@left4code/tw-starter/dist/css/_form-reset.css"; +@import "@left4code/tw-starter/dist/css/_form-check.css"; +@import "@left4code/tw-starter/dist/css/_form-control.css"; +@import "@left4code/tw-starter/dist/css/_form-help.css"; +@import "@left4code/tw-starter/dist/css/_form-inline.css"; +@import "@left4code/tw-starter/dist/css/_form-label.css"; +@import "@left4code/tw-starter/dist/css/_form-select.css"; +@import "@left4code/tw-starter/dist/css/_image-fit.css"; +@import "@left4code/tw-starter/dist/css/_input-group.css"; +@import "@left4code/tw-starter/dist/css/_intro.css"; +@import "@left4code/tw-starter/dist/css/_modal.css"; +@import "@left4code/tw-starter/dist/css/_pagination.css"; +@import "@left4code/tw-starter/dist/css/_progress.css"; +@import "@left4code/tw-starter/dist/css/_scrollbar.css"; +@import "@left4code/tw-starter/dist/css/_tab.css"; +@import "@left4code/tw-starter/dist/css/_table.css"; +@import "@left4code/tw-starter/dist/css/_typing-dots.css"; +@import "@left4code/tw-starter/dist/css/_zoom-in.css"; +@import "@left4code/tw-starter/dist/css/_box.css"; +@import "highlight.js/styles/github.css"; +@import "tippy.js/dist/tippy.css"; +@import "tippy.js/themes/light.css"; +@import "tippy.js/dist/svg-arrow.css"; +@import "tippy.js/animations/shift-away.css"; +@import "toastify-js/src/toastify.css"; +@import "dropzone/dist/dropzone.css"; +@import "zoom-vanilla.js/dist/zoom.css"; +@import "tabulator-tables/dist/css/tabulator.css"; +@import "tom-select/dist/css/tom-select.css"; +@import "tiny-slider/dist/tiny-slider.css"; +@import "simplebar/src/simplebar.css"; + +/* + |-------------------------------------------------------------------------- + | Components + |-------------------------------------------------------------------------- + | + | Import CSS/SCSS components. + | + */ +@import "components/_global.css"; +@import "components/_wrapper.css"; +@import "components/_main.css"; +@import "components/_login.css"; +@import "components/_table-report.css"; +@import "components/_report-chart.css"; +@import "components/_search.css"; +@import "components/_notification.css"; +@import "components/_report-box.css"; +@import "components/_report-box-2.css"; +@import "components/_report-box-3.css"; +@import "components/_report-box-4.css"; +@import "components/_content.css"; +@import "components/_top-nav.css"; +@import "components/_side-nav.css"; +@import "components/_breadcrumb.css"; +@import "components/_toastify.css"; +@import "components/_toastify-content.css"; +@import "components/_lucide-icon.css"; +@import "components/_mobile-menu.css"; +@import "components/_inbox-filter.css"; +@import "components/_inbox.css"; +@import "components/_chat.css"; +@import "components/_chat-dropdown.css"; +@import "components/_news.css"; +@import "components/_pricing-tabs.css"; +@import "components/_error-page.css"; +@import "components/_search-result.css"; +@import "components/_notification-content.css"; +@import "components/_report-maps.css"; +@import "components/_pos-dropdown.css"; +@import "components/_post.css"; +@import "components/_litepicker.css"; +@import "components/_tiny-slider.css"; +@import "components/_tippy.css"; +@import "components/_tabulator.css"; +@import "components/_tom-select.css"; +@import "components/_dropzone.css"; +@import "components/_ckeditor.css"; +@import "components/_zoom-vanilla.css"; +@import "components/_dark-mode-switcher.css"; +@import "components/_hljs.css"; +@import "components/_source-preview.css"; +@import "components/_full-calendar.css"; +@import "components/_pristine.css"; diff --git a/src/assets/css/components/.DS_Store b/src/assets/css/components/.DS_Store new file mode 100644 index 0000000..d9f8876 Binary files /dev/null and b/src/assets/css/components/.DS_Store differ diff --git a/src/assets/css/components/_breadcrumb.css b/src/assets/css/components/_breadcrumb.css new file mode 100755 index 0000000..4ba4027 --- /dev/null +++ b/src/assets/css/components/_breadcrumb.css @@ -0,0 +1,11 @@ +.breadcrumb { + &.breadcrumb-light { + @apply h-full ml-10 pl-10 border-l border-white/[0.08]; + .active { + @apply !text-white/70; + } + @include media-breakpoint-down(md) { + @apply ml-0 pl-0 border-l-0; + } + } +} diff --git a/src/assets/css/components/_chat-dropdown.css b/src/assets/css/components/_chat-dropdown.css new file mode 100755 index 0000000..64c5731 --- /dev/null +++ b/src/assets/css/components/_chat-dropdown.css @@ -0,0 +1,13 @@ +.chat-dropdown { + @apply w-[320px] -mt-[364px]; + .chat-dropdown__box { + @apply h-[364px]; + .chat-dropdown__box__tabs { + .nav-item .nav-link { + &.active { + @apply bg-slate-200 border-b-0 text-slate-600 dark:bg-darkmode-300 dark:text-slate-300; + } + } + } + } +} diff --git a/src/assets/css/components/_chat.css b/src/assets/css/components/_chat.css new file mode 100755 index 0000000..ec02eec --- /dev/null +++ b/src/assets/css/components/_chat.css @@ -0,0 +1,20 @@ +.chat { + .chat__chat-list { + @apply h-[525px]; + } + .chat__user-list { + @apply h-[525px]; + } + .chat__box { + @apply h-[782px]; + .chat__box__text-box { + @apply max-w-[49%]; + @include media-breakpoint-down(sm) { + @apply max-w-[90%]; + } + } + } + .chat__box__input { + @apply h-[46px]; + } +} diff --git a/src/assets/css/components/_ckeditor.css b/src/assets/css/components/_ckeditor.css new file mode 100644 index 0000000..0b1b8d8 --- /dev/null +++ b/src/assets/css/components/_ckeditor.css @@ -0,0 +1,279 @@ +.ck-editor, +.document-editor, +.ck-editor__editable { + @apply shadow-sm; +} + +.document-editor { + display: flex; + max-height: 700px; + flex-flow: column nowrap; + border-radius: var(--ck-border-radius); + @apply border border-slate-200; + .document-editor__toolbar { + z-index: 1; + @apply border-b border-slate-200; + } + .document-editor__toolbar .ck-toolbar { + border: 0; + border-radius: 0; + @apply bg-slate-100; + .ck-icon { + width: 16px; + } + } + .document-editor__editable-container { + overflow-y: scroll; + padding: calc(2 * var(--ck-spacing-large)); + @apply bg-slate-100; + } + .document-editor__editable-container .ck-editor__editable { + width: 15.8cm; + margin: 0 auto; + min-height: 21cm; + background: white; + padding: 1cm 2cm 2cm; + border-radius: var(--ck-border-radius); + @apply border border-slate-200 shadow-md; + } + .ck-heading-dropdown .ck-list .ck-button__label { + line-height: calc( + 1.7 * var(--ck-line-height-base) * var(--ck-font-size-base) + ); + min-width: 6em; + } + .ck-heading-dropdown + .ck-list + .ck-button:not(.ck-heading_paragraph) + .ck-button__label { + transform: scale(0.8); + transform-origin: left; + } + .ck-content h2, + .ck-heading-dropdown .ck-heading_heading1 .ck-button__label { + font-size: 2.18em; + font-weight: normal; + } + .ck-content h2 { + line-height: 1.37em; + padding-top: 0.342em; + margin-bottom: 0.142em; + } + .ck-content h3, + .ck-heading-dropdown .ck-heading_heading2 .ck-button__label { + font-size: 1.75em; + font-weight: normal; + color: hsl(203, 100%, 50%); + } + .ck-heading-dropdown .ck-heading_heading2.ck-on .ck-button__label { + color: var(--ck-color-list-button-on-text); + } + .ck-content h3 { + line-height: 1.86em; + padding-top: 0.171em; + margin-bottom: 0.357em; + } + .ck-content h4, + .ck-heading-dropdown .ck-heading_heading3 .ck-button__label { + font-size: 1.31em; + font-weight: bold; + } + .ck-content h4 { + line-height: 1.24em; + padding-top: 0.286em; + margin-bottom: 0.952em; + } + .ck-content p { + font-size: 1em; + line-height: 1.63em; + padding-top: 0.5em; + margin-bottom: 1.13em; + } + .ck-content blockquote { + font-family: Georgia, serif; + margin-left: calc(2 * var(--ck-spacing-large)); + margin-right: calc(2 * var(--ck-spacing-large)); + } +} + +.ck.ck-content { + min-height: 250px; + &.ck-editor__editable_inline { + @apply border border-slate-200; + } +} + +.ck .ck { + .ck-content { + @apply min-h-[250px]; + &.ck-editor__editable_inline { + @apply border border-slate-200; + } + blockquote, + dl, + dd, + h1, + h2, + h3, + h4, + h5, + h6, + hr, + figure, + p, + pre { + margin: revert; + } + ol, + ul { + list-style: revert; + margin: revert; + padding: revert; + } + h1, + h2, + h3, + h4, + h5, + h6 { + font-size: revert; + font-weight: revert; + } + img, + svg, + video, + canvas, + audio, + iframe, + embed, + object { + display: revert; + vertical-align: revert; + } + } + &.ck-reset_all, + &.ck-reset_all * { + @apply text-slate-800; + } + &.ck-toolbar, + &.ck-balloon-panel { + @apply bg-slate-100 border-slate-200; + .ck-icon { + @apply w-[16px]; + } + } + &.ck-editor__main > .ck-editor__editable:not(.ck-focused) { + @apply border-slate-200; + } + &.ck-button:not(.ck-disabled):hover, + &a.ck-button:not(.ck-disabled):hover { + @apply bg-slate-200; + } +} + +.dark { + .document-editor { + @apply border-darkmode-900/30; + .document-editor__toolbar { + @apply border-darkmode-900/20; + } + .document-editor__toolbar .ck-toolbar { + @apply bg-darkmode-900/20; + .ck-toolbar__separator { + @apply bg-darkmode-800; + } + .ck-tooltip .ck-tooltip__text { + @apply text-slate-200 bg-darkmode-800; + &:after { + @apply border-b-darkmode-800; + } + } + .ck.ck-icon :not([fill]) { + @apply fill-slate-300; + } + .ck.ck-dropdown__panel { + @apply border-darkmode-800; + } + .ck.ck-button.ck-on, + a.ck.ck-button.ck-on { + @apply bg-darkmode-800; + } + } + .document-editor__editable-container { + @apply bg-darkmode-600; + } + .document-editor__editable-container .ck-editor__editable { + @apply border-darkmode-900/20 bg-darkmode-800; + } + } + + .ck.ck-content.ck-editor__editable_inline { + @apply border-darkmode-900/20 bg-darkmode-800; + } + + .ck { + &.ck-list { + @apply bg-darkmode-800; + } + &.ck-dropdown__panel { + @apply bg-darkmode-800 border-darkmode-800; + } + &.ck.ck-input-text { + @apply bg-darkmode-400 border-darkmode-400; + &:focus { + @apply shadow-none; + } + } + .ck-insert-table-dropdown-grid-box { + @apply border-darkmode-400; + } + &.ck-reset_all, + &.ck-reset_all * { + @apply !text-slate-300; + } + .ck { + .ck-content.ck-editor__editable_inline { + @apply border-darkmode-900/20 bg-darkmode-800; + } + &.ck-toolbar, + &.ck-balloon-panel { + @apply bg-darkmode-700 border-darkmode-900/20; + &:before { + @apply !border-b-darkmode-900/20; + } + &:after { + @apply !border-b-darkmode-900/20; + } + .ck-toolbar__separator { + @apply bg-darkmode-800; + } + .ck-tooltip .ck-tooltip__text { + @apply text-slate-200 bg-darkmode-800; + &:after { + @apply border-b-darkmode-900/20; + } + } + .ck.ck-icon :not([fill]) { + @apply fill-slate-300; + } + .ck.ck-dropdown__panel { + @apply border-darkmode-800; + } + .ck.ck-button.ck-on, + a.ck.ck-button.ck-on { + @apply bg-darkmode-800; + } + } + &.ck-editor__main > .ck-editor__editable { + @apply bg-darkmode-800; + &:not(.ck-focused) { + @apply border-darkmode-900/20; + } + } + &.ck-button:not(.ck-disabled):hover, + &a.ck-button:not(.ck-disabled):hover { + @apply bg-darkmode-900/20; + } + } + } +} diff --git a/src/assets/css/components/_content.css b/src/assets/css/components/_content.css new file mode 100755 index 0000000..444139f --- /dev/null +++ b/src/assets/css/components/_content.css @@ -0,0 +1,12 @@ +.content { + padding: 0px 22px; + border-radius: 1.3rem; + @apply min-w-0 min-h-screen bg-slate-100 flex-1 pb-10 shadow-sm dark:bg-darkmode-700; + @include media-breakpoint-down(md) { + @apply px-4 max-w-full; + } + &:before { + content: ""; + @apply w-full h-px block; + } +} diff --git a/src/assets/css/components/_dark-mode-switcher.css b/src/assets/css/components/_dark-mode-switcher.css new file mode 100644 index 0000000..8fec2fe --- /dev/null +++ b/src/assets/css/components/_dark-mode-switcher.css @@ -0,0 +1,23 @@ +.dark-mode-switcher { + .dark-mode-switcher__toggle { + width: 38px; + height: 24px; + padding: 1px; + @apply outline-none rounded-full relative cursor-pointer; + &:before { + content: ""; + width: 22px; + height: 22px; + transition: all 0.2s ease-in-out; + box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.25); + @apply absolute inset-y-0 my-auto rounded-full; + } + &.dark-mode-switcher__toggle--active { + @apply bg-primary border-primary; + &::before { + margin-left: 13px; + @apply bg-white; + } + } + } +} diff --git a/src/assets/css/components/_dropzone.css b/src/assets/css/components/_dropzone.css new file mode 100644 index 0000000..8ecadb4 --- /dev/null +++ b/src/assets/css/components/_dropzone.css @@ -0,0 +1,3 @@ +.dropzone { + @apply border-slate-200/60 border-dashed dark:bg-darkmode-600; +} diff --git a/src/assets/css/components/_error-page.css b/src/assets/css/components/_error-page.css new file mode 100755 index 0000000..e107be5 --- /dev/null +++ b/src/assets/css/components/_error-page.css @@ -0,0 +1,3 @@ +.error-page img { + width: 450px; +} diff --git a/src/assets/css/components/_full-calendar.css b/src/assets/css/components/_full-calendar.css new file mode 100644 index 0000000..bbf3977 --- /dev/null +++ b/src/assets/css/components/_full-calendar.css @@ -0,0 +1,146 @@ +.full-calendar { + .fc-toolbar { + @include media-breakpoint-down(lg) { + @apply flex-col; + } + .fc-toolbar-chunk { + &:nth-child(1) { + @apply order-3; + } + &:nth-child(2) { + @apply order-1; + } + &:nth-child(3) { + @apply order-2; + @include media-breakpoint-down(lg) { + @apply my-3; + } + .fc-button-group { + @include media-breakpoint-down(sm) { + @apply block; + } + button { + @apply w-20; + @include media-breakpoint-down(sm) { + @apply w-full rounded-md mb-2; + } + } + } + } + } + .fc-toolbar-title { + @apply text-lg font-medium; + } + } + .fc-toolbar-chunk .fc-button-primary { + &:first-child { + @apply rounded-l-md; + } + &:last-child { + @apply rounded-r-md; + } + } + &.fc-theme-standard { + .fc-scrollgrid, + th, + td, + .fc-list { + @apply border-slate-200/60 dark:border-darkmode-400; + } + } + table { + @apply rounded-md; + tr th .fc-scrollgrid-sync-inner { + @apply py-3; + } + } + .fc-daygrid-event-harness { + @apply mx-5; + } + .fc-h-event { + @apply bg-primary border-primary rounded-md; + } + .fc-event-title-container { + @apply py-1 px-2 text-xs; + } + .fc-daygrid-event { + @apply text-xs; + } + .fc-daygrid-event-dot { + @apply border-primary mr-2; + } + .fc-daygrid-dot-event .fc-event-title { + @apply font-medium; + } + .fc-col-header-cell-cushion { + @apply font-medium; + } + &.fc .fc-view-harness { + @include media-breakpoint-down(sm) { + @apply !min-h-[400px]; + } + } + &.fc .fc-daygrid-day-frame { + @include media-breakpoint-down(sm) { + @apply !min-h-[60px]; + } + } + .fc-daygrid-more-link { + @apply text-sm; + @include media-breakpoint-down(md) { + @apply text-slate-500 text-[10px]; + } + @include media-breakpoint-down(sm) { + @apply pl-0 block -mt-3 leading-[10px]; + } + } + .fc-daygrid-day-bottom { + @apply pt-1; + } + .fc-day-other { + @apply bg-slate-100/50 dark:bg-darkmode-700; + } + .fc-button-primary { + @apply !font-normal !inline-block !border-slate-200/60 !text-slate-500 !bg-transparent !capitalize !px-[0.65em] !py-[0.4em]; + @apply btn; + .fc-icon { + @apply !text-[1.2em]; + } + &:focus { + @apply !shadow-none; + } + } + .fc-button-primary:not(:disabled):active, + .fc-button-primary:not(:disabled).fc-button-active { + @apply !text-white !bg-primary !border-primary; + } + .fc-list-day-cushion { + @apply !bg-slate-100/50 !px-[1.25rem] !py-[0.75rem]; + } + .fc-list-event td { + @apply px-5 py-3; + } + .fc-list-event-dot { + @apply !border-primary; + } + .fc-event-time { + @apply px-0.5 !text-[0.75rem]; + } + .fc-daygrid-more-link { + @apply pl-2; + } +} + +.dark { + .full-calendar { + .fc-button-primary { + @apply !bg-darkmode-400 !border-darkmode-400; + } + .fc-list-day-cushion { + @apply !bg-darkmode-400; + } + .fc-event:hover td { + @apply border-darkmode-400 bg-darkmode-400; + } + } +} diff --git a/src/assets/css/components/_global.css b/src/assets/css/components/_global.css new file mode 100755 index 0000000..2e63ef3 --- /dev/null +++ b/src/assets/css/components/_global.css @@ -0,0 +1,20 @@ +html { + @apply bg-primary; + &.dark { + @apply bg-darkmode-800; + body { + @apply text-slate-300; + *, + ::before, + ::after { + @apply border-white/5; + } + } + } + body { + @apply antialiased overflow-x-hidden pt-3 px-8 font-roboto text-sm text-slate-800; + @include media-breakpoint-down(sm) { + @apply px-3; + } + } +} diff --git a/src/assets/css/components/_hljs.css b/src/assets/css/components/_hljs.css new file mode 100644 index 0000000..874082b --- /dev/null +++ b/src/assets/css/components/_hljs.css @@ -0,0 +1,6 @@ +.source-preview { + @apply bg-slate-100 px-4 py-2.5; + .hljs { + @apply text-xs -mt-[20px] -mb-[40px] leading-relaxed bg-slate-100 dark:bg-slate-200; + } +} diff --git a/src/assets/css/components/_inbox-filter.css b/src/assets/css/components/_inbox-filter.css new file mode 100755 index 0000000..3994dce --- /dev/null +++ b/src/assets/css/components/_inbox-filter.css @@ -0,0 +1,8 @@ +.inbox-filter .inbox-filter__dropdown-menu { + width: 250px; +} + +.inbox-filter__dropdown-menu .dropdown-content { + margin-left: -228px; + @apply w-auto; +} diff --git a/src/assets/css/components/_inbox.css b/src/assets/css/components/_inbox.css new file mode 100755 index 0000000..1f972e1 --- /dev/null +++ b/src/assets/css/components/_inbox.css @@ -0,0 +1,27 @@ +.inbox { + .inbox__item { + @apply transition duration-200 ease-in-out transform cursor-pointer; + &:hover { + transform: scale(1.02, 1.02); + @apply relative z-20 shadow-md border-0 rounded; + } + &.inbox__item--active { + @apply bg-white text-slate-800 dark:text-slate-300 dark:bg-darkmode-600; + .inbox__item--sender { + @apply font-medium; + } + .inbox__item--highlight { + @apply font-medium; + } + .inbox__item--time { + @apply font-medium; + } + } + } + .form-check-input { + @apply border-slate-400; + &:checked { + @apply border-primary; + } + } +} diff --git a/src/assets/css/components/_litepicker.css b/src/assets/css/components/_litepicker.css new file mode 100755 index 0000000..ef22ccc --- /dev/null +++ b/src/assets/css/components/_litepicker.css @@ -0,0 +1,223 @@ +.litepicker { + @apply bg-white rounded-md text-sm; + z-index: 999999 !important; + margin-top: 7px; + box-shadow: 0px 3px 20px #00000014; + @include media-breakpoint-down(lg) { + width: 310px; + } + @include media-breakpoint-down(sm) { + left: 0px !important; + @apply right-0 mx-auto; + } + &:before { + content: ""; + left: 9px; + top: -7px; + border-bottom-color: #f7f7f7; + border-right: 7px solid transparent; + border-left: 7px solid transparent; + border-bottom: 7px solid #e8e8e8; + @apply absolute inline-block; + } + &:after { + content: ""; + left: 10px; + top: -6px; + border-right: 6px solid transparent; + border-bottom: 6px solid #fff; + border-left: 6px solid transparent; + @apply absolute inline-block; + } + .container__months, + .container__footer { + @apply shadow-none bg-transparent pt-0; + } + .container__footer { + @apply border-t border-slate-200/60 m-0 p-3; + @include media-breakpoint-down(lg) { + @apply flex flex-col-reverse text-center; + } + .preview-date-range { + @include media-breakpoint-down(lg) { + @apply w-full block order-1 mb-1.5; + } + } + .button-cancel { + @include media-breakpoint-down(lg) { + width: 100% !important; + margin-left: 0px !important; + padding-top: 0.375rem !important; + padding-bottom: 0.375rem !important; + } + } + .button-apply { + @include media-breakpoint-down(lg) { + width: 100% !important; + margin-left: 0px !important; + padding-top: 0.375rem !important; + padding-bottom: 0.375rem !important; + @apply mb-1.5; + } + } + .button-apply, + .button-cancel { + @apply w-20 py-1 px-2 rounded-md font-medium ml-1 mr-0; + } + .button-apply { + @apply bg-primary text-white; + } + .button-cancel { + @apply bg-slate-200/70 text-slate-500; + } + } + .container__months { + @apply px-1; + .month-item-weekdays-row { + @apply text-slate-400 mt-3; + } + .month-item-header { + @apply px-0 pb-0 pt-2; + .button-previous-month { + @apply flex items-center justify-center w-8 h-8; + &:hover { + @apply bg-slate-100; + } + svg { + transform: rotate(135deg); + @apply -mr-1; + } + } + .button-next-month { + @apply flex items-center justify-center w-8 h-8; + &:hover { + @apply bg-slate-100; + } + svg { + transform: rotate(-45deg); + @apply -ml-1; + } + } + .button-previous-month:hover svg, + .button-previous-month svg, + .button-next-month:hover svg, + .button-next-month svg { + fill: transparent; + border: solid black; + border-width: 0 2px 2px 0; + border-radius: 0; + display: inline-block; + border-color: #4a5568; + @apply w-2 h-2 block; + } + div > .month-item-name, + div > .month-item-year { + background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(74, 85, 104)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='lucide lucide-chevron-down'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E"); + background-size: 15px; + background-position: center right 0.6rem; + @apply bg-transparent text-sm border bg-no-repeat py-1 pl-2 pr-8 rounded-md focus:outline-none focus:border-slate-200 focus:ring-transparent; + } + } + } + .container__days { + .day-item { + @apply text-slate-800; + &:hover { + @apply shadow-none bg-slate-100 text-slate-800; + } + &.is-today, + &.is-today:hover { + @apply font-medium text-primary; + } + &.is-start-date, + &.is-start-date:hover, + &.is-end-date, + &.is-end-date:hover { + @apply bg-primary text-white; + } + &.is-in-range, + &.is-in-range:hover { + @apply bg-slate-100; + } + } + .week-number { + @apply text-slate-400; + } + } +} +@include media-breakpoint-down(lg) { + :root { + --litepicker-day-width: 35px; + } +} + +.dark { + .litepicker { + @apply bg-darkmode-600; + &:before, + &:after { + border-right-color: transparent; + border-left-color: transparent; + border-bottom-color: theme("colors.darkmode.600"); + } + .container__months { + .button-previous-month:hover { + @apply bg-darkmode-400; + } + .button-next-month:hover { + @apply bg-darkmode-400; + } + .month-item-header { + .button-previous-month:hover svg, + .button-previous-month svg, + .button-next-month:hover svg, + .button-next-month svg { + @apply border-slate-200; + } + div > .month-item-name, + div > .month-item-year { + @apply text-slate-200; + } + div > .month-item-name, + div > .month-item-year { + @apply border-darkmode-400; + } + } + } + .container__days { + .day-item { + @apply text-slate-200; + &:hover { + @apply bg-darkmode-400; + } + &.is-start-date, + &.is-start-date:hover, + &.is-end-date, + &.is-end-date:hover { + @apply bg-primary text-slate-200; + } + &.is-in-range, + &.is-in-range:hover { + @apply bg-darkmode-400; + } + &.is-today, + &.is-today:hover { + @apply text-slate-200; + } + } + } + .container__footer { + @apply border-darkmode-400; + .button-cancel { + @apply bg-darkmode-400 text-slate-300; + } + } + .container__tooltip { + @apply bg-darkmode-400; + &:before, + &:after { + border-top-color: theme("colors.darkmode.600"); + } + } + } +} diff --git a/src/assets/css/components/_login.css b/src/assets/css/components/_login.css new file mode 100755 index 0000000..b22db71 --- /dev/null +++ b/src/assets/css/components/_login.css @@ -0,0 +1,26 @@ +.login { + @apply relative overflow-hidden bg-white dark:bg-darkmode-600; + @include media-breakpoint-down(xl) { + @apply bg-primary dark:bg-darkmode-800; + } + &:before { + content: ""; + @apply w-[57%] -mt-[28%] -mb-[15%] -ml-[13%] absolute inset-y-0 left-0 transform rotate-[-4deg] bg-primary/20 rounded-[100%] dark:bg-darkmode-400; + @include media-breakpoint-down(xl) { + @apply hidden; + } + } + &:after { + content: ""; + @apply w-[57%] -mt-[20%] -mb-[12%] -ml-[13%] absolute inset-y-0 left-0 transform rotate-[-4deg] bg-primary rounded-[100%] dark:bg-darkmode-700; + @include media-breakpoint-down(xl) { + @apply hidden; + } + } + .login__input { + min-width: 350px; + @include media-breakpoint-down(xl) { + @apply min-w-full; + } + } +} diff --git a/src/assets/css/components/_lucide-icon.css b/src/assets/css/components/_lucide-icon.css new file mode 100755 index 0000000..17d4569 --- /dev/null +++ b/src/assets/css/components/_lucide-icon.css @@ -0,0 +1,3 @@ +.lucide { + @apply stroke-1.5; +} diff --git a/src/assets/css/components/_main.css b/src/assets/css/components/_main.css new file mode 100755 index 0000000..b8db02e --- /dev/null +++ b/src/assets/css/components/_main.css @@ -0,0 +1,10 @@ +.main { + background-image: url("../../images/bg-main.svg"); + @apply py-5 bg-no-repeat bg-fixed; +} + +.dark { + .main { + background-image: url("../../images/bg-main-dark.svg"); + } +} diff --git a/src/assets/css/components/_mobile-menu.css b/src/assets/css/components/_mobile-menu.css new file mode 100644 index 0000000..fdd293a --- /dev/null +++ b/src/assets/css/components/_mobile-menu.css @@ -0,0 +1,74 @@ +.mobile-menu { + @apply w-full fixed bg-primary/90 z-[60] border-b border-white/[0.08] -mt-5 -mx-8 mb-6 dark:bg-darkmode-800; + &:before { + content: ""; + @apply w-full h-screen z-10 fixed inset-x-0 bg-black/90 invisible opacity-0 transition-opacity duration-200 ease-in-out; + } + &.mobile-menu--active { + &:before { + content: ""; + @apply visible opacity-100; + } + .scrollable { + @apply ml-0; + .mobile-menu-toggler { + @apply visible opacity-100; + } + } + } + @include media-breakpoint-down(sm) { + @apply -mx-3; + } + .mobile-menu-bar { + height: 70px; + @apply px-8 flex items-center; + @include media-breakpoint-down(sm) { + @apply px-3; + } + } + .scrollable { + @apply h-screen z-20 fixed top-0 left-0 w-[270px] -ml-[100%] bg-primary transition-all duration-300 ease-in-out dark:bg-darkmode-800; + .mobile-menu-toggler { + @apply fixed top-0 right-0 mt-4 mr-4 invisible opacity-0 transition-opacity duration-200 ease-in-out; + } + .simplebar-track.simplebar-vertical { + .simplebar-scrollbar:before { + @apply bg-black/50; + } + } + } + ul { + &.menu__sub-open { + @apply block; + } + li { + max-width: 1280px; + @apply w-full mx-auto; + ul { + @apply bg-black/10 rounded-lg mx-4 my-1 dark:bg-darkmode-700; + .menu { + @apply px-4; + } + ul { + @apply bg-black/10 rounded-lg mx-0 dark:bg-darkmode-600; + } + } + } + } + .menu__devider { + @apply w-full h-px bg-white/[0.08] relative; + } + .menu { + height: 50px; + @apply flex items-center text-white px-6; + .menu__title { + @apply w-full ml-3 flex items-center; + .menu__sub-icon { + @apply transition ease-in duration-100 ml-auto; + svg { + @apply w-5 h-5; + } + } + } + } +} diff --git a/src/assets/css/components/_news.css b/src/assets/css/components/_news.css new file mode 100755 index 0000000..8fb2f11 --- /dev/null +++ b/src/assets/css/components/_news.css @@ -0,0 +1,14 @@ +.news { + .news__preview { + height: 400px; + @include media-breakpoint-down(md) { + height: 250px; + } + } + p { + text-indent: 30px; + } + .news__input { + height: 69px; + } +} diff --git a/src/assets/css/components/_notification-content.css b/src/assets/css/components/_notification-content.css new file mode 100755 index 0000000..4e6675a --- /dev/null +++ b/src/assets/css/components/_notification-content.css @@ -0,0 +1,12 @@ +.notification-content { + width: 350px; + @include media-breakpoint-down(sm) { + width: 280px; + } + .notification-content__title { + @apply font-medium mb-5; + } + .notification-content__box { + @apply p-5; + } +} diff --git a/src/assets/css/components/_notification.css b/src/assets/css/components/_notification.css new file mode 100755 index 0000000..a9324dc --- /dev/null +++ b/src/assets/css/components/_notification.css @@ -0,0 +1,12 @@ +.notification { + @apply relative text-white/70; + .notification__icon { + @apply w-5 h-5; + } + &.notification--bullet:before { + content: ""; + width: 8px; + height: 8px; + @apply rounded-full absolute top-[-2px] right-0 bg-danger; + } +} diff --git a/src/assets/css/components/_pos-dropdown.css b/src/assets/css/components/_pos-dropdown.css new file mode 100755 index 0000000..29eeb6b --- /dev/null +++ b/src/assets/css/components/_pos-dropdown.css @@ -0,0 +1,3 @@ +.pos-dropdown .pos-dropdown__dropdown-menu { + width: 265px; +} diff --git a/src/assets/css/components/_post.css b/src/assets/css/components/_post.css new file mode 100755 index 0000000..ac039aa --- /dev/null +++ b/src/assets/css/components/_post.css @@ -0,0 +1,14 @@ +.post { + .post__tabs { + @apply border-transparent dark:border-transparent; + .nav-item .nav-link { + @apply flex justify-center items-center text-slate-500; + &:hover:not(.disabled):not(.active):hover { + @apply border-transparent bg-transparent text-slate-600 dark:bg-transparent dark:text-slate-300; + } + &.active { + @apply text-primary border-transparent dark:bg-darkmode-600 dark:border-transparent dark:text-white; + } + } + } +} diff --git a/src/assets/css/components/_pricing-tabs.css b/src/assets/css/components/_pricing-tabs.css new file mode 100755 index 0000000..a6816f2 --- /dev/null +++ b/src/assets/css/components/_pricing-tabs.css @@ -0,0 +1,5 @@ +.pricing-tabs.nav.nav-pills { + .nav-item .nav-link { + @apply rounded-none; + } +} diff --git a/src/assets/css/components/_pristine.css b/src/assets/css/components/_pristine.css new file mode 100755 index 0000000..555fc7c --- /dev/null +++ b/src/assets/css/components/_pristine.css @@ -0,0 +1,5 @@ +.has-error { + .form-control { + @apply border-danger dark:border-danger/70; + } +} diff --git a/src/assets/css/components/_report-box-2.css b/src/assets/css/components/_report-box-2.css new file mode 100644 index 0000000..7928798 --- /dev/null +++ b/src/assets/css/components/_report-box-2.css @@ -0,0 +1,15 @@ +.report-box-2 { + @apply relative; + &:before { + content: ""; + width: 90%; + background: #f9fafc; + box-shadow: 0px 3px 20px #0000000b; + @apply h-full mt-3 absolute rounded-md mx-auto inset-x-0 dark:bg-darkmode-400/70; + } + .report-box-2__indicator { + padding-top: 3px; + padding-bottom: 3px; + @apply flex rounded-full text-white text-xs pl-2 pr-1 mt-3 mr-auto items-center font-medium; + } +} diff --git a/src/assets/css/components/_report-box-3.css b/src/assets/css/components/_report-box-3.css new file mode 100644 index 0000000..363bccf --- /dev/null +++ b/src/assets/css/components/_report-box-3.css @@ -0,0 +1,42 @@ +.report-box-3 { + margin-left: -22px; + margin-right: -22px; + @apply relative; + @include media-breakpoint-down(md) { + margin-left: -16px; + margin-right: -16px; + } + &:before { + content: ""; + border-radius: 30px 30px 0px 0px; + transform: translatey(35px); + animation: 0.4s intro-report-box-3-animation ease-in-out 0.33333s; + animation-fill-mode: forwards; + animation-delay: 0.1s; + @apply w-full h-full bg-slate-200/70 dark:bg-opacity-50 absolute top-0 left-0 right-0 opacity-0 dark:bg-darkmode-500; + } + &.report-box-3--content { + padding: 0px 22px; + min-height: 400px; + &:before { + content: ""; + border-radius: 30px; + transform: translatey(35px); + animation: 0.4s intro-report-box-3-animation ease-in-out 0.33333s; + animation-fill-mode: forwards; + animation-delay: 0.1s; + box-shadow: 0px 3px 20px #0000000b; + @apply w-full h-full bg-slate-100 absolute top-0 left-0 right-0 opacity-0 dark:bg-darkmode-700; + @include media-breakpoint-down(xl) { + @apply shadow-none rounded-t-none; + } + } + } +} + +@keyframes intro-report-box-3-animation { + 100% { + @apply opacity-100; + transform: translateX(0px); + } +} diff --git a/src/assets/css/components/_report-box-4.css b/src/assets/css/components/_report-box-4.css new file mode 100644 index 0000000..330969e --- /dev/null +++ b/src/assets/css/components/_report-box-4.css @@ -0,0 +1,32 @@ +.report-box-4 { + @apply relative; + &:before { + content: ""; + border-radius: 30px 30px 0px 0px; + transform: translatey(35px); + animation: 0.4s intro-report-box-4-animation ease-in-out 0.33333s; + animation-fill-mode: forwards; + animation-delay: 0.1s; + margin-left: -22px; + margin-right: -22px; + box-shadow: 0px 3px 20px #0000000b; + @apply h-full bg-slate-100 absolute top-0 left-0 right-0 opacity-0 hidden dark:bg-darkmode-700; + @include media-breakpoint-down(xl) { + @apply block; + } + @include media-breakpoint-down(md) { + margin-left: -16px; + margin-right: -16px; + } + } + .report-box-4__content { + flex: 1 1 0; + } +} + +@keyframes intro-report-box-4-animation { + 100% { + @apply opacity-100; + transform: translateX(0px); + } +} diff --git a/src/assets/css/components/_report-box.css b/src/assets/css/components/_report-box.css new file mode 100755 index 0000000..2503d2d --- /dev/null +++ b/src/assets/css/components/_report-box.css @@ -0,0 +1,18 @@ +.report-box { + @apply relative; + &:before { + content: ""; + width: 90%; + box-shadow: 0px 3px 20px #0000000b; + @apply bg-slate-50 h-full mt-3 absolute rounded-md mx-auto inset-x-0 dark:bg-darkmode-400/70; + } + .report-box__icon { + width: 28px; + height: 28px; + } + .report-box__indicator { + padding-top: 3px; + padding-bottom: 3px; + @apply flex rounded-full text-white text-xs pl-2 pr-1 items-center font-medium; + } +} diff --git a/src/assets/css/components/_report-chart.css b/src/assets/css/components/_report-chart.css new file mode 100755 index 0000000..6fe01f2 --- /dev/null +++ b/src/assets/css/components/_report-chart.css @@ -0,0 +1,11 @@ +.report-chart { + @apply relative; + &:before { + content: ""; + @apply block absolute w-16 left-0 top-0 bottom-0 ml-10 mb-7 bg-gradient-to-r from-white via-white/80 to-transparent dark:from-darkmode-600; + } + &:after { + content: ""; + @apply block absolute w-16 right-0 top-0 bottom-0 mb-7 bg-gradient-to-l from-white via-white/80 to-transparent dark:from-darkmode-600; + } +} diff --git a/src/assets/css/components/_report-maps.css b/src/assets/css/components/_report-maps.css new file mode 100755 index 0000000..4f5267d --- /dev/null +++ b/src/assets/css/components/_report-maps.css @@ -0,0 +1,3 @@ +.report-maps { + height: 310px; +} diff --git a/src/assets/css/components/_search-result.css b/src/assets/css/components/_search-result.css new file mode 100755 index 0000000..3e200c9 --- /dev/null +++ b/src/assets/css/components/_search-result.css @@ -0,0 +1,22 @@ +.search-result { + width: 450px; + @apply z-20 absolute right-0 mt-1 invisible opacity-0; + transition: visibility 0s linear 0.2s, opacity 0.2s 0s; + &.show { + transition: visibility 0s linear 0s, opacity 0.2s 0s; + @apply visible opacity-100; + > .search-result__content { + margin-top: -1px; + .tab-content .tab-pane { + @apply visible; + } + } + } + .search-result__content { + transition: margin-top 0.2s; + @apply box p-5 mt-5; + .search-result__content__title { + @apply font-medium mb-2; + } + } +} diff --git a/src/assets/css/components/_search.css b/src/assets/css/components/_search.css new file mode 100755 index 0000000..9a2c49b --- /dev/null +++ b/src/assets/css/components/_search.css @@ -0,0 +1,12 @@ +.search { + @apply relative; + .search__input { + @apply w-56 shadow-none rounded-full bg-slate-200 pr-8 transition-[width] duration-300 ease-in-out focus:border-transparent dark:bg-darkmode-400/70; + &:focus { + @apply w-72; + } + } + .search__icon { + @apply w-5 h-5 absolute my-auto inset-y-0 mr-3 right-0 text-slate-600; + } +} diff --git a/src/assets/css/components/_side-nav.css b/src/assets/css/components/_side-nav.css new file mode 100644 index 0000000..5fcbb0e --- /dev/null +++ b/src/assets/css/components/_side-nav.css @@ -0,0 +1,199 @@ +.side-nav { + @apply w-[250px] px-5 pt-8 pb-16 overflow-x-hidden; + @include media-breakpoint-down(xl) { + @apply w-[105px]; + } + @include media-breakpoint-down(md) { + @apply hidden; + } + &.side-nav--simple { + @apply w-[105px]; + .side-menu { + .side-menu__title { + @apply hidden; + .side-menu__sub-icon { + @apply hidden; + } + } + &:not(.side-menu--active) .side-menu__icon:before { + @apply hidden; + } + } + } + .side-nav__devider { + @apply w-full h-px bg-white/[0.08] z-10 relative dark:bg-white/[0.07]; + } + .side-menu { + @apply h-[50px] flex items-center pl-5 text-white mb-1 relative rounded-lg dark:text-slate-300; + .side-menu__title { + @apply w-full ml-3 flex items-center; + .side-menu__sub-icon { + @apply transition ease-in duration-100 ml-auto mr-5; + svg { + @apply w-4 h-4; + } + @include media-breakpoint-down(xl) { + @apply hidden; + } + } + @include media-breakpoint-down(xl) { + @apply hidden; + } + } + } + > ul { + @for $i from 1 through 50 { + > li:nth-child($i) { + &.side-nav__devider { + @apply opacity-0; + animation: 0.4s intro-devider-animation ease-in-out 0.33333s; + animation-fill-mode: forwards; + animation-delay: calc($i * 0.1s); + } + & > a { + &:not(.side-menu--active) { + @apply opacity-0; + transform: translateX(50px); + animation: 0.4s intro-menu-animation ease-in-out 0.33333s; + animation-fill-mode: forwards; + animation-delay: calc($i * 0.1s); + } + &.side-menu--active { + animation: 0.4s intro-active-menu-animation ease-in-out 0.33333s; + animation-fill-mode: forwards; + } + } + } + } + ul { + @for $i from 1 through 50 { + li:nth-child($i) { + & > a { + @apply opacity-0; + transform: translateX(50px); + animation: 0.2s intro-submenu-animation ease-in-out 0.33333s; + animation-fill-mode: forwards; + animation-delay: calc($i * 0.1s); + } + } + } + @apply bg-white/[0.04] rounded-lg relative dark:bg-transparent; + &:before { + content: ""; + @apply block inset-0 bg-primary/60 rounded-lg absolute z-[-1] dark:bg-darkmode-900/30; + } + &.side-menu__sub-open { + @apply block; + } + .side-menu__icon:before { + @apply hidden; + } + li a { + &:not(.side-menu--active) { + @apply text-white/70 dark:text-slate-400; + } + &.side-menu--active .side-menu__title { + @apply font-medium; + } + } + ul { + @apply bg-white/[0.04] rounded-lg relative dark:bg-transparent; + &:before { + content: ""; + @apply block inset-0 bg-primary/60 rounded-lg absolute z-[-1] dark:bg-darkmode-900/30; + } + } + } + & > li { + & > .side-menu { + &.side-menu--active { + @apply bg-primary dark:bg-transparent; + &:before { + content: ""; + @apply block inset-0 bg-white/[0.08] rounded-lg absolute border-b-[3px] border-solid border-black/10 dark:bg-darkmode-700; + } + &:after { + content: ""; + width: 20px; + height: 80px; + margin-right: -47px; + animation: 0.3s active-side-menu-chevron-animation ease-in-out + 0.33333s; + animation-fill-mode: forwards; + animation-delay: 1s; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='80' viewBox='0 0 20 122.1'%3E%3Cpath data-name='Union 1' d='M16.038 122H16v-2.213a95.805 95.805 0 00-2.886-20.735 94.894 94.894 0 00-7.783-20.434A39.039 39.039 0 010 61.051a39.035 39.035 0 015.331-17.567 94.9 94.9 0 007.783-20.435A95.746 95.746 0 0016 2.314V0h4v122h-3.961v.1l-.001-.1z' fill='%23f1f5f8'/%3E%3C/svg%3E"); + @apply bg-no-repeat bg-cover absolute top-0 bottom-0 right-0 my-auto opacity-0; + } + .side-menu__icon { + @apply z-10 dark:text-slate-300; + } + .side-menu__title { + @apply font-medium z-10 dark:text-slate-300; + } + } + .side-menu__icon { + @apply dark:text-slate-400; + } + .side-menu__title { + @apply dark:text-slate-400; + } + &:hover:not(.side-menu--active):not(.side-menu--open) { + @apply bg-primary/60 dark:bg-transparent; + &:before { + content: ""; + @apply block inset-0 bg-white/[0.04] rounded-lg absolute z-[-1] dark:bg-darkmode-700; + } + } + } + } + } +} + +@keyframes intro-devider-animation { + 100% { + @apply opacity-100; + } +} + +@keyframes intro-menu-animation { + 100% { + @apply opacity-100; + transform: translateX(0px); + } +} + +@keyframes intro-submenu-animation { + 100% { + @apply opacity-100; + transform: translateX(0px); + } +} + +@keyframes intro-active-menu-animation { + 100% { + @apply z-10; + } +} + +@keyframes active-side-menu-chevron-animation { + 100% { + margin-right: -27px; + @apply opacity-100; + } +} + +.dark { + .side-nav { + > ul { + & > li { + & > .side-menu { + &.side-menu--active { + &:after { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='80' viewBox='0 0 20 122.1'%3E%3Cpath data-name='Union 1' d='M16.038 122H16v-2.213a95.805 95.805 0 00-2.886-20.735 94.894 94.894 0 00-7.783-20.434A39.039 39.039 0 010 61.051a39.035 39.035 0 015.331-17.567 94.9 94.9 0 007.783-20.435A95.746 95.746 0 0016 2.314V0h4v122h-3.961v.1l-.001-.1z' fill='%23232e45'/%3E%3C/svg%3E"); + } + } + } + } + } + } +} diff --git a/src/assets/css/components/_source-preview.css b/src/assets/css/components/_source-preview.css new file mode 100644 index 0000000..4876171 --- /dev/null +++ b/src/assets/css/components/_source-preview.css @@ -0,0 +1,12 @@ +.source-preview { + @apply relative; + code { + &:before { + content: "HTML"; + @apply font-roboto font-medium px-4 py-2 block absolute top-0 right-0 rounded-bl bg-slate-200 bg-opacity-70 dark:bg-slate-300; + } + &.javascript:before { + content: "JS"; + } + } +} diff --git a/src/assets/css/components/_table-report.css b/src/assets/css/components/_table-report.css new file mode 100755 index 0000000..9f9fa65 --- /dev/null +++ b/src/assets/css/components/_table-report.css @@ -0,0 +1,48 @@ +.table-report { + &:not(.table-report--bordered):not(.table-report--tabulator) { + border-spacing: 0 10px; + @apply border-separate; + th { + @apply border-b-0; + } + td { + @apply bg-white border-b-0 dark:bg-darkmode-600; + box-shadow: 20px 3px 20px #0000000b; + &:first-child { + @apply rounded-l-md; + } + &:last-child { + @apply rounded-r-md; + } + &.table-report__action { + @apply py-0 relative before:block before:w-px before:h-8 before:bg-slate-200 before:absolute before:left-0 before:inset-y-0 before:my-auto before:dark:bg-darkmode-400; + } + } + } + img { + box-shadow: 0px 0px 0px 2px #fff, 1px 1px 5px rgba(0, 0, 0, 0.32); + } + &.table-report--tabulator + .tabulator-header + .tabulator-headers + .tabulator-col { + &:nth-child(3), + &:nth-child(4), + &:nth-child(5), + &:nth-child(6) { + .tabulator-col-content { + .tabulator-col-title { + @apply text-center; + } + } + } + } +} + +.dark { + .table-report { + img { + box-shadow: 0px 0px 0px 2px #3f4865, 1px 1px 5px rgba(0, 0, 0, 0.32); + } + } +} diff --git a/src/assets/css/components/_tabulator.css b/src/assets/css/components/_tabulator.css new file mode 100644 index 0000000..39bb6d4 --- /dev/null +++ b/src/assets/css/components/_tabulator.css @@ -0,0 +1,194 @@ +.tabulator-print-fullscreen-hide:before { + content: ""; + @apply fixed bg-white top-0 left-0 w-full h-screen; +} +.tabulator { + @apply overflow-hidden border-0 bg-transparent; + .tabulator-header { + @apply font-medium text-current border-t border-b border-slate-200 bg-transparent; + .tabulator-headers { + .tabulator-col { + @apply bg-transparent border-r-0; + &:hover { + @apply bg-slate-100; + } + .tabulator-col-content { + @apply px-5 py-3; + .tabulator-col-title { + @apply pr-0; + } + .tabulator-arrow { + top: -3px; + border-left-width: 5px; + border-right-width: 5px; + @apply bottom-0 my-auto; + } + } + &.tabulator-sortable[aria-sort="none"] + .tabulator-col-content + .tabulator-arrow { + border-bottom-color: #cbd5e0; + } + } + } + } + .tabulator-row { + @apply border-b border-slate-200; + &:hover, + &.tabulator-row-even:hover { + @apply bg-slate-200; + } + &.tabulator-row-even { + @apply bg-slate-100; + } + .tabulator-cell { + @apply border-r-0 px-5 py-3; + &.tabulator-row-handle { + @apply px-0; + } + .tabulator-responsive-collapse-toggle { + @apply w-4 h-4 -mr-5 bg-slate-400 rounded-full; + } + } + .tabulator-responsive-collapse { + @apply p-3 border-slate-200 border-b-0; + td { + @apply p-2; + strong { + @apply font-medium; + } + } + } + } + .tabulator-footer { + @apply bg-transparent border-t-0 p-0 mt-2; + @include media-breakpoint-down(md) { + @apply whitespace-normal; + } + .tabulator-paginator { + @apply flex items-center; + @include media-breakpoint-down(md) { + @apply block text-left; + } + > label { + @apply font-normal text-slate-700; + } + .tabulator-page-size { + background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(74, 85, 104)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='lucide lucide-chevron-down'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E"); + background-size: 15px; + background-position: center right 0.6rem; + @apply py-2 pl-3 pr-8 ml-2 mr-auto rounded-md appearance-none bg-white border-slate-200 bg-no-repeat; + @include media-breakpoint-down(md) { + @apply mr-3; + } + } + .tabulator-page { + min-width: 40px; + @apply btn font-normal inline-flex items-center justify-center border-transparent text-slate-700; + @include media-breakpoint-down(sm) { + @apply mr-0 px-1; + } + &:hover { + @apply bg-slate-200 text-slate-700; + } + &.active { + @apply bg-slate-100 font-medium; + &:hover { + @apply bg-slate-100; + } + } + &[data-page="first"], + &[data-page="prev"], + &[data-page="next"], + &[data-page="last"] { + @apply w-5 text-transparent; + } + &[data-page="first"] { + background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' stroke='%232d3748' stroke-width='1.1' fill='none' stroke-linecap='round' stroke-linejoin='round' class='css-i6dzq1'%3E%3Cpolyline points='11 17 6 12 11 7'%3E%3C/polyline%3E%3Cpolyline points='18 17 13 12 18 7'%3E%3C/polyline%3E%3C/svg%3E"); + background-size: 50%; + @apply bg-center bg-no-repeat; + } + &[data-page="prev"] { + background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' stroke='%232d3748' stroke-width='1.1' fill='none' stroke-linecap='round' stroke-linejoin='round' class='css-i6dzq1'%3E%3Cpolyline points='15 18 9 12 15 6'%3E%3C/polyline%3E%3C/svg%3E"); + background-size: 45%; + @apply bg-center bg-no-repeat; + } + &[data-page="next"] { + background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' stroke='%232d3748' stroke-width='1.1' fill='none' stroke-linecap='round' stroke-linejoin='round' class='css-i6dzq1'%3E%3Cpolyline points='9 18 15 12 9 6'%3E%3C/polyline%3E%3C/svg%3E"); + background-size: 45%; + @apply bg-center bg-no-repeat; + } + &[data-page="last"] { + background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' stroke='%232d3748' stroke-width='1.1' fill='none' stroke-linecap='round' stroke-linejoin='round' class='css-i6dzq1'%3E%3Cpolyline points='13 17 18 12 13 7'%3E%3C/polyline%3E%3Cpolyline points='6 17 11 12 6 7'%3E%3C/polyline%3E%3C/svg%3E"); + background-size: 50%; + @apply bg-center bg-no-repeat; + } + } + } + } + .tabulator-tableHolder .tabulator-placeholder span { + @apply text-slate-500 font-normal text-sm; + } + .tabulator-loader { + background: #ffffffbd; + .tabulator-loader-msg { + @apply font-normal text-base bg-transparent; + &.tabulator-loading { + @apply border-0 text-slate-700; + } + &.tabulator-error { + @apply border-0 text-danger; + } + } + } +} + +.dark { + .tabulator { + .tabulator-header { + @apply text-slate-300 border-darkmode-400; + .tabulator-headers .tabulator-col:hover { + @apply bg-darkmode-300; + } + } + .tabulator-table { + @apply bg-transparent text-slate-200; + .tabulator-row { + @apply bg-transparent border-transparent; + &:hover, + &.tabulator-row-even:hover { + @apply bg-darkmode-700; + } + &.tabulator-row-even { + @apply bg-darkmode-400; + } + } + } + .tabulator-footer { + .tabulator-paginator { + > label { + @apply text-slate-200; + } + .tabulator-page-size { + @apply bg-darkmode-300 border-darkmode-600 text-slate-200; + } + .tabulator-page { + @apply bg-transparent text-slate-200; + &:hover { + @apply bg-darkmode-700 text-slate-300; + } + &.active, + &.active:hover { + @apply bg-darkmode-300; + } + } + } + } + .tabulator-loader { + @apply bg-black/30; + .tabulator-loader-msg.tabulator-loading { + @apply text-slate-200; + } + } + } +} diff --git a/src/assets/css/components/_tiny-slider.css b/src/assets/css/components/_tiny-slider.css new file mode 100644 index 0000000..fe1a47b --- /dev/null +++ b/src/assets/css/components/_tiny-slider.css @@ -0,0 +1,43 @@ +.tns-outer { + @apply relative; + .tns-controls button { + @apply w-5 h-5 bg-slate-200 text-transparent rounded-full absolute inset-y-0 my-auto z-10 outline-none dark:bg-darkmode-300; + &:hover { + @apply bg-slate-300 dark:bg-darkmode-200; + } + &[data-controls="prev"] { + @apply left-0 -ml-6; + &:before { + content: ""; + background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(102 113 132)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='lucide lucide-chevron-down'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E"); + background-size: 80%; + @apply w-full h-full bg-center transform rotate-90 absolute top-0 left-0; + } + } + &[data-controls="next"] { + @apply right-0 -mr-6; + &:before { + content: ""; + background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(102 113 132)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='lucide lucide-chevron-down'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E"); + background-size: 80%; + @apply w-full h-full bg-center transform -rotate-90 absolute top-0 left-0; + } + } + } + .tns-nav { + margin-bottom: -1.8rem; + @apply w-full absolute bottom-0 z-10 flex justify-center; + button { + @apply bg-slate-300 w-3 h-3 rounded-full mx-1 outline-none dark:bg-darkmode-300; + &.tns-nav-active { + @apply bg-slate-500 dark:bg-darkmode-200; + } + } + } + button[data-action] { + @apply hidden; + } + .tns-visually-hidden { + @apply hidden; + } +} diff --git a/src/assets/css/components/_tippy.css b/src/assets/css/components/_tippy.css new file mode 100755 index 0000000..df5f7f1 --- /dev/null +++ b/src/assets/css/components/_tippy.css @@ -0,0 +1,44 @@ +.tooltip-content { + left: 10000px; + @apply fixed; +} +.tippy-box { + @apply rounded-md dark:text-slate-300 dark:bg-darkmode-300; + & > .tippy-svg-arrow { + @apply dark:fill-darkmode-300; + } + .tippy-content { + @apply px-3 py-1.5; + } +} +.tippy-popper { + &[x-placement="left"], + &[x-placement="right"], + &[x-placement="left-start"], + &[x-placement="left-end"], + &[x-placement="right-start"], + &[x-placement="right-end"] { + .tippy-roundarrow, + .tippy-arrow { + @apply top-0 bottom-0 my-auto; + } + } + &[x-placement="top"], + &[x-placement="bottom"], + &[x-placement="top-start"], + &[x-placement="top-end"], + &[x-placement="bottom-start"], + &[x-placement="bottom-end"] { + .tippy-roundarrow, + .tippy-arrow { + @apply left-0 right-0 mx-auto; + } + } +} + +.dark { + .tippy-box { + box-shadow: 0 0 20px 4px #00000026, 0 4px 80px -8px #24282f40, + 0 4px 4px -2px #5b5e6926; + } +} diff --git a/src/assets/css/components/_toastify-content.css b/src/assets/css/components/_toastify-content.css new file mode 100644 index 0000000..6cb42b5 --- /dev/null +++ b/src/assets/css/components/_toastify-content.css @@ -0,0 +1,3 @@ +.toastify-content { + @apply py-5 pl-5 pr-14 bg-white border border-slate-200/60 rounded-lg shadow-xl dark:bg-darkmode-600 dark:text-slate-300 dark:border-darkmode-600; +} diff --git a/src/assets/css/components/_toastify.css b/src/assets/css/components/_toastify.css new file mode 100644 index 0000000..883430f --- /dev/null +++ b/src/assets/css/components/_toastify.css @@ -0,0 +1,14 @@ +.toastify { + background: none; + @apply shadow-none text-slate-700 p-0; + @include media-breakpoint-down(md) { + max-width: calc(100% - 30px); + } + .toast-close { + @apply text-transparent absolute opacity-100 inset-y-0 right-0 pr-3 flex items-center; + &:before { + content: "×"; + @apply block text-slate-500 text-3xl -mt-1.5 font-light; + } + } +} diff --git a/src/assets/css/components/_tom-select.css b/src/assets/css/components/_tom-select.css new file mode 100644 index 0000000..8e2d0dc --- /dev/null +++ b/src/assets/css/components/_tom-select.css @@ -0,0 +1,130 @@ +.tom-select { + .ts-input { + min-height: 40px; + padding: 7.5px 32px 7.5px 12px; + background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(74 85 104)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='lucide lucide-chevron-down'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E"); + background-size: 18px; + background-position: center right 0.6rem; + @apply text-sm shadow-sm border-inherit bg-no-repeat rounded; + .item { + line-height: 22px; + } + &.dropdown-active { + background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14.828' height='8.414' viewBox='0 0 14.828 8.414'%3E%3Cpath id='chevron' d='M6,9l6,6,6-6' transform='translate(19.414 16) rotate(180)' fill='none' stroke='%234a5568' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'/%3E%3C/svg%3E%0A") !important; + background-size: 11px !important; + background-position: center right 0.8rem !important; + background-repeat: no-repeat !important; + } + input { + height: 23px; + @apply text-sm; + } + } + &.multi .ts-input { + @apply px-1.5 py-1; + & > div { + @apply rounded my-0.5 mr-1 px-2 py-0 bg-slate-200; + &.active { + @apply bg-slate-300; + .remove { + @apply border-slate-400; + } + } + } + } + &.plugin-remove_button .item .remove { + @apply border-slate-300 ml-2 px-2; + } + &.plugin-dropdown_input .ts-input.focus { + @apply border-slate-200; + } + .ts-dropdown { + margin-top: -1px; + border-top: 1px solid rgba(226, 232, 240, var(--tw-border-opacity)); + @apply z-50 text-sm shadow-sm border-slate-200 rounded; + .optgroup-header { + padding: 9px 10px; + @apply font-medium; + } + .option { + padding: 9px 13px; + .highlight { + @apply bg-danger text-white; + } + &.active { + @apply bg-primary text-white; + } + &:hover:not(.active) { + @apply bg-slate-200 text-slate-800; + } + } + &.plugin-dropdown_input .dropdown-input-wrap { + @apply p-2; + input { + @apply outline-none border border-slate-200 rounded py-2 px-3; + } + } + .dropdown-header { + @apply px-3 bg-slate-100 border-slate-200; + .dropdown-header-close { + @apply cursor-pointer opacity-100 text-slate-400 mr-0.5; + } + } + } +} + +.dark { + .tom-select { + .ts-input { + background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(255 255 255)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='lucide lucide-chevron-down'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E"); + @apply bg-darkmode-800 border-transparent text-slate-300; + &.dropdown-active { + @apply bg-darkmode-800 border-transparent text-slate-300; + background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14.828' height='8.414' viewBox='0 0 14.828 8.414'%3E%3Cpath id='chevron' d='M6,9l6,6,6-6' transform='translate(19.414 16) rotate(180)' fill='none' stroke='rgb(255 255 255)' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'/%3E%3C/svg%3E%0A") !important; + &:before { + @apply bg-darkmode-800; + } + } + } + &.multi .ts-input { + & > div { + @apply bg-darkmode-600 border border-darkmode-400 text-slate-300; + &.active { + @apply bg-darkmode-400/80; + } + .remove { + @apply border-darkmode-400; + } + } + } + &.plugin-dropdown_input .ts-input.focus { + @apply border-transparent; + } + .ts-dropdown { + @apply bg-darkmode-700 border-darkmode-800/80 text-slate-300; + &.plugin-dropdown_input .dropdown-input-wrap input { + @apply bg-darkmode-600 border-darkmode-800/80; + } + .optgroup-header { + @apply bg-darkmode-800 text-slate-400; + } + .create { + @apply bg-darkmode-800 text-slate-300; + &:hover { + @apply bg-darkmode-600; + } + } + .option { + &:hover:not(.active) { + @apply bg-darkmode-600 text-slate-300; + } + } + .dropdown-header { + @apply bg-darkmode-800 border-darkmode-700 text-slate-300; + .dropdown-header-close { + @apply text-slate-300; + } + } + } + } +} diff --git a/src/assets/css/components/_top-nav.css b/src/assets/css/components/_top-nav.css new file mode 100644 index 0000000..3f515e6 --- /dev/null +++ b/src/assets/css/components/_top-nav.css @@ -0,0 +1,208 @@ +.top-nav { + padding-top: 12px; + transform: translatey(35px); + animation: 0.4s intro-top-menu-animation ease-in-out 0.33333s; + animation-fill-mode: forwards; + animation-delay: 0.2s; + @apply z-50 relative px-6 opacity-0 -mt-[3px]; + @include media-breakpoint-down(xl) { + @apply px-0 pt-0 -mt-2; + } + @include media-breakpoint-down(md) { + @apply hidden; + } + > ul { + @for $i from 1 through 50 { + > li:nth-child($i) { + & > a { + &:not(.top-menu--active) { + @apply opacity-0; + transform: translateY(50px); + animation: 0.4s + intro-menu-animation + ease-in-out + 0.33333s; + animation-fill-mode: forwards; + animation-delay: calc($i * 0.1s); + } + &.top-menu--active { + animation: 0.4s + intro-active-menu-animation + ease-in-out + 0.33333s; + animation-fill-mode: forwards; + } + } + } + } + @apply flex flex-wrap; + > li > .top-menu { + @apply mt-[3px]; + > .top-menu__icon { + @apply -mt-[3px]; + } + > .top-menu__title { + @apply -mt-[3px]; + } + } + li { + @apply relative; + &:hover { + > .top-menu > .top-menu__title > .top-menu__sub-icon { + @apply rotate-180; + } + > ul { + @apply block; + li:hover + .top-menu + > .top-menu__title + > .top-menu__sub-icon { + @apply -rotate-90; + } + } + } + .top-menu { + height: 47px; + @apply flex items-center px-5 mr-1 text-white relative rounded-lg; + @include media-breakpoint-down(xl) { + height: 55px; + @apply rounded-full; + } + &.top-menu--active { + @apply bg-primary; + @include media-breakpoint-down(xl) { + @apply bg-slate-100 dark:bg-darkmode-700; + } + &:before { + content: ""; + @apply block inset-0 bg-white/[0.08] rounded-lg absolute border-b-[3px] border-solid border-black/10 dark:bg-darkmode-700; + @include media-breakpoint-down(xl) { + @apply hidden; + } + } + &:after { + content: ""; + width: 20px; + height: 80px; + margin-bottom: -74px; + animation: 0.3s active-top-menu-chevron-animation + ease-in-out 0.33333s; + animation-fill-mode: forwards; + animation-delay: 1s; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='80' viewBox='0 0 20 122.1'%3E%3Cpath data-name='Union 1' d='M16.038 122H16v-2.213a95.805 95.805 0 00-2.886-20.735 94.894 94.894 0 00-7.783-20.434A39.039 39.039 0 010 61.051a39.035 39.035 0 015.331-17.567 94.9 94.9 0 007.783-20.435A95.746 95.746 0 0016 2.314V0h4v122h-3.961v.1l-.001-.1z' fill='%23f1f5f8'/%3E%3C/svg%3E"); + @apply bg-no-repeat bg-cover absolute left-0 right-0 bottom-0 mx-auto transform rotate-90 opacity-0; + @include media-breakpoint-down(xl) { + @apply hidden; + } + } + .top-menu__icon { + @apply dark:text-white; + @include media-breakpoint-down(xl) { + @apply text-primary; + } + } + .top-menu__title { + @apply font-medium dark:text-white; + @include media-breakpoint-down(xl) { + @apply text-slate-800; + } + } + } + .top-menu__icon { + @apply z-10 dark:text-slate-400; + } + .top-menu__title { + @apply z-10 dark:text-slate-400; + } + .top-menu__title { + @apply ml-3 flex items-center whitespace-nowrap; + .top-menu__sub-icon { + @apply transform transition ease-in duration-200 w-4 h-4 ml-2; + @include media-breakpoint-down(xl) { + @apply hidden; + } + .top-menu__sub-icon { + @apply duration-100; + } + } + } + } + ul { + box-shadow: 0px 3px 20px #0000000b; + @apply bg-primary hidden w-56 absolute rounded-md z-20 px-0 mt-1 before:block before:absolute before:w-full before:h-full before:bg-white/[0.04] before:inset-0 before:rounded-md before:z-[-1] dark:before:bg-black/10; + &:after { + content: ""; + @apply w-full h-1 absolute top-0 left-0 -mt-1 cursor-pointer; + } + li { + @apply px-5 relative; + .top-menu { + @apply px-0 mr-0; + .top-menu__title { + @apply w-full; + .top-menu__sub-icon { + @apply ml-auto; + } + } + } + } + ul { + left: 100%; + @apply bg-primary hidden rounded-md mt-0 ml-0 top-0 before:block before:absolute before:w-full before:h-full before:bg-white/[0.04] before:inset-0 before:rounded-md before:z-[-1] dark:before:bg-black/10; + } + } + } + > li:hover > .top-menu:not(.top-menu--active) { + @apply bg-primary/60 dark:bg-transparent; + &:before { + content: ""; + @apply block inset-0 bg-white/[0.04] rounded-lg absolute z-[-1] dark:bg-darkmode-700; + @include media-breakpoint-down(xl) { + @apply rounded-full bg-white/10; + } + } + } + } +} + +@keyframes intro-top-menu-animation { + 100% { + @apply opacity-100; + transform: translateY(0px); + } +} + +@keyframes intro-active-top-menu-animation { + 100% { + @apply z-10; + } +} + +@keyframes active-top-menu-chevron-animation { + 100% { + margin-bottom: -54px; + @apply opacity-100; + } +} + +.dark { + .top-nav { + > ul { + li { + .top-menu { + &.top-menu--active { + &:after { + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='80' viewBox='0 0 20 122.1'%3E%3Cpath data-name='Union 1' d='M16.038 122H16v-2.213a95.805 95.805 0 00-2.886-20.735 94.894 94.894 0 00-7.783-20.434A39.039 39.039 0 010 61.051a39.035 39.035 0 015.331-17.567 94.9 94.9 0 007.783-20.435A95.746 95.746 0 0016 2.314V0h4v122h-3.961v.1l-.001-.1z' fill='%23232e45'/%3E%3C/svg%3E"); + } + } + } + ul { + @apply bg-darkmode-600; + } + } + ul { + box-shadow: 0px 3px 7px #0000001c; + } + } + } +} diff --git a/src/assets/css/components/_wrapper.css b/src/assets/css/components/_wrapper.css new file mode 100644 index 0000000..9d9541c --- /dev/null +++ b/src/assets/css/components/_wrapper.css @@ -0,0 +1,54 @@ +.wrapper { + @apply relative; + &:before { + content: ""; + width: 95%; + z-index: -1; + transform: translatey(35px); + animation: 0.4s intro-wrapper-animation ease-in-out 0.33333s; + animation-fill-mode: forwards; + animation-delay: 0.1s; + border-radius: 1.3rem; + @apply bg-white/10 h-full -mt-4 absolute mx-auto inset-x-0 opacity-0 dark:bg-darkmode-400/50; + } + &.wrapper--top-nav { + .wrapper-box { + padding-top: 80px; + margin-top: -62px; + @include media-breakpoint-down(xl) { + margin-top: -67px; + @apply bg-transparent before:hidden dark:bg-transparent; + } + @include media-breakpoint-down(md) { + margin-top: -7px; + @apply pt-0; + } + } + &:before { + @include media-breakpoint-down(xl) { + @apply bg-transparent; + } + } + } + .wrapper-box { + transform: translatey(35px); + animation: 0.4s intro-wrapper-animation ease-in-out 0.33333s; + animation-fill-mode: forwards; + animation-delay: 0.2s; + @apply bg-primary flex rounded-[1.3rem] dark:bg-darkmode-400; + &:before { + content: ""; + @apply block absolute inset-0 bg-black/[0.15] rounded-[1.3rem] z-[-1]; + } + @include media-breakpoint-down(md) { + @apply -mt-[7px]; + } + } +} + +@keyframes intro-wrapper-animation { + 100% { + @apply opacity-100; + transform: translateX(0px); + } +} diff --git a/src/assets/css/components/_zoom-vanilla.css b/src/assets/css/components/_zoom-vanilla.css new file mode 100644 index 0000000..3cfd826 --- /dev/null +++ b/src/assets/css/components/_zoom-vanilla.css @@ -0,0 +1,3 @@ +.zoom-overlay { + @apply bg-black/75 dark:bg-black/40; +} diff --git a/src/assets/css/fonts/_roboto.css b/src/assets/css/fonts/_roboto.css new file mode 100755 index 0000000..d94ddab --- /dev/null +++ b/src/assets/css/fonts/_roboto.css @@ -0,0 +1,972 @@ +/* cyrillic-ext */ +@font-face { + font-family: "Roboto"; + font-style: italic; + font-weight: 100; + font-display: swap; + src: local("Roboto Thin Italic"), local("Roboto-ThinItalic"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOiCnqEu92Fr1Mu51QrEz0dL-vwnYh2eg.woff2) + format("woff2"); + unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, + U+FE2E-FE2F; +} +/* cyrillic */ +@font-face { + font-family: "Roboto"; + font-style: italic; + font-weight: 100; + font-display: swap; + src: local("Roboto Thin Italic"), local("Roboto-ThinItalic"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOiCnqEu92Fr1Mu51QrEzQdL-vwnYh2eg.woff2) + format("woff2"); + unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; +} +/* greek-ext */ +@font-face { + font-family: "Roboto"; + font-style: italic; + font-weight: 100; + font-display: swap; + src: local("Roboto Thin Italic"), local("Roboto-ThinItalic"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOiCnqEu92Fr1Mu51QrEzwdL-vwnYh2eg.woff2) + format("woff2"); + unicode-range: U+1F00-1FFF; +} +/* greek */ +@font-face { + font-family: "Roboto"; + font-style: italic; + font-weight: 100; + font-display: swap; + src: local("Roboto Thin Italic"), local("Roboto-ThinItalic"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOiCnqEu92Fr1Mu51QrEzMdL-vwnYh2eg.woff2) + format("woff2"); + unicode-range: U+0370-03FF; +} +/* vietnamese */ +@font-face { + font-family: "Roboto"; + font-style: italic; + font-weight: 100; + font-display: swap; + src: local("Roboto Thin Italic"), local("Roboto-ThinItalic"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOiCnqEu92Fr1Mu51QrEz8dL-vwnYh2eg.woff2) + format("woff2"); + unicode-range: U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB; +} +/* latin-ext */ +@font-face { + font-family: "Roboto"; + font-style: italic; + font-weight: 100; + font-display: swap; + src: local("Roboto Thin Italic"), local("Roboto-ThinItalic"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOiCnqEu92Fr1Mu51QrEz4dL-vwnYh2eg.woff2) + format("woff2"); + unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, + U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; +} +/* latin */ +@font-face { + font-family: "Roboto"; + font-style: italic; + font-weight: 100; + font-display: swap; + src: local("Roboto Thin Italic"), local("Roboto-ThinItalic"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOiCnqEu92Fr1Mu51QrEzAdL-vwnYg.woff2) + format("woff2"); + unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, + U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, + U+FEFF, U+FFFD; +} +/* cyrillic-ext */ +@font-face { + font-family: "Roboto"; + font-style: italic; + font-weight: 300; + font-display: swap; + src: local("Roboto Light Italic"), local("Roboto-LightItalic"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOjCnqEu92Fr1Mu51TjASc3CsTYl4BOQ3o.woff2) + format("woff2"); + unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, + U+FE2E-FE2F; +} +/* cyrillic */ +@font-face { + font-family: "Roboto"; + font-style: italic; + font-weight: 300; + font-display: swap; + src: local("Roboto Light Italic"), local("Roboto-LightItalic"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOjCnqEu92Fr1Mu51TjASc-CsTYl4BOQ3o.woff2) + format("woff2"); + unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; +} +/* greek-ext */ +@font-face { + font-family: "Roboto"; + font-style: italic; + font-weight: 300; + font-display: swap; + src: local("Roboto Light Italic"), local("Roboto-LightItalic"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOjCnqEu92Fr1Mu51TjASc2CsTYl4BOQ3o.woff2) + format("woff2"); + unicode-range: U+1F00-1FFF; +} +/* greek */ +@font-face { + font-family: "Roboto"; + font-style: italic; + font-weight: 300; + font-display: swap; + src: local("Roboto Light Italic"), local("Roboto-LightItalic"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOjCnqEu92Fr1Mu51TjASc5CsTYl4BOQ3o.woff2) + format("woff2"); + unicode-range: U+0370-03FF; +} +/* vietnamese */ +@font-face { + font-family: "Roboto"; + font-style: italic; + font-weight: 300; + font-display: swap; + src: local("Roboto Light Italic"), local("Roboto-LightItalic"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOjCnqEu92Fr1Mu51TjASc1CsTYl4BOQ3o.woff2) + format("woff2"); + unicode-range: U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB; +} +/* latin-ext */ +@font-face { + font-family: "Roboto"; + font-style: italic; + font-weight: 300; + font-display: swap; + src: local("Roboto Light Italic"), local("Roboto-LightItalic"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOjCnqEu92Fr1Mu51TjASc0CsTYl4BOQ3o.woff2) + format("woff2"); + unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, + U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; +} +/* latin */ +@font-face { + font-family: "Roboto"; + font-style: italic; + font-weight: 300; + font-display: swap; + src: local("Roboto Light Italic"), local("Roboto-LightItalic"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOjCnqEu92Fr1Mu51TjASc6CsTYl4BO.woff2) + format("woff2"); + unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, + U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, + U+FEFF, U+FFFD; +} +/* cyrillic-ext */ +@font-face { + font-family: "Roboto"; + font-style: italic; + font-weight: 400; + font-display: swap; + src: local("Roboto Italic"), local("Roboto-Italic"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOkCnqEu92Fr1Mu51xFIzIXKMnyrYk.woff2) + format("woff2"); + unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, + U+FE2E-FE2F; +} +/* cyrillic */ +@font-face { + font-family: "Roboto"; + font-style: italic; + font-weight: 400; + font-display: swap; + src: local("Roboto Italic"), local("Roboto-Italic"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOkCnqEu92Fr1Mu51xMIzIXKMnyrYk.woff2) + format("woff2"); + unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; +} +/* greek-ext */ +@font-face { + font-family: "Roboto"; + font-style: italic; + font-weight: 400; + font-display: swap; + src: local("Roboto Italic"), local("Roboto-Italic"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOkCnqEu92Fr1Mu51xEIzIXKMnyrYk.woff2) + format("woff2"); + unicode-range: U+1F00-1FFF; +} +/* greek */ +@font-face { + font-family: "Roboto"; + font-style: italic; + font-weight: 400; + font-display: swap; + src: local("Roboto Italic"), local("Roboto-Italic"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOkCnqEu92Fr1Mu51xLIzIXKMnyrYk.woff2) + format("woff2"); + unicode-range: U+0370-03FF; +} +/* vietnamese */ +@font-face { + font-family: "Roboto"; + font-style: italic; + font-weight: 400; + font-display: swap; + src: local("Roboto Italic"), local("Roboto-Italic"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOkCnqEu92Fr1Mu51xHIzIXKMnyrYk.woff2) + format("woff2"); + unicode-range: U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB; +} +/* latin-ext */ +@font-face { + font-family: "Roboto"; + font-style: italic; + font-weight: 400; + font-display: swap; + src: local("Roboto Italic"), local("Roboto-Italic"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOkCnqEu92Fr1Mu51xGIzIXKMnyrYk.woff2) + format("woff2"); + unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, + U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; +} +/* latin */ +@font-face { + font-family: "Roboto"; + font-style: italic; + font-weight: 400; + font-display: swap; + src: local("Roboto Italic"), local("Roboto-Italic"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOkCnqEu92Fr1Mu51xIIzIXKMny.woff2) + format("woff2"); + unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, + U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, + U+FEFF, U+FFFD; +} +/* cyrillic-ext */ +@font-face { + font-family: "Roboto"; + font-style: italic; + font-weight: 500; + font-display: swap; + src: local("Roboto Medium Italic"), local("Roboto-MediumItalic"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOjCnqEu92Fr1Mu51S7ACc3CsTYl4BOQ3o.woff2) + format("woff2"); + unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, + U+FE2E-FE2F; +} +/* cyrillic */ +@font-face { + font-family: "Roboto"; + font-style: italic; + font-weight: 500; + font-display: swap; + src: local("Roboto Medium Italic"), local("Roboto-MediumItalic"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOjCnqEu92Fr1Mu51S7ACc-CsTYl4BOQ3o.woff2) + format("woff2"); + unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; +} +/* greek-ext */ +@font-face { + font-family: "Roboto"; + font-style: italic; + font-weight: 500; + font-display: swap; + src: local("Roboto Medium Italic"), local("Roboto-MediumItalic"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOjCnqEu92Fr1Mu51S7ACc2CsTYl4BOQ3o.woff2) + format("woff2"); + unicode-range: U+1F00-1FFF; +} +/* greek */ +@font-face { + font-family: "Roboto"; + font-style: italic; + font-weight: 500; + font-display: swap; + src: local("Roboto Medium Italic"), local("Roboto-MediumItalic"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOjCnqEu92Fr1Mu51S7ACc5CsTYl4BOQ3o.woff2) + format("woff2"); + unicode-range: U+0370-03FF; +} +/* vietnamese */ +@font-face { + font-family: "Roboto"; + font-style: italic; + font-weight: 500; + font-display: swap; + src: local("Roboto Medium Italic"), local("Roboto-MediumItalic"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOjCnqEu92Fr1Mu51S7ACc1CsTYl4BOQ3o.woff2) + format("woff2"); + unicode-range: U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB; +} +/* latin-ext */ +@font-face { + font-family: "Roboto"; + font-style: italic; + font-weight: 500; + font-display: swap; + src: local("Roboto Medium Italic"), local("Roboto-MediumItalic"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOjCnqEu92Fr1Mu51S7ACc0CsTYl4BOQ3o.woff2) + format("woff2"); + unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, + U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; +} +/* latin */ +@font-face { + font-family: "Roboto"; + font-style: italic; + font-weight: 500; + font-display: swap; + src: local("Roboto Medium Italic"), local("Roboto-MediumItalic"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOjCnqEu92Fr1Mu51S7ACc6CsTYl4BO.woff2) + format("woff2"); + unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, + U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, + U+FEFF, U+FFFD; +} +/* cyrillic-ext */ +@font-face { + font-family: "Roboto"; + font-style: italic; + font-weight: 700; + font-display: swap; + src: local("Roboto Bold Italic"), local("Roboto-BoldItalic"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOjCnqEu92Fr1Mu51TzBic3CsTYl4BOQ3o.woff2) + format("woff2"); + unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, + U+FE2E-FE2F; +} +/* cyrillic */ +@font-face { + font-family: "Roboto"; + font-style: italic; + font-weight: 700; + font-display: swap; + src: local("Roboto Bold Italic"), local("Roboto-BoldItalic"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOjCnqEu92Fr1Mu51TzBic-CsTYl4BOQ3o.woff2) + format("woff2"); + unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; +} +/* greek-ext */ +@font-face { + font-family: "Roboto"; + font-style: italic; + font-weight: 700; + font-display: swap; + src: local("Roboto Bold Italic"), local("Roboto-BoldItalic"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOjCnqEu92Fr1Mu51TzBic2CsTYl4BOQ3o.woff2) + format("woff2"); + unicode-range: U+1F00-1FFF; +} +/* greek */ +@font-face { + font-family: "Roboto"; + font-style: italic; + font-weight: 700; + font-display: swap; + src: local("Roboto Bold Italic"), local("Roboto-BoldItalic"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOjCnqEu92Fr1Mu51TzBic5CsTYl4BOQ3o.woff2) + format("woff2"); + unicode-range: U+0370-03FF; +} +/* vietnamese */ +@font-face { + font-family: "Roboto"; + font-style: italic; + font-weight: 700; + font-display: swap; + src: local("Roboto Bold Italic"), local("Roboto-BoldItalic"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOjCnqEu92Fr1Mu51TzBic1CsTYl4BOQ3o.woff2) + format("woff2"); + unicode-range: U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB; +} +/* latin-ext */ +@font-face { + font-family: "Roboto"; + font-style: italic; + font-weight: 700; + font-display: swap; + src: local("Roboto Bold Italic"), local("Roboto-BoldItalic"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOjCnqEu92Fr1Mu51TzBic0CsTYl4BOQ3o.woff2) + format("woff2"); + unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, + U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; +} +/* latin */ +@font-face { + font-family: "Roboto"; + font-style: italic; + font-weight: 700; + font-display: swap; + src: local("Roboto Bold Italic"), local("Roboto-BoldItalic"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOjCnqEu92Fr1Mu51TzBic6CsTYl4BO.woff2) + format("woff2"); + unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, + U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, + U+FEFF, U+FFFD; +} +/* cyrillic-ext */ +@font-face { + font-family: "Roboto"; + font-style: italic; + font-weight: 900; + font-display: swap; + src: local("Roboto Black Italic"), local("Roboto-BlackItalic"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOjCnqEu92Fr1Mu51TLBCc3CsTYl4BOQ3o.woff2) + format("woff2"); + unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, + U+FE2E-FE2F; +} +/* cyrillic */ +@font-face { + font-family: "Roboto"; + font-style: italic; + font-weight: 900; + font-display: swap; + src: local("Roboto Black Italic"), local("Roboto-BlackItalic"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOjCnqEu92Fr1Mu51TLBCc-CsTYl4BOQ3o.woff2) + format("woff2"); + unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; +} +/* greek-ext */ +@font-face { + font-family: "Roboto"; + font-style: italic; + font-weight: 900; + font-display: swap; + src: local("Roboto Black Italic"), local("Roboto-BlackItalic"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOjCnqEu92Fr1Mu51TLBCc2CsTYl4BOQ3o.woff2) + format("woff2"); + unicode-range: U+1F00-1FFF; +} +/* greek */ +@font-face { + font-family: "Roboto"; + font-style: italic; + font-weight: 900; + font-display: swap; + src: local("Roboto Black Italic"), local("Roboto-BlackItalic"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOjCnqEu92Fr1Mu51TLBCc5CsTYl4BOQ3o.woff2) + format("woff2"); + unicode-range: U+0370-03FF; +} +/* vietnamese */ +@font-face { + font-family: "Roboto"; + font-style: italic; + font-weight: 900; + font-display: swap; + src: local("Roboto Black Italic"), local("Roboto-BlackItalic"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOjCnqEu92Fr1Mu51TLBCc1CsTYl4BOQ3o.woff2) + format("woff2"); + unicode-range: U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB; +} +/* latin-ext */ +@font-face { + font-family: "Roboto"; + font-style: italic; + font-weight: 900; + font-display: swap; + src: local("Roboto Black Italic"), local("Roboto-BlackItalic"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOjCnqEu92Fr1Mu51TLBCc0CsTYl4BOQ3o.woff2) + format("woff2"); + unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, + U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; +} +/* latin */ +@font-face { + font-family: "Roboto"; + font-style: italic; + font-weight: 900; + font-display: swap; + src: local("Roboto Black Italic"), local("Roboto-BlackItalic"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOjCnqEu92Fr1Mu51TLBCc6CsTYl4BO.woff2) + format("woff2"); + unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, + U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, + U+FEFF, U+FFFD; +} +/* cyrillic-ext */ +@font-face { + font-family: "Roboto"; + font-style: normal; + font-weight: 100; + font-display: swap; + src: local("Roboto Thin"), local("Roboto-Thin"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOkCnqEu92Fr1MmgVxFIzIXKMnyrYk.woff2) + format("woff2"); + unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, + U+FE2E-FE2F; +} +/* cyrillic */ +@font-face { + font-family: "Roboto"; + font-style: normal; + font-weight: 100; + font-display: swap; + src: local("Roboto Thin"), local("Roboto-Thin"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOkCnqEu92Fr1MmgVxMIzIXKMnyrYk.woff2) + format("woff2"); + unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; +} +/* greek-ext */ +@font-face { + font-family: "Roboto"; + font-style: normal; + font-weight: 100; + font-display: swap; + src: local("Roboto Thin"), local("Roboto-Thin"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOkCnqEu92Fr1MmgVxEIzIXKMnyrYk.woff2) + format("woff2"); + unicode-range: U+1F00-1FFF; +} +/* greek */ +@font-face { + font-family: "Roboto"; + font-style: normal; + font-weight: 100; + font-display: swap; + src: local("Roboto Thin"), local("Roboto-Thin"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOkCnqEu92Fr1MmgVxLIzIXKMnyrYk.woff2) + format("woff2"); + unicode-range: U+0370-03FF; +} +/* vietnamese */ +@font-face { + font-family: "Roboto"; + font-style: normal; + font-weight: 100; + font-display: swap; + src: local("Roboto Thin"), local("Roboto-Thin"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOkCnqEu92Fr1MmgVxHIzIXKMnyrYk.woff2) + format("woff2"); + unicode-range: U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB; +} +/* latin-ext */ +@font-face { + font-family: "Roboto"; + font-style: normal; + font-weight: 100; + font-display: swap; + src: local("Roboto Thin"), local("Roboto-Thin"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOkCnqEu92Fr1MmgVxGIzIXKMnyrYk.woff2) + format("woff2"); + unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, + U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; +} +/* latin */ +@font-face { + font-family: "Roboto"; + font-style: normal; + font-weight: 100; + font-display: swap; + src: local("Roboto Thin"), local("Roboto-Thin"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOkCnqEu92Fr1MmgVxIIzIXKMny.woff2) + format("woff2"); + unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, + U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, + U+FEFF, U+FFFD; +} +/* cyrillic-ext */ +@font-face { + font-family: "Roboto"; + font-style: normal; + font-weight: 300; + font-display: swap; + src: local("Roboto Light"), local("Roboto-Light"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOlCnqEu92Fr1MmSU5fCRc4AMP6lbBP.woff2) + format("woff2"); + unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, + U+FE2E-FE2F; +} +/* cyrillic */ +@font-face { + font-family: "Roboto"; + font-style: normal; + font-weight: 300; + font-display: swap; + src: local("Roboto Light"), local("Roboto-Light"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOlCnqEu92Fr1MmSU5fABc4AMP6lbBP.woff2) + format("woff2"); + unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; +} +/* greek-ext */ +@font-face { + font-family: "Roboto"; + font-style: normal; + font-weight: 300; + font-display: swap; + src: local("Roboto Light"), local("Roboto-Light"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOlCnqEu92Fr1MmSU5fCBc4AMP6lbBP.woff2) + format("woff2"); + unicode-range: U+1F00-1FFF; +} +/* greek */ +@font-face { + font-family: "Roboto"; + font-style: normal; + font-weight: 300; + font-display: swap; + src: local("Roboto Light"), local("Roboto-Light"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOlCnqEu92Fr1MmSU5fBxc4AMP6lbBP.woff2) + format("woff2"); + unicode-range: U+0370-03FF; +} +/* vietnamese */ +@font-face { + font-family: "Roboto"; + font-style: normal; + font-weight: 300; + font-display: swap; + src: local("Roboto Light"), local("Roboto-Light"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOlCnqEu92Fr1MmSU5fCxc4AMP6lbBP.woff2) + format("woff2"); + unicode-range: U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB; +} +/* latin-ext */ +@font-face { + font-family: "Roboto"; + font-style: normal; + font-weight: 300; + font-display: swap; + src: local("Roboto Light"), local("Roboto-Light"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOlCnqEu92Fr1MmSU5fChc4AMP6lbBP.woff2) + format("woff2"); + unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, + U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; +} +/* latin */ +@font-face { + font-family: "Roboto"; + font-style: normal; + font-weight: 300; + font-display: swap; + src: local("Roboto Light"), local("Roboto-Light"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOlCnqEu92Fr1MmSU5fBBc4AMP6lQ.woff2) + format("woff2"); + unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, + U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, + U+FEFF, U+FFFD; +} +/* cyrillic-ext */ +@font-face { + font-family: "Roboto"; + font-style: normal; + font-weight: 400; + font-display: swap; + src: local("Roboto"), local("Roboto-Regular"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOmCnqEu92Fr1Mu72xKKTU1Kvnz.woff2) + format("woff2"); + unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, + U+FE2E-FE2F; +} +/* cyrillic */ +@font-face { + font-family: "Roboto"; + font-style: normal; + font-weight: 400; + font-display: swap; + src: local("Roboto"), local("Roboto-Regular"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOmCnqEu92Fr1Mu5mxKKTU1Kvnz.woff2) + format("woff2"); + unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; +} +/* greek-ext */ +@font-face { + font-family: "Roboto"; + font-style: normal; + font-weight: 400; + font-display: swap; + src: local("Roboto"), local("Roboto-Regular"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOmCnqEu92Fr1Mu7mxKKTU1Kvnz.woff2) + format("woff2"); + unicode-range: U+1F00-1FFF; +} +/* greek */ +@font-face { + font-family: "Roboto"; + font-style: normal; + font-weight: 400; + font-display: swap; + src: local("Roboto"), local("Roboto-Regular"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOmCnqEu92Fr1Mu4WxKKTU1Kvnz.woff2) + format("woff2"); + unicode-range: U+0370-03FF; +} +/* vietnamese */ +@font-face { + font-family: "Roboto"; + font-style: normal; + font-weight: 400; + font-display: swap; + src: local("Roboto"), local("Roboto-Regular"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOmCnqEu92Fr1Mu7WxKKTU1Kvnz.woff2) + format("woff2"); + unicode-range: U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB; +} +/* latin-ext */ +@font-face { + font-family: "Roboto"; + font-style: normal; + font-weight: 400; + font-display: swap; + src: local("Roboto"), local("Roboto-Regular"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOmCnqEu92Fr1Mu7GxKKTU1Kvnz.woff2) + format("woff2"); + unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, + U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; +} +/* latin */ +@font-face { + font-family: "Roboto"; + font-style: normal; + font-weight: 400; + font-display: swap; + src: local("Roboto"), local("Roboto-Regular"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOmCnqEu92Fr1Mu4mxKKTU1Kg.woff2) + format("woff2"); + unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, + U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, + U+FEFF, U+FFFD; +} +/* cyrillic-ext */ +@font-face { + font-family: "Roboto"; + font-style: normal; + font-weight: 500; + font-display: swap; + src: local("Roboto Medium"), local("Roboto-Medium"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOlCnqEu92Fr1MmEU9fCRc4AMP6lbBP.woff2) + format("woff2"); + unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, + U+FE2E-FE2F; +} +/* cyrillic */ +@font-face { + font-family: "Roboto"; + font-style: normal; + font-weight: 500; + font-display: swap; + src: local("Roboto Medium"), local("Roboto-Medium"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOlCnqEu92Fr1MmEU9fABc4AMP6lbBP.woff2) + format("woff2"); + unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; +} +/* greek-ext */ +@font-face { + font-family: "Roboto"; + font-style: normal; + font-weight: 500; + font-display: swap; + src: local("Roboto Medium"), local("Roboto-Medium"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOlCnqEu92Fr1MmEU9fCBc4AMP6lbBP.woff2) + format("woff2"); + unicode-range: U+1F00-1FFF; +} +/* greek */ +@font-face { + font-family: "Roboto"; + font-style: normal; + font-weight: 500; + font-display: swap; + src: local("Roboto Medium"), local("Roboto-Medium"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOlCnqEu92Fr1MmEU9fBxc4AMP6lbBP.woff2) + format("woff2"); + unicode-range: U+0370-03FF; +} +/* vietnamese */ +@font-face { + font-family: "Roboto"; + font-style: normal; + font-weight: 500; + font-display: swap; + src: local("Roboto Medium"), local("Roboto-Medium"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOlCnqEu92Fr1MmEU9fCxc4AMP6lbBP.woff2) + format("woff2"); + unicode-range: U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB; +} +/* latin-ext */ +@font-face { + font-family: "Roboto"; + font-style: normal; + font-weight: 500; + font-display: swap; + src: local("Roboto Medium"), local("Roboto-Medium"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOlCnqEu92Fr1MmEU9fChc4AMP6lbBP.woff2) + format("woff2"); + unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, + U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; +} +/* latin */ +@font-face { + font-family: "Roboto"; + font-style: normal; + font-weight: 500; + font-display: swap; + src: local("Roboto Medium"), local("Roboto-Medium"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOlCnqEu92Fr1MmEU9fBBc4AMP6lQ.woff2) + format("woff2"); + unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, + U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, + U+FEFF, U+FFFD; +} +/* cyrillic-ext */ +@font-face { + font-family: "Roboto"; + font-style: normal; + font-weight: 700; + font-display: swap; + src: local("Roboto Bold"), local("Roboto-Bold"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOlCnqEu92Fr1MmWUlfCRc4AMP6lbBP.woff2) + format("woff2"); + unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, + U+FE2E-FE2F; +} +/* cyrillic */ +@font-face { + font-family: "Roboto"; + font-style: normal; + font-weight: 700; + font-display: swap; + src: local("Roboto Bold"), local("Roboto-Bold"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOlCnqEu92Fr1MmWUlfABc4AMP6lbBP.woff2) + format("woff2"); + unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; +} +/* greek-ext */ +@font-face { + font-family: "Roboto"; + font-style: normal; + font-weight: 700; + font-display: swap; + src: local("Roboto Bold"), local("Roboto-Bold"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOlCnqEu92Fr1MmWUlfCBc4AMP6lbBP.woff2) + format("woff2"); + unicode-range: U+1F00-1FFF; +} +/* greek */ +@font-face { + font-family: "Roboto"; + font-style: normal; + font-weight: 700; + font-display: swap; + src: local("Roboto Bold"), local("Roboto-Bold"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOlCnqEu92Fr1MmWUlfBxc4AMP6lbBP.woff2) + format("woff2"); + unicode-range: U+0370-03FF; +} +/* vietnamese */ +@font-face { + font-family: "Roboto"; + font-style: normal; + font-weight: 700; + font-display: swap; + src: local("Roboto Bold"), local("Roboto-Bold"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOlCnqEu92Fr1MmWUlfCxc4AMP6lbBP.woff2) + format("woff2"); + unicode-range: U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB; +} +/* latin-ext */ +@font-face { + font-family: "Roboto"; + font-style: normal; + font-weight: 700; + font-display: swap; + src: local("Roboto Bold"), local("Roboto-Bold"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOlCnqEu92Fr1MmWUlfChc4AMP6lbBP.woff2) + format("woff2"); + unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, + U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; +} +/* latin */ +@font-face { + font-family: "Roboto"; + font-style: normal; + font-weight: 700; + font-display: swap; + src: local("Roboto Bold"), local("Roboto-Bold"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOlCnqEu92Fr1MmWUlfBBc4AMP6lQ.woff2) + format("woff2"); + unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, + U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, + U+FEFF, U+FFFD; +} +/* cyrillic-ext */ +@font-face { + font-family: "Roboto"; + font-style: normal; + font-weight: 900; + font-display: swap; + src: local("Roboto Black"), local("Roboto-Black"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOlCnqEu92Fr1MmYUtfCRc4AMP6lbBP.woff2) + format("woff2"); + unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, + U+FE2E-FE2F; +} +/* cyrillic */ +@font-face { + font-family: "Roboto"; + font-style: normal; + font-weight: 900; + font-display: swap; + src: local("Roboto Black"), local("Roboto-Black"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOlCnqEu92Fr1MmYUtfABc4AMP6lbBP.woff2) + format("woff2"); + unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; +} +/* greek-ext */ +@font-face { + font-family: "Roboto"; + font-style: normal; + font-weight: 900; + font-display: swap; + src: local("Roboto Black"), local("Roboto-Black"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOlCnqEu92Fr1MmYUtfCBc4AMP6lbBP.woff2) + format("woff2"); + unicode-range: U+1F00-1FFF; +} +/* greek */ +@font-face { + font-family: "Roboto"; + font-style: normal; + font-weight: 900; + font-display: swap; + src: local("Roboto Black"), local("Roboto-Black"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOlCnqEu92Fr1MmYUtfBxc4AMP6lbBP.woff2) + format("woff2"); + unicode-range: U+0370-03FF; +} +/* vietnamese */ +@font-face { + font-family: "Roboto"; + font-style: normal; + font-weight: 900; + font-display: swap; + src: local("Roboto Black"), local("Roboto-Black"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOlCnqEu92Fr1MmYUtfCxc4AMP6lbBP.woff2) + format("woff2"); + unicode-range: U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB; +} +/* latin-ext */ +@font-face { + font-family: "Roboto"; + font-style: normal; + font-weight: 900; + font-display: swap; + src: local("Roboto Black"), local("Roboto-Black"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOlCnqEu92Fr1MmYUtfChc4AMP6lbBP.woff2) + format("woff2"); + unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, + U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; +} +/* latin */ +@font-face { + font-family: "Roboto"; + font-style: normal; + font-weight: 900; + font-display: swap; + src: local("Roboto Black"), local("Roboto-Black"), + url(https://fonts.gstatic.com/s/roboto/v20/KFOlCnqEu92Fr1MmYUtfBBc4AMP6lQ.woff2) + format("woff2"); + unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, + U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, + U+FEFF, U+FFFD; +} diff --git a/src/assets/fonts/.DS_Store b/src/assets/fonts/.DS_Store new file mode 100755 index 0000000..a739ae2 Binary files /dev/null and b/src/assets/fonts/.DS_Store differ diff --git a/src/assets/fonts/roboto/LICENSE.txt b/src/assets/fonts/roboto/LICENSE.txt new file mode 100755 index 0000000..75b5248 --- /dev/null +++ b/src/assets/fonts/roboto/LICENSE.txt @@ -0,0 +1,202 @@ + + Apache License + Version 2.0, January 2004 + http://www.apache.org/licenses/ + + TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION + + 1. Definitions. + + "License" shall mean the terms and conditions for use, reproduction, + and distribution as defined by Sections 1 through 9 of this document. + + "Licensor" shall mean the copyright owner or entity authorized by + the copyright owner that is granting the License. + + "Legal Entity" shall mean the union of the acting entity and all + other entities that control, are controlled by, or are under common + control with that entity. For the purposes of this definition, + "control" means (i) the power, direct or indirect, to cause the + direction or management of such entity, whether by contract or + otherwise, or (ii) ownership of fifty percent (50%) or more of the + outstanding shares, or (iii) beneficial ownership of such entity. + + "You" (or "Your") shall mean an individual or Legal Entity + exercising permissions granted by this License. + + "Source" form shall mean the preferred form for making modifications, + including but not limited to software source code, documentation + source, and configuration files. + + "Object" form shall mean any form resulting from mechanical + transformation or translation of a Source form, including but + not limited to compiled object code, generated documentation, + and conversions to other media types. + + "Work" shall mean the work of authorship, whether in Source or + Object form, made available under the License, as indicated by a + copyright notice that is included in or attached to the work + (an example is provided in the Appendix below). + + "Derivative Works" shall mean any work, whether in Source or Object + form, that is based on (or derived from) the Work and for which the + editorial revisions, annotations, elaborations, or other modifications + represent, as a whole, an original work of authorship. For the purposes + of this License, Derivative Works shall not include works that remain + separable from, or merely link (or bind by name) to the interfaces of, + the Work and Derivative Works thereof. + + "Contribution" shall mean any work of authorship, including + the original version of the Work and any modifications or additions + to that Work or Derivative Works thereof, that is intentionally + submitted to Licensor for inclusion in the Work by the copyright owner + or by an individual or Legal Entity authorized to submit on behalf of + the copyright owner. For the purposes of this definition, "submitted" + means any form of electronic, verbal, or written communication sent + to the Licensor or its representatives, including but not limited to + communication on electronic mailing lists, source code control systems, + and issue tracking systems that are managed by, or on behalf of, the + Licensor for the purpose of discussing and improving the Work, but + excluding communication that is conspicuously marked or otherwise + designated in writing by the copyright owner as "Not a Contribution." + + "Contributor" shall mean Licensor and any individual or Legal Entity + on behalf of whom a Contribution has been received by Licensor and + subsequently incorporated within the Work. + + 2. Grant of Copyright License. Subject to the terms and conditions of + this License, each Contributor hereby grants to You a perpetual, + worldwide, non-exclusive, no-charge, royalty-free, irrevocable + copyright license to reproduce, prepare Derivative Works of, + publicly display, publicly perform, sublicense, and distribute the + Work and such Derivative Works in Source or Object form. + + 3. Grant of Patent License. Subject to the terms and conditions of + this License, each Contributor hereby grants to You a perpetual, + worldwide, non-exclusive, no-charge, royalty-free, irrevocable + (except as stated in this section) patent license to make, have made, + use, offer to sell, sell, import, and otherwise transfer the Work, + where such license applies only to those patent claims licensable + by such Contributor that are necessarily infringed by their + Contribution(s) alone or by combination of their Contribution(s) + with the Work to which such Contribution(s) was submitted. If You + institute patent litigation against any entity (including a + cross-claim or counterclaim in a lawsuit) alleging that the Work + or a Contribution incorporated within the Work constitutes direct + or contributory patent infringement, then any patent licenses + granted to You under this License for that Work shall terminate + as of the date such litigation is filed. + + 4. Redistribution. You may reproduce and distribute copies of the + Work or Derivative Works thereof in any medium, with or without + modifications, and in Source or Object form, provided that You + meet the following conditions: + + (a) You must give any other recipients of the Work or + Derivative Works a copy of this License; and + + (b) You must cause any modified files to carry prominent notices + stating that You changed the files; and + + (c) You must retain, in the Source form of any Derivative Works + that You distribute, all copyright, patent, trademark, and + attribution notices from the Source form of the Work, + excluding those notices that do not pertain to any part of + the Derivative Works; and + + (d) If the Work includes a "NOTICE" text file as part of its + distribution, then any Derivative Works that You distribute must + include a readable copy of the attribution notices contained + within such NOTICE file, excluding those notices that do not + pertain to any part of the Derivative Works, in at least one + of the following places: within a NOTICE text file distributed + as part of the Derivative Works; within the Source form or + documentation, if provided along with the Derivative Works; or, + within a display generated by the Derivative Works, if and + wherever such third-party notices normally appear. The contents + of the NOTICE file are for informational purposes only and + do not modify the License. You may add Your own attribution + notices within Derivative Works that You distribute, alongside + or as an addendum to the NOTICE text from the Work, provided + that such additional attribution notices cannot be construed + as modifying the License. + + You may add Your own copyright statement to Your modifications and + may provide additional or different license terms and conditions + for use, reproduction, or distribution of Your modifications, or + for any such Derivative Works as a whole, provided Your use, + reproduction, and distribution of the Work otherwise complies with + the conditions stated in this License. + + 5. Submission of Contributions. Unless You explicitly state otherwise, + any Contribution intentionally submitted for inclusion in the Work + by You to the Licensor shall be under the terms and conditions of + this License, without any additional terms or conditions. + Notwithstanding the above, nothing herein shall supersede or modify + the terms of any separate license agreement you may have executed + with Licensor regarding such Contributions. + + 6. Trademarks. This License does not grant permission to use the trade + names, trademarks, service marks, or product names of the Licensor, + except as required for reasonable and customary use in describing the + origin of the Work and reproducing the content of the NOTICE file. + + 7. Disclaimer of Warranty. Unless required by applicable law or + agreed to in writing, Licensor provides the Work (and each + Contributor provides its Contributions) on an "AS IS" BASIS, + WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or + implied, including, without limitation, any warranties or conditions + of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A + PARTICULAR PURPOSE. You are solely responsible for determining the + appropriateness of using or redistributing the Work and assume any + risks associated with Your exercise of permissions under this License. + + 8. Limitation of Liability. In no event and under no legal theory, + whether in tort (including negligence), contract, or otherwise, + unless required by applicable law (such as deliberate and grossly + negligent acts) or agreed to in writing, shall any Contributor be + liable to You for damages, including any direct, indirect, special, + incidental, or consequential damages of any character arising as a + result of this License or out of the use or inability to use the + Work (including but not limited to damages for loss of goodwill, + work stoppage, computer failure or malfunction, or any and all + other commercial damages or losses), even if such Contributor + has been advised of the possibility of such damages. + + 9. Accepting Warranty or Additional Liability. While redistributing + the Work or Derivative Works thereof, You may choose to offer, + and charge a fee for, acceptance of support, warranty, indemnity, + or other liability obligations and/or rights consistent with this + License. However, in accepting such obligations, You may act only + on Your own behalf and on Your sole responsibility, not on behalf + of any other Contributor, and only if You agree to indemnify, + defend, and hold each Contributor harmless for any liability + incurred by, or claims asserted against, such Contributor by reason + of your accepting any such warranty or additional liability. + + END OF TERMS AND CONDITIONS + + APPENDIX: How to apply the Apache License to your work. + + To apply the Apache License to your work, attach the following + boilerplate notice, with the fields enclosed by brackets "[]" + replaced with your own identifying information. (Don't include + the brackets!) The text should be enclosed in the appropriate + comment syntax for the file format. We also recommend that a + file or class name and description of purpose be included on the + same "printed page" as the copyright notice for easier + identification within third-party archives. + + Copyright [yyyy] [name of copyright owner] + + Licensed under the Apache License, Version 2.0 (the "License"); + you may not use this file except in compliance with the License. + You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + + Unless required by applicable law or agreed to in writing, software + distributed under the License is distributed on an "AS IS" BASIS, + WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + See the License for the specific language governing permissions and + limitations under the License. diff --git a/src/assets/fonts/roboto/Roboto-Black.ttf b/src/assets/fonts/roboto/Roboto-Black.ttf new file mode 100755 index 0000000..2d45238 Binary files /dev/null and b/src/assets/fonts/roboto/Roboto-Black.ttf differ diff --git a/src/assets/fonts/roboto/Roboto-BlackItalic.ttf b/src/assets/fonts/roboto/Roboto-BlackItalic.ttf new file mode 100755 index 0000000..29a4359 Binary files /dev/null and b/src/assets/fonts/roboto/Roboto-BlackItalic.ttf differ diff --git a/src/assets/fonts/roboto/Roboto-Bold.ttf b/src/assets/fonts/roboto/Roboto-Bold.ttf new file mode 100755 index 0000000..d998cf5 Binary files /dev/null and b/src/assets/fonts/roboto/Roboto-Bold.ttf differ diff --git a/src/assets/fonts/roboto/Roboto-BoldItalic.ttf b/src/assets/fonts/roboto/Roboto-BoldItalic.ttf new file mode 100755 index 0000000..b4e2210 Binary files /dev/null and b/src/assets/fonts/roboto/Roboto-BoldItalic.ttf differ diff --git a/src/assets/fonts/roboto/Roboto-Italic.ttf b/src/assets/fonts/roboto/Roboto-Italic.ttf new file mode 100755 index 0000000..5b390ff Binary files /dev/null and b/src/assets/fonts/roboto/Roboto-Italic.ttf differ diff --git a/src/assets/fonts/roboto/Roboto-Light.ttf b/src/assets/fonts/roboto/Roboto-Light.ttf new file mode 100755 index 0000000..3526798 Binary files /dev/null and b/src/assets/fonts/roboto/Roboto-Light.ttf differ diff --git a/src/assets/fonts/roboto/Roboto-LightItalic.ttf b/src/assets/fonts/roboto/Roboto-LightItalic.ttf new file mode 100755 index 0000000..46e9bf7 Binary files /dev/null and b/src/assets/fonts/roboto/Roboto-LightItalic.ttf differ diff --git a/src/assets/fonts/roboto/Roboto-Medium.ttf b/src/assets/fonts/roboto/Roboto-Medium.ttf new file mode 100755 index 0000000..f714a51 Binary files /dev/null and b/src/assets/fonts/roboto/Roboto-Medium.ttf differ diff --git a/src/assets/fonts/roboto/Roboto-MediumItalic.ttf b/src/assets/fonts/roboto/Roboto-MediumItalic.ttf new file mode 100755 index 0000000..5dc6a2d Binary files /dev/null and b/src/assets/fonts/roboto/Roboto-MediumItalic.ttf differ diff --git a/src/assets/fonts/roboto/Roboto-Regular.ttf b/src/assets/fonts/roboto/Roboto-Regular.ttf new file mode 100755 index 0000000..2b6392f Binary files /dev/null and b/src/assets/fonts/roboto/Roboto-Regular.ttf differ diff --git a/src/assets/fonts/roboto/Roboto-Thin.ttf b/src/assets/fonts/roboto/Roboto-Thin.ttf new file mode 100755 index 0000000..4e797cf Binary files /dev/null and b/src/assets/fonts/roboto/Roboto-Thin.ttf differ diff --git a/src/assets/fonts/roboto/Roboto-ThinItalic.ttf b/src/assets/fonts/roboto/Roboto-ThinItalic.ttf new file mode 100755 index 0000000..eea836f Binary files /dev/null and b/src/assets/fonts/roboto/Roboto-ThinItalic.ttf differ diff --git a/src/assets/images/.DS_Store b/src/assets/images/.DS_Store new file mode 100755 index 0000000..6d84df8 Binary files /dev/null and b/src/assets/images/.DS_Store differ diff --git a/src/assets/images/bg-main-dark.svg b/src/assets/images/bg-main-dark.svg new file mode 100644 index 0000000..3347a47 --- /dev/null +++ b/src/assets/images/bg-main-dark.svg @@ -0,0 +1,3 @@ + diff --git a/src/assets/images/bg-main.svg b/src/assets/images/bg-main.svg new file mode 100644 index 0000000..01060cc --- /dev/null +++ b/src/assets/images/bg-main.svg @@ -0,0 +1,3 @@ + diff --git a/src/assets/images/error-illustration.svg b/src/assets/images/error-illustration.svg new file mode 100644 index 0000000..19f09e9 --- /dev/null +++ b/src/assets/images/error-illustration.svg @@ -0,0 +1,72 @@ + diff --git a/src/assets/images/food-beverage-1.jpg b/src/assets/images/food-beverage-1.jpg new file mode 100755 index 0000000..547586c Binary files /dev/null and b/src/assets/images/food-beverage-1.jpg differ diff --git a/src/assets/images/food-beverage-10.jpg b/src/assets/images/food-beverage-10.jpg new file mode 100755 index 0000000..b860fcc Binary files /dev/null and b/src/assets/images/food-beverage-10.jpg differ diff --git a/src/assets/images/food-beverage-11.jpg b/src/assets/images/food-beverage-11.jpg new file mode 100755 index 0000000..8136d3b Binary files /dev/null and b/src/assets/images/food-beverage-11.jpg differ diff --git a/src/assets/images/food-beverage-12.jpg b/src/assets/images/food-beverage-12.jpg new file mode 100755 index 0000000..dc18308 Binary files /dev/null and b/src/assets/images/food-beverage-12.jpg differ diff --git a/src/assets/images/food-beverage-13.jpg b/src/assets/images/food-beverage-13.jpg new file mode 100755 index 0000000..2daf94d Binary files /dev/null and b/src/assets/images/food-beverage-13.jpg differ diff --git a/src/assets/images/food-beverage-14.jpg b/src/assets/images/food-beverage-14.jpg new file mode 100755 index 0000000..53ab2f9 Binary files /dev/null and b/src/assets/images/food-beverage-14.jpg differ diff --git a/src/assets/images/food-beverage-15.jpg b/src/assets/images/food-beverage-15.jpg new file mode 100755 index 0000000..a78064a Binary files /dev/null and b/src/assets/images/food-beverage-15.jpg differ diff --git a/src/assets/images/food-beverage-16.jpg b/src/assets/images/food-beverage-16.jpg new file mode 100755 index 0000000..39282a9 Binary files /dev/null and b/src/assets/images/food-beverage-16.jpg differ diff --git a/src/assets/images/food-beverage-17.jpg b/src/assets/images/food-beverage-17.jpg new file mode 100755 index 0000000..8ad5e92 Binary files /dev/null and b/src/assets/images/food-beverage-17.jpg differ diff --git a/src/assets/images/food-beverage-18.jpg b/src/assets/images/food-beverage-18.jpg new file mode 100755 index 0000000..70f6ba7 Binary files /dev/null and b/src/assets/images/food-beverage-18.jpg differ diff --git a/src/assets/images/food-beverage-19.jpg b/src/assets/images/food-beverage-19.jpg new file mode 100755 index 0000000..b76b335 Binary files /dev/null and b/src/assets/images/food-beverage-19.jpg differ diff --git a/src/assets/images/food-beverage-2.jpg b/src/assets/images/food-beverage-2.jpg new file mode 100755 index 0000000..c49f8d1 Binary files /dev/null and b/src/assets/images/food-beverage-2.jpg differ diff --git a/src/assets/images/food-beverage-3.jpg b/src/assets/images/food-beverage-3.jpg new file mode 100755 index 0000000..9d027e1 Binary files /dev/null and b/src/assets/images/food-beverage-3.jpg differ diff --git a/src/assets/images/food-beverage-4.jpg b/src/assets/images/food-beverage-4.jpg new file mode 100755 index 0000000..94579c6 Binary files /dev/null and b/src/assets/images/food-beverage-4.jpg differ diff --git a/src/assets/images/food-beverage-5.jpg b/src/assets/images/food-beverage-5.jpg new file mode 100755 index 0000000..ddf354f Binary files /dev/null and b/src/assets/images/food-beverage-5.jpg differ diff --git a/src/assets/images/food-beverage-6.jpg b/src/assets/images/food-beverage-6.jpg new file mode 100755 index 0000000..efe41d6 Binary files /dev/null and b/src/assets/images/food-beverage-6.jpg differ diff --git a/src/assets/images/food-beverage-7.jpg b/src/assets/images/food-beverage-7.jpg new file mode 100755 index 0000000..7ce9373 Binary files /dev/null and b/src/assets/images/food-beverage-7.jpg differ diff --git a/src/assets/images/food-beverage-8.jpg b/src/assets/images/food-beverage-8.jpg new file mode 100755 index 0000000..70ce8da Binary files /dev/null and b/src/assets/images/food-beverage-8.jpg differ diff --git a/src/assets/images/food-beverage-9.jpg b/src/assets/images/food-beverage-9.jpg new file mode 100755 index 0000000..ff4e94b Binary files /dev/null and b/src/assets/images/food-beverage-9.jpg differ diff --git a/src/assets/images/illustration.svg b/src/assets/images/illustration.svg new file mode 100644 index 0000000..a0ae933 --- /dev/null +++ b/src/assets/images/illustration.svg @@ -0,0 +1,121 @@ + diff --git a/src/assets/images/logo.svg b/src/assets/images/logo.svg new file mode 100644 index 0000000..28c5228 --- /dev/null +++ b/src/assets/images/logo.svg @@ -0,0 +1,9 @@ + diff --git a/src/assets/images/map-marker-dark.svg b/src/assets/images/map-marker-dark.svg new file mode 100644 index 0000000..474b9e7 --- /dev/null +++ b/src/assets/images/map-marker-dark.svg @@ -0,0 +1,6 @@ + diff --git a/src/assets/images/map-marker-region-dark.svg b/src/assets/images/map-marker-region-dark.svg new file mode 100644 index 0000000..4e774e7 --- /dev/null +++ b/src/assets/images/map-marker-region-dark.svg @@ -0,0 +1,20 @@ + diff --git a/src/assets/images/map-marker-region.svg b/src/assets/images/map-marker-region.svg new file mode 100644 index 0000000..3f6991f --- /dev/null +++ b/src/assets/images/map-marker-region.svg @@ -0,0 +1,20 @@ + diff --git a/src/assets/images/map-marker.svg b/src/assets/images/map-marker.svg new file mode 100644 index 0000000..4dd6a9b --- /dev/null +++ b/src/assets/images/map-marker.svg @@ -0,0 +1,6 @@ + diff --git a/src/assets/images/phone-illustration.svg b/src/assets/images/phone-illustration.svg new file mode 100644 index 0000000..279c65a --- /dev/null +++ b/src/assets/images/phone-illustration.svg @@ -0,0 +1,11 @@ + diff --git a/src/assets/images/placeholders/.DS_Store b/src/assets/images/placeholders/.DS_Store new file mode 100755 index 0000000..5008ddf Binary files /dev/null and b/src/assets/images/placeholders/.DS_Store differ diff --git a/src/assets/images/placeholders/200x200.jpg b/src/assets/images/placeholders/200x200.jpg new file mode 100755 index 0000000..4d40faa Binary files /dev/null and b/src/assets/images/placeholders/200x200.jpg differ diff --git a/src/assets/images/placeholders/800x800.jpg b/src/assets/images/placeholders/800x800.jpg new file mode 100755 index 0000000..560c7f6 Binary files /dev/null and b/src/assets/images/placeholders/800x800.jpg differ diff --git a/src/assets/images/preview-1.jpg b/src/assets/images/preview-1.jpg new file mode 100755 index 0000000..e303cc2 Binary files /dev/null and b/src/assets/images/preview-1.jpg differ diff --git a/src/assets/images/preview-10.jpg b/src/assets/images/preview-10.jpg new file mode 100755 index 0000000..c0b6e3f Binary files /dev/null and b/src/assets/images/preview-10.jpg differ diff --git a/src/assets/images/preview-11.jpg b/src/assets/images/preview-11.jpg new file mode 100755 index 0000000..3f2ef43 Binary files /dev/null and b/src/assets/images/preview-11.jpg differ diff --git a/src/assets/images/preview-12.jpg b/src/assets/images/preview-12.jpg new file mode 100755 index 0000000..e88dcf2 Binary files /dev/null and b/src/assets/images/preview-12.jpg differ diff --git a/src/assets/images/preview-13.jpg b/src/assets/images/preview-13.jpg new file mode 100755 index 0000000..348cbfe Binary files /dev/null and b/src/assets/images/preview-13.jpg differ diff --git a/src/assets/images/preview-14.jpg b/src/assets/images/preview-14.jpg new file mode 100755 index 0000000..da2cf26 Binary files /dev/null and b/src/assets/images/preview-14.jpg differ diff --git a/src/assets/images/preview-15.jpg b/src/assets/images/preview-15.jpg new file mode 100755 index 0000000..61008f8 Binary files /dev/null and b/src/assets/images/preview-15.jpg differ diff --git a/src/assets/images/preview-2.jpg b/src/assets/images/preview-2.jpg new file mode 100755 index 0000000..b709fe7 Binary files /dev/null and b/src/assets/images/preview-2.jpg differ diff --git a/src/assets/images/preview-3.jpg b/src/assets/images/preview-3.jpg new file mode 100755 index 0000000..3c7c5fa Binary files /dev/null and b/src/assets/images/preview-3.jpg differ diff --git a/src/assets/images/preview-4.jpg b/src/assets/images/preview-4.jpg new file mode 100755 index 0000000..ddd80c8 Binary files /dev/null and b/src/assets/images/preview-4.jpg differ diff --git a/src/assets/images/preview-5.jpg b/src/assets/images/preview-5.jpg new file mode 100755 index 0000000..736a6bd Binary files /dev/null and b/src/assets/images/preview-5.jpg differ diff --git a/src/assets/images/preview-6.jpg b/src/assets/images/preview-6.jpg new file mode 100755 index 0000000..d696a88 Binary files /dev/null and b/src/assets/images/preview-6.jpg differ diff --git a/src/assets/images/preview-7.jpg b/src/assets/images/preview-7.jpg new file mode 100755 index 0000000..d43746a Binary files /dev/null and b/src/assets/images/preview-7.jpg differ diff --git a/src/assets/images/preview-8.jpg b/src/assets/images/preview-8.jpg new file mode 100755 index 0000000..9bd6b3a Binary files /dev/null and b/src/assets/images/preview-8.jpg differ diff --git a/src/assets/images/preview-9.jpg b/src/assets/images/preview-9.jpg new file mode 100755 index 0000000..2df7b9c Binary files /dev/null and b/src/assets/images/preview-9.jpg differ diff --git a/src/assets/images/profile-1.jpg b/src/assets/images/profile-1.jpg new file mode 100755 index 0000000..766ead5 Binary files /dev/null and b/src/assets/images/profile-1.jpg differ diff --git a/src/assets/images/profile-10.jpg b/src/assets/images/profile-10.jpg new file mode 100755 index 0000000..c8cfd39 Binary files /dev/null and b/src/assets/images/profile-10.jpg differ diff --git a/src/assets/images/profile-11.jpg b/src/assets/images/profile-11.jpg new file mode 100755 index 0000000..345e72e Binary files /dev/null and b/src/assets/images/profile-11.jpg differ diff --git a/src/assets/images/profile-12.jpg b/src/assets/images/profile-12.jpg new file mode 100755 index 0000000..0f1549e Binary files /dev/null and b/src/assets/images/profile-12.jpg differ diff --git a/src/assets/images/profile-13.jpg b/src/assets/images/profile-13.jpg new file mode 100755 index 0000000..825cfc2 Binary files /dev/null and b/src/assets/images/profile-13.jpg differ diff --git a/src/assets/images/profile-14.jpg b/src/assets/images/profile-14.jpg new file mode 100755 index 0000000..c398c6a Binary files /dev/null and b/src/assets/images/profile-14.jpg differ diff --git a/src/assets/images/profile-15.jpg b/src/assets/images/profile-15.jpg new file mode 100755 index 0000000..0a8a04e Binary files /dev/null and b/src/assets/images/profile-15.jpg differ diff --git a/src/assets/images/profile-2.jpg b/src/assets/images/profile-2.jpg new file mode 100755 index 0000000..262fdd3 Binary files /dev/null and b/src/assets/images/profile-2.jpg differ diff --git a/src/assets/images/profile-3.jpg b/src/assets/images/profile-3.jpg new file mode 100755 index 0000000..bc46fce Binary files /dev/null and b/src/assets/images/profile-3.jpg differ diff --git a/src/assets/images/profile-4.jpg b/src/assets/images/profile-4.jpg new file mode 100755 index 0000000..ffa5e24 Binary files /dev/null and b/src/assets/images/profile-4.jpg differ diff --git a/src/assets/images/profile-5.jpg b/src/assets/images/profile-5.jpg new file mode 100755 index 0000000..953420d Binary files /dev/null and b/src/assets/images/profile-5.jpg differ diff --git a/src/assets/images/profile-6.jpg b/src/assets/images/profile-6.jpg new file mode 100755 index 0000000..ebf71d9 Binary files /dev/null and b/src/assets/images/profile-6.jpg differ diff --git a/src/assets/images/profile-7.jpg b/src/assets/images/profile-7.jpg new file mode 100755 index 0000000..b7f8cea Binary files /dev/null and b/src/assets/images/profile-7.jpg differ diff --git a/src/assets/images/profile-8.jpg b/src/assets/images/profile-8.jpg new file mode 100755 index 0000000..6caf684 Binary files /dev/null and b/src/assets/images/profile-8.jpg differ diff --git a/src/assets/images/profile-9.jpg b/src/assets/images/profile-9.jpg new file mode 100755 index 0000000..c5104d3 Binary files /dev/null and b/src/assets/images/profile-9.jpg differ diff --git a/src/assets/images/woman-illustration.svg b/src/assets/images/woman-illustration.svg new file mode 100644 index 0000000..f023ddf --- /dev/null +++ b/src/assets/images/woman-illustration.svg @@ -0,0 +1,32 @@ + diff --git a/src/assets/json/location.json b/src/assets/json/location.json new file mode 100755 index 0000000..6b40df8 --- /dev/null +++ b/src/assets/json/location.json @@ -0,0 +1 @@ +[{"name":"Official Store 1","latitude":"-6.1852503","longitude":"106.874831"},{"name":"Official Store 2","latitude":"-6.183166","longitude":"106.927962"},{"name":"Official Store 3","latitude":"-6.1441182","longitude":"106.8838333"},{"name":"Official Store 4","latitude":"5.5416023","longitude":"95.3367786"},{"name":"Official Store 5","latitude":"3.5374288","longitude":"98.7093122"},{"name":"Official Store 6","latitude":"3.6141928","longitude":"98.7069495"},{"name":"Official Store 7","latitude":"-0.8676445","longitude":"100.3798576"},{"name":"Official Store 8","latitude":"0.4249965","longitude":"101.4378315"},{"name":"Official Store 9","latitude":"1.1375711","longitude":"104.0167512"},{"name":"Official Store 10","latitude":"-2.9098656","longitude":"104.7148521"},{"name":"Official Store 11","latitude":"-2.9716029","longitude":"104.7123907"},{"name":"Official Store 12","latitude":"-1.6192371","longitude":"103.5948793"},{"name":"Official Store 13","latitude":"-3.86789","longitude":"102.3496487"},{"name":"Official Store 14","latitude":"-4.844925","longitude":"105.4727718"},{"name":"Official Store 15","latitude":"-6.4093355","longitude":"107.4820524"},{"name":"Official Store 16","latitude":"-6.2705453","longitude":"107.0887695"},{"name":"Official Store 17","latitude":"-6.9661824","longitude":"107.8209252"},{"name":"Official Store 18","latitude":"-6.9488713","longitude":"107.6226518"},{"name":"Official Store 19","latitude":"-7.0897999","longitude":"110.4095698"},{"name":"Official Store 20","latitude":"-6.959065","longitude":"110.445554"},{"name":"Official Store 21","latitude":"-7.5602719","longitude":"110.7599826"},{"name":"Official Store 22","latitude":"-7.3593881","longitude":"112.6789783"},{"name":"Official Store 23","latitude":"-8.613003","longitude":"115.1927548"},{"name":"Official Store 24","latitude":"-8.599562","longitude":"116.1826897"},{"name":"Official Store 25","latitude":"-0.0752469","longitude":"109.3652061"},{"name":"Official Store 26","latitude":"-2.5378343","longitude":"112.9251494"},{"name":"Official Store 27","latitude":"-3.4165662","longitude":"114.6798992"},{"name":"Official Store 28","latitude":"-0.4642793","longitude":"117.1406547"},{"name":"Official Store 29","latitude":"1.4707077","longitude":"124.9195984"},{"name":"Official Store 30","latitude":"-0.8533082","longitude":"119.8837662"},{"name":"Official Store 31","latitude":"-5.103227","longitude":"119.4581237"},{"name":"Official Store 32","latitude":"-3.9977317","longitude":"122.4997843"},{"name":"Official Store 33","latitude":"-3.638957","longitude":"128.2460404"},{"name":"Official Store 34","latitude":"-0.8902418","longitude":"131.3136297"},{"name":"Official Store 35","latitude":"-1.1618514","longitude":"116.850629"},{"name":"Official Store 36","latitude":"-6.1639704","longitude":"106.675014"},{"name":"Official Store 37","latitude":"3.5531273","longitude":"98.8489318"},{"name":"Official Store 38","latitude":"-1.2310798","longitude":"116.8749021"},{"name":"Official Store 39","latitude":"1.1375679","longitude":"104.0166845"},{"name":"Official Store 40","latitude":"-1.2760395","longitude":"116.8443807"},{"name":"Official Store 41","latitude":"-6.5065577","longitude":"106.8425623"},{"name":"Official Store 42","latitude":"-6.3113721","longitude":"106.7542655"},{"name":"Official Store 43","latitude":"1.3523704","longitude":"99.2879552"},{"name":"Official Store 44","latitude":"2.0640159","longitude":"99.8483406"},{"name":"Official Store 45","latitude":"-3.0422556","longitude":"104.7490286"},{"name":"Official Store 46","latitude":"0.3929823","longitude":"101.857644"},{"name":"Official Store 47","latitude":"0.4250072","longitude":"101.437869"},{"name":"Official Store 48","latitude":"-3.7858528","longitude":"103.6412456"},{"name":"Official Store 49","latitude":"-4.1249887","longitude":"104.1679203"},{"name":"Official Store 50","latitude":"-2.1852028","longitude":"106.1328731"},{"name":"Official Store 51","latitude":"-1.4989263","longitude":"102.1033271"},{"name":"Official Store 52","latitude":"-6.6727806","longitude":"106.8469738"},{"name":"Official Store 53","latitude":"-4.2924954","longitude":"105.2206822"},{"name":"Official Store 54","latitude":"-4.954338","longitude":"105.2156682"},{"name":"Official Store 55","latitude":"-6.7238977","longitude":"108.5381016"},{"name":"Official Store 56","latitude":"-6.0327028","longitude":"106.0856715"},{"name":"Official Store 57","latitude":"-6.2149033","longitude":"106.4903782"},{"name":"Official Store 58","latitude":"-7.3184246","longitude":"108.2280875"},{"name":"Official Store 59","latitude":"-6.950399","longitude":"110.4827914"},{"name":"Official Store 60","latitude":"-6.868285","longitude":"109.22041"},{"name":"Official Store 61","latitude":"-7.6761041","longitude":"109.0591339"},{"name":"Official Store 62","latitude":"-6.8428042","longitude":"110.8420163"},{"name":"Official Store 63","latitude":"-7.4895108","longitude":"110.2349109"},{"name":"Official Store 64","latitude":"-7.8993929","longitude":"112.6632471"},{"name":"Official Store 65","latitude":"-7.6876068","longitude":"110.3415865"},{"name":"Official Store 66","latitude":"-7.4425494","longitude":"109.2344842"},{"name":"Official Store 67","latitude":"-7.3593312","longitude":"112.6790201"},{"name":"Official Store 68","latitude":"-8.245422","longitude":"114.3504847"},{"name":"Official Store 69","latitude":"-8.2008189","longitude":"113.6256908"},{"name":"Official Store 70","latitude":"-6.8810115","longitude":"112.0453495"},{"name":"Official Store 71","latitude":"-0.0752237","longitude":"109.3652161"},{"name":"Official Store 72","latitude":"0.9013566","longitude":"108.9813182"},{"name":"Official Store 73","latitude":"-2.5978551","longitude":"111.740685"},{"name":"Official Store 74","latitude":"-0.4936963","longitude":"117.1272444"},{"name":"Official Store 75","latitude":"-3.416548","longitude":"114.6799044"},{"name":"Official Store 76","latitude":"0.5729273","longitude":"123.0534948"},{"name":"Official Store 77","latitude":"0.4719387","longitude":"121.9316166"},{"name":"Official Store 78","latitude":"-2.6853294","longitude":"118.8695314"},{"name":"Official Store 79","latitude":"-0.9472804","longitude":"122.7922123"},{"name":"Official Store 80","latitude":"0.7914249","longitude":"127.3860326"},{"name":"Official Store 81","latitude":"-6.331041","longitude":"106.6791615"},{"name":"Official Store 82","latitude":"-0.247822","longitude":"100.6113003"},{"name":"Official Store 83","latitude":"-3.0121331","longitude":"120.20444"},{"name":"Official Store 84","latitude":"-5.1031794","longitude":"119.4580494"},{"name":"Official Store 85","latitude":"3.5744226","longitude":"98.6264121"},{"name":"Official Store 86","latitude":"-2.7440137","longitude":"107.6662278"},{"name":"Official Store 87","latitude":"-7.8206124","longitude":"110.2392692"},{"name":"Official Store 88","latitude":"-8.4476922","longitude":"115.6101601"},{"name":"Official Store 89","latitude":"-8.5996004","longitude":"116.1826362"},{"name":"Official Store 90","latitude":"-7.770832","longitude":"113.1712474"},{"name":"Official Store 91","latitude":"-6.2877282","longitude":"106.9861742"},{"name":"Official Store 92","latitude":"-2.2418841","longitude":"113.9194271"},{"name":"Official Store 93","latitude":"-7.2292908","longitude":"112.709374"},{"name":"Official Store 94","latitude":"-8.0731916","longitude":"112.2111097"},{"name":"Official Store 95","latitude":"-7.4588653","longitude":"110.9553393"},{"name":"Official Store 96","latitude":"5.1790259","longitude":"97.1240924"},{"name":"Official Store 97","latitude":"-6.1044717","longitude":"106.1368467"},{"name":"Official Store 98","latitude":"3.6141774","longitude":"98.7070673"},{"name":"Official Store 99","latitude":"-7.5198744","longitude":"112.4180372"},{"name":"Official Store 100","latitude":"-4.5382239","longitude":"120.294035"},{"name":"Official Store 101","latitude":"-7.6464859","longitude":"111.5179105"},{"name":"Official Store 102","latitude":"3.6142321","longitude":"98.7070834"},{"name":"Official Store 103","latitude":"0.7059175","longitude":"100.5407274"},{"name":"Official Store 104","latitude":"-3.7835933","longitude":"103.5641778"},{"name":"Official Store 105","latitude":"-3.2706462","longitude":"102.9248041"},{"name":"Official Store 106","latitude":"-2.9755856","longitude":"104.7624241"},{"name":"Official Store 107","latitude":"-2.3050903","longitude":"102.6772189"},{"name":"Official Store 108","latitude":"-6.1339166","longitude":"106.7295565"},{"name":"Official Store 109","latitude":"-6.8387844","longitude":"107.4756305"},{"name":"Official Store 110","latitude":"-7.1847671","longitude":"107.8896932"},{"name":"Official Store 111","latitude":"-6.9168548","longitude":"109.7499356"},{"name":"Official Store 112","latitude":"-7.7544311","longitude":"112.0262064"},{"name":"Official Store 113","latitude":"-8.1276566","longitude":"115.0658719"},{"name":"Official Store 114","latitude":"-8.8096814","longitude":"121.6715332"},{"name":"Official Store 115","latitude":"-8.6208244","longitude":"122.2076267"},{"name":"Official Store 116","latitude":"-10.146679","longitude":"123.6298891"},{"name":"Official Store 117","latitude":"-8.6142786","longitude":"120.4314793"},{"name":"Official Store 118","latitude":"0.0697573","longitude":"111.4806546"},{"name":"Official Store 119","latitude":"-3.7601255","longitude":"115.4139977"},{"name":"Official Store 120","latitude":"-3.4511767","longitude":"116.002277"},{"name":"Official Store 121","latitude":"1.4429846","longitude":"124.8519072"},{"name":"Official Store 122","latitude":"-4.0015738","longitude":"119.632362"},{"name":"Official Store 123","latitude":"-5.2148973","longitude":"119.4496198"},{"name":"Official Store 124","latitude":"-2.5799295","longitude":"140.6864192"},{"name":"Official Store 125","latitude":"-3.8678528","longitude":"102.3496463"},{"name":"Official Store 126","latitude":"0.1222243","longitude":"110.5756725"},{"name":"Official Store 127","latitude":"-6.2749144","longitude":"107.2755399"},{"name":"Official Store 128","latitude":"-7.3982536","longitude":"109.6551233"},{"name":"Official Store 129","latitude":"-0.2478614","longitude":"100.6113663"},{"name":"Official Store 130","latitude":"-0.3933928","longitude":"102.4336727"},{"name":"Official Store 131","latitude":"-6.4007392","longitude":"106.8306165"},{"name":"Official Store 132","latitude":"-6.1250467","longitude":"106.7544877"},{"name":"Official Store 133","latitude":"-6.1476444","longitude":"106.8996159"},{"name":"Official Store 134","latitude":"-3.9876005","longitude":"119.6367823"},{"name":"Official Store 135","latitude":"-2.849401","longitude":"104.2354745"},{"name":"Official Store 136","latitude":"-2.8889114","longitude":"103.8592004"},{"name":"Official Store 137","latitude":"-6.4771433","longitude":"106.8835818"},{"name":"Official Store 138","latitude":"-6.267291","longitude":"107.2279994"},{"name":"Official Store 139","latitude":"-6.9756942","longitude":"110.3236059"},{"name":"Official Store 140","latitude":"-0.4619491","longitude":"117.1817322"},{"name":"Official Store 141","latitude":"-6.135616","longitude":"106.9350036"},{"name":"Official Store 142","latitude":"-5.5367405","longitude":"120.1958579"},{"name":"Official Store 143","latitude":"-5.4690771","longitude":"122.5902344"},{"name":"Official Store 144","latitude":"-6.9261476","longitude":"107.5918776"},{"name":"Official Store 145","latitude":"-2.9658194","longitude":"104.7951967"},{"name":"Official Store 146","latitude":"-6.2098193","longitude":"106.6239816"},{"name":"Official Store 147","latitude":"-6.2954638","longitude":"106.8688722"},{"name":"Official Store 148","latitude":"-6.9661829","longitude":"107.8209667"},{"name":"Official Store 149","latitude":"-6.8387546","longitude":"107.4757013"},{"name":"Official Store 150","latitude":"-6.9590747","longitude":"110.4434533"},{"name":"Official Store 151","latitude":"-7.6959958","longitude":"109.6974416"},{"name":"Official Store 152","latitude":"0.5420181","longitude":"123.0612653"},{"name":"Official Store 153","latitude":"-2.2617467","longitude":"120.4127428"},{"name":"Official Store 154","latitude":"0.7914448","longitude":"127.383961"},{"name":"Official Store 155","latitude":"0.7914448","longitude":"127.383961"},{"name":"Official Store 156","latitude":"-0.8656033","longitude":"134.0544935"},{"name":"Official Store 157","latitude":"3.5531566","longitude":"98.8489569"},{"name":"Official Store 158","latitude":"-6.2094091","longitude":"106.5658609"}] \ No newline at end of file diff --git a/src/components/.DS_Store b/src/components/.DS_Store new file mode 100644 index 0000000..56e1c99 Binary files /dev/null and b/src/components/.DS_Store differ diff --git a/src/components/calendar/Main.vue b/src/components/calendar/Main.vue new file mode 100644 index 0000000..d86dd27 --- /dev/null +++ b/src/components/calendar/Main.vue @@ -0,0 +1,62 @@ + + + diff --git a/src/components/dark-mode-switcher/Main.vue b/src/components/dark-mode-switcher/Main.vue new file mode 100644 index 0000000..ae66d45 --- /dev/null +++ b/src/components/dark-mode-switcher/Main.vue @@ -0,0 +1,36 @@ + + + diff --git a/src/components/donut-chart/Main.vue b/src/components/donut-chart/Main.vue new file mode 100644 index 0000000..fa79739 --- /dev/null +++ b/src/components/donut-chart/Main.vue @@ -0,0 +1,65 @@ + + + diff --git a/src/components/horizontal-bar-chart/Main.vue b/src/components/horizontal-bar-chart/Main.vue new file mode 100644 index 0000000..93c3702 --- /dev/null +++ b/src/components/horizontal-bar-chart/Main.vue @@ -0,0 +1,104 @@ + + + diff --git a/src/components/line-chart/Main.vue b/src/components/line-chart/Main.vue new file mode 100644 index 0000000..cebe673 --- /dev/null +++ b/src/components/line-chart/Main.vue @@ -0,0 +1,117 @@ + + + diff --git a/src/components/main-color-switcher/Main.vue b/src/components/main-color-switcher/Main.vue new file mode 100644 index 0000000..4433709 --- /dev/null +++ b/src/components/main-color-switcher/Main.vue @@ -0,0 +1,81 @@ + + + diff --git a/src/components/mobile-menu/Main.vue b/src/components/mobile-menu/Main.vue new file mode 100644 index 0000000..f979583 --- /dev/null +++ b/src/components/mobile-menu/Main.vue @@ -0,0 +1,164 @@ + + + diff --git a/src/components/mobile-menu/index.js b/src/components/mobile-menu/index.js new file mode 100644 index 0000000..fdbedce --- /dev/null +++ b/src/components/mobile-menu/index.js @@ -0,0 +1,30 @@ +import { ref } from "vue"; +import dom from "@left4code/tw-starter/dist/js/dom"; + +// Toggle mobile menu +const activeMobileMenu = ref(false); +const toggleMobileMenu = () => { + activeMobileMenu.value = !activeMobileMenu.value; +}; + +// Setup mobile menu +const linkTo = (menu, router) => { + if (menu.subMenu) { + menu.activeDropdown = !menu.activeDropdown; + } else { + activeMobileMenu.value = false; + router.push({ + name: menu.pageName, + }); + } +}; + +const enter = (el, done) => { + dom(el).slideDown(300); +}; + +const leave = (el, done) => { + dom(el).slideUp(300); +}; + +export { activeMobileMenu, toggleMobileMenu, linkTo, enter, leave }; diff --git a/src/components/pie-chart/Main.vue b/src/components/pie-chart/Main.vue new file mode 100644 index 0000000..488d73b --- /dev/null +++ b/src/components/pie-chart/Main.vue @@ -0,0 +1,65 @@ + + + diff --git a/src/components/report-bar-chart-1/Main.vue b/src/components/report-bar-chart-1/Main.vue new file mode 100644 index 0000000..c9b1a00 --- /dev/null +++ b/src/components/report-bar-chart-1/Main.vue @@ -0,0 +1,104 @@ + + + diff --git a/src/components/report-bar-chart/Main.vue b/src/components/report-bar-chart/Main.vue new file mode 100644 index 0000000..ba9b6fe --- /dev/null +++ b/src/components/report-bar-chart/Main.vue @@ -0,0 +1,122 @@ + + + diff --git a/src/components/report-donut-chart-1/Main.vue b/src/components/report-donut-chart-1/Main.vue new file mode 100644 index 0000000..6d87de6 --- /dev/null +++ b/src/components/report-donut-chart-1/Main.vue @@ -0,0 +1,64 @@ + + + diff --git a/src/components/report-donut-chart-2/Main.vue b/src/components/report-donut-chart-2/Main.vue new file mode 100644 index 0000000..a458083 --- /dev/null +++ b/src/components/report-donut-chart-2/Main.vue @@ -0,0 +1,66 @@ + + + diff --git a/src/components/report-donut-chart/Main.vue b/src/components/report-donut-chart/Main.vue new file mode 100644 index 0000000..6fbd102 --- /dev/null +++ b/src/components/report-donut-chart/Main.vue @@ -0,0 +1,64 @@ + + + diff --git a/src/components/report-line-chart/Main.vue b/src/components/report-line-chart/Main.vue new file mode 100644 index 0000000..f82fa12 --- /dev/null +++ b/src/components/report-line-chart/Main.vue @@ -0,0 +1,115 @@ + + + diff --git a/src/components/report-map/Main.vue b/src/components/report-map/Main.vue new file mode 100644 index 0000000..914cf81 --- /dev/null +++ b/src/components/report-map/Main.vue @@ -0,0 +1,660 @@ + + + diff --git a/src/components/report-pie-chart/Main.vue b/src/components/report-pie-chart/Main.vue new file mode 100644 index 0000000..e809bda --- /dev/null +++ b/src/components/report-pie-chart/Main.vue @@ -0,0 +1,62 @@ + + + diff --git a/src/components/side-menu-tooltip/Main.vue b/src/components/side-menu-tooltip/Main.vue new file mode 100644 index 0000000..6b417f4 --- /dev/null +++ b/src/components/side-menu-tooltip/Main.vue @@ -0,0 +1,49 @@ + + + diff --git a/src/components/simple-line-chart-1/Main.vue b/src/components/simple-line-chart-1/Main.vue new file mode 100644 index 0000000..11dc3a0 --- /dev/null +++ b/src/components/simple-line-chart-1/Main.vue @@ -0,0 +1,96 @@ + + + diff --git a/src/components/simple-line-chart-2/Main.vue b/src/components/simple-line-chart-2/Main.vue new file mode 100644 index 0000000..07ccb09 --- /dev/null +++ b/src/components/simple-line-chart-2/Main.vue @@ -0,0 +1,96 @@ + + + diff --git a/src/components/simple-line-chart-3/Main.vue b/src/components/simple-line-chart-3/Main.vue new file mode 100644 index 0000000..d8f3ee8 --- /dev/null +++ b/src/components/simple-line-chart-3/Main.vue @@ -0,0 +1,103 @@ + + + diff --git a/src/components/simple-line-chart-4/Main.vue b/src/components/simple-line-chart-4/Main.vue new file mode 100644 index 0000000..d8f3ee8 --- /dev/null +++ b/src/components/simple-line-chart-4/Main.vue @@ -0,0 +1,103 @@ + + + diff --git a/src/components/simple-line-chart/Main.vue b/src/components/simple-line-chart/Main.vue new file mode 100644 index 0000000..f2d4f99 --- /dev/null +++ b/src/components/simple-line-chart/Main.vue @@ -0,0 +1,97 @@ + + + diff --git a/src/components/stacked-bar-chart-1/Main.vue b/src/components/stacked-bar-chart-1/Main.vue new file mode 100644 index 0000000..ff3b573 --- /dev/null +++ b/src/components/stacked-bar-chart-1/Main.vue @@ -0,0 +1,94 @@ + + + diff --git a/src/components/stacked-bar-chart/Main.vue b/src/components/stacked-bar-chart/Main.vue new file mode 100644 index 0000000..d6022ce --- /dev/null +++ b/src/components/stacked-bar-chart/Main.vue @@ -0,0 +1,119 @@ + + + diff --git a/src/components/top-bar/Main.vue b/src/components/top-bar/Main.vue new file mode 100644 index 0000000..a4a60be --- /dev/null +++ b/src/components/top-bar/Main.vue @@ -0,0 +1,223 @@ + + + diff --git a/src/components/vertical-bar-chart/Main.vue b/src/components/vertical-bar-chart/Main.vue new file mode 100644 index 0000000..742c650 --- /dev/null +++ b/src/components/vertical-bar-chart/Main.vue @@ -0,0 +1,103 @@ + + + diff --git a/src/global-components/.DS_Store b/src/global-components/.DS_Store new file mode 100644 index 0000000..476ad84 Binary files /dev/null and b/src/global-components/.DS_Store differ diff --git a/src/global-components/accordion/index.js b/src/global-components/accordion/index.js new file mode 100644 index 0000000..97dd064 --- /dev/null +++ b/src/global-components/accordion/index.js @@ -0,0 +1,157 @@ +import { h, defineComponent, resolveDirective, withDirectives } from "vue"; +import dom from "@left4code/tw-starter/dist/js/dom"; +import "@left4code/tw-starter/dist/js/accordion"; + +const init = (el, { props, emit }) => { + const accordionGroupId = "_" + Math.random().toString(36).substr(2, 9); + dom(el).attr("id", accordionGroupId); + dom(el) + .find(".accordion-item") + .each(function (key, el) { + const accordionId = "_" + Math.random().toString(36).substr(2, 9); + const accordionPanelId = "_" + Math.random().toString(36).substr(2, 9); + dom(this).find(".accordion-header").attr("id", accordionId); + dom(this).find(".accordion-button").attr({ + "data-tw-target": accordionPanelId, + "aria-controls": accordionPanelId, + }); + dom(this).find(".accordion-collapse").attr({ + id: accordionPanelId, + "aria-labelledby": accordionId, + "data-tw-parent": accordionGroupId, + }); + + const accordion = tailwind.Accordion.getOrCreateInstance( + dom(el).find("[data-tw-toggle='collapse']")[0] + ); + + if (props.selectedIndex === null) { + accordion.hide(); + } else if (key === props.selectedIndex) { + accordion.show(); + } + + const accordionButton = dom(el).find(".accordion-header")[0]; + if (accordionButton["__initiated"] === undefined) { + accordionButton["__initiated"] = true; + + accordionButton.addEventListener("show.tw.accordion", () => { + emit("change", key); + }); + } + }); +}; + +// Accordion wrapper +const AccordionGroup = defineComponent({ + name: "AccordionGroup", + props: { + selectedIndex: { + type: [Number, Object], + default: 0, + }, + tag: { + type: String, + default: "div", + }, + }, + directives: { + accordion: { + mounted(el, { value }) { + init(el, value); + }, + updated(el, { value }) { + init(el, value); + }, + }, + }, + setup(props, { slots, attrs, emit }) { + const accordionDirective = resolveDirective("accordion"); + return () => + withDirectives( + h( + props.tag, + { + class: "accordion", + }, + slots.default() + ), + [[accordionDirective, { props, emit }]] + ); + }, +}); + +const AccordionItem = defineComponent({ + name: "AccordionItem", + setup(props, { slots, attrs, emit }) { + return () => + h( + "div", + { + class: "accordion-item", + }, + slots.default() + ); + }, +}); + +const Accordion = defineComponent({ + name: "Accordion", + props: { + class: { + type: String, + default: "", + }, + }, + setup(props, { slots, attrs, emit }) { + return () => + h( + "div", + { + class: "accordion-header", + }, + [ + h( + "button", + { + class: `accordion-button collapsed ${props.class}`, + type: "button", + "aria-expanded": false, + "data-tw-toggle": "collapse", + }, + slots.default() + ), + ] + ); + }, +}); + +const AccordionPanel = defineComponent({ + name: "AccordionPanel", + props: { + class: { + type: String, + default: "", + }, + }, + setup(props, { slots, attrs, emit }) { + return () => + h( + "div", + { + class: "accordion-collapse collapse", + }, + [ + h( + "div", + { + class: `accordion-body ${props.class}`, + }, + slots.default() + ), + ] + ); + }, +}); + +export { AccordionGroup, AccordionItem, Accordion, AccordionPanel }; diff --git a/src/global-components/alert/index.js b/src/global-components/alert/index.js new file mode 100644 index 0000000..efe9679 --- /dev/null +++ b/src/global-components/alert/index.js @@ -0,0 +1,76 @@ +import { h, ref, defineComponent, resolveDirective, withDirectives } from "vue"; +import "@left4code/tw-starter/dist/js/alert"; + +const init = (el, { props, emit }) => { + const alert = tailwind.Alert.getOrCreateInstance(el); + if (props.show) { + alert.show(); + } else { + alert.hide(); + } + + if (el["__initiated"] === undefined) { + el["__initiated"] = true; + + el.addEventListener("show.tw.alert", () => { + emit("show"); + }); + + el.addEventListener("shown.tw.alert", () => { + emit("shown"); + }); + + el.addEventListener("hide.tw.alert", () => { + emit("hide"); + }); + + el.addEventListener("hidden.tw.alert", () => { + emit("hidden"); + }); + } +}; + +// Alert wrapper +const Alert = defineComponent({ + name: "Alert", + props: { + show: { + type: Boolean, + default: true, + }, + }, + directives: { + alert: { + mounted(el, { value }) { + init(el, value); + }, + updated(el, { value }) { + init(el, value); + }, + }, + }, + setup(props, { slots, attrs, emit }) { + const alertRef = ref(); + const alertDirective = resolveDirective("alert"); + + return () => + withDirectives( + h( + "div", + { + class: "alert", + role: "alert", + ref: alertRef, + }, + slots.default({ + dismiss: () => { + tailwind.Alert.getOrCreateInstance(alertRef.value).hide(); + }, + }) + ), + [[alertDirective, { props, emit }]] + ); + }, +}); + +export { Alert }; diff --git a/src/global-components/calendar/Draggable.vue b/src/global-components/calendar/Draggable.vue new file mode 100644 index 0000000..302e48d --- /dev/null +++ b/src/global-components/calendar/Draggable.vue @@ -0,0 +1,26 @@ + + + diff --git a/src/global-components/calendar/Main.vue b/src/global-components/calendar/Main.vue new file mode 100644 index 0000000..7ccbb9c --- /dev/null +++ b/src/global-components/calendar/Main.vue @@ -0,0 +1,25 @@ + + + diff --git a/src/global-components/chart/.DS_Store b/src/global-components/chart/.DS_Store new file mode 100644 index 0000000..2f831f5 Binary files /dev/null and b/src/global-components/chart/.DS_Store differ diff --git a/src/global-components/chart/Main.vue b/src/global-components/chart/Main.vue new file mode 100644 index 0000000..5d026b8 --- /dev/null +++ b/src/global-components/chart/Main.vue @@ -0,0 +1,84 @@ + + + diff --git a/src/global-components/ckeditor/BalloonBlockEditor.vue b/src/global-components/ckeditor/BalloonBlockEditor.vue new file mode 100644 index 0000000..2ac6d45 --- /dev/null +++ b/src/global-components/ckeditor/BalloonBlockEditor.vue @@ -0,0 +1,61 @@ + + + diff --git a/src/global-components/ckeditor/BalloonEditor.vue b/src/global-components/ckeditor/BalloonEditor.vue new file mode 100644 index 0000000..6980229 --- /dev/null +++ b/src/global-components/ckeditor/BalloonEditor.vue @@ -0,0 +1,61 @@ + + + diff --git a/src/global-components/ckeditor/ClassicEditor.vue b/src/global-components/ckeditor/ClassicEditor.vue new file mode 100644 index 0000000..32c8c26 --- /dev/null +++ b/src/global-components/ckeditor/ClassicEditor.vue @@ -0,0 +1,61 @@ + + + diff --git a/src/global-components/ckeditor/DocumentEditor.vue b/src/global-components/ckeditor/DocumentEditor.vue new file mode 100644 index 0000000..df9144e --- /dev/null +++ b/src/global-components/ckeditor/DocumentEditor.vue @@ -0,0 +1,61 @@ + + + diff --git a/src/global-components/ckeditor/InlineEditor.vue b/src/global-components/ckeditor/InlineEditor.vue new file mode 100644 index 0000000..f0ca62d --- /dev/null +++ b/src/global-components/ckeditor/InlineEditor.vue @@ -0,0 +1,61 @@ + + + diff --git a/src/global-components/ckeditor/index.js b/src/global-components/ckeditor/index.js new file mode 100644 index 0000000..384d2b9 --- /dev/null +++ b/src/global-components/ckeditor/index.js @@ -0,0 +1,45 @@ +import { watch } from "vue"; + +const init = async (el, editorBuild, { props, emit, cacheData }) => { + // Initial data + cacheData = props.modelValue; + props.config.initialData = props.modelValue; + + // Init CKEditor + const editor = await editorBuild.create(el, props.config); + + // Attach CKEditor instance + el.CKEditor = editor; + + // Set initial disabled state + editor.isReadOnly = props.disabled; + + // Set on change event + editor.model.document.on("change:data", () => { + const data = editor.getData(); + cacheData = data; + emit("update:modelValue", data); + }); + + // Set on focus event + editor.editing.view.document.on("focus", (evt) => { + emit("focus", evt, editor); + }); + + // Set on blur event + editor.editing.view.document.on("blur", (evt) => { + emit("blur", evt, editor); + }); + + // Set on ready event + emit("ready", editor); + + // Watch model change + watch(props, () => { + if (cacheData !== props.modelValue) { + el.CKEditor.setData(props.modelValue); + } + }); +}; + +export { init }; diff --git a/src/global-components/dropdown/index.js b/src/global-components/dropdown/index.js new file mode 100644 index 0000000..d82cdab --- /dev/null +++ b/src/global-components/dropdown/index.js @@ -0,0 +1,290 @@ +import { + h, + ref, + inject, + onMounted, + onUnmounted, + defineComponent, + resolveDirective, + withDirectives, +} from "vue"; +import dom from "@left4code/tw-starter/dist/js/dom"; +import "@left4code/tw-starter/dist/js/dropdown"; + +const init = (el, { props, emit }) => { + const dropdown = tailwind.Dropdown.getOrCreateInstance(el); + setTimeout(() => { + const isDropdownShowed = dom(el).find("[data-dropdown-replacer]").length; + if (props.show && !isDropdownShowed) { + dropdown.show(); + } else if (!props.show && isDropdownShowed) { + dropdown.hide(); + } + }); + + if (el["__initiated"] === undefined) { + el["__initiated"] = true; + + el.addEventListener("show.tw.dropdown", () => { + emit("show"); + }); + + el.addEventListener("shown.tw.dropdown", () => { + emit("shown"); + }); + + el.addEventListener("hide.tw.dropdown", () => { + emit("hide"); + }); + + el.addEventListener("hidden.tw.dropdown", () => { + emit("hidden"); + }); + } +}; + +// Dropdown wrapper +const Dropdown = defineComponent({ + name: "Dropdown", + props: { + show: { + type: Boolean, + default: false, + }, + placement: { + type: String, + default: "bottom-end", + }, + refKey: { + type: String, + default: null, + }, + }, + directives: { + dropdown: { + mounted(el, { value }) { + init(el, value); + }, + updated(el, { value }) { + init(el, value); + }, + }, + }, + setup(props, { slots, attrs, emit }) { + const dropdownRef = ref(); + const dropdownRefTemp = ref(); + + const bindInstance = () => { + if (props.refKey) { + const bind = inject(`bind[${props.refKey}]`); + if (bind) { + bind(tailwind.Dropdown.getOrCreateInstance(dropdownRef.value)); + } + } + }; + + onMounted(() => { + dropdownRefTemp.value = dropdownRef.value; + bindInstance(); + }); + + // Hide dropdown when route is changed + onUnmounted(() => { + tailwind.Dropdown.getOrCreateInstance(dropdownRefTemp.value).hide(); + }); + + const dropdownDirective = resolveDirective("dropdown"); + + return () => + withDirectives( + h( + "div", + { + class: "dropdown", + ref: dropdownRef, + "data-tw-placement": props.placement, + }, + slots.default({ + dismiss: () => { + tailwind.Dropdown.getOrCreateInstance(dropdownRef.value).hide(); + }, + }) + ), + [[dropdownDirective, { props, emit }]] + ); + }, +}); + +// Dropdown toggle +const DropdownToggle = defineComponent({ + name: "DropdownToggle", + props: { + tag: { + type: String, + default: "button", + }, + }, + setup(props, { slots, attrs, emit }) { + return () => + h( + props.tag, + { + class: "dropdown-toggle", + "aria-expanded": false, + "data-tw-toggle": "dropdown", + }, + slots.default() + ); + }, +}); + +// Dropdown menu +const DropdownMenu = defineComponent({ + name: "DropdownMenu", + setup(props, { slots, attrs, emit }) { + return () => + h( + "div", + { + class: "dropdown-menu", + }, + slots.default() + ); + }, +}); + +// Dropdown content +const DropdownContent = defineComponent({ + name: "DropdownContent", + props: { + tag: { + type: String, + default: "ul", + }, + }, + setup(props, { slots, attrs, emit }) { + return () => + h( + props.tag, + { + class: "dropdown-content", + }, + slots.default() + ); + }, +}); + +// Dropdown item +const DropdownItem = defineComponent({ + name: "DropdownItem", + props: { + tag: { + type: String, + default: "a", + }, + class: { + type: String, + default: "", + }, + }, + setup(props, { slots, attrs, emit }) { + return () => + h("li", [ + h( + props.tag, + { + class: ["dropdown-item cursor-pointer", props.class], + }, + slots.default() + ), + ]); + }, +}); + +// Dropdown header +const DropdownHeader = defineComponent({ + name: "DropdownHeader", + props: { + tag: { + type: String, + default: "h6", + }, + class: { + type: String, + default: "", + }, + }, + setup(props, { slots, attrs, emit }) { + return () => + h("li", [ + h( + props.tag, + { + class: ["dropdown-header", props.class], + }, + slots.default() + ), + ]); + }, +}); + +// Dropdown footer +const DropdownFooter = defineComponent({ + name: "DropdownFooter", + props: { + tag: { + type: String, + default: "div", + }, + class: { + type: String, + default: "", + }, + }, + setup(props, { slots, attrs, emit }) { + return () => + h("li", [ + h( + props.tag, + { + class: ["dropdown-footer", props.class], + }, + slots.default() + ), + ]); + }, +}); + +// Dropdown divider +const DropdownDivider = defineComponent({ + name: "DropdownDivider", + props: { + tag: { + type: String, + default: "hr", + }, + class: { + type: String, + default: "", + }, + }, + setup(props, { slots, attrs, emit }) { + return () => + h("li", [ + h(props.tag, { + class: ["dropdown-divider", props.class], + }), + ]); + }, +}); + +export { + Dropdown, + DropdownToggle, + DropdownMenu, + DropdownContent, + DropdownItem, + DropdownHeader, + DropdownFooter, + DropdownDivider, +}; diff --git a/src/global-components/dropzone/Main.vue b/src/global-components/dropzone/Main.vue new file mode 100644 index 0000000..159c320 --- /dev/null +++ b/src/global-components/dropzone/Main.vue @@ -0,0 +1,49 @@ + + + diff --git a/src/global-components/dropzone/index.js b/src/global-components/dropzone/index.js new file mode 100644 index 0000000..d1d6bac --- /dev/null +++ b/src/global-components/dropzone/index.js @@ -0,0 +1,8 @@ +import Dropzone from "dropzone"; + +const init = (el, props) => { + Dropzone.autoDiscover = false; + el.dropzone = new Dropzone(el, props.options); +}; + +export { init }; diff --git a/src/global-components/google-map-loader/.DS_Store b/src/global-components/google-map-loader/.DS_Store new file mode 100644 index 0000000..5712614 Binary files /dev/null and b/src/global-components/google-map-loader/.DS_Store differ diff --git a/src/global-components/google-map-loader/Main.vue b/src/global-components/google-map-loader/Main.vue new file mode 100644 index 0000000..65fe9f1 --- /dev/null +++ b/src/global-components/google-map-loader/Main.vue @@ -0,0 +1,22 @@ + + + diff --git a/src/global-components/google-map-loader/index.js b/src/global-components/google-map-loader/index.js new file mode 100644 index 0000000..3fe7074 --- /dev/null +++ b/src/global-components/google-map-loader/index.js @@ -0,0 +1,17 @@ +import { Loader } from '@googlemaps/js-api-loader' + +const initializeMap = async (mapRef, mapConfig) => { + await new Loader({ + apiKey: mapConfig.apiKey + }).load() + + const google = window.google + const map = new google.maps.Map(mapRef, mapConfig.config(google)) + + return { + map: map, + google: google + } +} + +export { initializeMap } diff --git a/src/global-components/highlight/Main.vue b/src/global-components/highlight/Main.vue new file mode 100644 index 0000000..38d67f4 --- /dev/null +++ b/src/global-components/highlight/Main.vue @@ -0,0 +1,66 @@ + + + diff --git a/src/global-components/index.js b/src/global-components/index.js new file mode 100644 index 0000000..4d54cdb --- /dev/null +++ b/src/global-components/index.js @@ -0,0 +1,94 @@ +import "zoom-vanilla.js/dist/zoom-vanilla.min.js"; +import Chart from "./chart/Main.vue"; +import GoogleMapLoader from "./google-map-loader/Main.vue"; +import Litepicker from "./litepicker/Main.vue"; +import Tippy from "./tippy/Main.vue"; +import TippyContent from "./tippy-content/Main.vue"; +import TomSelect from "./tom-select/Main.vue"; +import LoadingIcon from "./loading-icon/Main.vue"; +import TinySlider from "./tiny-slider/Main.vue"; +import ClassicEditor from "./ckeditor/ClassicEditor.vue"; +// import BalloonBlockEditor from './ckeditor/BalloonBlockEditor.vue' +// import BalloonEditor from './ckeditor/BalloonEditor.vue' +// import DocumentEditor from './ckeditor/DocumentEditor.vue' +// import InlineEditor from './ckeditor/InlineEditor.vue' +import Dropzone from "./dropzone/Main.vue"; +import FullCalendar from "./calendar/Main.vue"; +import FullCalendarDraggable from "./calendar/Draggable.vue"; +import Notification from "./notification/Main.vue"; +import { Modal, ModalHeader, ModalBody, ModalFooter } from "./modal"; +import { + Dropdown, + DropdownToggle, + DropdownMenu, + DropdownContent, + DropdownItem, + DropdownHeader, + DropdownFooter, + DropdownDivider, +} from "./dropdown"; +import { TabGroup, TabList, Tab, TabPanels, TabPanel } from "./tab"; +import { + AccordionGroup, + AccordionItem, + Accordion, + AccordionPanel, +} from "./accordion"; +import { Alert } from "./alert"; +import { + PreviewComponent, + Preview, + Source, + Highlight, +} from "./preview-component"; +import LucideIcons from "./lucide"; + +export default (app) => { + app.component("Chart", Chart); + app.component("GoogleMapLoader", GoogleMapLoader); + app.component("Litepicker", Litepicker); + app.component("Tippy", Tippy); + app.component("TippyContent", TippyContent); + app.component("TomSelect", TomSelect); + app.component("LoadingIcon", LoadingIcon); + app.component("TinySlider", TinySlider); + app.component("Dropzone", Dropzone); + app.component("ClassicEditor", ClassicEditor); + // app.component('BalloonBlockEditor', BalloonBlockEditor) + // app.component('BalloonEditor', BalloonEditor) + // app.component('DocumentEditor', DocumentEditor) + // app.component('InlineEditor', InlineEditor) + app.component("FullCalendar", FullCalendar); + app.component("FullCalendarDraggable", FullCalendarDraggable); + app.component("Notification", Notification); + app.component("Modal", Modal); + app.component("ModalHeader", ModalHeader); + app.component("ModalBody", ModalBody); + app.component("ModalFooter", ModalFooter); + app.component("Dropdown", Dropdown); + app.component("DropdownToggle", DropdownToggle); + app.component("DropdownMenu", DropdownMenu); + app.component("DropdownContent", DropdownContent); + app.component("DropdownItem", DropdownItem); + app.component("DropdownHeader", DropdownHeader); + app.component("DropdownFooter", DropdownFooter); + app.component("DropdownDivider", DropdownDivider); + app.component("TabGroup", TabGroup); + app.component("TabList", TabList); + app.component("Tab", Tab); + app.component("TabPanels", TabPanels); + app.component("TabPanel", TabPanel); + app.component("AccordionGroup", AccordionGroup); + app.component("AccordionItem", AccordionItem); + app.component("Accordion", Accordion); + app.component("AccordionPanel", AccordionPanel); + app.component("Alert", Alert); + app.component("PreviewComponent", PreviewComponent); + app.component("Preview", Preview); + app.component("Source", Source); + app.component("Highlight", Highlight); + + for (const [key, icon] of Object.entries(LucideIcons)) { + app.component(key, icon); + } +}; diff --git a/src/global-components/litepicker/Main.vue b/src/global-components/litepicker/Main.vue new file mode 100644 index 0000000..e731745 --- /dev/null +++ b/src/global-components/litepicker/Main.vue @@ -0,0 +1,64 @@ + + + + + diff --git a/src/global-components/litepicker/index.js b/src/global-components/litepicker/index.js new file mode 100644 index 0000000..81b16eb --- /dev/null +++ b/src/global-components/litepicker/index.js @@ -0,0 +1,49 @@ +import { reactive } from "vue"; +import dayjs from "dayjs"; +import Litepicker from "litepicker"; + +let litePickerInstance = reactive({}); + +const getDateFormat = (format) => { + return format !== undefined ? format : "D MMM, YYYY"; +}; + +const setValue = (props, emit) => { + const format = getDateFormat(props.options.format); + if (!props.modelValue.length) { + let date = dayjs().format(format); + date += + !props.options.singleMode && props.options.singleMode !== undefined + ? " - " + dayjs().add(1, "month").format(format) + : ""; + emit("update:modelValue", date); + } +}; + +const init = (el, props, emit) => { + const format = getDateFormat(props.options.format); + litePickerInstance = new Litepicker({ + element: el, + ...props.options, + format: format, + setup: (picker) => { + picker.on("selected", (startDate, endDate) => { + let date = dayjs(startDate.dateInstance).format(format); + date += + endDate !== undefined + ? " - " + dayjs(endDate.dateInstance).format(format) + : ""; + emit("update:modelValue", date); + }); + }, + }); + + el.Litepicker = litePickerInstance; +}; + +const reInit = (el, props, emit) => { + litePickerInstance.destroy(); + init(el, props, emit); +}; + +export { setValue, init, reInit }; diff --git a/src/global-components/loading-icon/Main.vue b/src/global-components/loading-icon/Main.vue new file mode 100644 index 0000000..24ed78c --- /dev/null +++ b/src/global-components/loading-icon/Main.vue @@ -0,0 +1,821 @@ + + + diff --git a/src/global-components/lucide/index.js b/src/global-components/lucide/index.js new file mode 100644 index 0000000..fe11b4e --- /dev/null +++ b/src/global-components/lucide/index.js @@ -0,0 +1,17 @@ +import { h, defineComponent } from "vue"; +import * as lucideIcons from "lucide-vue-next"; + +const icons = []; +for (const [key, icon] of Object.entries(lucideIcons)) { + icons[`${key}Icon`] = defineComponent({ + name: `${key}Icon`, + setup(props, { slots, attrs, emit }) { + return () => + h(icon, { + class: "lucide", + }); + }, + }); +} + +export default icons; diff --git a/src/global-components/modal/index.js b/src/global-components/modal/index.js new file mode 100644 index 0000000..eaba7b9 --- /dev/null +++ b/src/global-components/modal/index.js @@ -0,0 +1,178 @@ +import { + h, + ref, + inject, + onMounted, + defineComponent, + resolveDirective, + withDirectives, +} from "vue"; +import dom from "@left4code/tw-starter/dist/js/dom"; +import "@left4code/tw-starter/dist/js/modal"; + +const init = (el, { props, emit }) => { + const modal = tailwind.Modal.getOrCreateInstance(el); + if (props.show) { + modal.show(); + } else { + modal.hide(); + } + + if (el["__initiated"] === undefined) { + el["__initiated"] = true; + + el.addEventListener("show.tw.modal", () => { + emit("show"); + }); + + el.addEventListener("shown.tw.modal", () => { + emit("shown"); + }); + + el.addEventListener("hide.tw.modal", () => { + emit("hide"); + }); + + el.addEventListener("hidden.tw.modal", () => { + emit("hidden"); + }); + } +}; + +// Modal wrapper +const Modal = defineComponent({ + name: "Modal", + props: { + show: { + type: Boolean, + default: false, + }, + size: { + type: String, + default: "", + }, + backdrop: { + type: String, + default: "", + }, + slideOver: { + type: Boolean, + default: false, + }, + refKey: { + type: String, + default: null, + }, + }, + directives: { + modal: { + mounted(el, { value }) { + dom(el).attr("id", "_" + Math.random().toString(36).substr(2, 9)); + init(el, value); + }, + updated(el, { value }) { + init(el, value); + }, + }, + }, + setup(props, { slots, attrs, emit }) { + const modalRef = ref(); + const bindInstance = () => { + if (props.refKey) { + const bind = inject(`bind[${props.refKey}]`); + if (bind) { + bind(tailwind.Modal.getOrCreateInstance(modalRef.value)); + } + } + }; + + onMounted(() => { + bindInstance(); + }); + + const modalDirective = resolveDirective("modal"); + + return () => + withDirectives( + h( + "div", + { + class: ["modal", { "modal-slide-over": props.slideOver }], + tabindex: "-1", + "aria-hidden": "true", + "data-tw-backdrop": props.backdrop, + ref: modalRef, + }, + [ + h( + "div", + { + class: ["modal-dialog", props.size], + }, + [ + h( + "div", + { + class: "modal-content", + }, + slots.default({ + dismiss: () => { + tailwind.Modal.getOrCreateInstance(modalRef.value).hide(); + }, + }) + ), + ] + ), + ] + ), + [[modalDirective, { props, emit }]] + ); + }, +}); + +// Modal header +const ModalHeader = defineComponent({ + name: "ModalHeader", + setup(props, { slots, attrs, emit }) { + return () => + h( + "div", + { + class: "modal-header", + }, + slots.default() + ); + }, +}); + +// Modal body +const ModalBody = defineComponent({ + name: "ModalBody", + setup(props, { slots, attrs, emit }) { + return () => + h( + "div", + { + class: "modal-body", + }, + slots.default() + ); + }, +}); + +// Modal footer +const ModalFooter = defineComponent({ + name: "ModalFooter", + setup(props, { slots, attrs, emit }) { + return () => + h( + "div", + { + class: "modal-footer", + }, + slots.default() + ); + }, +}); + +export { Modal, ModalHeader, ModalBody, ModalFooter }; diff --git a/src/global-components/notification/Main.vue b/src/global-components/notification/Main.vue new file mode 100644 index 0000000..fd115fd --- /dev/null +++ b/src/global-components/notification/Main.vue @@ -0,0 +1,50 @@ + + + diff --git a/src/global-components/notification/index.js b/src/global-components/notification/index.js new file mode 100644 index 0000000..334fcec --- /dev/null +++ b/src/global-components/notification/index.js @@ -0,0 +1,37 @@ +import Toastify from "toastify-js"; +import dom from "@left4code/tw-starter/dist/js/dom"; + +const toastifyClass = "_" + Math.random().toString(36).substr(2, 9); + +const init = (el, props) => { + el.showToast = () => { + const clonedEl = dom(el).clone().removeClass("hidden")[0]; + dom(clonedEl).addClass(toastifyClass); + clonedEl.toastify = Toastify({ + duration: -1, + newWindow: true, + close: true, + gravity: "top", + position: "right", + stopOnFocus: true, + ...props.options, + node: clonedEl, + }).showToast(); + + dom(clonedEl).on("click", "[data-dismiss='notification']", function () { + clonedEl.toastify.hideToast(); + }); + }; + + el.hideToast = () => { + dom(`.${toastifyClass}`).each(function () { + dom(this)[0].toastify.hideToast(); + }); + }; +}; + +const reInit = (el) => { + dom(`.${toastifyClass}`).html(dom(el).html()); +}; + +export { init, reInit }; diff --git a/src/global-components/preview-component/index.js b/src/global-components/preview-component/index.js new file mode 100644 index 0000000..1f01e99 --- /dev/null +++ b/src/global-components/preview-component/index.js @@ -0,0 +1,164 @@ +import { + h, + defineComponent, + resolveDirective, + withDirectives, + provide, + inject, + ref, +} from "vue"; +import { File } from "lucide-vue-next"; +import jsBeautify from "js-beautify"; +import hljs from "highlight.js"; +import _ from "lodash"; + +// Preview coomponent wrapper +const PreviewComponent = defineComponent({ + name: "PreviewComponent", + setup(props, { slots, attrs, emit }) { + const previewCode = ref(true); + provide("previewCode", previewCode); + + return () => + h( + "div", + slots.default({ + toggle: () => { + previewCode.value = !previewCode.value; + }, + }) + ); + }, +}); + +// Preview +const Preview = defineComponent({ + name: "Preview", + setup(props, { slots, attrs, emit }) { + const previewCode = inject("previewCode"); + return () => (previewCode.value ? h("div", slots.default()) : ""); + }, +}); + +// Source +const Source = defineComponent({ + name: "Source", + setup(props, { slots, attrs, emit }) { + const previewCode = inject("previewCode"); + return () => (!previewCode.value ? h("div", slots.default()) : ""); + }, +}); + +// Highlight +const Highlight = defineComponent({ + name: "Highlight", + directives: { + highlight: { + mounted(el, { value }) { + let source = dom(el).find("code").html(); + + // Format for beautify + source = _.replace(source, /</g, "<"); + source = _.replace(source, />/g, ">"); + + // Beautify code + source = jsBeautify.html(source); + + // Save for copy code function + value.copySource.value = source; + + // Format for highlight.js + source = _.replace(source, //g, ">"); + + dom(el).find("code").html(source); + + hljs.highlightElement(dom(el).find("code")[0]); + }, + }, + }, + props: { + copyButton: { + type: Boolean, + default: true, + }, + type: { + type: String, + default: "html", + }, + class: { + type: String, + default: "", + }, + }, + setup(props, { slots, attrs, emit }) { + const highlightDirective = resolveDirective("highlight"); + const copyText = ref("Copy example code"); + const copySourceEl = ref(""); + const copySource = ref(""); + + return () => + h("div", [ + props.copyButton + ? h( + "button", + { + class: ["btn py-1 px-2 btn-outline-secondary", props.class], + onClick(event) { + copyText.value = "Copied!"; + setTimeout(() => { + copyText.value = "Copy example code"; + }, 1500); + + copySourceEl.value.select(); + copySourceEl.value.setSelectionRange(0, 99999); + document.execCommand("copy"); + }, + }, + [ + h(File, { + class: "w-4 h-4 mr-2", + }), + copyText.value, + ] + ) + : "", + withDirectives( + h( + "div", + { + class: [ + "rounded-md overflow-hidden relative", + props.copyButton ? "mt-3" : "", + !props.copyButton ? props.class : "", + ], + }, + h( + "pre", + { + class: + "source-preview !static overflow-y-auto !px-[16px] !py-[15px]", + }, + [ + h( + "code", + { + class: ["!-mb-[60px] !inline", props.type], + }, + slots.default() + ), + h("textarea", { + ref: copySourceEl, + value: copySource.value, + class: "absolute w-0 h-0 p-0", + }), + ] + ) + ), + [[highlightDirective, { props, emit, copySource }]] + ), + ]); + }, +}); + +export { PreviewComponent, Preview, Source, Highlight }; diff --git a/src/global-components/tab/index.js b/src/global-components/tab/index.js new file mode 100644 index 0000000..da64b9c --- /dev/null +++ b/src/global-components/tab/index.js @@ -0,0 +1,181 @@ +import { h, defineComponent, resolveDirective, withDirectives } from "vue"; +import dom from "@left4code/tw-starter/dist/js/dom"; +import "@left4code/tw-starter/dist/js/tab"; + +const init = (el, { props, emit }) => { + const tabPanels = dom(el).find(".tab-content").first(); + const tabPanes = dom(tabPanels).children(".tab-pane"); + const tabList = []; + const ids = []; + + dom(el) + .find(".nav") + .each(function () { + if (dom(this).closest(".tab-content")[0] !== tabPanels[0]) { + tabList.push(this); + } + }); + + tabList.forEach((node) => { + dom(node) + .find(".nav-item") + .each(function (key, el) { + let id = "_" + Math.random().toString(36).substr(2, 9); + if (ids[key] !== undefined) { + id = ids[key]; + } else { + ids[key] = id; + } + + dom(this) + .find(".nav-link") + .attr({ + "data-tw-target": `#${id}`, + "aria-controls": id, + "aria-selected": false, + }); + + if (tabPanes[key] !== undefined) { + dom(tabPanes[key]).attr({ + id: id, + "aria-labelledby": `${id}-tab`, + }); + } + + if (key === props.selectedIndex) { + const tab = tailwind.Tab.getOrCreateInstance( + dom(el).find(".nav-link")[0] + ); + tab.show(); + dom(tabPanes).removeAttr("style"); + } + + const navLink = dom(el).find(".nav-link")[0]; + if (navLink["__initiated"] === undefined) { + navLink["__initiated"] = true; + + navLink.addEventListener("show.tw.tab", () => { + emit("change", key); + }); + } + }); + }); +}; + +// Tab wrapper +const TabGroup = defineComponent({ + name: "TabGroup", + props: { + selectedIndex: { + type: Number, + default: 0, + }, + tag: { + type: String, + default: "div", + }, + }, + directives: { + tab: { + mounted(el, { value }) { + init(el, value); + }, + updated(el, { value }) { + init(el, value); + }, + }, + }, + setup(props, { slots, attrs, emit }) { + const tabDirective = resolveDirective("tab"); + return () => + withDirectives(h(props.tag, slots.default()), [ + [tabDirective, { props, emit }], + ]); + }, +}); + +// Tab wrapper +const TabList = defineComponent({ + name: "TabList", + setup(props, { slots, attrs, emit }) { + return () => + h( + "ul", + { + class: "nav", + role: "tablist", + }, + slots.default() + ); + }, +}); + +const Tab = defineComponent({ + name: "Tab", + props: { + fullWidth: { + type: Boolean, + default: true, + }, + tag: { + type: String, + default: "a", + }, + class: { + type: String, + default: "", + }, + }, + setup(props, { slots, attrs, emit }) { + return () => + h( + "li", + { + class: `nav-item ${props.fullWidth ? "flex-1" : ""}`, + role: "presentation", + }, + [ + h( + props.tag, + { + class: `nav-link ${props.class}`, + type: "button", + role: "tab", + }, + slots.default() + ), + ] + ); + }, +}); + +const TabPanels = defineComponent({ + name: "TabPanels", + setup(props, { slots, attrs, emit }) { + return () => + h( + "div", + { + class: "tab-content w-full", + }, + slots.default() + ); + }, +}); + +const TabPanel = defineComponent({ + name: "TabPanel", + setup(props, { slots, attrs, emit }) { + return () => + h( + "div", + { + class: "tab-pane", + role: "tabpanel", + }, + slots.default() + ); + }, +}); + +export { TabGroup, TabList, Tab, TabPanels, TabPanel }; diff --git a/src/global-components/tiny-slider/Main.vue b/src/global-components/tiny-slider/Main.vue new file mode 100644 index 0000000..f2514d6 --- /dev/null +++ b/src/global-components/tiny-slider/Main.vue @@ -0,0 +1,46 @@ + + + diff --git a/src/global-components/tiny-slider/index.js b/src/global-components/tiny-slider/index.js new file mode 100644 index 0000000..244125d --- /dev/null +++ b/src/global-components/tiny-slider/index.js @@ -0,0 +1,23 @@ +import { tns } from "tiny-slider/src/tiny-slider"; + +const init = (el, props) => { + el.tns = tns({ + container: el, + slideBy: "page", + mouseDrag: true, + autoplay: true, + controls: false, + nav: false, + speed: 500, + ...props.options, + }); +}; + +const reInit = (el) => { + if (el.tns.version !== null) { + el.tns.destroy(); + el.tns = el.tns.rebuild(); + } +}; + +export { init, reInit }; diff --git a/src/global-components/tippy-content/Main.vue b/src/global-components/tippy-content/Main.vue new file mode 100644 index 0000000..907f2a3 --- /dev/null +++ b/src/global-components/tippy-content/Main.vue @@ -0,0 +1,64 @@ + + + diff --git a/src/global-components/tippy/Main.vue b/src/global-components/tippy/Main.vue new file mode 100644 index 0000000..4d160c1 --- /dev/null +++ b/src/global-components/tippy/Main.vue @@ -0,0 +1,65 @@ + + + diff --git a/src/global-components/tom-select/Main.vue b/src/global-components/tom-select/Main.vue new file mode 100644 index 0000000..4722f39 --- /dev/null +++ b/src/global-components/tom-select/Main.vue @@ -0,0 +1,97 @@ + + + diff --git a/src/global-components/tom-select/index.js b/src/global-components/tom-select/index.js new file mode 100644 index 0000000..d8dd295 --- /dev/null +++ b/src/global-components/tom-select/index.js @@ -0,0 +1,107 @@ +import dom from "@left4code/tw-starter/dist/js/dom"; +import TomSelect from "tom-select"; +import _, { clone } from "lodash"; + +const setValue = (el, props) => { + if (props.modelValue.length) { + dom(el).val(props.modelValue); + } +}; + +const init = (originalEl, clonedEl, props, emit, computedOptions) => { + // On option add + if (Array.isArray(props.modelValue)) { + computedOptions = { + onOptionAdd: function (value) { + // Add new option + const newOption = document.createElement("option"); + newOption.value = value; + newOption.text = value; + originalEl.add(newOption); + + // Emit option add + emit("optionAdd", value); + }, + ...computedOptions, + }; + } + + clonedEl.TomSelect = new TomSelect(clonedEl, computedOptions); + + // On change + clonedEl.TomSelect.on("change", function (selectedItems) { + emit( + "update:modelValue", + Array.isArray(selectedItems) ? [...selectedItems] : selectedItems + ); + }); +}; + +const getOptions = (options, tempOptions = []) => { + options.each(function (optionKey, optionEl) { + if (optionEl instanceof HTMLOptGroupElement) { + getOptions(dom(optionEl).children(), tempOptions); + } else { + tempOptions.push(optionEl); + } + }); + + return tempOptions; +}; + +const updateValue = ( + originalEl, + clonedEl, + modelValue, + props, + emit, + computedOptions +) => { + // Remove old options + for (const [optionKey, option] of Object.entries( + clonedEl.TomSelect.options + )) { + if ( + !getOptions(dom(clonedEl).prev().children()).filter((optionEl) => { + return optionEl.value === option.value; + }).length + ) { + clonedEl.TomSelect.removeOption(option.value); + } + } + + // Update border style + dom(clonedEl.TomSelect.wrapper).css( + "border-color", + dom(originalEl).css("border-color") + ); + + // Add new options + dom(clonedEl) + .prev() + .children() + .each(function () { + clonedEl.TomSelect.addOption({ + text: dom(this).text(), + value: dom(this).attr("value"), + }); + }); + + // Refresh options + clonedEl.TomSelect.refreshOptions(false); + + // Update value + if ( + (!Array.isArray(modelValue) && + modelValue !== clonedEl.TomSelect.getValue()) || + (Array.isArray(modelValue) && + !_.isEqual(modelValue, clonedEl.TomSelect.getValue())) + ) { + clonedEl.TomSelect.destroy(); + dom(clonedEl).html(dom(clonedEl).prev().html()); + setValue(clonedEl, props); + init(originalEl, clonedEl, props, emit, computedOptions); + } +}; + +export { setValue, init, updateValue }; diff --git a/src/layouts/.DS_Store b/src/layouts/.DS_Store new file mode 100644 index 0000000..958c786 Binary files /dev/null and b/src/layouts/.DS_Store differ diff --git a/src/layouts/side-menu/.DS_Store b/src/layouts/side-menu/.DS_Store new file mode 100644 index 0000000..d77f360 Binary files /dev/null and b/src/layouts/side-menu/.DS_Store differ diff --git a/src/layouts/side-menu/Main.vue b/src/layouts/side-menu/Main.vue new file mode 100644 index 0000000..d6f0d63 --- /dev/null +++ b/src/layouts/side-menu/Main.vue @@ -0,0 +1,176 @@ + + + diff --git a/src/layouts/side-menu/index.js b/src/layouts/side-menu/index.js new file mode 100644 index 0000000..6ec2094 --- /dev/null +++ b/src/layouts/side-menu/index.js @@ -0,0 +1,66 @@ +import dom from "@left4code/tw-starter/dist/js/dom"; + +// Setup side menu +const findActiveMenu = (subMenu, route) => { + let match = false; + subMenu.forEach((item) => { + if ( + ((route.forceActiveMenu !== undefined && + item.pageName === route.forceActiveMenu) || + (route.forceActiveMenu === undefined && + item.pageName === route.name)) && + !item.ignore + ) { + match = true; + } else if (!match && item.subMenu) { + match = findActiveMenu(item.subMenu, route); + } + }); + return match; +}; + +const nestedMenu = (menu, route) => { + menu.forEach((item, key) => { + if (typeof item !== "string") { + let menuItem = menu[key]; + menuItem.active = + ((route.forceActiveMenu !== undefined && + item.pageName === route.forceActiveMenu) || + (route.forceActiveMenu === undefined && + item.pageName === route.name) || + (item.subMenu && findActiveMenu(item.subMenu, route))) && + !item.ignore; + + if (item.subMenu) { + menuItem.activeDropdown = findActiveMenu(item.subMenu, route); + menuItem = { + ...item, + ...nestedMenu(item.subMenu, route), + }; + } + } + }); + + return menu; +}; + +const linkTo = (menu, router, event) => { + if (menu.subMenu) { + menu.activeDropdown = !menu.activeDropdown; + } else { + event.preventDefault(); + router.push({ + name: menu.pageName, + }); + } +}; + +const enter = (el, done) => { + dom(el).slideDown(300); +}; + +const leave = (el, done) => { + dom(el).slideUp(300); +}; + +export { nestedMenu, linkTo, enter, leave }; diff --git a/src/layouts/simple-menu/Main.vue b/src/layouts/simple-menu/Main.vue new file mode 100644 index 0000000..9d3651a --- /dev/null +++ b/src/layouts/simple-menu/Main.vue @@ -0,0 +1,180 @@ + + + diff --git a/src/layouts/top-menu/Main.vue b/src/layouts/top-menu/Main.vue new file mode 100644 index 0000000..80fa2f1 --- /dev/null +++ b/src/layouts/top-menu/Main.vue @@ -0,0 +1,140 @@ + + + diff --git a/src/layouts/top-menu/index.js b/src/layouts/top-menu/index.js new file mode 100644 index 0000000..d4e194b --- /dev/null +++ b/src/layouts/top-menu/index.js @@ -0,0 +1,12 @@ +import { ref } from "vue"; + +// Toggle search dropdown +const searchDropdown = ref(false); +const showSearchDropdown = () => { + searchDropdown.value = true; +}; +const hideSearchDropdown = () => { + searchDropdown.value = false; +}; + +export { searchDropdown, showSearchDropdown, hideSearchDropdown }; diff --git a/src/main.js b/src/main.js new file mode 100644 index 0000000..c9521fd --- /dev/null +++ b/src/main.js @@ -0,0 +1,14 @@ +import { createApp } from "vue"; +import { createPinia } from "pinia"; +import App from "./App.vue"; +import router from "./router"; +import globalComponents from "./global-components"; +import utils from "./utils"; +import "./assets/css/app.css"; + +const app = createApp(App).use(router).use(createPinia()); + +globalComponents(app); +utils(app); + +app.mount("#app"); diff --git a/src/router/index.js b/src/router/index.js new file mode 100644 index 0000000..11f5148 --- /dev/null +++ b/src/router/index.js @@ -0,0 +1,1113 @@ +import { createRouter, createWebHistory } from "vue-router"; +import SideMenu from "../layouts/side-menu/Main.vue"; +import SimpleMenu from "../layouts/simple-menu/Main.vue"; +import TopMenu from "../layouts/top-menu/Main.vue"; +import DashboardOverview1 from "../views/dashboard-overview-1/Main.vue"; +import DashboardOverview2 from "../views/dashboard-overview-2/Main.vue"; +import DashboardOverview3 from "../views/dashboard-overview-3/Main.vue"; +import DashboardOverview4 from "../views/dashboard-overview-4/Main.vue"; +import Categories from "../views/categories/Main.vue"; +import AddProduct from "../views/add-product/Main.vue"; +import ProductList from "../views/product-list/Main.vue"; +import ProductGrid from "../views/product-grid/Main.vue"; +import TransactionList from "../views/transaction-list/Main.vue"; +import TransactionDetail from "../views/transaction-detail/Main.vue"; +import SellerList from "../views/seller-list/Main.vue"; +import SellerDetail from "../views/seller-detail/Main.vue"; +import Reviews from "../views/reviews/Main.vue"; +import Inbox from "../views/inbox/Main.vue"; +import FileManager from "../views/file-manager/Main.vue"; +import PointOfSale from "../views/point-of-sale/Main.vue"; +import Chat from "../views/chat/Main.vue"; +import Post from "../views/post/Main.vue"; +import Calendar from "../views/calendar/Main.vue"; +import CrudDataList from "../views/crud-data-list/Main.vue"; +import CrudForm from "../views/crud-form/Main.vue"; +import UsersLayout1 from "../views/users-layout-1/Main.vue"; +import UsersLayout2 from "../views/users-layout-2/Main.vue"; +import UsersLayout3 from "../views/users-layout-3/Main.vue"; +import ProfileOverview1 from "../views/profile-overview-1/Main.vue"; +import ProfileOverview2 from "../views/profile-overview-2/Main.vue"; +import ProfileOverview3 from "../views/profile-overview-3/Main.vue"; +import WizardLayout1 from "../views/wizard-layout-1/Main.vue"; +import WizardLayout2 from "../views/wizard-layout-2/Main.vue"; +import WizardLayout3 from "../views/wizard-layout-3/Main.vue"; +import BlogLayout1 from "../views/blog-layout-1/Main.vue"; +import BlogLayout2 from "../views/blog-layout-2/Main.vue"; +import BlogLayout3 from "../views/blog-layout-3/Main.vue"; +import PricingLayout1 from "../views/pricing-layout-1/Main.vue"; +import PricingLayout2 from "../views/pricing-layout-2/Main.vue"; +import InvoiceLayout1 from "../views/invoice-layout-1/Main.vue"; +import InvoiceLayout2 from "../views/invoice-layout-2/Main.vue"; +import FaqLayout1 from "../views/faq-layout-1/Main.vue"; +import FaqLayout2 from "../views/faq-layout-2/Main.vue"; +import FaqLayout3 from "../views/faq-layout-3/Main.vue"; +import Login from "../views/login/Main.vue"; +import Register from "../views/register/Main.vue"; +import ErrorPage from "../views/error-page/Main.vue"; +import UpdateProfile from "../views/update-profile/Main.vue"; +import ChangePassword from "../views/change-password/Main.vue"; +import RegularTable from "../views/regular-table/Main.vue"; +import Tabulator from "../views/tabulator/Main.vue"; +import Modal from "../views/modal/Main.vue"; +import SlideOver from "../views/slide-over/Main.vue"; +import Notification from "../views/notification/Main.vue"; +import Tab from "../views/tab/Main.vue"; +import Accordion from "../views/accordion/Main.vue"; +import Button from "../views/button/Main.vue"; +import Alert from "../views/alert/Main.vue"; +import ProgressBar from "../views/progress-bar/Main.vue"; +import Tooltip from "../views/tooltip/Main.vue"; +import Dropdown from "../views/dropdown/Main.vue"; +import Typography from "../views/typography/Main.vue"; +import Icon from "../views/icon/Main.vue"; +import LoadingIcon from "../views/loading-icon/Main.vue"; +import RegularForm from "../views/regular-form/Main.vue"; +import Datepicker from "../views/datepicker/Main.vue"; +import TomSelect from "../views/tom-select/Main.vue"; +import FileUpload from "../views/file-upload/Main.vue"; +import WysiwygEditor from "../views/wysiwg-editor/Main.vue"; +import Validation from "../views/validation/Main.vue"; +import Chart from "../views/chart/Main.vue"; +import Slider from "../views/slider/Main.vue"; +import ImageZoom from "../views/image-zoom/Main.vue"; + +const routes = [ + { + path: "/", + component: SideMenu, + children: [ + { + path: "dashboard-overview-1", + name: "side-menu-dashboard-overview-1", + component: DashboardOverview1, + }, + { + path: "/", + name: "side-menu-dashboard-overview-2", + component: DashboardOverview2, + }, + { + path: "dashboard-overview-3", + name: "side-menu-dashboard-overview-3", + component: DashboardOverview3, + }, + { + path: "dashboard-overview-4", + name: "side-menu-dashboard-overview-4", + component: DashboardOverview4, + }, + { + path: "categories", + name: "side-menu-categories", + component: Categories, + }, + { + path: "add-product", + name: "side-menu-add-product", + component: AddProduct, + }, + { + path: "product-list", + name: "side-menu-product-list", + component: ProductList, + }, + { + path: "product-grid", + name: "side-menu-product-grid", + component: ProductGrid, + }, + { + path: "transaction-list", + name: "side-menu-transaction-list", + component: TransactionList, + }, + { + path: "transaction-detail", + name: "side-menu-transaction-detail", + component: TransactionDetail, + }, + { + path: "seller-list", + name: "side-menu-seller-list", + component: SellerList, + }, + { + path: "seller-detail", + name: "side-menu-seller-detail", + component: SellerDetail, + }, + { + path: "reviews", + name: "side-menu-reviews", + component: Reviews, + }, + { + path: "inbox", + name: "side-menu-inbox", + component: Inbox, + }, + { + path: "file-manager", + name: "side-menu-file-manager", + component: FileManager, + }, + { + path: "point-of-sale", + name: "side-menu-point-of-sale", + component: PointOfSale, + }, + { + path: "chat", + name: "side-menu-chat", + component: Chat, + }, + { + path: "post", + name: "side-menu-post", + component: Post, + }, + { + path: "calendar", + name: "side-menu-calendar", + component: Calendar, + }, + { + path: "crud-data-list", + name: "side-menu-crud-data-list", + component: CrudDataList, + }, + { + path: "crud-form", + name: "side-menu-crud-form", + component: CrudForm, + }, + { + path: "users-layout-1", + name: "side-menu-users-layout-1", + component: UsersLayout1, + }, + { + path: "users-layout-2", + name: "side-menu-users-layout-2", + component: UsersLayout2, + }, + { + path: "users-layout-3", + name: "side-menu-users-layout-3", + component: UsersLayout3, + }, + { + path: "profile-overview-1", + name: "side-menu-profile-overview-1", + component: ProfileOverview1, + }, + { + path: "profile-overview-2", + name: "side-menu-profile-overview-2", + component: ProfileOverview2, + }, + { + path: "profile-overview-3", + name: "side-menu-profile-overview-3", + component: ProfileOverview3, + }, + { + path: "wizard-layout-1", + name: "side-menu-wizard-layout-1", + component: WizardLayout1, + }, + { + path: "wizard-layout-2", + name: "side-menu-wizard-layout-2", + component: WizardLayout2, + }, + { + path: "wizard-layout-3", + name: "side-menu-wizard-layout-3", + component: WizardLayout3, + }, + { + path: "blog-layout-1", + name: "side-menu-blog-layout-1", + component: BlogLayout1, + }, + { + path: "blog-layout-2", + name: "side-menu-blog-layout-2", + component: BlogLayout2, + }, + { + path: "blog-layout-3", + name: "side-menu-blog-layout-3", + component: BlogLayout3, + }, + { + path: "pricing-layout-1", + name: "side-menu-pricing-layout-1", + component: PricingLayout1, + }, + { + path: "pricing-layout-2", + name: "side-menu-pricing-layout-2", + component: PricingLayout2, + }, + { + path: "invoice-layout-1", + name: "side-menu-invoice-layout-1", + component: InvoiceLayout1, + }, + { + path: "invoice-layout-2", + name: "side-menu-invoice-layout-2", + component: InvoiceLayout2, + }, + { + path: "faq-layout-1", + name: "side-menu-faq-layout-1", + component: FaqLayout1, + }, + { + path: "faq-layout-2", + name: "side-menu-faq-layout-2", + component: FaqLayout2, + }, + { + path: "faq-layout-3", + name: "side-menu-faq-layout-3", + component: FaqLayout3, + }, + { + path: "update-profile", + name: "side-menu-update-profile", + component: UpdateProfile, + }, + { + path: "change-password", + name: "side-menu-change-password", + component: ChangePassword, + }, + { + path: "regular-table", + name: "side-menu-regular-table", + component: RegularTable, + }, + { + path: "tabulator", + name: "side-menu-tabulator", + component: Tabulator, + }, + { + path: "modal", + name: "side-menu-modal", + component: Modal, + }, + { + path: "slide-over", + name: "side-menu-slide-over", + component: SlideOver, + }, + { + path: "notification", + name: "side-menu-notification", + component: Notification, + }, + { + path: "tab", + name: "side-menu-tab", + component: Tab, + }, + { + path: "accordion", + name: "side-menu-accordion", + component: Accordion, + }, + { + path: "button", + name: "side-menu-button", + component: Button, + }, + { + path: "alert", + name: "side-menu-alert", + component: Alert, + }, + { + path: "progress-bar", + name: "side-menu-progress-bar", + component: ProgressBar, + }, + { + path: "tooltip", + name: "side-menu-tooltip", + component: Tooltip, + }, + { + path: "dropdown", + name: "side-menu-dropdown", + component: Dropdown, + }, + { + path: "typography", + name: "side-menu-typography", + component: Typography, + }, + { + path: "icon", + name: "side-menu-icon", + component: Icon, + }, + { + path: "loading-icon", + name: "side-menu-loading-icon", + component: LoadingIcon, + }, + { + path: "regular-form", + name: "side-menu-regular-form", + component: RegularForm, + }, + { + path: "datepicker", + name: "side-menu-datepicker", + component: Datepicker, + }, + { + path: "tom-select", + name: "side-menu-tom-select", + component: TomSelect, + }, + { + path: "file-upload", + name: "side-menu-file-upload", + component: FileUpload, + }, + { + path: "wysiwyg-editor", + name: "side-menu-wysiwyg-editor", + component: WysiwygEditor, + }, + { + path: "validation", + name: "side-menu-validation", + component: Validation, + }, + { + path: "chart", + name: "side-menu-chart", + component: Chart, + }, + { + path: "slider", + name: "side-menu-slider", + component: Slider, + }, + { + path: "image-zoom", + name: "side-menu-image-zoom", + component: ImageZoom, + }, + ], + }, + { + path: "/simple-menu", + component: SimpleMenu, + children: [ + { + path: "dashboard-overview-1", + name: "simple-menu-dashboard-overview-1", + component: DashboardOverview1, + }, + { + path: "dashboard-overview-2", + name: "simple-menu-dashboard-overview-2", + component: DashboardOverview2, + }, + { + path: "dashboard-overview-3", + name: "simple-menu-dashboard-overview-3", + component: DashboardOverview3, + }, + { + path: "dashboard-overview-4", + name: "simple-menu-dashboard-overview-4", + component: DashboardOverview4, + }, + { + path: "categories", + name: "simple-menu-categories", + component: Categories, + }, + { + path: "add-product", + name: "simple-menu-add-product", + component: AddProduct, + }, + { + path: "product-list", + name: "simple-menu-product-list", + component: ProductList, + }, + { + path: "product-grid", + name: "simple-menu-product-grid", + component: ProductGrid, + }, + { + path: "transaction-list", + name: "simple-menu-transaction-list", + component: TransactionList, + }, + { + path: "transaction-detail", + name: "simple-menu-transaction-detail", + component: TransactionDetail, + }, + { + path: "seller-list", + name: "simple-menu-seller-list", + component: SellerList, + }, + { + path: "seller-detail", + name: "simple-menu-seller-detail", + component: SellerDetail, + }, + { + path: "reviews", + name: "simple-menu-reviews", + component: Reviews, + }, + { + path: "inbox", + name: "simple-menu-inbox", + component: Inbox, + }, + { + path: "file-manager", + name: "simple-menu-file-manager", + component: FileManager, + }, + { + path: "point-of-sale", + name: "simple-menu-point-of-sale", + component: PointOfSale, + }, + { + path: "chat", + name: "simple-menu-chat", + component: Chat, + }, + { + path: "post", + name: "simple-menu-post", + component: Post, + }, + { + path: "calendar", + name: "simple-menu-calendar", + component: Calendar, + }, + { + path: "crud-data-list", + name: "simple-menu-crud-data-list", + component: CrudDataList, + }, + { + path: "crud-form", + name: "simple-menu-crud-form", + component: CrudForm, + }, + { + path: "users-layout-1", + name: "simple-menu-users-layout-1", + component: UsersLayout1, + }, + { + path: "users-layout-2", + name: "simple-menu-users-layout-2", + component: UsersLayout2, + }, + { + path: "users-layout-3", + name: "simple-menu-users-layout-3", + component: UsersLayout3, + }, + { + path: "profile-overview-1", + name: "simple-menu-profile-overview-1", + component: ProfileOverview1, + }, + { + path: "profile-overview-2", + name: "simple-menu-profile-overview-2", + component: ProfileOverview2, + }, + { + path: "profile-overview-3", + name: "simple-menu-profile-overview-3", + component: ProfileOverview3, + }, + { + path: "wizard-layout-1", + name: "simple-menu-wizard-layout-1", + component: WizardLayout1, + }, + { + path: "wizard-layout-2", + name: "simple-menu-wizard-layout-2", + component: WizardLayout2, + }, + { + path: "wizard-layout-3", + name: "simple-menu-wizard-layout-3", + component: WizardLayout3, + }, + { + path: "blog-layout-1", + name: "simple-menu-blog-layout-1", + component: BlogLayout1, + }, + { + path: "blog-layout-2", + name: "simple-menu-blog-layout-2", + component: BlogLayout2, + }, + { + path: "blog-layout-3", + name: "simple-menu-blog-layout-3", + component: BlogLayout3, + }, + { + path: "pricing-layout-1", + name: "simple-menu-pricing-layout-1", + component: PricingLayout1, + }, + { + path: "pricing-layout-2", + name: "simple-menu-pricing-layout-2", + component: PricingLayout2, + }, + { + path: "invoice-layout-1", + name: "simple-menu-invoice-layout-1", + component: InvoiceLayout1, + }, + { + path: "invoice-layout-2", + name: "simple-menu-invoice-layout-2", + component: InvoiceLayout2, + }, + { + path: "faq-layout-1", + name: "simple-menu-faq-layout-1", + component: FaqLayout1, + }, + { + path: "faq-layout-2", + name: "simple-menu-faq-layout-2", + component: FaqLayout2, + }, + { + path: "faq-layout-3", + name: "simple-menu-faq-layout-3", + component: FaqLayout3, + }, + { + path: "update-profile", + name: "simple-menu-update-profile", + component: UpdateProfile, + }, + { + path: "change-password", + name: "simple-menu-change-password", + component: ChangePassword, + }, + { + path: "regular-table", + name: "simple-menu-regular-table", + component: RegularTable, + }, + { + path: "tabulator", + name: "simple-menu-tabulator", + component: Tabulator, + }, + { + path: "modal", + name: "simple-menu-modal", + component: Modal, + }, + { + path: "slide-over", + name: "simple-menu-slide-over", + component: SlideOver, + }, + { + path: "notification", + name: "simple-menu-notification", + component: Notification, + }, + { + path: "tab", + name: "simple-menu-tab", + component: Tab, + }, + { + path: "accordion", + name: "simple-menu-accordion", + component: Accordion, + }, + { + path: "button", + name: "simple-menu-button", + component: Button, + }, + { + path: "alert", + name: "simple-menu-alert", + component: Alert, + }, + { + path: "progress-bar", + name: "simple-menu-progress-bar", + component: ProgressBar, + }, + { + path: "tooltip", + name: "simple-menu-tooltip", + component: Tooltip, + }, + { + path: "dropdown", + name: "simple-menu-dropdown", + component: Dropdown, + }, + { + path: "typography", + name: "simple-menu-typography", + component: Typography, + }, + { + path: "icon", + name: "simple-menu-icon", + component: Icon, + }, + { + path: "loading-icon", + name: "simple-menu-loading-icon", + component: LoadingIcon, + }, + { + path: "regular-form", + name: "simple-menu-regular-form", + component: RegularForm, + }, + { + path: "datepicker", + name: "simple-menu-datepicker", + component: Datepicker, + }, + { + path: "tom-select", + name: "simple-menu-tom-select", + component: TomSelect, + }, + { + path: "file-upload", + name: "simple-menu-file-upload", + component: FileUpload, + }, + { + path: "wysiwyg-editor", + name: "simple-menu-wysiwyg-editor", + component: WysiwygEditor, + }, + { + path: "validation", + name: "simple-menu-validation", + component: Validation, + }, + { + path: "chart", + name: "simple-menu-chart", + component: Chart, + }, + { + path: "slider", + name: "simple-menu-slider", + component: Slider, + }, + { + path: "image-zoom", + name: "simple-menu-image-zoom", + component: ImageZoom, + }, + ], + }, + { + path: "/top-menu", + component: TopMenu, + children: [ + { + path: "dashboard-overview-1", + name: "top-menu-dashboard-overview-1", + component: DashboardOverview1, + }, + { + path: "dashboard-overview-2", + name: "top-menu-dashboard-overview-2", + component: DashboardOverview2, + }, + { + path: "dashboard-overview-3", + name: "top-menu-dashboard-overview-3", + component: DashboardOverview3, + }, + { + path: "dashboard-overview-4", + name: "top-menu-dashboard-overview-4", + component: DashboardOverview4, + }, + { + path: "categories", + name: "top-menu-categories", + component: Categories, + }, + { + path: "add-product", + name: "top-menu-add-product", + component: AddProduct, + }, + { + path: "product-list", + name: "top-menu-product-list", + component: ProductList, + }, + { + path: "product-grid", + name: "top-menu-product-grid", + component: ProductGrid, + }, + { + path: "transaction-list", + name: "top-menu-transaction-list", + component: TransactionList, + }, + { + path: "transaction-detail", + name: "top-menu-transaction-detail", + component: TransactionDetail, + }, + { + path: "seller-list", + name: "top-menu-seller-list", + component: SellerList, + }, + { + path: "seller-detail", + name: "top-menu-seller-detail", + component: SellerDetail, + }, + { + path: "reviews", + name: "top-menu-reviews", + component: Reviews, + }, + { + path: "inbox", + name: "top-menu-inbox", + component: Inbox, + }, + { + path: "file-manager", + name: "top-menu-file-manager", + component: FileManager, + }, + { + path: "point-of-sale", + name: "top-menu-point-of-sale", + component: PointOfSale, + }, + { + path: "chat", + name: "top-menu-chat", + component: Chat, + }, + { + path: "post", + name: "top-menu-post", + component: Post, + }, + { + path: "calendar", + name: "top-menu-calendar", + component: Calendar, + }, + { + path: "crud-data-list", + name: "top-menu-crud-data-list", + component: CrudDataList, + }, + { + path: "crud-form", + name: "top-menu-crud-form", + component: CrudForm, + }, + { + path: "users-layout-1", + name: "top-menu-users-layout-1", + component: UsersLayout1, + }, + { + path: "users-layout-2", + name: "top-menu-users-layout-2", + component: UsersLayout2, + }, + { + path: "users-layout-3", + name: "top-menu-users-layout-3", + component: UsersLayout3, + }, + { + path: "profile-overview-1", + name: "top-menu-profile-overview-1", + component: ProfileOverview1, + }, + { + path: "profile-overview-2", + name: "top-menu-profile-overview-2", + component: ProfileOverview2, + }, + { + path: "profile-overview-3", + name: "top-menu-profile-overview-3", + component: ProfileOverview3, + }, + { + path: "wizard-layout-1", + name: "top-menu-wizard-layout-1", + component: WizardLayout1, + }, + { + path: "wizard-layout-2", + name: "top-menu-wizard-layout-2", + component: WizardLayout2, + }, + { + path: "wizard-layout-3", + name: "top-menu-wizard-layout-3", + component: WizardLayout3, + }, + { + path: "blog-layout-1", + name: "top-menu-blog-layout-1", + component: BlogLayout1, + }, + { + path: "blog-layout-2", + name: "top-menu-blog-layout-2", + component: BlogLayout2, + }, + { + path: "blog-layout-3", + name: "top-menu-blog-layout-3", + component: BlogLayout3, + }, + { + path: "pricing-layout-1", + name: "top-menu-pricing-layout-1", + component: PricingLayout1, + }, + { + path: "pricing-layout-2", + name: "top-menu-pricing-layout-2", + component: PricingLayout2, + }, + { + path: "invoice-layout-1", + name: "top-menu-invoice-layout-1", + component: InvoiceLayout1, + }, + { + path: "invoice-layout-2", + name: "top-menu-invoice-layout-2", + component: InvoiceLayout2, + }, + { + path: "faq-layout-1", + name: "top-menu-faq-layout-1", + component: FaqLayout1, + }, + { + path: "faq-layout-2", + name: "top-menu-faq-layout-2", + component: FaqLayout2, + }, + { + path: "faq-layout-3", + name: "top-menu-faq-layout-3", + component: FaqLayout3, + }, + { + path: "update-profile", + name: "top-menu-update-profile", + component: UpdateProfile, + }, + { + path: "change-password", + name: "top-menu-change-password", + component: ChangePassword, + }, + { + path: "regular-table", + name: "top-menu-regular-table", + component: RegularTable, + }, + { + path: "tabulator", + name: "top-menu-tabulator", + component: Tabulator, + }, + { + path: "modal", + name: "top-menu-modal", + component: Modal, + }, + { + path: "slide-over", + name: "top-menu-slide-over", + component: SlideOver, + }, + { + path: "notification", + name: "top-menu-notification", + component: Notification, + }, + { + path: "tab", + name: "top-menu-tab", + component: Tab, + }, + { + path: "accordion", + name: "top-menu-accordion", + component: Accordion, + }, + { + path: "button", + name: "top-menu-button", + component: Button, + }, + { + path: "alert", + name: "top-menu-alert", + component: Alert, + }, + { + path: "progress-bar", + name: "top-menu-progress-bar", + component: ProgressBar, + }, + { + path: "tooltip", + name: "top-menu-tooltip", + component: Tooltip, + }, + { + path: "dropdown", + name: "top-menu-dropdown", + component: Dropdown, + }, + { + path: "typography", + name: "top-menu-typography", + component: Typography, + }, + { + path: "icon", + name: "top-menu-icon", + component: Icon, + }, + { + path: "loading-icon", + name: "top-menu-loading-icon", + component: LoadingIcon, + }, + { + path: "regular-form", + name: "top-menu-regular-form", + component: RegularForm, + }, + { + path: "datepicker", + name: "top-menu-datepicker", + component: Datepicker, + }, + { + path: "tom-select", + name: "top-menu-tom-select", + component: TomSelect, + }, + { + path: "file-upload", + name: "top-menu-file-upload", + component: FileUpload, + }, + { + path: "wysiwyg-editor", + name: "top-menu-wysiwyg-editor", + component: WysiwygEditor, + }, + { + path: "validation", + name: "top-menu-validation", + component: Validation, + }, + { + path: "chart", + name: "top-menu-chart", + component: Chart, + }, + { + path: "slider", + name: "top-menu-slider", + component: Slider, + }, + { + path: "image-zoom", + name: "top-menu-image-zoom", + component: ImageZoom, + }, + ], + }, + { + path: "/login", + name: "login", + component: Login, + }, + { + path: "/register", + name: "register", + component: Register, + }, + { + path: "/error-page", + name: "error-page", + component: ErrorPage, + }, + { + path: "/:pathMatch(.*)*", + component: ErrorPage, + }, +]; + +const router = createRouter({ + history: createWebHistory(), + routes, + scrollBehavior(to, from, savedPosition) { + return savedPosition || { left: 0, top: 0 }; + }, +}); + +export default router; diff --git a/src/stores/.DS_Store b/src/stores/.DS_Store new file mode 100644 index 0000000..45d38de Binary files /dev/null and b/src/stores/.DS_Store differ diff --git a/src/stores/color-scheme.js b/src/stores/color-scheme.js new file mode 100644 index 0000000..b6a57ae --- /dev/null +++ b/src/stores/color-scheme.js @@ -0,0 +1,25 @@ +import { defineStore } from "pinia"; + +export const useColorSchemeStore = defineStore("colorScheme", { + state: () => ({ + colorSchemeValue: + localStorage.getItem("colorScheme") === null + ? "default" + : localStorage.getItem("colorScheme"), + }), + getters: { + colorScheme(state) { + if (localStorage.getItem("colorScheme") === null) { + localStorage.setItem("colorScheme", "default"); + } + + return state.colorSchemeValue; + }, + }, + actions: { + setColorScheme(colorScheme) { + localStorage.setItem("colorScheme", colorScheme); + this.colorSchemeValue = colorScheme; + }, + }, +}); diff --git a/src/stores/dark-mode.js b/src/stores/dark-mode.js new file mode 100644 index 0000000..76e8bbc --- /dev/null +++ b/src/stores/dark-mode.js @@ -0,0 +1,22 @@ +import { defineStore } from "pinia"; + +export const useDarkModeStore = defineStore("darkMode", { + state: () => ({ + darkModeValue: localStorage.getItem("darkMode") === "true", + }), + getters: { + darkMode(state) { + if (localStorage.getItem("darkMode") === null) { + localStorage.setItem("darkMode", false); + } + + return state.darkModeValue; + }, + }, + actions: { + setDarkMode(darkMode) { + localStorage.setItem("darkMode", darkMode); + this.darkModeValue = darkMode; + }, + }, +}); diff --git a/src/stores/side-menu.js b/src/stores/side-menu.js new file mode 100644 index 0000000..58ae77e --- /dev/null +++ b/src/stores/side-menu.js @@ -0,0 +1,513 @@ +import { defineStore } from "pinia"; + +export const useSideMenuStore = defineStore("sideMenu", { + state: () => ({ + menu: [ + { + icon: "HomeIcon", + pageName: "side-menu-dashboard", + title: "Dashboard", + subMenu: [ + { + icon: "", + pageName: "side-menu-dashboard-overview-1", + title: "Overview 1", + }, + { + icon: "", + pageName: "side-menu-dashboard-overview-2", + title: "Overview 2", + }, + { + icon: "", + pageName: "side-menu-dashboard-overview-3", + title: "Overview 3", + }, + { + icon: "", + pageName: "side-menu-dashboard-overview-4", + title: "Overview 4", + }, + ], + }, + { + icon: "BoxIcon", + pageName: "side-menu-menu-layout", + title: "Menu Layout", + subMenu: [ + { + icon: "", + pageName: "side-menu-dashboard-overview-1", + title: "Side Menu", + ignore: true, + }, + { + icon: "", + pageName: "simple-menu-dashboard-overview-1", + title: "Simple Menu", + ignore: true, + }, + { + icon: "", + pageName: "top-menu-dashboard-overview-1", + title: "Top Menu", + ignore: true, + }, + ], + }, + { + icon: "ShoppingBagIcon", + pageName: "side-menu-ecommerce", + title: "E-Commerce", + subMenu: [ + { + icon: "", + pageName: "side-menu-categories", + title: "Categories", + }, + { + icon: "", + pageName: "side-menu-add-product", + title: "Add Product", + }, + { + icon: "", + pageName: "side-menu-products", + title: "Products", + subMenu: [ + { + icon: "", + pageName: "side-menu-product-list", + title: "Product List", + }, + { + icon: "", + pageName: "side-menu-product-grid", + title: "Product Grid", + }, + ], + }, + { + icon: "", + pageName: "side-menu-transactions", + title: "Transactions", + subMenu: [ + { + icon: "", + pageName: "side-menu-transaction-list", + title: "Transaction List", + }, + { + icon: "", + pageName: "side-menu-transaction-detail", + title: "Transaction Detail", + }, + ], + }, + { + icon: "", + pageName: "side-menu-sellers", + title: "Sellers", + subMenu: [ + { + icon: "", + pageName: "side-menu-seller-list", + title: "Seller List", + }, + { + icon: "", + pageName: "side-menu-seller-detail", + title: "Seller Detail", + }, + ], + }, + { + icon: "", + pageName: "side-menu-reviews", + title: "Reviews", + }, + ], + }, + { + icon: "InboxIcon", + pageName: "side-menu-inbox", + title: "Inbox", + }, + { + icon: "HardDriveIcon", + pageName: "side-menu-file-manager", + title: "File Manager", + }, + { + icon: "CreditCardIcon", + pageName: "side-menu-point-of-sale", + title: "Point of Sale", + }, + { + icon: "MessageSquareIcon", + pageName: "side-menu-chat", + title: "Chat", + }, + { + icon: "FileTextIcon", + pageName: "side-menu-post", + title: "Post", + }, + { + icon: "CalendarIcon", + pageName: "side-menu-calendar", + title: "Calendar", + }, + "devider", + { + icon: "EditIcon", + pageName: "side-menu-crud", + title: "Crud", + subMenu: [ + { + icon: "", + pageName: "side-menu-crud-data-list", + title: "Data List", + }, + { + icon: "", + pageName: "side-menu-crud-form", + title: "Form", + }, + ], + }, + { + icon: "UsersIcon", + pageName: "side-menu-users", + title: "Users", + subMenu: [ + { + icon: "", + pageName: "side-menu-users-layout-1", + title: "Layout 1", + }, + { + icon: "", + pageName: "side-menu-users-layout-2", + title: "Layout 2", + }, + { + icon: "", + pageName: "side-menu-users-layout-3", + title: "Layout 3", + }, + ], + }, + { + icon: "TrelloIcon", + pageName: "side-menu-profile", + title: "Profile", + subMenu: [ + { + icon: "", + pageName: "side-menu-profile-overview-1", + title: "Overview 1", + }, + { + icon: "", + pageName: "side-menu-profile-overview-2", + title: "Overview 2", + }, + { + icon: "", + pageName: "side-menu-profile-overview-3", + title: "Overview 3", + }, + ], + }, + { + icon: "LayoutIcon", + pageName: "side-menu-layout", + title: "Pages", + subMenu: [ + { + icon: "", + pageName: "side-menu-wizards", + title: "Wizards", + subMenu: [ + { + icon: "", + pageName: "side-menu-wizard-layout-1", + title: "Layout 1", + }, + { + icon: "", + pageName: "side-menu-wizard-layout-2", + title: "Layout 2", + }, + { + icon: "", + pageName: "side-menu-wizard-layout-3", + title: "Layout 3", + }, + ], + }, + { + icon: "", + pageName: "side-menu-blog", + title: "Blog", + subMenu: [ + { + icon: "", + pageName: "side-menu-blog-layout-1", + title: "Layout 1", + }, + { + icon: "", + pageName: "side-menu-blog-layout-2", + title: "Layout 2", + }, + { + icon: "", + pageName: "side-menu-blog-layout-3", + title: "Layout 3", + }, + ], + }, + { + icon: "", + pageName: "side-menu-pricing", + title: "Pricing", + subMenu: [ + { + icon: "", + pageName: "side-menu-pricing-layout-1", + title: "Layout 1", + }, + { + icon: "", + pageName: "side-menu-pricing-layout-2", + title: "Layout 2", + }, + ], + }, + { + icon: "", + pageName: "side-menu-invoice", + title: "Invoice", + subMenu: [ + { + icon: "", + pageName: "side-menu-invoice-layout-1", + title: "Layout 1", + }, + { + icon: "", + pageName: "side-menu-invoice-layout-2", + title: "Layout 2", + }, + ], + }, + { + icon: "", + pageName: "side-menu-faq", + title: "FAQ", + subMenu: [ + { + icon: "", + pageName: "side-menu-faq-layout-1", + title: "Layout 1", + }, + { + icon: "", + pageName: "side-menu-faq-layout-2", + title: "Layout 2", + }, + { + icon: "", + pageName: "side-menu-faq-layout-3", + title: "Layout 3", + }, + ], + }, + { + icon: "", + pageName: "login", + title: "Login", + }, + { + icon: "", + pageName: "register", + title: "Register", + }, + { + icon: "", + pageName: "error-page", + title: "Error Page", + }, + { + icon: "", + pageName: "side-menu-update-profile", + title: "Update profile", + }, + { + icon: "", + pageName: "side-menu-change-password", + title: "Change Password", + }, + ], + }, + "devider", + { + icon: "InboxIcon", + pageName: "side-menu-components", + title: "Components", + subMenu: [ + { + icon: "", + pageName: "side-menu-table", + title: "Table", + subMenu: [ + { + icon: "", + pageName: "side-menu-regular-table", + title: "Regular Table", + }, + { + icon: "", + pageName: "side-menu-tabulator", + title: "Tabulator", + }, + ], + }, + { + icon: "", + pageName: "side-menu-overlay", + title: "Overlay", + subMenu: [ + { + icon: "", + pageName: "side-menu-modal", + title: "Modal", + }, + { + icon: "", + pageName: "side-menu-slide-over", + title: "Slide Over", + }, + { + icon: "", + pageName: "side-menu-notification", + title: "Notification", + }, + ], + }, + { + icon: "", + pageName: "side-menu-tab", + title: "Tab", + }, + { + icon: "", + pageName: "side-menu-accordion", + title: "Accordion", + }, + { + icon: "", + pageName: "side-menu-button", + title: "Button", + }, + { + icon: "", + pageName: "side-menu-alert", + title: "Alert", + }, + { + icon: "", + pageName: "side-menu-progress-bar", + title: "Progress Bar", + }, + { + icon: "", + pageName: "side-menu-tooltip", + title: "Tooltip", + }, + { + icon: "", + pageName: "side-menu-dropdown", + title: "Dropdown", + }, + { + icon: "", + pageName: "side-menu-typography", + title: "Typography", + }, + { + icon: "", + pageName: "side-menu-icon", + title: "Icon", + }, + { + icon: "", + pageName: "side-menu-loading-icon", + title: "Loading Icon", + }, + ], + }, + { + icon: "SidebarIcon", + pageName: "side-menu-forms", + title: "Forms", + subMenu: [ + { + icon: "", + pageName: "side-menu-regular-form", + title: "Regular Form", + }, + { + icon: "", + pageName: "side-menu-datepicker", + title: "Datepicker", + }, + { + icon: "", + pageName: "side-menu-tom-select", + title: "Tom Select", + }, + { + icon: "", + pageName: "side-menu-file-upload", + title: "File Upload", + }, + { + icon: "", + pageName: "side-menu-wysiwyg-editor", + title: "Wysiwyg Editor", + }, + { + icon: "", + pageName: "side-menu-validation", + title: "Validation", + }, + ], + }, + { + icon: "HardDriveIcon", + pageName: "side-menu-widgets", + title: "Widgets", + subMenu: [ + { + icon: "", + pageName: "side-menu-chart", + title: "Chart", + }, + { + icon: "", + pageName: "side-menu-slider", + title: "Slider", + }, + { + icon: "", + pageName: "side-menu-image-zoom", + title: "Image Zoom", + }, + ], + }, + ], + }), +}); diff --git a/src/stores/simple-menu.js b/src/stores/simple-menu.js new file mode 100644 index 0000000..1d69248 --- /dev/null +++ b/src/stores/simple-menu.js @@ -0,0 +1,513 @@ +import { defineStore } from "pinia"; + +export const useSimpleMenuStore = defineStore("simpleMenu", { + state: () => ({ + menu: [ + { + icon: "HomeIcon", + pageName: "simple-menu-dashboard", + title: "Dashboard", + subMenu: [ + { + icon: "", + pageName: "simple-menu-dashboard-overview-1", + title: "Overview 1", + }, + { + icon: "", + pageName: "simple-menu-dashboard-overview-2", + title: "Overview 2", + }, + { + icon: "", + pageName: "simple-menu-dashboard-overview-3", + title: "Overview 3", + }, + { + icon: "", + pageName: "simple-menu-dashboard-overview-4", + title: "Overview 4", + }, + ], + }, + { + icon: "BoxIcon", + pageName: "simple-menu-menu-layout", + title: "Menu Layout", + subMenu: [ + { + icon: "", + pageName: "side-menu-dashboard-overview-1", + title: "Side Menu", + ignore: true, + }, + { + icon: "", + pageName: "simple-menu-dashboard-overview-1", + title: "Simple Menu", + ignore: true, + }, + { + icon: "", + pageName: "top-menu-dashboard-overview-1", + title: "Top Menu", + ignore: true, + }, + ], + }, + { + icon: "ShoppingBagIcon", + pageName: "simple-menu-ecommerce", + title: "E-Commerce", + subMenu: [ + { + icon: "", + pageName: "simple-menu-categories", + title: "Categories", + }, + { + icon: "", + pageName: "simple-menu-add-product", + title: "Add Product", + }, + { + icon: "", + pageName: "simple-menu-products", + title: "Products", + subMenu: [ + { + icon: "", + pageName: "simple-menu-product-list", + title: "Product List", + }, + { + icon: "", + pageName: "simple-menu-product-grid", + title: "Product Grid", + }, + ], + }, + { + icon: "", + pageName: "simple-menu-transactions", + title: "Transactions", + subMenu: [ + { + icon: "", + pageName: "simple-menu-transaction-list", + title: "Transaction List", + }, + { + icon: "", + pageName: "simple-menu-transaction-detail", + title: "Transaction Detail", + }, + ], + }, + { + icon: "", + pageName: "simple-menu-sellers", + title: "Sellers", + subMenu: [ + { + icon: "", + pageName: "simple-menu-seller-list", + title: "Seller List", + }, + { + icon: "", + pageName: "simple-menu-seller-detail", + title: "Seller Detail", + }, + ], + }, + { + icon: "", + pageName: "simple-menu-reviews", + title: "Reviews", + }, + ], + }, + { + icon: "InboxIcon", + pageName: "simple-menu-inbox", + title: "Inbox", + }, + { + icon: "HardDriveIcon", + pageName: "simple-menu-file-manager", + title: "File Manager", + }, + { + icon: "CreditCardIcon", + pageName: "simple-menu-point-of-sale", + title: "Point of Sale", + }, + { + icon: "MessageSquareIcon", + pageName: "simple-menu-chat", + title: "Chat", + }, + { + icon: "FileTextIcon", + pageName: "simple-menu-post", + title: "Post", + }, + { + icon: "CalendarIcon", + pageName: "simple-menu-calendar", + title: "Calendar", + }, + "devider", + { + icon: "EditIcon", + pageName: "simple-menu-crud", + title: "Crud", + subMenu: [ + { + icon: "", + pageName: "simple-menu-crud-data-list", + title: "Data List", + }, + { + icon: "", + pageName: "simple-menu-crud-form", + title: "Form", + }, + ], + }, + { + icon: "UsersIcon", + pageName: "simple-menu-users", + title: "Users", + subMenu: [ + { + icon: "", + pageName: "simple-menu-users-layout-1", + title: "Layout 1", + }, + { + icon: "", + pageName: "simple-menu-users-layout-2", + title: "Layout 2", + }, + { + icon: "", + pageName: "simple-menu-users-layout-3", + title: "Layout 3", + }, + ], + }, + { + icon: "TrelloIcon", + pageName: "simple-menu-profile", + title: "Profile", + subMenu: [ + { + icon: "", + pageName: "simple-menu-profile-overview-1", + title: "Overview 1", + }, + { + icon: "", + pageName: "simple-menu-profile-overview-2", + title: "Overview 2", + }, + { + icon: "", + pageName: "simple-menu-profile-overview-3", + title: "Overview 3", + }, + ], + }, + { + icon: "LayoutIcon", + pageName: "simple-menu-layout", + title: "Pages", + subMenu: [ + { + icon: "", + pageName: "simple-menu-wizards", + title: "Wizards", + subMenu: [ + { + icon: "", + pageName: "simple-menu-wizard-layout-1", + title: "Layout 1", + }, + { + icon: "", + pageName: "simple-menu-wizard-layout-2", + title: "Layout 2", + }, + { + icon: "", + pageName: "simple-menu-wizard-layout-3", + title: "Layout 3", + }, + ], + }, + { + icon: "", + pageName: "simple-menu-blog", + title: "Blog", + subMenu: [ + { + icon: "", + pageName: "simple-menu-blog-layout-1", + title: "Layout 1", + }, + { + icon: "", + pageName: "simple-menu-blog-layout-2", + title: "Layout 2", + }, + { + icon: "", + pageName: "simple-menu-blog-layout-3", + title: "Layout 3", + }, + ], + }, + { + icon: "", + pageName: "simple-menu-pricing", + title: "Pricing", + subMenu: [ + { + icon: "", + pageName: "simple-menu-pricing-layout-1", + title: "Layout 1", + }, + { + icon: "", + pageName: "simple-menu-pricing-layout-2", + title: "Layout 2", + }, + ], + }, + { + icon: "", + pageName: "simple-menu-invoice", + title: "Invoice", + subMenu: [ + { + icon: "", + pageName: "simple-menu-invoice-layout-1", + title: "Layout 1", + }, + { + icon: "", + pageName: "simple-menu-invoice-layout-2", + title: "Layout 2", + }, + ], + }, + { + icon: "", + pageName: "simple-menu-faq", + title: "FAQ", + subMenu: [ + { + icon: "", + pageName: "simple-menu-faq-layout-1", + title: "Layout 1", + }, + { + icon: "", + pageName: "simple-menu-faq-layout-2", + title: "Layout 2", + }, + { + icon: "", + pageName: "simple-menu-faq-layout-3", + title: "Layout 3", + }, + ], + }, + { + icon: "", + pageName: "login", + title: "Login", + }, + { + icon: "", + pageName: "register", + title: "Register", + }, + { + icon: "", + pageName: "error-page", + title: "Error Page", + }, + { + icon: "", + pageName: "simple-menu-update-profile", + title: "Update profile", + }, + { + icon: "", + pageName: "simple-menu-change-password", + title: "Change Password", + }, + ], + }, + "devider", + { + icon: "InboxIcon", + pageName: "simple-menu-components", + title: "Components", + subMenu: [ + { + icon: "", + pageName: "simple-menu-table", + title: "Table", + subMenu: [ + { + icon: "", + pageName: "simple-menu-regular-table", + title: "Regular Table", + }, + { + icon: "", + pageName: "simple-menu-tabulator", + title: "Tabulator", + }, + ], + }, + { + icon: "", + pageName: "simple-menu-overlay", + title: "Overlay", + subMenu: [ + { + icon: "", + pageName: "simple-menu-modal", + title: "Modal", + }, + { + icon: "", + pageName: "simple-menu-slide-over", + title: "Slide Over", + }, + { + icon: "", + pageName: "simple-menu-notification", + title: "Notification", + }, + ], + }, + { + icon: "", + pageName: "simple-menu-tab", + title: "Tab", + }, + { + icon: "", + pageName: "simple-menu-accordion", + title: "Accordion", + }, + { + icon: "", + pageName: "simple-menu-button", + title: "Button", + }, + { + icon: "", + pageName: "simple-menu-alert", + title: "Alert", + }, + { + icon: "", + pageName: "simple-menu-progress-bar", + title: "Progress Bar", + }, + { + icon: "", + pageName: "simple-menu-tooltip", + title: "Tooltip", + }, + { + icon: "", + pageName: "simple-menu-dropdown", + title: "Dropdown", + }, + { + icon: "", + pageName: "simple-menu-typography", + title: "Typography", + }, + { + icon: "", + pageName: "simple-menu-icon", + title: "Icon", + }, + { + icon: "", + pageName: "simple-menu-loading-icon", + title: "Loading Icon", + }, + ], + }, + { + icon: "SidebarIcon", + pageName: "simple-menu-forms", + title: "Forms", + subMenu: [ + { + icon: "", + pageName: "simple-menu-regular-form", + title: "Regular Form", + }, + { + icon: "", + pageName: "simple-menu-datepicker", + title: "Datepicker", + }, + { + icon: "", + pageName: "simple-menu-tom-select", + title: "Tom Select", + }, + { + icon: "", + pageName: "simple-menu-file-upload", + title: "File Upload", + }, + { + icon: "", + pageName: "simple-menu-wysiwyg-editor", + title: "Wysiwyg Editor", + }, + { + icon: "", + pageName: "simple-menu-validation", + title: "Validation", + }, + ], + }, + { + icon: "HardDriveIcon", + pageName: "simple-menu-widgets", + title: "Widgets", + subMenu: [ + { + icon: "", + pageName: "simple-menu-chart", + title: "Chart", + }, + { + icon: "", + pageName: "simple-menu-slider", + title: "Slider", + }, + { + icon: "", + pageName: "simple-menu-image-zoom", + title: "Image Zoom", + }, + ], + }, + ], + }), +}); diff --git a/src/stores/top-menu.js b/src/stores/top-menu.js new file mode 100644 index 0000000..f88cb83 --- /dev/null +++ b/src/stores/top-menu.js @@ -0,0 +1,497 @@ +import { defineStore } from "pinia"; + +export const useTopMenuStore = defineStore("topMenu", { + state: () => ({ + menu: [ + { + icon: "HomeIcon", + pageName: "top-menu-dashboard", + title: "Dashboard", + subMenu: [ + { + icon: "", + pageName: "top-menu-dashboard-overview-1", + title: "Overview 1", + }, + { + icon: "", + pageName: "top-menu-dashboard-overview-2", + title: "Overview 2", + }, + { + icon: "", + pageName: "top-menu-dashboard-overview-3", + title: "Overview 3", + }, + { + icon: "", + pageName: "top-menu-dashboard-overview-4", + title: "Overview 4", + }, + ], + }, + { + icon: "BoxIcon", + pageName: "top-menu-menu-layout", + title: "Menu Layout", + subMenu: [ + { + icon: "", + pageName: "side-menu-dashboard-overview-1", + title: "Side Menu", + ignore: true, + }, + { + icon: "", + pageName: "simple-menu-dashboard-overview-1", + title: "Simple Menu", + ignore: true, + }, + { + icon: "", + pageName: "top-menu-dashboard-overview-1", + title: "Top Menu", + ignore: true, + }, + ], + }, + { + icon: "ActivityIcon", + pageName: "top-menu-apps", + title: "Apps", + subMenu: [ + { + icon: "UsersIcon", + pageName: "top-menu-users", + title: "Users", + subMenu: [ + { + icon: "", + pageName: "top-menu-users-layout-1", + title: "Layout 1", + }, + { + icon: "", + pageName: "top-menu-users-layout-2", + title: "Layout 2", + }, + { + icon: "", + pageName: "top-menu-users-layout-3", + title: "Layout 3", + }, + ], + }, + { + icon: "TrelloIcon", + pageName: "top-menu-profile", + title: "Profile", + subMenu: [ + { + icon: "", + pageName: "top-menu-profile-overview-1", + title: "Overview 1", + }, + { + icon: "", + pageName: "top-menu-profile-overview-2", + title: "Overview 2", + }, + { + icon: "", + pageName: "top-menu-profile-overview-3", + title: "Overview 3", + }, + ], + }, + { + icon: "ShoppingBagIcon", + pageName: "top-menu-ecommerce", + title: "E-Commerce", + subMenu: [ + { + icon: "", + pageName: "top-menu-categories", + title: "Categories", + }, + { + icon: "", + pageName: "top-menu-add-product", + title: "Add Product", + }, + { + icon: "", + pageName: "top-menu-product-list", + title: "Product List", + }, + { + icon: "", + pageName: "top-menu-product-grid", + title: "Product Grid", + }, + { + icon: "", + pageName: "top-menu-transaction-list", + title: "Transaction List", + }, + { + icon: "", + pageName: "top-menu-transaction-detail", + title: "Transaction Detail", + }, + { + icon: "", + pageName: "top-menu-seller-list", + title: "Seller List", + }, + { + icon: "", + pageName: "top-menu-seller-detail", + title: "Seller Detail", + }, + { + icon: "", + pageName: "top-menu-reviews", + title: "Reviews", + }, + ], + }, + { + icon: "InboxIcon", + pageName: "top-menu-inbox", + title: "Inbox", + }, + { + icon: "FolderIcon", + pageName: "top-menu-file-manager", + title: "File Manager", + }, + { + icon: "CreditCardIcon", + pageName: "top-menu-point-of-sale", + title: "Point of Sale", + }, + { + icon: "MessageSquareIcon", + pageName: "top-menu-chat", + title: "Chat", + }, + { + icon: "FileTextIcon", + pageName: "top-menu-post", + title: "Post", + }, + { + icon: "CalendarIcon", + pageName: "top-menu-calendar", + title: "Calendar", + }, + { + icon: "EditIcon", + pageName: "top-menu-crud", + title: "Crud", + subMenu: [ + { + icon: "", + pageName: "top-menu-crud-data-list", + title: "Data List", + }, + { + icon: "", + pageName: "top-menu-crud-form", + title: "Form", + }, + ], + }, + ], + }, + { + icon: "LayoutIcon", + pageName: "top-menu-layout", + title: "Pages", + subMenu: [ + { + icon: "", + pageName: "top-menu-wizards", + title: "Wizards", + subMenu: [ + { + icon: "", + pageName: "top-menu-wizard-layout-1", + title: "Layout 1", + }, + { + icon: "", + pageName: "top-menu-wizard-layout-2", + title: "Layout 2", + }, + { + icon: "", + pageName: "top-menu-wizard-layout-3", + title: "Layout 3", + }, + ], + }, + { + icon: "", + pageName: "top-menu-blog", + title: "Blog", + subMenu: [ + { + icon: "", + pageName: "top-menu-blog-layout-1", + title: "Layout 1", + }, + { + icon: "", + pageName: "top-menu-blog-layout-2", + title: "Layout 2", + }, + { + icon: "", + pageName: "top-menu-blog-layout-3", + title: "Layout 3", + }, + ], + }, + { + icon: "", + pageName: "top-menu-pricing", + title: "Pricing", + subMenu: [ + { + icon: "", + pageName: "top-menu-pricing-layout-1", + title: "Layout 1", + }, + { + icon: "", + pageName: "top-menu-pricing-layout-2", + title: "Layout 2", + }, + ], + }, + { + icon: "", + pageName: "top-menu-invoice", + title: "Invoice", + subMenu: [ + { + icon: "", + pageName: "top-menu-invoice-layout-1", + title: "Layout 1", + }, + { + icon: "", + pageName: "top-menu-invoice-layout-2", + title: "Layout 2", + }, + ], + }, + { + icon: "", + pageName: "top-menu-faq", + title: "FAQ", + subMenu: [ + { + icon: "", + pageName: "top-menu-faq-layout-1", + title: "Layout 1", + }, + { + icon: "", + pageName: "top-menu-faq-layout-2", + title: "Layout 2", + }, + { + icon: "", + pageName: "top-menu-faq-layout-3", + title: "Layout 3", + }, + ], + }, + { + icon: "", + pageName: "login", + title: "Login", + }, + { + icon: "", + pageName: "register", + title: "Register", + }, + { + icon: "", + pageName: "error-page", + title: "Error Page", + }, + { + icon: "", + pageName: "top-menu-update-profile", + title: "Update profile", + }, + { + icon: "", + pageName: "top-menu-change-password", + title: "Change Password", + }, + ], + }, + { + icon: "InboxIcon", + pageName: "top-menu-components", + title: "Components", + subMenu: [ + { + icon: "", + pageName: "top-menu-table", + title: "Table", + subMenu: [ + { + icon: "", + pageName: "top-menu-regular-table", + title: "Regular Table", + }, + { + icon: "", + pageName: "top-menu-tabulator", + title: "Tabulator", + }, + ], + }, + { + icon: "", + pageName: "top-menu-overlay", + title: "Overlay", + subMenu: [ + { + icon: "", + pageName: "top-menu-modal", + title: "Modal", + }, + { + icon: "", + pageName: "top-menu-slide-over", + title: "Slide Over", + }, + { + icon: "", + pageName: "top-menu-notification", + title: "Notification", + }, + ], + }, + { + icon: "", + pageName: "top-menu-tab", + title: "Tab", + }, + { + icon: "", + pageName: "top-menu-accordion", + title: "Accordion", + }, + { + icon: "", + pageName: "top-menu-button", + title: "Button", + }, + { + icon: "", + pageName: "top-menu-alert", + title: "Alert", + }, + { + icon: "", + pageName: "top-menu-progress-bar", + title: "Progress Bar", + }, + { + icon: "", + pageName: "top-menu-tooltip", + title: "Tooltip", + }, + { + icon: "", + pageName: "top-menu-dropdown", + title: "Dropdown", + }, + { + icon: "", + pageName: "top-menu-typography", + title: "Typography", + }, + { + icon: "", + pageName: "top-menu-icon", + title: "Icon", + }, + { + icon: "", + pageName: "top-menu-loading-icon", + title: "Loading Icon", + }, + ], + }, + { + icon: "SidebarIcon", + pageName: "top-menu-forms", + title: "Forms", + subMenu: [ + { + icon: "", + pageName: "top-menu-regular-form", + title: "Regular Form", + }, + { + icon: "", + pageName: "top-menu-datepicker", + title: "Datepicker", + }, + { + icon: "", + pageName: "top-menu-tom-select", + title: "Tom Select", + }, + { + icon: "", + pageName: "top-menu-file-upload", + title: "File Upload", + }, + { + icon: "", + pageName: "top-menu-wysiwyg-editor", + title: "Wysiwyg Editor", + }, + { + icon: "", + pageName: "top-menu-validation", + title: "Validation", + }, + ], + }, + { + icon: "HardDriveIcon", + pageName: "top-menu-widgets", + title: "Widgets", + subMenu: [ + { + icon: "", + pageName: "top-menu-chart", + title: "Chart", + }, + { + icon: "", + pageName: "top-menu-slider", + title: "Slider", + }, + { + icon: "", + pageName: "top-menu-image-zoom", + title: "Image Zoom", + }, + ], + }, + ], + }), +}); diff --git a/src/utils/colors.js b/src/utils/colors.js new file mode 100644 index 0000000..c2f145b --- /dev/null +++ b/src/utils/colors.js @@ -0,0 +1,133 @@ +import { + inherit, + currentinherit, + transparentinherit, + blackinherit, + whiteinherit, + slateinherit, + grayinherit, + zincinherit, + neutralinherit, + stoneinherit, + redinherit, + orangeinherit, + amberinherit, + yellowinherit, + limeinherit, + greeninherit, + emeraldinherit, + tealinherit, + cyaninherit, + skyinherit, + blueinherit, + indigoinherit, + violetinherit, + purpleinherit, + fuchsiainherit, + pinkinherit, + roseinherit, +} from "tailwindcss/colors"; +import { helper } from "@/utils/helper"; + +const el = getComputedStyle(document.body); +const mainColors = { + ...helper.toRGB({ + inherit, + currentinherit, + transparentinherit, + blackinherit, + whiteinherit, + slateinherit, + grayinherit, + zincinherit, + neutralinherit, + stoneinherit, + redinherit, + orangeinherit, + amberinherit, + yellowinherit, + limeinherit, + greeninherit, + emeraldinherit, + tealinherit, + cyaninherit, + skyinherit, + blueinherit, + indigoinherit, + violetinherit, + purpleinherit, + fuchsiainherit, + pinkinherit, + roseinherit, + }), + primary: (opacity = 1) => + `rgb(${el.getPropertyValue("--color-primary")} / ${opacity})`, + secondary: (opacity = 1) => + `rgb(${el.getPropertyValue("--color-secondary")} / ${opacity})`, + success: (opacity = 1) => + `rgb(${el.getPropertyValue("--color-success")} / ${opacity})`, + info: (opacity = 1) => + `rgb(${el.getPropertyValue("--color-info")} / ${opacity})`, + warning: (opacity = 1) => + `rgb(${el.getPropertyValue("--color-warning")} / ${opacity})`, + pending: (opacity = 1) => + `rgb(${el.getPropertyValue("--color-pending")} / ${opacity})`, + danger: (opacity = 1) => + `rgb(${el.getPropertyValue("--color-danger")} / ${opacity})`, + light: (opacity = 1) => + `rgb(${el.getPropertyValue("--color-light")} / ${opacity})`, + dark: (opacity = 1) => + `rgb(${el.getPropertyValue("--color-dark")} / ${opacity})`, + slate: { + 50: (opacity = 1) => + `rgb(${el.getPropertyValue("--color-slate-50")} / ${opacity})`, + 100: (opacity = 1) => + `rgb(${el.getPropertyValue("--color-slate-100")} / ${opacity})`, + 200: (opacity = 1) => + `rgb(${el.getPropertyValue("--color-slate-200")} / ${opacity})`, + 300: (opacity = 1) => + `rgb(${el.getPropertyValue("--color-slate-300")} / ${opacity})`, + 400: (opacity = 1) => + `rgb(${el.getPropertyValue("--color-slate-400")} / ${opacity})`, + 500: (opacity = 1) => + `rgb(${el.getPropertyValue("--color-slate-500")} / ${opacity})`, + 600: (opacity = 1) => + `rgb(${el.getPropertyValue("--color-slate-600")} / ${opacity})`, + 700: (opacity = 1) => + `rgb(${el.getPropertyValue("--color-slate-700")} / ${opacity})`, + 800: (opacity = 1) => + `rgb(${el.getPropertyValue("--color-slate-800")} / ${opacity})`, + 900: (opacity = 1) => + `rgb(${el.getPropertyValue("--color-slate-900")} / ${opacity})`, + }, + darkmode: { + 50: (opacity = 1) => + `rgb(${el.getPropertyValue("--color-darkmode-50")} / ${opacity})`, + 100: (opacity = 1) => + `rgb(${el.getPropertyValue("--color-darkmode-100")} / ${opacity})`, + 200: (opacity = 1) => + `rgb(${el.getPropertyValue("--color-darkmode-200")} / ${opacity})`, + 300: (opacity = 1) => + `rgb(${el.getPropertyValue("--color-darkmode-300")} / ${opacity})`, + 400: (opacity = 1) => + `rgb(${el.getPropertyValue("--color-darkmode-400")} / ${opacity})`, + 500: (opacity = 1) => + `rgb(${el.getPropertyValue("--color-darkmode-500")} / ${opacity})`, + 600: (opacity = 1) => + `rgb(${el.getPropertyValue("--color-darkmode-600")} / ${opacity})`, + 700: (opacity = 1) => + `rgb(${el.getPropertyValue("--color-darkmode-700")} / ${opacity})`, + 800: (opacity = 1) => + `rgb(${el.getPropertyValue("--color-darkmode-800")} / ${opacity})`, + 900: (opacity = 1) => + `rgb(${el.getPropertyValue("--color-darkmode-900")} / ${opacity})`, + }, +}; + +const install = (app) => { + app.config.globalProperties.$c = () => { + return mainColors; + }; +}; + +export { install as default, mainColors as colors }; diff --git a/src/utils/faker.js b/src/utils/faker.js new file mode 100755 index 0000000..aa08bd5 --- /dev/null +++ b/src/utils/faker.js @@ -0,0 +1,380 @@ +import _ from "lodash"; +import dayjs from "dayjs"; + +const imageAssets = import.meta.globEager( + `/src/assets/images/*.{jpg,jpeg,png,svg}` +); +const fakers = { + fakeUsers() { + const users = [ + { name: "Johnny Depp", gender: "male" }, + { name: "Al Pacino", gender: "male" }, + { name: "Robert De Niro", gender: "male" }, + { name: "Kevin Spacey", gender: "male" }, + { name: "Denzel Washington", gender: "male" }, + { name: "Russell Crowe", gender: "male" }, + { name: "Brad Pitt", gender: "male" }, + { name: "Angelina Jolie", gender: "female" }, + { name: "Leonardo DiCaprio", gender: "male" }, + { name: "Tom Cruise", gender: "male" }, + { name: "John Travolta", gender: "male" }, + { name: "Arnold Schwarzenegger", gender: "male" }, + { name: "Sylvester Stallone", gender: "male" }, + { name: "Kate Winslet", gender: "female" }, + { name: "Christian Bale", gender: "male" }, + { name: "Morgan Freeman", gender: "male" }, + { name: "Keanu Reeves", gender: "male" }, + { name: "Nicolas Cage", gender: "male" }, + { name: "Hugh Jackman", gender: "male" }, + { name: "Edward Norton", gender: "male" }, + { name: "Bruce Willis", gender: "male" }, + { name: "Tom Hanks", gender: "male" }, + { name: "Charlize Theron", gender: "female" }, + { name: "Will Smith", gender: "male" }, + { name: "Sean Connery", gender: "male" }, + { name: "Keira Knightley", gender: "female" }, + { name: "Vin Diesel", gender: "male" }, + { name: "Matt Damon", gender: "male" }, + { name: "Richard Gere", gender: "male" }, + { name: "Catherine Zeta-Jones", gender: "female" }, + ]; + + return _.sampleSize(users, 3).map((user) => { + return { + name: user.name, + gender: user.gender, + email: _.toLower(_.replace(user.name, / /g, "") + "@left4code.com"), + }; + }); + }, + fakePhotos() { + const photos = []; + for (let i = 0; i < 15; i++) { + photos[photos.length] = + imageAssets[ + "/src/assets/images/profile-" + _.random(1, 15) + ".jpg" + ].default; + } + return _.sampleSize(photos, 10); + }, + fakeImages() { + const images = []; + for (let i = 0; i < 15; i++) { + images[images.length] = + imageAssets[ + "/src/assets/images/preview-" + _.random(1, 15) + ".jpg" + ].default; + } + return _.sampleSize(images, 10); + }, + fakeDates() { + const dates = []; + for (let i = 0; i < 5; i++) { + dates[dates.length] = dayjs + .unix(_.random(1586584776897, 1672333200000) / 1000) + .format("DD MMMM YYYY"); + } + return _.sampleSize(dates, 3); + }, + fakeTimes() { + const times = [ + "01:10 PM", + "05:09 AM", + "06:05 AM", + "03:20 PM", + "04:50 AM", + "07:00 PM", + ]; + return _.sampleSize(times, 3); + }, + fakeFormattedTimes() { + const times = [ + _.random(10, 60) + " seconds ago", + _.random(10, 60) + " minutes ago", + _.random(10, 24) + " hours ago", + _.random(10, 20) + " days ago", + _.random(10, 12) + " months ago", + ]; + return _.sampleSize(times, 3); + }, + fakeTotals() { + return _.shuffle([_.random(20, 220), _.random(20, 120), _.random(20, 50)]); + }, + fakeTrueFalse() { + return _.sampleSize([0, 1, 1], 1); + }, + fakeStocks() { + return _.shuffle([_.random(50, 220), _.random(50, 120), _.random(50, 50)]); + }, + fakeProducts() { + const products = [ + { name: "Dell XPS 13", category: "PC & Laptop" }, + { name: "Apple MacBook Pro 13", category: "PC & Laptop" }, + { name: "Oppo Find X2 Pro", category: "Smartphone & Tablet" }, + { name: "Samsung Galaxy S20 Ultra", category: "Smartphone & Tablet" }, + { name: "Sony Master Series A9G", category: "Electronic" }, + { name: "Samsung Q90 QLED TV", category: "Electronic" }, + { name: "Nike Air Max 270", category: "Sport & Outdoor" }, + { name: "Nike Tanjun", category: "Sport & Outdoor" }, + { name: "Nikon Z6", category: "Photography" }, + { name: "Sony A7 III", category: "Photography" }, + ]; + return _.shuffle(products); + }, + fakeCategories() { + const categories = [ + { name: "PC & Laptop", tags: "Apple, Asus, Lenovo, Dell, Acer" }, + { + name: "Smartphone & Tablet", + tags: "Samsung, Apple, Huawei, Nokia, Sony", + }, + { name: "Electronic", tags: "Sony, LG, Toshiba, Hisense, Vizio" }, + { + name: "Home Appliance", + tags: "Whirlpool, Amana, LG, Frigidaire, Samsung", + }, + { name: "Photography", tags: "Canon, Nikon, Sony, Fujifilm, Panasonic" }, + { name: "Fashion & Make Up", tags: "Nike, Adidas, Zara, H&M, Levi’s" }, + { + name: "Kids & Baby", + tags: "Mothercare, Gini & Jony, H&M, Babyhug, Liliput", + }, + { name: "Hobby", tags: "Bandai, Atomik R/C, Atlantis Models, Carisma" }, + { + name: "Sport & Outdoor", + tags: "Nike, Adidas, Puma, Rebook, Under Armour", + }, + ]; + + return _.sampleSize(categories, 3).map((category) => { + return { + name: category.name, + tags: category.tags, + slug: _.replace( + _.replace(_.toLower(category.name), / /g, "-"), + "&", + "and" + ), + }; + }); + }, + fakeNews() { + const news = [ + { + title: "Desktop publishing software like Aldus PageMaker", + superShortContent: _.truncate( + "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.", + { + length: 30, + omission: "", + } + ), + shortContent: _.truncate( + "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.", + { + length: 150, + omission: "", + } + ), + content: + "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.", + }, + { + title: "Dummy text of the printing and typesetting industry", + superShortContent: _.truncate( + "It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using 'Content here, content here', making it look like readable English. Many desktop publishing packages and web page editors now use Lorem Ipsum as their default model text, and a search for 'lorem ipsum' will uncover many web sites still in their infancy. Various versions have evolved over the years, sometimes by accident, sometimes on purpose (injected humour and the like).", + { + length: 30, + omission: "", + } + ), + shortContent: _.truncate( + "It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using 'Content here, content here', making it look like readable English. Many desktop publishing packages and web page editors now use Lorem Ipsum as their default model text, and a search for 'lorem ipsum' will uncover many web sites still in their infancy. Various versions have evolved over the years, sometimes by accident, sometimes on purpose (injected humour and the like).", + { + length: 150, + omission: "", + } + ), + content: + "It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using 'Content here, content here', making it look like readable English. Many desktop publishing packages and web page editors now use Lorem Ipsum as their default model text, and a search for 'lorem ipsum' will uncover many web sites still in their infancy. Various versions have evolved over the years, sometimes by accident, sometimes on purpose (injected humour and the like).", + }, + { + title: "Popularised in the 1960s with the release of Letraset", + superShortContent: _.truncate( + 'Contrary to popular belief, Lorem Ipsum is not simply random text. It has roots in a piece of classical Latin literature from 45 BC, making it over 2000 years old. Richard McClintock, a Latin professor at Hampden-Sydney College in Virginia, looked up one of the more obscure Latin words, consectetur, from a Lorem Ipsum passage, and going through the cites of the word in classical literature, discovered the undoubtable source. Lorem Ipsum comes from sections 1.10.32 and 1.10.33 of "de Finibus Bonorum et Malorum" (The Extremes of Good and Evil) by Cicero, written in 45 BC. This book is a treatise on the theory of ethics, very popular during the Renaissance. The first line of Lorem Ipsum, "Lorem ipsum dolor sit amet..", comes from a line in section 1.10.32. The standard chunk of Lorem Ipsum used since the 1500s is reproduced below for those interested. Sections 1.10.32 and 1.10.33 from "de Finibus Bonorum et Malorum" by Cicero are also reproduced in their exact original form, accompanied by English versions from the 1914 translation by H. Rackham.', + { + length: 30, + omission: "", + } + ), + shortContent: _.truncate( + 'Contrary to popular belief, Lorem Ipsum is not simply random text. It has roots in a piece of classical Latin literature from 45 BC, making it over 2000 years old. Richard McClintock, a Latin professor at Hampden-Sydney College in Virginia, looked up one of the more obscure Latin words, consectetur, from a Lorem Ipsum passage, and going through the cites of the word in classical literature, discovered the undoubtable source. Lorem Ipsum comes from sections 1.10.32 and 1.10.33 of "de Finibus Bonorum et Malorum" (The Extremes of Good and Evil) by Cicero, written in 45 BC. This book is a treatise on the theory of ethics, very popular during the Renaissance. The first line of Lorem Ipsum, "Lorem ipsum dolor sit amet..", comes from a line in section 1.10.32. The standard chunk of Lorem Ipsum used since the 1500s is reproduced below for those interested. Sections 1.10.32 and 1.10.33 from "de Finibus Bonorum et Malorum" by Cicero are also reproduced in their exact original form, accompanied by English versions from the 1914 translation by H. Rackham.', + { + length: 150, + omission: "", + } + ), + content: + 'Contrary to popular belief, Lorem Ipsum is not simply random text. It has roots in a piece of classical Latin literature from 45 BC, making it over 2000 years old. Richard McClintock, a Latin professor at Hampden-Sydney College in Virginia, looked up one of the more obscure Latin words, consectetur, from a Lorem Ipsum passage, and going through the cites of the word in classical literature, discovered the undoubtable source. Lorem Ipsum comes from sections 1.10.32 and 1.10.33 of "de Finibus Bonorum et Malorum" (The Extremes of Good and Evil) by Cicero, written in 45 BC. This book is a treatise on the theory of ethics, very popular during the Renaissance. The first line of Lorem Ipsum, "Lorem ipsum dolor sit amet..", comes from a line in section 1.10.32. The standard chunk of Lorem Ipsum used since the 1500s is reproduced below for those interested. Sections 1.10.32 and 1.10.33 from "de Finibus Bonorum et Malorum" by Cicero are also reproduced in their exact original form, accompanied by English versions from the 1914 translation by H. Rackham.', + }, + { + title: "200 Latin words, combined with a handful of model sentences", + superShortContent: _.truncate( + "There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomised words which don't look even slightly believable. If you are going to use a passage of Lorem Ipsum, you need to be sure there isn't anything embarrassing hidden in the middle of text. All the Lorem Ipsum generators on the Internet tend to repeat predefined chunks as necessary, making this the first true generator on the Internet. It uses a dictionary of over 200 Latin words, combined with a handful of model sentence structures, to generate Lorem Ipsum which looks reasonable. The generated Lorem Ipsum is therefore always free from repetition, injected humour, or non-characteristic words etc.", + { + length: 50, + omission: "", + } + ), + shortContent: _.truncate( + "There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomised words which don't look even slightly believable. If you are going to use a passage of Lorem Ipsum, you need to be sure there isn't anything embarrassing hidden in the middle of text. All the Lorem Ipsum generators on the Internet tend to repeat predefined chunks as necessary, making this the first true generator on the Internet. It uses a dictionary of over 200 Latin words, combined with a handful of model sentence structures, to generate Lorem Ipsum which looks reasonable. The generated Lorem Ipsum is therefore always free from repetition, injected humour, or non-characteristic words etc.", + { + length: 150, + omission: "", + } + ), + content: + "There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomised words which don't look even slightly believable. If you are going to use a passage of Lorem Ipsum, you need to be sure there isn't anything embarrassing hidden in the middle of text. All the Lorem Ipsum generators on the Internet tend to repeat predefined chunks as necessary, making this the first true generator on the Internet. It uses a dictionary of over 200 Latin words, combined with a handful of model sentence structures, to generate Lorem Ipsum which looks reasonable. The generated Lorem Ipsum is therefore always free from repetition, injected humour, or non-characteristic words etc.", + }, + ]; + return _.shuffle(news); + }, + fakeFiles() { + const files = [ + { fileName: "Celine Dion - Ashes.mp4", type: "MP4", size: "20 MB" }, + { fileName: "Laravel 7", type: "Empty Folder", size: "120 MB" }, + { fileName: fakers.fakeImages()[0], type: "Image", size: "1.2 MB" }, + { fileName: "Repository", type: "Folder", size: "20 KB" }, + { fileName: "Resources.txt", type: "TXT", size: "2.2 MB" }, + { fileName: "Routes.php", type: "PHP", size: "1 KB" }, + { fileName: "Dota 2", type: "Folder", size: "112 GB" }, + { fileName: "Documentation", type: "Empty Folder", size: "4 MB" }, + { fileName: fakers.fakeImages()[0], type: "Image", size: "1.4 MB" }, + { fileName: fakers.fakeImages()[0], type: "Image", size: "1 MB" }, + ]; + return _.shuffle(files); + }, + fakeJobs() { + const jobs = [ + "Frontend Engineer", + "Software Engineer", + "Backend Engineer", + "DevOps Engineer", + ]; + return _.shuffle(jobs); + }, + fakeNotificationCount() { + return _.random(1, 7); + }, + fakeFoods() { + const foods = [ + { + name: "Vanilla Latte", + image: imageAssets["/src/assets/images/food-beverage-1.jpg"].default, + }, + { + name: "Milkshake", + image: imageAssets["/src/assets/images/food-beverage-2.jpg"].default, + }, + { + name: "Soft Drink", + image: imageAssets["/src/assets/images/food-beverage-3.jpg"].default, + }, + { + name: "Root Beer", + image: imageAssets["/src/assets/images/food-beverage-4.jpg"].default, + }, + { + name: "Pocari", + image: imageAssets["/src/assets/images/food-beverage-5.jpg"].default, + }, + { + name: "Ultimate Burger", + image: imageAssets["/src/assets/images/food-beverage-6.jpg"].default, + }, + { + name: "Hotdog", + image: imageAssets["/src/assets/images/food-beverage-7.jpg"].default, + }, + { + name: "Avocado Burger", + image: imageAssets["/src/assets/images/food-beverage-8.jpg"].default, + }, + { + name: "Spaghetti Fettucine Aglio with Beef Bacon", + image: imageAssets["/src/assets/images/food-beverage-9.jpg"].default, + }, + { + name: "Spaghetti Fettucine Aglio with Smoked Salmon", + image: imageAssets["/src/assets/images/food-beverage-10.jpg"].default, + }, + { + name: "Curry Penne and Cheese", + image: imageAssets["/src/assets/images/food-beverage-11.jpg"].default, + }, + { + name: "French Fries", + image: imageAssets["/src/assets/images/food-beverage-12.jpg"].default, + }, + { + name: "Virginia Cheese Fries", + image: imageAssets["/src/assets/images/food-beverage-13.jpg"].default, + }, + { + name: "Virginia Cheese Wedges", + image: imageAssets["/src/assets/images/food-beverage-14.jpg"].default, + }, + { + name: "Fried/Grilled Banana", + image: imageAssets["/src/assets/images/food-beverage-15.jpg"].default, + }, + { + name: "Crispy Mushroom", + image: imageAssets["/src/assets/images/food-beverage-16.jpg"].default, + }, + { + name: "Fried Calamari", + image: imageAssets["/src/assets/images/food-beverage-17.jpg"].default, + }, + { + name: "Chicken Wings", + image: imageAssets["/src/assets/images/food-beverage-18.jpg"].default, + }, + { + name: "Snack Platter", + image: imageAssets["/src/assets/images/food-beverage-19.jpg"].default, + }, + ]; + return _.shuffle(foods); + }, +}; + +const fakerData = []; +for (let i = 0; i < 20; i++) { + fakerData[fakerData.length] = { + users: fakers.fakeUsers(), + photos: fakers.fakePhotos(), + images: fakers.fakeImages(), + dates: fakers.fakeDates(), + times: fakers.fakeTimes(), + formattedTimes: fakers.fakeFormattedTimes(), + totals: fakers.fakeTotals(), + trueFalse: fakers.fakeTrueFalse(), + stocks: fakers.fakeStocks(), + products: fakers.fakeProducts(), + categories: fakers.fakeCategories(), + news: fakers.fakeNews(), + files: fakers.fakeFiles(), + jobs: fakers.fakeJobs(), + notificationCount: fakers.fakeNotificationCount(), + foods: fakers.fakeFoods(), + }; +} + +const install = (app) => { + app.config.globalProperties.$f = () => { + return fakerData; + }; +}; + +export { install as default, fakerData as faker }; diff --git a/src/utils/helper.js b/src/utils/helper.js new file mode 100755 index 0000000..13fe005 --- /dev/null +++ b/src/utils/helper.js @@ -0,0 +1,147 @@ +import dayjs from "dayjs"; +import duration from "dayjs/plugin/duration"; + +dayjs.extend(duration); + +const helpers = { + cutText(text, length) { + if (text.split(" ").length > 1) { + const string = text.substring(0, length); + const splitText = string.split(" "); + splitText.pop(); + return splitText.join(" ") + "..."; + } else { + return text; + } + }, + formatDate(date, format) { + return dayjs(date).format(format); + }, + capitalizeFirstLetter(string) { + if (string) { + return string.charAt(0).toUpperCase() + string.slice(1); + } else { + return ""; + } + }, + onlyNumber(string) { + if (string) { + return string.replace(/\D/g, ""); + } else { + return ""; + } + }, + formatCurrency(number) { + if (number) { + const formattedNumber = number.toString().replace(/\D/g, ""); + const rest = formattedNumber.length % 3; + let currency = formattedNumber.substr(0, rest); + const thousand = formattedNumber.substr(rest).match(/\d{3}/g); + let separator; + + if (thousand) { + separator = rest ? "." : ""; + currency += separator + thousand.join("."); + } + + return currency; + } else { + return ""; + } + }, + timeAgo(time) { + const date = new Date( + (time || "").replace(/-/g, "/").replace(/[TZ]/g, " ") + ); + const diff = (new Date().getTime() - date.getTime()) / 1000; + const dayDiff = Math.floor(diff / 86400); + + if (isNaN(dayDiff) || dayDiff < 0 || dayDiff >= 31) { + return dayjs(time).format("MMMM DD, YYYY"); + } + + return ( + (dayDiff === 0 && + ((diff < 60 && "just now") || + (diff < 120 && "1 minute ago") || + (diff < 3600 && Math.floor(diff / 60) + " minutes ago") || + (diff < 7200 && "1 hour ago") || + (diff < 86400 && Math.floor(diff / 3600) + " hours ago"))) || + (dayDiff === 1 && "Yesterday") || + (dayDiff < 7 && dayDiff + " days ago") || + (dayDiff < 31 && Math.ceil(dayDiff / 7) + " weeks ago") + ); + }, + diffTimeByNow(time) { + const startDate = dayjs(dayjs().format("YYYY-MM-DD HH:mm:ss").toString()); + const endDate = dayjs(dayjs(time).format("YYYY-MM-DD HH:mm:ss").toString()); + + const duration = dayjs.duration(endDate.diff(startDate)); + const milliseconds = Math.floor(duration.asMilliseconds()); + + const days = Math.round(milliseconds / 86400000); + const hours = Math.round((milliseconds % 86400000) / 3600000); + let minutes = Math.round(((milliseconds % 86400000) % 3600000) / 60000); + const seconds = Math.round( + (((milliseconds % 86400000) % 3600000) % 60000) / 1000 + ); + + if (seconds < 30 && seconds >= 0) { + minutes += 1; + } + + return { + days: days.toString().length < 2 ? "0" + days : days, + hours: hours.toString().length < 2 ? "0" + hours : hours, + minutes: minutes.toString().length < 2 ? "0" + minutes : minutes, + seconds: seconds.toString().length < 2 ? "0" + seconds : seconds, + }; + }, + isset(obj) { + if (obj !== null && obj !== undefined) { + if (typeof obj === "object" || Array.isArray(obj)) { + return Object.keys(obj).length; + } else { + return obj.toString().length; + } + } + + return false; + }, + toRaw(obj) { + return JSON.parse(JSON.stringify(obj)); + }, + randomNumbers(from, to, length) { + const numbers = [0]; + for (let i = 1; i < length; i++) { + numbers.push(Math.ceil(Math.random() * (from - to) + to)); + } + + return numbers; + }, + toRGB(colors) { + const tempColors = Object.assign({}, colors); + const rgbColors = Object.entries(tempColors); + for (const [key, value] of rgbColors) { + if (typeof value === "string") { + if (value.replace("#", "").length == 6) { + const aRgbHex = value.replace("#", "").match(/.{1,2}/g); + tempColors[key] = (opacity = 1) => + `rgb(${parseInt(aRgbHex[0], 16)} ${parseInt( + aRgbHex[1], + 16 + )} ${parseInt(aRgbHex[2], 16)} / ${opacity})`; + } + } else { + tempColors[key] = helpers.toRGB(value); + } + } + return tempColors; + }, +}; + +const install = (app) => { + app.config.globalProperties.$h = helpers; +}; + +export { install as default, helpers as helper }; diff --git a/src/utils/index.js b/src/utils/index.js new file mode 100755 index 0000000..c178ec5 --- /dev/null +++ b/src/utils/index.js @@ -0,0 +1,11 @@ +import faker from "./faker"; +import helper from "./helper"; +import lodash from "./lodash"; +import colors from "./colors"; + +export default (app) => { + app.use(faker); + app.use(helper); + app.use(lodash); + app.use(colors); +}; diff --git a/src/utils/lodash.js b/src/utils/lodash.js new file mode 100644 index 0000000..6c97e7c --- /dev/null +++ b/src/utils/lodash.js @@ -0,0 +1,7 @@ +import _ from 'lodash' + +const install = app => { + app.config.globalProperties.$_ = _ +} + +export { install as default } diff --git a/src/views/.DS_Store b/src/views/.DS_Store new file mode 100644 index 0000000..36d7434 Binary files /dev/null and b/src/views/.DS_Store differ diff --git a/src/views/accordion/Main.vue b/src/views/accordion/Main.vue new file mode 100644 index 0000000..4923bfd --- /dev/null +++ b/src/views/accordion/Main.vue @@ -0,0 +1,419 @@ + diff --git a/src/views/add-product/Main.vue b/src/views/add-product/Main.vue new file mode 100644 index 0000000..2d7a832 --- /dev/null +++ b/src/views/add-product/Main.vue @@ -0,0 +1,1575 @@ + + + diff --git a/src/views/alert/Main.vue b/src/views/alert/Main.vue new file mode 100644 index 0000000..2d6e26e --- /dev/null +++ b/src/views/alert/Main.vue @@ -0,0 +1,1049 @@ + diff --git a/src/views/blog-layout-1/Main.vue b/src/views/blog-layout-1/Main.vue new file mode 100644 index 0000000..f8d3bc4 --- /dev/null +++ b/src/views/blog-layout-1/Main.vue @@ -0,0 +1,231 @@ + diff --git a/src/views/blog-layout-2/Main.vue b/src/views/blog-layout-2/Main.vue new file mode 100644 index 0000000..3806386 --- /dev/null +++ b/src/views/blog-layout-2/Main.vue @@ -0,0 +1,229 @@ + diff --git a/src/views/blog-layout-3/Main.vue b/src/views/blog-layout-3/Main.vue new file mode 100644 index 0000000..1b65a16 --- /dev/null +++ b/src/views/blog-layout-3/Main.vue @@ -0,0 +1,209 @@ + diff --git a/src/views/button/Main.vue b/src/views/button/Main.vue new file mode 100644 index 0000000..5e05c51 --- /dev/null +++ b/src/views/button/Main.vue @@ -0,0 +1,834 @@ + diff --git a/src/views/calendar/Main.vue b/src/views/calendar/Main.vue new file mode 100644 index 0000000..6a33e9b --- /dev/null +++ b/src/views/calendar/Main.vue @@ -0,0 +1,226 @@ + + + diff --git a/src/views/categories/Main.vue b/src/views/categories/Main.vue new file mode 100644 index 0000000..2c9957e --- /dev/null +++ b/src/views/categories/Main.vue @@ -0,0 +1,224 @@ + + + diff --git a/src/views/change-password/Main.vue b/src/views/change-password/Main.vue new file mode 100644 index 0000000..0d9a0fd --- /dev/null +++ b/src/views/change-password/Main.vue @@ -0,0 +1,164 @@ + diff --git a/src/views/chart/Main.vue b/src/views/chart/Main.vue new file mode 100644 index 0000000..aad0c51 --- /dev/null +++ b/src/views/chart/Main.vue @@ -0,0 +1,218 @@ + + + diff --git a/src/views/chat/Main.vue b/src/views/chat/Main.vue new file mode 100644 index 0000000..6da2bf8 --- /dev/null +++ b/src/views/chat/Main.vue @@ -0,0 +1,7494 @@ + + + diff --git a/src/views/crud-data-list/Main.vue b/src/views/crud-data-list/Main.vue new file mode 100644 index 0000000..1742dfb --- /dev/null +++ b/src/views/crud-data-list/Main.vue @@ -0,0 +1,216 @@ + + + diff --git a/src/views/crud-form/Main.vue b/src/views/crud-form/Main.vue new file mode 100644 index 0000000..68d32f5 --- /dev/null +++ b/src/views/crud-form/Main.vue @@ -0,0 +1,124 @@ + + + diff --git a/src/views/dashboard-overview-1/Main.vue b/src/views/dashboard-overview-1/Main.vue new file mode 100644 index 0000000..6078eaa --- /dev/null +++ b/src/views/dashboard-overview-1/Main.vue @@ -0,0 +1,983 @@ + + + diff --git a/src/views/dashboard-overview-2/Main.vue b/src/views/dashboard-overview-2/Main.vue new file mode 100644 index 0000000..a8f6ad6 --- /dev/null +++ b/src/views/dashboard-overview-2/Main.vue @@ -0,0 +1,1006 @@ + + + diff --git a/src/views/dashboard-overview-3/Main.vue b/src/views/dashboard-overview-3/Main.vue new file mode 100644 index 0000000..668452b --- /dev/null +++ b/src/views/dashboard-overview-3/Main.vue @@ -0,0 +1,901 @@ + + + diff --git a/src/views/dashboard-overview-4/Main.vue b/src/views/dashboard-overview-4/Main.vue new file mode 100644 index 0000000..0747e15 --- /dev/null +++ b/src/views/dashboard-overview-4/Main.vue @@ -0,0 +1,1050 @@ + + + diff --git a/src/views/datepicker/Main.vue b/src/views/datepicker/Main.vue new file mode 100644 index 0000000..c643034 --- /dev/null +++ b/src/views/datepicker/Main.vue @@ -0,0 +1,445 @@ + + + diff --git a/src/views/dropdown/Main.vue b/src/views/dropdown/Main.vue new file mode 100644 index 0000000..dd29708 --- /dev/null +++ b/src/views/dropdown/Main.vue @@ -0,0 +1,1078 @@ + + + diff --git a/src/views/error-page/Main.vue b/src/views/error-page/Main.vue new file mode 100644 index 0000000..32ee2ad --- /dev/null +++ b/src/views/error-page/Main.vue @@ -0,0 +1,44 @@ + + + diff --git a/src/views/faq-layout-1/Main.vue b/src/views/faq-layout-1/Main.vue new file mode 100644 index 0000000..2d0bc44 --- /dev/null +++ b/src/views/faq-layout-1/Main.vue @@ -0,0 +1,303 @@ + diff --git a/src/views/faq-layout-2/Main.vue b/src/views/faq-layout-2/Main.vue new file mode 100644 index 0000000..48c9fe4 --- /dev/null +++ b/src/views/faq-layout-2/Main.vue @@ -0,0 +1,256 @@ + diff --git a/src/views/faq-layout-3/Main.vue b/src/views/faq-layout-3/Main.vue new file mode 100644 index 0000000..d7165e5 --- /dev/null +++ b/src/views/faq-layout-3/Main.vue @@ -0,0 +1,277 @@ + diff --git a/src/views/file-manager/Main.vue b/src/views/file-manager/Main.vue new file mode 100644 index 0000000..bdf4e20 --- /dev/null +++ b/src/views/file-manager/Main.vue @@ -0,0 +1,287 @@ + diff --git a/src/views/file-upload/Main.vue b/src/views/file-upload/Main.vue new file mode 100644 index 0000000..e7f0730 --- /dev/null +++ b/src/views/file-upload/Main.vue @@ -0,0 +1,262 @@ + + + diff --git a/src/views/icon/Main.vue b/src/views/icon/Main.vue new file mode 100644 index 0000000..f41e958 --- /dev/null +++ b/src/views/icon/Main.vue @@ -0,0 +1,1149 @@ + diff --git a/src/views/image-zoom/Main.vue b/src/views/image-zoom/Main.vue new file mode 100644 index 0000000..c05f994 --- /dev/null +++ b/src/views/image-zoom/Main.vue @@ -0,0 +1,281 @@ + diff --git a/src/views/inbox/Main.vue b/src/views/inbox/Main.vue new file mode 100644 index 0000000..5c554c5 --- /dev/null +++ b/src/views/inbox/Main.vue @@ -0,0 +1,332 @@ + diff --git a/src/views/invoice-layout-1/Main.vue b/src/views/invoice-layout-1/Main.vue new file mode 100644 index 0000000..934fa64 --- /dev/null +++ b/src/views/invoice-layout-1/Main.vue @@ -0,0 +1,174 @@ + diff --git a/src/views/invoice-layout-2/Main.vue b/src/views/invoice-layout-2/Main.vue new file mode 100644 index 0000000..3698695 --- /dev/null +++ b/src/views/invoice-layout-2/Main.vue @@ -0,0 +1,175 @@ + diff --git a/src/views/loading-icon/Main.vue b/src/views/loading-icon/Main.vue new file mode 100644 index 0000000..5d3d7c2 --- /dev/null +++ b/src/views/loading-icon/Main.vue @@ -0,0 +1,81 @@ + diff --git a/src/views/login/Main.vue b/src/views/login/Main.vue new file mode 100644 index 0000000..862a022 --- /dev/null +++ b/src/views/login/Main.vue @@ -0,0 +1,117 @@ + + + diff --git a/src/views/modal/Main.vue b/src/views/modal/Main.vue new file mode 100644 index 0000000..c293774 --- /dev/null +++ b/src/views/modal/Main.vue @@ -0,0 +1,1610 @@ + + + diff --git a/src/views/notification/Main.vue b/src/views/notification/Main.vue new file mode 100644 index 0000000..1ea67fa --- /dev/null +++ b/src/views/notification/Main.vue @@ -0,0 +1,793 @@ + + + diff --git a/src/views/point-of-sale/Main.vue b/src/views/point-of-sale/Main.vue new file mode 100644 index 0000000..212438f --- /dev/null +++ b/src/views/point-of-sale/Main.vue @@ -0,0 +1,355 @@ + + + diff --git a/src/views/post/Main.vue b/src/views/post/Main.vue new file mode 100644 index 0000000..92bb778 --- /dev/null +++ b/src/views/post/Main.vue @@ -0,0 +1,277 @@ + + + diff --git a/src/views/pricing-layout-1/Main.vue b/src/views/pricing-layout-1/Main.vue new file mode 100644 index 0000000..308bcad --- /dev/null +++ b/src/views/pricing-layout-1/Main.vue @@ -0,0 +1,155 @@ + diff --git a/src/views/pricing-layout-2/Main.vue b/src/views/pricing-layout-2/Main.vue new file mode 100644 index 0000000..19df96d --- /dev/null +++ b/src/views/pricing-layout-2/Main.vue @@ -0,0 +1,327 @@ + diff --git a/src/views/product-grid/Main.vue b/src/views/product-grid/Main.vue new file mode 100644 index 0000000..a0caa24 --- /dev/null +++ b/src/views/product-grid/Main.vue @@ -0,0 +1,191 @@ + + + diff --git a/src/views/product-list/Main.vue b/src/views/product-list/Main.vue new file mode 100644 index 0000000..587322f --- /dev/null +++ b/src/views/product-list/Main.vue @@ -0,0 +1,218 @@ + + + diff --git a/src/views/profile-overview-1/Main.vue b/src/views/profile-overview-1/Main.vue new file mode 100644 index 0000000..7147215 --- /dev/null +++ b/src/views/profile-overview-1/Main.vue @@ -0,0 +1,550 @@ + + + diff --git a/src/views/profile-overview-2/Main.vue b/src/views/profile-overview-2/Main.vue new file mode 100644 index 0000000..4d96bdd --- /dev/null +++ b/src/views/profile-overview-2/Main.vue @@ -0,0 +1,703 @@ + + + diff --git a/src/views/profile-overview-3/Main.vue b/src/views/profile-overview-3/Main.vue new file mode 100644 index 0000000..e9d871e --- /dev/null +++ b/src/views/profile-overview-3/Main.vue @@ -0,0 +1,910 @@ + + + diff --git a/src/views/progress-bar/Main.vue b/src/views/progress-bar/Main.vue new file mode 100644 index 0000000..b217646 --- /dev/null +++ b/src/views/progress-bar/Main.vue @@ -0,0 +1,377 @@ + diff --git a/src/views/register/Main.vue b/src/views/register/Main.vue new file mode 100644 index 0000000..1617bc2 --- /dev/null +++ b/src/views/register/Main.vue @@ -0,0 +1,135 @@ + + + diff --git a/src/views/regular-form/Main.vue b/src/views/regular-form/Main.vue new file mode 100644 index 0000000..bbb7501 --- /dev/null +++ b/src/views/regular-form/Main.vue @@ -0,0 +1,1171 @@ + diff --git a/src/views/regular-table/Main.vue b/src/views/regular-table/Main.vue new file mode 100644 index 0000000..5427533 --- /dev/null +++ b/src/views/regular-table/Main.vue @@ -0,0 +1,919 @@ + diff --git a/src/views/reviews/Main.vue b/src/views/reviews/Main.vue new file mode 100644 index 0000000..77f56dd --- /dev/null +++ b/src/views/reviews/Main.vue @@ -0,0 +1,228 @@ + + + diff --git a/src/views/seller-detail/Main.vue b/src/views/seller-detail/Main.vue new file mode 100644 index 0000000..204b6c6 --- /dev/null +++ b/src/views/seller-detail/Main.vue @@ -0,0 +1,318 @@ + + + diff --git a/src/views/seller-list/Main.vue b/src/views/seller-list/Main.vue new file mode 100644 index 0000000..2881ca0 --- /dev/null +++ b/src/views/seller-list/Main.vue @@ -0,0 +1,222 @@ + + + diff --git a/src/views/slide-over/Main.vue b/src/views/slide-over/Main.vue new file mode 100644 index 0000000..aa30f74 --- /dev/null +++ b/src/views/slide-over/Main.vue @@ -0,0 +1,1110 @@ + + + diff --git a/src/views/slider/Main.vue b/src/views/slider/Main.vue new file mode 100644 index 0000000..be3ffbd --- /dev/null +++ b/src/views/slider/Main.vue @@ -0,0 +1,996 @@ + diff --git a/src/views/tab/Main.vue b/src/views/tab/Main.vue new file mode 100644 index 0000000..d448b37 --- /dev/null +++ b/src/views/tab/Main.vue @@ -0,0 +1,415 @@ + diff --git a/src/views/tabulator/Main.vue b/src/views/tabulator/Main.vue new file mode 100644 index 0000000..0bd9142 --- /dev/null +++ b/src/views/tabulator/Main.vue @@ -0,0 +1,413 @@ + + + diff --git a/src/views/tom-select/Main.vue b/src/views/tom-select/Main.vue new file mode 100644 index 0000000..f7ef2c7 --- /dev/null +++ b/src/views/tom-select/Main.vue @@ -0,0 +1,427 @@ + + + diff --git a/src/views/tooltip/Main.vue b/src/views/tooltip/Main.vue new file mode 100644 index 0000000..ff07f87 --- /dev/null +++ b/src/views/tooltip/Main.vue @@ -0,0 +1,368 @@ + + + diff --git a/src/views/transaction-detail/Main.vue b/src/views/transaction-detail/Main.vue new file mode 100644 index 0000000..f51e3b4 --- /dev/null +++ b/src/views/transaction-detail/Main.vue @@ -0,0 +1,190 @@ + diff --git a/src/views/transaction-list/Main.vue b/src/views/transaction-list/Main.vue new file mode 100644 index 0000000..1f12d8f --- /dev/null +++ b/src/views/transaction-list/Main.vue @@ -0,0 +1,243 @@ + + + diff --git a/src/views/typography/Main.vue b/src/views/typography/Main.vue new file mode 100644 index 0000000..1f86592 --- /dev/null +++ b/src/views/typography/Main.vue @@ -0,0 +1,718 @@ + diff --git a/src/views/update-profile/Main.vue b/src/views/update-profile/Main.vue new file mode 100644 index 0000000..49f5a15 --- /dev/null +++ b/src/views/update-profile/Main.vue @@ -0,0 +1,381 @@ + + + diff --git a/src/views/users-layout-1/Main.vue b/src/views/users-layout-1/Main.vue new file mode 100644 index 0000000..42e6b46 --- /dev/null +++ b/src/views/users-layout-1/Main.vue @@ -0,0 +1,165 @@ + diff --git a/src/views/users-layout-2/Main.vue b/src/views/users-layout-2/Main.vue new file mode 100644 index 0000000..abbfb19 --- /dev/null +++ b/src/views/users-layout-2/Main.vue @@ -0,0 +1,120 @@ + diff --git a/src/views/users-layout-3/Main.vue b/src/views/users-layout-3/Main.vue new file mode 100644 index 0000000..5d2aeca --- /dev/null +++ b/src/views/users-layout-3/Main.vue @@ -0,0 +1,154 @@ + diff --git a/src/views/validation/Main.vue b/src/views/validation/Main.vue new file mode 100644 index 0000000..50756a8 --- /dev/null +++ b/src/views/validation/Main.vue @@ -0,0 +1,395 @@ + + + diff --git a/src/views/wizard-layout-1/Main.vue b/src/views/wizard-layout-1/Main.vue new file mode 100644 index 0000000..6bd7e50 --- /dev/null +++ b/src/views/wizard-layout-1/Main.vue @@ -0,0 +1,97 @@ + diff --git a/src/views/wizard-layout-2/Main.vue b/src/views/wizard-layout-2/Main.vue new file mode 100644 index 0000000..46f6ed1 --- /dev/null +++ b/src/views/wizard-layout-2/Main.vue @@ -0,0 +1,122 @@ + diff --git a/src/views/wizard-layout-3/Main.vue b/src/views/wizard-layout-3/Main.vue new file mode 100644 index 0000000..943c4ef --- /dev/null +++ b/src/views/wizard-layout-3/Main.vue @@ -0,0 +1,144 @@ + diff --git a/src/views/wysiwg-editor/Main.vue b/src/views/wysiwg-editor/Main.vue new file mode 100644 index 0000000..49b4bf2 --- /dev/null +++ b/src/views/wysiwg-editor/Main.vue @@ -0,0 +1,49 @@ + + + diff --git a/tailwind.config.js b/tailwind.config.js new file mode 100755 index 0000000..6c8fa35 --- /dev/null +++ b/tailwind.config.js @@ -0,0 +1,111 @@ +const colors = require("tailwindcss/colors"); +const { + toRGB, + withOpacityValue, +} = require("@left4code/tw-starter/dist/js/tailwind-config-helper"); + +module.exports = { + mode: "jit", + content: [ + "./src/**/*.{php,html,js,jsx,ts,tsx,vue}", + "./resources/**/*.{php,html,js,jsx,ts,tsx,vue}", + "./node_modules/@left4code/tw-starter/**/*.js", + // ".//*.html", + ], + darkMode: "class", + theme: { + extend: { + colors: { + rgb: toRGB({ + inherit: colors.inherit, + current: colors.current, + transparent: colors.transparent, + black: colors.black, + white: colors.white, + slate: colors.slate, + gray: colors.gray, + zinc: colors.zinc, + neutral: colors.neutral, + stone: colors.stone, + red: colors.red, + orange: colors.orange, + amber: colors.amber, + yellow: colors.yellow, + lime: colors.lime, + green: colors.green, + emerald: colors.emerald, + teal: colors.teal, + cyan: colors.cyan, + sky: colors.sky, + blue: colors.blue, + indigo: colors.indigo, + violet: colors.violet, + purple: colors.purple, + fuchsia: colors.fuchsia, + pink: colors.pink, + rose: colors.rose, + sky: colors.sky, + stone: colors.stone, + neutral: colors.neutral, + gray: colors.gray, + slate: colors.slate, + }), + primary: withOpacityValue("--color-primary"), + secondary: withOpacityValue("--color-secondary"), + success: withOpacityValue("--color-success"), + info: withOpacityValue("--color-info"), + warning: withOpacityValue("--color-warning"), + pending: withOpacityValue("--color-pending"), + danger: withOpacityValue("--color-danger"), + light: withOpacityValue("--color-light"), + dark: withOpacityValue("--color-dark"), + slate: { + 50: withOpacityValue("--color-slate-50"), + 100: withOpacityValue("--color-slate-100"), + 200: withOpacityValue("--color-slate-200"), + 300: withOpacityValue("--color-slate-300"), + 400: withOpacityValue("--color-slate-400"), + 500: withOpacityValue("--color-slate-500"), + 600: withOpacityValue("--color-slate-600"), + 700: withOpacityValue("--color-slate-700"), + 800: withOpacityValue("--color-slate-800"), + 900: withOpacityValue("--color-slate-900"), + }, + darkmode: { + 50: withOpacityValue("--color-darkmode-50"), + 100: withOpacityValue("--color-darkmode-100"), + 200: withOpacityValue("--color-darkmode-200"), + 300: withOpacityValue("--color-darkmode-300"), + 400: withOpacityValue("--color-darkmode-400"), + 500: withOpacityValue("--color-darkmode-500"), + 600: withOpacityValue("--color-darkmode-600"), + 700: withOpacityValue("--color-darkmode-700"), + 800: withOpacityValue("--color-darkmode-800"), + 900: withOpacityValue("--color-darkmode-900"), + }, + }, + fontFamily: { + roboto: ["Roboto"], + }, + container: { + center: true, + }, + maxWidth: { + "1/4": "25%", + "1/2": "50%", + "3/4": "75%", + }, + strokeWidth: { + 0.5: 0.5, + 1.5: 1.5, + 2.5: 2.5, + }, + }, + }, + plugins: [require("@tailwindcss/forms")], + variants: { + extend: { + boxShadow: ["dark"], + }, + }, +}; diff --git a/vite.config.js b/vite.config.js new file mode 100644 index 0000000..4dc17b7 --- /dev/null +++ b/vite.config.js @@ -0,0 +1,13 @@ +import { defineConfig } from "vite"; +import vue from "@vitejs/plugin-vue"; +import path from "path"; + +// https://vitejs.dev/config/ +export default defineConfig({ + plugins: [vue()], + resolve: { + alias: { + "@": path.resolve(__dirname, "./src"), + }, + }, +});

Accordion

Basic Accordion

Boxed Accordion

Component Reference

Component API

Add Product

Tips

Alert

Basic Alerts

Icon Alerts

+ Additional Content Alerts +

Icon & Dismiss Alerts

Outline Alerts

Soft Color Alerts

Component Reference

Component API

Blog Layout

Blog Layout

+ {{ $f()[0].news[0].title }} +

Buttons

Basic Buttons

Button Sizes

Working with Links

Elevated Buttons

Social Media Buttons

Outline Buttons

Loading State Buttons

Rounded Buttons

Soft Color Buttons

Icon Buttons

Icon Only Buttons

Calendar

Categories

Change Password

Change Password

Chart

Vertical Bar Chart

Horizontal Bar Chart

Donut Chart

Stacked Bar Chart

Line Chart

Pie Chart

Chat

Data List Layout

Form Layout

General Report

Sales Report

Weekly Top Seller

Sales Report

Official Store

+ Weekly Best Sellers +

+ Weekly Top Products +

Transactions

+ Recent Activities +

+ Important Notes +

Schedules

General Report

Visitors

Users By Age

Official Store

+ Weekly Best Sellers +

+ Weekly Top Products +

+ Important Notes +

+ Recent Activities +

Transactions

Schedules

Official Store

+ Weekly Best Sellers +

+ Weekly Top Products +

+ Recent Activities +

Transactions

General Report

Sales Report

Official Store

+ Weekly Best Sellers +

Visitors

Most Viewed Pages

Top Search Items

+ Weekly Top Products +

+ Important Notes +