├── README.md ├── discount-code.html ├── docs.html ├── hire-us.html ├── landingpage ├── index.html └── style.css └── package ├── .gitignore ├── .npmrc ├── README.md ├── app.vue ├── components ├── auth │ ├── LoginForm.vue │ └── RegisterForm.vue ├── dashboard │ ├── MonthlyEarnings.vue │ ├── ProductCards.vue │ ├── ProductPerformance.vue │ ├── RecentTransaction.vue │ ├── SalesOverview.vue │ └── YearlyBreakup.vue ├── layout │ └── full │ │ ├── Main.vue │ │ ├── Topbar.vue │ │ ├── logo │ │ ├── Logo.vue │ │ └── LogoDark.vue │ │ ├── vertical-header │ │ ├── NotificationDD.vue │ │ └── ProfileDD.vue │ │ └── vertical-sidebar │ │ ├── Dropdown │ │ └── index.vue │ │ ├── ExtraBox │ │ └── index.vue │ │ ├── Icon.vue │ │ ├── NavCollapse │ │ └── index.vue │ │ ├── NavGroup │ │ └── index.vue │ │ ├── NavItem │ │ └── index.vue │ │ └── sidebarItem.ts ├── shared │ ├── CardHeaderFooter.vue │ ├── UiChildCard.vue │ ├── UiParentCard.vue │ ├── UiTableCard.vue │ ├── UiTextfieldPrimary.vue │ ├── WidgetCard.vue │ └── WidgetCardv2.vue ├── style-components │ ├── shadow │ │ └── Shadow.vue │ └── typography │ │ ├── DefaultText.vue │ │ └── Heading.vue └── ui-components │ ├── alert │ ├── Basic.vue │ ├── Closable.vue │ └── Filled.vue │ ├── button │ ├── BaseButtons.vue │ ├── ColorsButtons.vue │ ├── IconColorSizes.vue │ ├── OutlinedButtons.vue │ ├── SizeButtons.vue │ └── TextButtons.vue │ └── cards │ ├── CardsContentWrap.vue │ ├── CardsMedia.vue │ ├── CardsProps.vue │ ├── CardsSlots.vue │ ├── CardsTwitter.vue │ └── CardsWeather.vue ├── data └── dashboard │ └── dashboardData.ts ├── error.vue ├── layouts ├── blank.vue └── default.vue ├── nuxt.config.ts ├── package-lock.json ├── package.json ├── pages ├── Icons.vue ├── Sample-Page.vue ├── auth │ ├── Login.vue │ └── Register.vue ├── index.vue ├── ui-components │ ├── Alerts.vue │ ├── Buttons.vue │ ├── Cards.vue │ └── Tables.vue └── ui │ ├── Shadow.vue │ └── Typography.vue ├── plugins └── vuetify.ts ├── public ├── favicon.ico └── images │ ├── background │ ├── errorimg.svg │ └── rocket.png │ ├── blog │ ├── blog-img1.jpg │ └── blog-img4.jpg │ ├── logos │ ├── logo-adminmart.svg │ ├── logo.svg │ └── logolight.svg │ ├── products │ ├── s11.jpg │ ├── s4.jpg │ ├── s5.jpg │ └── s7.jpg │ ├── technology │ ├── angular-cat-icon.svg │ ├── bt-cat-icon.svg │ ├── next-cat-icon.svg │ ├── nuxt-cat-icon.svg │ ├── react-cat-icon.svg │ ├── tailwind-icon.svg │ └── vue-cat-icon.svg │ └── users │ └── avatar-1.jpg ├── scss ├── _override.scss ├── _variables.scss ├── components │ ├── _VButtons.scss │ ├── _VCard.scss │ ├── _VInput.scss │ ├── _VNavigationDrawer.scss │ ├── _VShadow.scss │ └── _VTextField.scss ├── layout │ ├── _container.scss │ ├── _sidebar.scss │ └── _topbar.scss ├── pages │ ├── _auth.scss │ └── _dashboards.scss └── style.scss ├── theme └── LightTheme.ts ├── tsconfig.json └── types ├── dashboard └── index.ts └── themeTypes └── ThemeType.ts /README.md: -------------------------------------------------------------------------------- 1 |

2 | 3 | sneat-logo 4 | 5 |

6 |

7 | 8 | Modernize Free NuxtJs Admin Dashboard Template 9 | 10 |

11 |

Download most useful and comprehensive 🚀 Free NuxtJs admin template built for developers

12 | 13 | [![MaterialM Free Tailwind React Admin Template Demo Screenshot](https://adminmart.com/wp-content/uploads/2023/02/modernize-free-nuxt-admin-dashboard-am-min.png)](https://adminmart.com/product/modernize-free-nuxtjs-admin-dashboard/?ref=56) 14 | 15 | 16 | ## 👋 Introduction 17 | 18 | **Modernize Free NuxtJs Admin Dashboard Template** is a modern, fully responsive **Nuxt dashboard template** built with **NuxtJs**, **Vuetify** and **Vite**. It offers a clean, minimal design that follows Material Design principles, making it ideal for building scalable and high-performance **admin panels**, **SaaS dashboards**, and **internal tools**. 19 | 20 | Designed for speed and scalability, **Modernize Free (Nuxt.js Edition)** seamlessly blends the power of Nuxt.js' versatile framework and **Vuetify’s stunning UI components**. This dynamic combination empowers developers to craft professional-grade dashboards with ease and efficiency. 21 | 22 | Fully open-source and built with modern web technologies, **Modernize Free Nuxt Js Admin Template** offers top-tier performance, a smooth development experience, and excellent SEO support. Whether you're building an internal tool, admin panel, or business dashboard, it provides a solid, production-ready foundation to get started quickly and scale effortlessly. 23 | 24 | 25 | 26 | ### 🔑 Key Features 27 | 28 | - **Responsive Design** 29 | Delivers a seamless experience across all screen sizes with **Vuetify's** responsive layout system and adaptive components. 30 | 31 | - **Nuxt.js Framework** 32 | Leveraging the full power of **Nuxt.js**, including built-in routing, state management with Vuex, and strong TypeScript support, to deliver scalable and maintainable applications. 33 | 34 | - **Vuetify Components** 35 | Built entirely with **Vuetify**, offering a rich set of pre-styled, accessible UI components that follow the Material Design guidelines—ideal for fast, consistent interface development. 36 | 37 | - **Chart.js Integration** 38 | Comes with interactive and customizable charts powered by **Chart.js**, perfect for visualizing analytics and data dashboards (or any other visualization library you prefer). 39 | 40 | - **TypeScript Support** 41 | Fully typed codebase ensures reliability, better developer tooling, and maintainable code structure. 42 | 43 | - **Developer Friendly** 44 | Modular folder structure, clean code, and minimal setup make it easy to extend, customize, and scale for real-world applications. 45 | --- 46 | 47 | 48 | ## 🛠️ Notable Libraries and Tools 49 | 50 | | **Library / Tool** | **Description** | 51 | |------------------------|---------------------------------------------------------------------------------| 52 | | **Nuxt.js** | A powerful framework built on Vue.js, designed for building scalable, server-side rendered (SSR) web applications. | 53 | | **Vuetify** | A Material Design component library for Vue.js, offering pre-built, responsive UI components for rapid interface development. | 54 | | **Chart.js** | A modern charting library for building interactive and customizable charts, perfect for dashboards and data visualizations. | 55 | | **TypeScript** | A strongly typed programming language that builds on JavaScript, offering better tooling, code quality, and maintainability. | 56 | 57 | --- 58 | ## 💾 Installation Guide 59 | 60 | Welcome to the **Modernize Free NuxtJs Template**! This guide will walk you through the installation and setup process, so you can get started with building your custom admin dashboard in no time. 61 | 62 | ### 📝 Steps to Install 63 | 64 | #### 1. **Clone the Repository** 65 | 66 | The easiest way to get started is by cloning the repository or download the zip file. You can do this with the following command: 67 | 68 | ```bash 69 | git clone https://github.com/adminmart/Modernize-nuxtjs-free.git 70 | ``` 71 | 72 | #### 2. **Install Dependencies** 73 | 74 | Install the relative Dependencies of the template. You can do this with the following command: 75 | 76 | ```bash 77 | npm install 78 | ``` 79 | 80 | #### 3. **Start the Development Server** 81 | 82 | Once the dependencies are installed, you can start a local development server to preview the template: 83 | 84 | ```bash 85 | npm run dev 86 | 87 | ``` 88 | 89 | --- 90 | 91 | ## 📝 Documentation 92 | 93 | Welcome to the **Modernize Free NuxtJs Template** documentation! Whether you're just getting started or looking to explore advanced features, this guide will help you set up and customize your project with ease. 94 | 95 | 👉 **[Click here to read the full documentation](https://adminmart.github.io/free-documentation/nuxt/modernize/index.html?ref=56)** 96 | 97 | --- 98 | 99 | ## 💎 Pro Version 100 | 101 | The Pro Version of the **Modernize NuxtJs Dashboard Template** comes packed with essential features—ideal for personal projects, prototypes, or small-scale applications. When you're ready to level up, the Pro Version unlocks a powerful suite of extras, including multiple theme options, advanced UI widgets, real-time notifications, priority support, and a host of other premium tools designed to supercharge your development workflow. 102 | 103 |
104 | 105 | Try the Demo 106 | 107 | 108 | Download Now 109 | 110 |
111 | 112 | [![MaterialM Tailwind React Admin Template Demo Screenshot](https://adminmart.com/wp-content/uploads/2023/02/modernize-nuxt-js-admin-dashboard.png)](https://adminmart.com/product/modernize-nuxt-js-admin-dashboard/?ref=56) 113 | 114 | --- 115 | 116 | ## ⚖️ Free vs Pro Version Comparison 117 | 118 | The **Free Version** of the **Modernize NuxtJs Dashboard Template** provides a solid set of features, perfect for personal projects or small applications. However, for businesses or developers looking to unlock more advanced functionality, the **Pro Version** offers exciting features like **multiple themes**, **advanced widgets**, **real-time notifications**, **priority support**, and much more. 119 | 120 | 121 | #### Check out the comparison below to see the key differences between the two versions: 122 | 123 | | **Feature** | **Free Version** | **Pro Version** | 124 | |-----------------------------------|----------------------------------------|-----------------------------------------------------| 125 | | **Demo** | [![Try the Demo](https://img.shields.io/badge/Try_the_Demo-Click_Here-blue)](https://modernize-nuxtjs-free.netlify.app/?ref=56) | [![Try the Demo](https://img.shields.io/badge/Try_the_Demo-Click_Here-blue)](https://modernize-nuxt.adminmart.com/dashboards/modern?ref=56) | 126 | | **Download** | [![Download Now](https://img.shields.io/badge/Download_Now-Click_Here-green)](https://adminmart.com/product/modernize-free-nuxtjs-admin-dashboard/?ref=56) | [![Download Now](https://img.shields.io/badge/Download_Now-Click_Here-green)](https://adminmart.com/product/modernize-nuxt-js-admin-dashboard/#product-demo-section?ref=56) | 127 | | **Responsive Design** | ✅ Yes | ✅ Yes | 128 | | **Pre-designed Pages** | ✅ Basic Pages | ✅ Advanced Pages (more layouts & options) | 129 | | **Widgets** | ✅ Basic Widgets | ✅ Advanced Widgets (e.g., weather, charts, maps) | 130 | | **Themes** | ✅ Default Theme | ✅ Multiple Themes, Custom Color Skins, and Dark Modes | 131 | | **Support** | ✅ Community Support | ✅ Priority Support with Direct Contact | 132 | | **Additional Components** | ❌ Limited | ✅ Additional Components (Forms, Buttons, More UI Elements) | 133 | | **Advanced Data Visualization** | ❌ Basic Charts | ✅ Advanced Data Visualizations (graphs, complex charts) | 134 | | **Multi-Language Support** | ❌ Not available | ✅ Built-in support for multiple languages | 135 | | **User Permissions & Roles** | ❌ No | ✅ User roles and permissions management | 136 | | **Real-time Notifications** | ❌ Not available | ✅ Real-time notifications for alerts & updates | 137 | | **Advanced Analytics & Reporting**| ❌ Basic reports | ✅ Advanced analytics with custom reports and filters| 138 | 139 | 140 | --- 141 | 142 | ## 🗂️ Other versions 143 | 144 | 145 | 146 | 147 | 151 | 155 | 159 | 160 | 161 | 162 | 163 | 168 | 173 | 178 | 179 | 180 | 181 | 182 | 186 | 190 | 191 | 192 | 193 | 194 | 199 | 204 | 205 | 206 |
148 | Bootstrap 5 templates 149 | Bootstrap 150 | 152 | next templates 153 | Next 154 | 156 | next templates 157 | Angular 158 |
164 | 165 | materialM-bootstrap-admin-template 166 | 167 | 169 | 170 | materialM-next-admin-template 171 | 172 | 174 | 175 | materialM-next-admin-template 176 | 177 |
183 | angular templates 184 | React 185 | 187 | vue templates 188 | Vue 189 |
195 | 196 | materialM-react-admin-template 197 | 198 | 200 | 201 | materialM-vue-admin-template 202 | 203 |
207 | 208 | --- 209 | 210 | 211 | ## 🤝 Contributing 212 | 213 | We welcome contributions from the community to help improve the **Modernize NuxtJs Dashboard Template**. Whether it’s fixing bugs, adding new features, improving documentation, or sharing ideas — your input is appreciated! 214 | 215 | ### 🛠️ How to Contribute 216 | 217 | Follow these simple steps to start contributing: 218 | 219 | 1. **Fork the Repository** 220 | Click the **Fork** button on the top-right corner of this repo to create your own copy. 221 | 222 | 2. **Clone Your Fork** 223 | Use the command below to clone your forked repository: 224 | ```bash 225 | git clone https://github.com/adminmart/Modernize-nuxtjs-free.git 226 | 3. **Create a New Branch** 227 | Create a new branch to work on your feature or fix. This keeps your changes separate from the main branch: 228 | ```bash 229 | git checkout -b feature/your-feature-name 230 | 4. **Commit and Push Changes** 231 | After making your changes, commit them with a meaningful message and push your branch to your fork: 232 | ```bash 233 | git commit -am "Add: Description of changes made" 234 | git push origin feature/your-feature-name 235 | --- 236 | 237 | ## 🧭 Useful Links 238 | -

Bootstrap Templates & Themes from AdminMart

239 | -

React Templates from AdminMart

240 | -

NextJs Templates from AdminMart

241 | -

Vue Templates from AdminMart

242 | -

Tailwind Templates from AdminMart

243 | -

Angular Templates from AdminMart

244 | -

Material UI Templates from AdminMart

245 | -

Vuetify Themes from AdminMart

246 | -

Nuxt Js Templates from AdminMart

247 | 248 | --- 249 | 250 | ## 🌐 We are social 251 | 252 | [![](https://img.shields.io/badge/GitHub-100000?style=for-the-badge&logo=github&logoColor=white)](https://github.com/adminmart) [![facebook](https://img.shields.io/badge/facebook-logo?style=for-the-badge&logo=facebook&logoColor=white&color=%230866ff)](https://www.facebook.com/official.adminmart) [![instagram](https://img.shields.io/badge/instagram-logo?style=for-the-badge&logo=instagram&logoColor=white&color=%23F35369)](https://www.instagram.com/adminmart.official/) [![youtube](https://img.shields.io/badge/youtube-logo?style=for-the-badge&logo=youtube&logoColor=white&color=%23cc0000)](https://www.youtube.com/@adminmart-official) [![](https://img.shields.io/badge/LinkedIn-0077B5?style=for-the-badge&logo=linkedin&logoColor=white)](https://www.linkedin.com/in/admin-mart-5ba892249/) 253 | -------------------------------------------------------------------------------- /discount-code.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Discount Code 8 | 9 | 87 | 88 | 89 | 90 |
91 |
92 |
93 |
94 |

30% OFF

95 | On Premium 96 | Product 97 |
Use Coupon code : upgrade30 98 |
99 | 100 | Get Now 101 |
102 |
103 | 104 | 105 | -------------------------------------------------------------------------------- /docs.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Modernize Free NuxtJs Admin Dashboard | Docs 5 | 9 | 10 | 11 | 12 |

Modernize Free NuxtJs Admin Dashboard

13 | https://adminmart.github.io/free-documentation/nuxt/modernize/index.html 17 | 18 | 19 | -------------------------------------------------------------------------------- /hire-us.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Modernize Free NuxtJs Admin Dashboard 5 | 9 | 10 | 11 | 12 |

Modernize Free NuxtJs Admin Dashboard

13 | https://adminmart.com/hire-us/ 16 | 17 | 18 | -------------------------------------------------------------------------------- /landingpage/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Modernize Free Nuxtjs Admin Template by Adminmart 8 | 9 | 10 | 11 | 13 | 14 | 16 | 17 | 18 | 19 | 20 |
21 |
22 |
23 | 24 |
25 | 50 |
51 | 52 |
53 |
54 | 55 |
56 |
57 |
58 |
59 | 60 | 61 | 62 |
63 |
64 |
65 |
66 |

Free Version

67 | 68 |
69 |
70 | Free version 73 |
74 | 81 |
82 |
83 |
    84 |
  • 85 | 86 | 1 Basic Dashboard 87 |
  • 88 |
  • 89 | 7+ Pages Template 90 |
  • 91 |
  • 92 | 5+ UI Components 93 |
  • 94 |
  • 95 | Vuetify 3 96 |
  • 97 |
  • 98 | NuxtJs 3 99 |
  • 100 |
  • 101 | Tabler Icons 102 |
  • 103 | 104 |
  • 105 | No Support 106 | Provided 107 |
  • 108 |
109 |
110 |
111 |
    112 |
  • 113 | Google Fonts 114 |
  • 115 |
  • 116 | SCSS Base CSS 117 |
  • 118 |
  • 119 | Code splitting 120 |
  • 121 |
  • 122 | Organized Code Structure 123 |
  • 124 |
  • 125 | Fully Responsive Pages 126 |
  • 127 |
  • 128 | No 129 | Documentation 130 |
  • 131 |
  • 132 | Backlink 133 | Required 134 |
  • 135 |
136 |
137 |
138 |
139 |
140 |
141 | 142 | 143 | 144 |
145 |
146 |
147 |
148 |

149 | Pro Version 150 |

151 | 152 |
153 |
154 | Pro version 157 |
158 |
159 | Live Preview 162 | Check Pro Version 164 |
165 |
166 |
167 |
    168 |
  • 169 | 2+ Stunning Dashboards 170 |
  • 171 |
  • 172 | 65+ Page Templates 173 |
  • 174 |
  • 175 | 45+ UI Components 176 |
  • 177 |
  • 178 | 15+ Integrated Plugins 179 |
  • 180 |
  • 181 | Vuetify 3 + Nuxt 3 182 |
  • 183 |
  • 184 | NuxtJs Landing Page 185 |
  • 186 |
  • 187 | 1 Year Premium Support 188 |
  • 189 | 190 |
  • 191 | 3400+ Font Icons 192 |
  • 193 |
  • 194 | Lots of Charts Added 195 |
  • 196 |
  • 197 | Slick Carousel Added 198 |
  • 199 |
  • 200 | Fully Responsive Pages 201 |
  • 202 |
  • 203 | & lots more.. 204 |
  • 205 |
206 |
207 |
208 |
    209 |
  • 210 | 4+ Unique Demos 211 |
  • 212 |
  • 213 | Axios - Mock API Included 214 |
  • 215 |
  • 216 | 7+ Ready to Use App 217 |
  • 218 |
  • 219 | i18 Vue Included 220 |
  • 221 |
  • 222 | Dashboard Figma Files 223 |
  • 224 |
  • 225 | Documentation Provided 226 |
  • 227 |
  • 228 | Lots of Widgets 229 |
  • 230 |
  • 231 | Tons of Table Example 232 |
  • 233 |
  • 234 | Variety of Forms Included 235 |
  • 236 |
  • 237 | SCSS Base CSS 238 |
  • 239 |
  • 240 | Easy to Customize 241 |
  • 242 | 243 |
244 |
245 |
246 |
247 |
248 |
249 |
250 |
251 |
252 | 253 | 258 |
259 |
260 | 261 | 264 | 265 | 266 | -------------------------------------------------------------------------------- /landingpage/style.css: -------------------------------------------------------------------------------- 1 | @import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@200;300;400;500;600;700;800&display=swap'); 2 | 3 | :root { 4 | --bs-font-sans-serif: "Plus Jakarta Sans", 5 | sans-serif; 6 | --bs-primary: #5D87FF; 7 | --bs-secondary: #6c757d; 8 | --bs-danger: #FA896B; 9 | --bs-body-font-size: 0.875rem; 10 | --bs-body-font-weight: 400; 11 | --bs-body-line-height: 1.5; 12 | --bs-body-color: #5A6A85; 13 | --bs-body-bg: #fff; 14 | --bs-border-color: #ebf1f6; 15 | --bs-heading-color: #2A3547; 16 | --bs-border-radius: 7px; 17 | --bs-gutter-x: 24px; 18 | --bs-btn-font-size: 0.875rem; 19 | --bs-card-spacer-y: 30px; 20 | --bs-card-spacer-x: 30px; 21 | --bs-card-border-width: 0px; 22 | --bs-success-rgb: 19,222,185; 23 | --bs-primary-rgb: 93,135,255; 24 | --bs-light-rgb: 246,249,252; 25 | --bs-dark-rgb: 42,53,71; 26 | } 27 | 28 | .btn { 29 | --bs-btn-padding-x: 16px; 30 | --bs-btn-padding-y: 7px; 31 | --bs-btn-font-size: 0.875rem; 32 | } 33 | 34 | .btn-primary { 35 | --bs-btn-bg: var(--bs-primary); 36 | --bs-btn-border-color: var(--bs-primary); 37 | --bs-btn-hover-bg: var(--bs-primary); 38 | --bs-btn-hover-border-color: var(--bs-primary); 39 | --bs-btn-focus-shadow-rgb: 49,132,253; 40 | --bs-btn-active-bg: var(--bs-primary); 41 | --bs-btn-active-border-color: var(--bs-primary); 42 | --bs-btn-disabled-bg: var(--bs-primary); 43 | --bs-btn-disabled-border-color: var(--bs-primary); 44 | } 45 | 46 | .btn-secondary { 47 | --bs-btn-bg: var(--bs-secondary); 48 | --bs-btn-border-color: var(--bs-secondary); 49 | --bs-btn-hover-bg: var(--bs-secondary); 50 | --bs-btn-hover-border-color: var(--bs-secondary); 51 | --bs-btn-focus-shadow-rgb: 49,132,253; 52 | --bs-btn-active-bg: var(--bs-secondary); 53 | --bs-btn-active-border-color: var(--bs-secondary); 54 | --bs-btn-disabled-bg: var(--bs-secondary); 55 | --bs-btn-disabled-border-color: var(--bs-secondary); 56 | } 57 | 58 | .btn-danger { 59 | --bs-btn-bg: var(--bs-danger); 60 | --bs-btn-border-color: var(--bs-danger); 61 | --bs-btn-hover-bg: var(--bs-danger); 62 | --bs-btn-hover-border-color: var(--bs-danger); 63 | --bs-btn-focus-shadow-rgb: 49,132,253; 64 | --bs-btn-active-bg: var(--bs-danger); 65 | --bs-btn-active-border-color: var(--bs-danger); 66 | --bs-btn-disabled-bg: var(--bs-danger); 67 | --bs-btn-disabled-border-color: var(--bs-danger); 68 | } 69 | 70 | .btn-outline-primary { 71 | --bs-btn-color: var(--bs-primary); 72 | --bs-btn-border-color: var(--bs-primary); 73 | --bs-btn-hover-color: #fff; 74 | --bs-btn-hover-bg: var(--bs-primary); 75 | --bs-btn-hover-border-color: var(--bs-primary); 76 | --bs-btn-focus-shadow-rgb: 13,110,253; 77 | --bs-btn-active-color: #fff; 78 | --bs-btn-active-bg: var(--bs-primary); 79 | --bs-btn-active-border-color: var(--bs-primary); 80 | --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125); 81 | --bs-btn-disabled-color: var(--bs-primary); 82 | --bs-btn-disabled-bg: transparent; 83 | --bs-btn-disabled-border-color: var(--bs-primary); 84 | } 85 | 86 | /* background */ 87 | .bg-light { 88 | background-color: rgba(var(--bs-light-rgb),var(--bs-bg-opacity))!important; 89 | } 90 | 91 | /* text colors */ 92 | .text-success { 93 | color: rgba(var(--bs-success-rgb),var(--bs-text-opacity))!important; 94 | } 95 | 96 | .text-primary { 97 | color: rgba(var(--bs-primary-rgb),var(--bs-text-opacity))!important; 98 | } 99 | 100 | .text-dark { 101 | color: rgba(var(--bs-dark-rgb),var(--bs-text-opacity))!important; 102 | } 103 | 104 | .text-muted { 105 | color: #5a6a85!important; 106 | } 107 | 108 | /* card */ 109 | .card { 110 | --bs-card-spacer-y: 30px; 111 | --bs-card-spacer-x: 30px; 112 | --bs-card-title-color: #2A3547; 113 | --bs-card-subtitle-color: #2A3547; 114 | --bs-card-border-width: 0px; 115 | --bs-card-box-shadow: rgba(145, 158, 171, 0.2) 0px 0px 2px 0px,rgba(145, 158, 171, 0.12) 0px 12px 24px -4px; 116 | --bs-card-inner-border-radius: 7px; 117 | } 118 | 119 | .container { 120 | max-width: 1150px; 121 | } 122 | 123 | /* custom */ 124 | .spacer { 125 | padding: 80px 0; 126 | } 127 | 128 | .pro-demo { 129 | -webkit-box-shadow: 0px 4px 45px rgb(0 0 0 / 9%); 130 | box-shadow: 0px 4px 45px rgb(0 0 0 / 9%); 131 | } 132 | 133 | .line-h33 { 134 | line-height: 33px; 135 | } 136 | 137 | .icon-circle { 138 | background-color: rgb(var( --bs-dark-rgb)); 139 | display: inline-block; 140 | width: 15px; 141 | height: 15px; 142 | border-radius: 100%; 143 | position: relative; 144 | } 145 | 146 | .icon-circle.circle-primary { 147 | background-color: rgb(var( --bs-primary-rgb)) !important; 148 | } 149 | 150 | .icon-circle.circle-muted { 151 | background-color: var(--bs-body-color) !important; 152 | opacity: 0.8; 153 | } 154 | 155 | .icon-circle:before { 156 | content: ''; 157 | position: absolute; 158 | left: 0; 159 | right: 0; 160 | width: 5px; 161 | height: 5px; 162 | border-radius: 100%; 163 | background-color: #fff; 164 | display: block; 165 | margin: 0 auto; 166 | top: 5px; 167 | } -------------------------------------------------------------------------------- /package/.gitignore: -------------------------------------------------------------------------------- 1 | node_modules 2 | *.log* 3 | .nuxt 4 | .nitro 5 | .cache 6 | .output 7 | .env 8 | dist 9 | -------------------------------------------------------------------------------- /package/.npmrc: -------------------------------------------------------------------------------- 1 | shamefully-hoist=true 2 | strict-peer-dependencies=false 3 | -------------------------------------------------------------------------------- /package/README.md: -------------------------------------------------------------------------------- 1 | # Modernize-nuxtjs-free 2 | Free Nuxt 3 Admin Template with vuetify 3 + Typescript 3 | Free Nuxt 3 Admin Template with vuetify 3 + Typescript 4 | # Live Demo 5 | 6 | 7 | # Nuxt 3 Starter 8 | 9 | > 💚 A Better Nuxt 3 starter template 10 | 11 | ## Use the Template 12 | 13 | ### Clone to local 14 | 15 | ```bash 16 | 17 | $> 💿 Install dependencies with `npm install` or `yarn install` 18 | $> 19 | $> 🚀 Start development server with `npm run dev` or `yarn dev` 20 | ``` 21 | 22 | ## Setup 23 | 24 | ### Installation 25 | 26 | Make sure to install the dependencies 27 | 28 | ```bash 29 | yarn install 30 | ``` 31 | 32 | ### Development 33 | 34 | Start the development server on http://localhost:3088 35 | 36 | ```bash 37 | yarn dev 38 | ``` 39 | 40 | ### Production 41 | 42 | Build the application for production: 43 | 44 | ```bash 45 | yarn build 46 | ``` 47 | 48 | 49 | -------------------------------------------------------------------------------- /package/app.vue: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /package/components/auth/LoginForm.vue: -------------------------------------------------------------------------------- 1 | 5 | 6 | 33 | -------------------------------------------------------------------------------- /package/components/auth/RegisterForm.vue: -------------------------------------------------------------------------------- 1 | 5 | 6 | 25 | -------------------------------------------------------------------------------- /package/components/dashboard/MonthlyEarnings.vue: -------------------------------------------------------------------------------- 1 | 56 | 93 | -------------------------------------------------------------------------------- /package/components/dashboard/ProductCards.vue: -------------------------------------------------------------------------------- 1 | 4 | 37 | -------------------------------------------------------------------------------- /package/components/dashboard/ProductPerformance.vue: -------------------------------------------------------------------------------- 1 | 4 | 46 | -------------------------------------------------------------------------------- /package/components/dashboard/RecentTransaction.vue: -------------------------------------------------------------------------------- 1 | 6 | 35 | 43 | -------------------------------------------------------------------------------- /package/components/dashboard/SalesOverview.vue: -------------------------------------------------------------------------------- 1 | 86 | 113 | -------------------------------------------------------------------------------- /package/components/dashboard/YearlyBreakup.vue: -------------------------------------------------------------------------------- 1 | 44 | 99 | -------------------------------------------------------------------------------- /package/components/layout/full/Main.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 91 | -------------------------------------------------------------------------------- /package/components/layout/full/Topbar.vue: -------------------------------------------------------------------------------- 1 | 64 | 145 | -------------------------------------------------------------------------------- /package/components/layout/full/logo/Logo.vue: -------------------------------------------------------------------------------- 1 | 4 | -------------------------------------------------------------------------------- /package/components/layout/full/logo/LogoDark.vue: -------------------------------------------------------------------------------- 1 | 7 | 29 | 30 | -------------------------------------------------------------------------------- /package/components/layout/full/vertical-header/NotificationDD.vue: -------------------------------------------------------------------------------- 1 | 4 | 11 | -------------------------------------------------------------------------------- /package/components/layout/full/vertical-header/ProfileDD.vue: -------------------------------------------------------------------------------- 1 | 4 | 5 | 44 | -------------------------------------------------------------------------------- /package/components/layout/full/vertical-sidebar/Dropdown/index.vue: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/adminmart/Modernize-nuxtjs-free/84d8797979f9480e210d3098bf0bfb6cb13286ab/package/components/layout/full/vertical-sidebar/Dropdown/index.vue -------------------------------------------------------------------------------- /package/components/layout/full/vertical-sidebar/ExtraBox/index.vue: -------------------------------------------------------------------------------- 1 | 14 | 22 | -------------------------------------------------------------------------------- /package/components/layout/full/vertical-sidebar/Icon.vue: -------------------------------------------------------------------------------- 1 | 4 | 5 | 23 | -------------------------------------------------------------------------------- /package/components/layout/full/vertical-sidebar/NavCollapse/index.vue: -------------------------------------------------------------------------------- 1 | 5 | 6 | 56 | -------------------------------------------------------------------------------- /package/components/layout/full/vertical-sidebar/NavGroup/index.vue: -------------------------------------------------------------------------------- 1 | 4 | 5 | 8 | -------------------------------------------------------------------------------- /package/components/layout/full/vertical-sidebar/NavItem/index.vue: -------------------------------------------------------------------------------- 1 | 6 | 7 | 60 | -------------------------------------------------------------------------------- /package/components/shared/CardHeaderFooter.vue: -------------------------------------------------------------------------------- 1 | 6 | 7 | 25 | -------------------------------------------------------------------------------- /package/components/shared/UiChildCard.vue: -------------------------------------------------------------------------------- 1 | 6 | 7 | 18 | -------------------------------------------------------------------------------- /package/components/shared/UiParentCard.vue: -------------------------------------------------------------------------------- 1 | 7 | 8 | // ===============================|| Ui Parent Card||=============================== // 9 | 24 | -------------------------------------------------------------------------------- /package/components/shared/UiTableCard.vue: -------------------------------------------------------------------------------- 1 | 6 | 7 | 20 | -------------------------------------------------------------------------------- /package/components/shared/UiTextfieldPrimary.vue: -------------------------------------------------------------------------------- 1 | 6 | 7 | 10 | -------------------------------------------------------------------------------- /package/components/shared/WidgetCard.vue: -------------------------------------------------------------------------------- 1 | 6 | 7 | 21 | -------------------------------------------------------------------------------- /package/components/shared/WidgetCardv2.vue: -------------------------------------------------------------------------------- 1 | 7 | 8 | 24 | -------------------------------------------------------------------------------- /package/components/style-components/shadow/Shadow.vue: -------------------------------------------------------------------------------- 1 | 4 | 16 | -------------------------------------------------------------------------------- /package/components/style-components/typography/DefaultText.vue: -------------------------------------------------------------------------------- 1 | 14 | 26 | -------------------------------------------------------------------------------- /package/components/style-components/typography/Heading.vue: -------------------------------------------------------------------------------- 1 | 23 | 50 | -------------------------------------------------------------------------------- /package/components/ui-components/alert/Basic.vue: -------------------------------------------------------------------------------- 1 | 7 | -------------------------------------------------------------------------------- /package/components/ui-components/alert/Closable.vue: -------------------------------------------------------------------------------- 1 | 5 | 31 | -------------------------------------------------------------------------------- /package/components/ui-components/alert/Filled.vue: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /package/components/ui-components/button/BaseButtons.vue: -------------------------------------------------------------------------------- 1 | 11 | -------------------------------------------------------------------------------- /package/components/ui-components/button/ColorsButtons.vue: -------------------------------------------------------------------------------- 1 | 6 | 13 | -------------------------------------------------------------------------------- /package/components/ui-components/button/IconColorSizes.vue: -------------------------------------------------------------------------------- 1 | 10 | -------------------------------------------------------------------------------- /package/components/ui-components/button/OutlinedButtons.vue: -------------------------------------------------------------------------------- 1 | 2 | 12 | -------------------------------------------------------------------------------- /package/components/ui-components/button/SizeButtons.vue: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /package/components/ui-components/button/TextButtons.vue: -------------------------------------------------------------------------------- 1 | 6 | 13 | -------------------------------------------------------------------------------- /package/components/ui-components/cards/CardsContentWrap.vue: -------------------------------------------------------------------------------- 1 | 26 | 27 | 83 | -------------------------------------------------------------------------------- /package/components/ui-components/cards/CardsMedia.vue: -------------------------------------------------------------------------------- 1 | 4 | 5 | 35 | -------------------------------------------------------------------------------- /package/components/ui-components/cards/CardsProps.vue: -------------------------------------------------------------------------------- 1 | 2 | 3 | 13 | -------------------------------------------------------------------------------- /package/components/ui-components/cards/CardsSlots.vue: -------------------------------------------------------------------------------- 1 | 2 | 3 | 15 | -------------------------------------------------------------------------------- /package/components/ui-components/cards/CardsTwitter.vue: -------------------------------------------------------------------------------- 1 | 2 | 3 | 50 | -------------------------------------------------------------------------------- /package/components/ui-components/cards/CardsWeather.vue: -------------------------------------------------------------------------------- 1 | 23 | 24 | 116 | -------------------------------------------------------------------------------- /package/data/dashboard/dashboardData.ts: -------------------------------------------------------------------------------- 1 | import type { recentTrans, productPerformanceType, productsCards } from '@/types/dashboard/index'; 2 | 3 | /*--Recent Transaction--*/ 4 | const recentTransaction: recentTrans[] = [ 5 | { 6 | title: '09:30 am', 7 | subtitle: 'Payment received from John Doe of $385.90', 8 | textcolor: 'primary', 9 | boldtext: false, 10 | line: true, 11 | link: '', 12 | url: '' 13 | }, 14 | { 15 | title: '10:00 am', 16 | subtitle: 'New sale recorded', 17 | textcolor: 'secondary', 18 | boldtext: true, 19 | line: true, 20 | link: '#ML-3467', 21 | url: '' 22 | }, 23 | { 24 | title: '12:00 am', 25 | subtitle: 'Payment was made of $64.95 to Michael', 26 | textcolor: 'success', 27 | boldtext: false, 28 | line: true, 29 | link: '', 30 | url: '' 31 | }, 32 | { 33 | title: '09:30 am', 34 | subtitle: 'New sale recorded', 35 | textcolor: 'warning', 36 | boldtext: true, 37 | line: true, 38 | link: '#ML-3467', 39 | url: '' 40 | }, 41 | { 42 | title: '09:30 am', 43 | subtitle: 'New arrival recorded', 44 | textcolor: 'error', 45 | boldtext: true, 46 | line: true, 47 | link: '', 48 | url: '' 49 | }, 50 | { 51 | title: '12:00 am', 52 | subtitle: 'Payment Received', 53 | textcolor: 'success', 54 | boldtext: false, 55 | line: false, 56 | link: '', 57 | url: '' 58 | }, 59 | ] 60 | 61 | /*Basic Table 1*/ 62 | const productPerformance: productPerformanceType[] = [ 63 | { 64 | id: 1, 65 | name: 'Sunil Joshi', 66 | post: 'Web Designer', 67 | pname: 'Elite Admin', 68 | status: 'Low', 69 | statuscolor: 'primary', 70 | budget: '$3.9' 71 | }, 72 | { 73 | id: 2, 74 | name: 'Andrew McDownland', 75 | post: 'Project Manager', 76 | pname: 'Real Homes WP Theme', 77 | status: 'Medium', 78 | statuscolor: 'secondary', 79 | budget: '$24.5k' 80 | }, 81 | { 82 | id: 3, 83 | name: 'Christopher Jamil', 84 | post: 'Project Manager', 85 | pname: 'MedicalPro WP Theme', 86 | status: 'High', 87 | statuscolor: 'error', 88 | budget: '$12.8k' 89 | }, 90 | { 91 | id: 4, 92 | name: 'Nirav Joshi', 93 | post: 'Frontend Engineer', 94 | pname: 'Hosting Press HTML', 95 | status: 'Critical', 96 | statuscolor: 'success', 97 | budget: '$2.4k' 98 | } 99 | 100 | ]; 101 | 102 | /*--Products Cards--*/ 103 | import proimg1 from '/images/products/s4.jpg'; 104 | import proimg2 from '/images/products/s5.jpg'; 105 | import proimg3 from '/images/products/s7.jpg'; 106 | import proimg4 from '/images/products/s11.jpg'; 107 | const productsCard: productsCards[] = [ 108 | { 109 | title: 'Boat Headphone', 110 | link: '/', 111 | photo: proimg1, 112 | salesPrice: 375, 113 | price: 285, 114 | rating: 4 115 | }, 116 | { 117 | title: 'MacBook Air Pro', 118 | link: '/', 119 | photo: proimg2, 120 | salesPrice: 650, 121 | price: 900, 122 | rating: 5 123 | }, 124 | { 125 | title: 'Red Valvet Dress', 126 | link: '/', 127 | photo: proimg3, 128 | salesPrice: 150, 129 | price: 200, 130 | rating: 3 131 | }, 132 | { 133 | title: 'Cute Soft Teddybear', 134 | link: '/', 135 | photo: proimg4, 136 | salesPrice: 285, 137 | price: 345, 138 | rating: 2 139 | } 140 | ]; 141 | 142 | 143 | export { recentTransaction, productPerformance, productsCard } -------------------------------------------------------------------------------- /package/error.vue: -------------------------------------------------------------------------------- 1 | 13 | 23 | -------------------------------------------------------------------------------- /package/layouts/blank.vue: -------------------------------------------------------------------------------- 1 | // ===============================|| Blank Layout ||=============================== // 2 | 4 | 9 | -------------------------------------------------------------------------------- /package/layouts/default.vue: -------------------------------------------------------------------------------- 1 | 16 | 17 | 32 | -------------------------------------------------------------------------------- /package/nuxt.config.ts: -------------------------------------------------------------------------------- 1 | // https://nuxt.com/docs/api/configuration/nuxt-config 2 | export default defineNuxtConfig({ 3 | ssr: false, 4 | 5 | typescript: { 6 | shim: false 7 | }, 8 | 9 | build: { 10 | transpile: ["vuetify"], 11 | }, 12 | 13 | vite: { 14 | define: { 15 | "process.env.DEBUG": false, 16 | }, 17 | }, 18 | 19 | nitro: { 20 | serveStatic: true, 21 | }, 22 | 23 | devServerHandlers: [], 24 | 25 | hooks: { 26 | }, 27 | 28 | compatibilityDate: "2025-04-15", 29 | }) -------------------------------------------------------------------------------- /package/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "modernize-nuxtjs-free", 3 | "version": "2.0.0", 4 | "type": "module", 5 | "private": true, 6 | "scripts": { 7 | "build": "nuxt build", 8 | "dev": "nuxt dev", 9 | "generate": "nuxt generate", 10 | "preview": "nuxt preview", 11 | "postinstall": "nuxt prepare" 12 | }, 13 | "devDependencies": { 14 | "nuxt": "3.16.2" 15 | }, 16 | "dependencies": { 17 | "@mdi/font": "7.4.47", 18 | "@nuxt/vite-builder": "3.16.2", 19 | "apexcharts": "4.5.0", 20 | "@iconify/vue": "^4.1.1", 21 | "sass": "1.70.0", 22 | "vue": "3.5.13", 23 | "vue-tabler-icons": "2.21.0", 24 | "vue3-apexcharts": "1.5.2", 25 | "vue3-perfect-scrollbar": "1.6.1", 26 | "vuetify": "3.7.18" 27 | }, 28 | "overrides": { 29 | "nth-check": "2.1.1" 30 | } 31 | } 32 | -------------------------------------------------------------------------------- /package/pages/Icons.vue: -------------------------------------------------------------------------------- 1 | 5 | 16 | -------------------------------------------------------------------------------- /package/pages/Sample-Page.vue: -------------------------------------------------------------------------------- 1 | 5 | 14 | -------------------------------------------------------------------------------- /package/pages/auth/Login.vue: -------------------------------------------------------------------------------- 1 | 7 | 32 | -------------------------------------------------------------------------------- /package/pages/auth/Register.vue: -------------------------------------------------------------------------------- 1 | 7 | 32 | -------------------------------------------------------------------------------- /package/pages/index.vue: -------------------------------------------------------------------------------- 1 | 10 | -------------------------------------------------------------------------------- /package/pages/ui-components/Alerts.vue: -------------------------------------------------------------------------------- 1 | 11 | 12 | 38 | -------------------------------------------------------------------------------- /package/pages/ui-components/Buttons.vue: -------------------------------------------------------------------------------- 1 | 18 | 19 | // ===============================|| Ui Buttons ||=============================== // 20 | 65 | -------------------------------------------------------------------------------- /package/pages/ui-components/Cards.vue: -------------------------------------------------------------------------------- 1 | 13 | 14 | 51 | -------------------------------------------------------------------------------- /package/pages/ui-components/Tables.vue: -------------------------------------------------------------------------------- 1 | 47 | 48 | -------------------------------------------------------------------------------- /package/pages/ui/Shadow.vue: -------------------------------------------------------------------------------- 1 | 4 | 5 | 12 | -------------------------------------------------------------------------------- /package/pages/ui/Typography.vue: -------------------------------------------------------------------------------- 1 | 6 | 7 | 19 | -------------------------------------------------------------------------------- /package/plugins/vuetify.ts: -------------------------------------------------------------------------------- 1 | 2 | import { createVuetify } from "vuetify"; 3 | import "@mdi/font/css/materialdesignicons.css"; 4 | import * as components from "vuetify/components"; 5 | import * as directives from "vuetify/directives"; 6 | import PerfectScrollbar from 'vue3-perfect-scrollbar'; 7 | import VueApexCharts from 'vue3-apexcharts'; 8 | import VueTablerIcons from 'vue-tabler-icons'; 9 | import '@/scss/style.scss'; 10 | import { 11 | PurpleTheme, 12 | } from "@/theme/LightTheme"; 13 | export default defineNuxtPlugin((nuxtApp) => { 14 | const vuetify = createVuetify({ 15 | components, 16 | directives, 17 | theme: { 18 | defaultTheme: "PurpleTheme", 19 | themes: { 20 | PurpleTheme, 21 | }, 22 | }, 23 | }); 24 | nuxtApp.vueApp.use(vuetify); 25 | nuxtApp.vueApp.use(PerfectScrollbar); 26 | nuxtApp.vueApp.use(VueApexCharts); 27 | nuxtApp.vueApp.use(VueTablerIcons); 28 | }); 29 | 30 | -------------------------------------------------------------------------------- /package/public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/adminmart/Modernize-nuxtjs-free/84d8797979f9480e210d3098bf0bfb6cb13286ab/package/public/favicon.ico -------------------------------------------------------------------------------- /package/public/images/background/errorimg.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | -------------------------------------------------------------------------------- /package/public/images/background/rocket.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/adminmart/Modernize-nuxtjs-free/84d8797979f9480e210d3098bf0bfb6cb13286ab/package/public/images/background/rocket.png -------------------------------------------------------------------------------- /package/public/images/blog/blog-img1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/adminmart/Modernize-nuxtjs-free/84d8797979f9480e210d3098bf0bfb6cb13286ab/package/public/images/blog/blog-img1.jpg -------------------------------------------------------------------------------- /package/public/images/blog/blog-img4.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/adminmart/Modernize-nuxtjs-free/84d8797979f9480e210d3098bf0bfb6cb13286ab/package/public/images/blog/blog-img4.jpg -------------------------------------------------------------------------------- /package/public/images/logos/logo-adminmart.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | -------------------------------------------------------------------------------- /package/public/images/logos/logo.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | -------------------------------------------------------------------------------- /package/public/images/logos/logolight.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /package/public/images/products/s11.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/adminmart/Modernize-nuxtjs-free/84d8797979f9480e210d3098bf0bfb6cb13286ab/package/public/images/products/s11.jpg -------------------------------------------------------------------------------- /package/public/images/products/s4.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/adminmart/Modernize-nuxtjs-free/84d8797979f9480e210d3098bf0bfb6cb13286ab/package/public/images/products/s4.jpg -------------------------------------------------------------------------------- /package/public/images/products/s5.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/adminmart/Modernize-nuxtjs-free/84d8797979f9480e210d3098bf0bfb6cb13286ab/package/public/images/products/s5.jpg -------------------------------------------------------------------------------- /package/public/images/products/s7.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/adminmart/Modernize-nuxtjs-free/84d8797979f9480e210d3098bf0bfb6cb13286ab/package/public/images/products/s7.jpg -------------------------------------------------------------------------------- /package/public/images/technology/angular-cat-icon.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | -------------------------------------------------------------------------------- /package/public/images/technology/bt-cat-icon.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | -------------------------------------------------------------------------------- /package/public/images/technology/next-cat-icon.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /package/public/images/technology/nuxt-cat-icon.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /package/public/images/technology/react-cat-icon.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /package/public/images/technology/tailwind-icon.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /package/public/images/technology/vue-cat-icon.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | -------------------------------------------------------------------------------- /package/public/images/users/avatar-1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/adminmart/Modernize-nuxtjs-free/84d8797979f9480e210d3098bf0bfb6cb13286ab/package/public/images/users/avatar-1.jpg -------------------------------------------------------------------------------- /package/scss/_override.scss: -------------------------------------------------------------------------------- 1 | html { 2 | .bg-success { 3 | color: white !important; 4 | } 5 | 6 | .bg-primary { 7 | color: $white !important; 8 | } 9 | 10 | .bg-secondary { 11 | color: $white !important; 12 | } 13 | 14 | .bg-warning { 15 | color: $white !important; 16 | } 17 | } 18 | .border, 19 | .v-divider { 20 | border-color: rgba(var(--v-border-color), 1) !important; 21 | } 22 | 23 | .lh-0{ 24 | line-height: 0; 25 | } 26 | .lh-normal{ 27 | line-height: normal; 28 | } -------------------------------------------------------------------------------- /package/scss/_variables.scss: -------------------------------------------------------------------------------- 1 | @use 'sass:math'; 2 | @use 'sass:map'; 3 | @use 'sass:meta'; 4 | @use 'vuetify/lib/styles/tools/functions' as *; 5 | 6 | // This will false all colors which is not necessory for theme 7 | $color-pack: false; 8 | 9 | // Global font size and border radius 10 | $font-size-root: 1rem; 11 | $border-radius-root: 4px; 12 | $body-font-family: 'Plus Jakarta Sans', sans-serif !default; 13 | $heading-font-family: $body-font-family !default; 14 | $btn-font-weight: 400 !default; 15 | $btn-letter-spacing: 0 !default; 16 | 17 | // Global Radius as per breakeven point 18 | $rounded: () !default; 19 | $rounded: map-deep-merge( 20 | ( 21 | 0: 0, 22 | 'sm': $border-radius-root * 0.5, 23 | null: $border-radius-root, 24 | 'md': $border-radius-root * 1, 25 | 'lg': $border-radius-root * 2, 26 | 'xl': $border-radius-root * 6, 27 | 'pill': 9999px, 28 | 'circle': 50%, 29 | 'shaped': $border-radius-root * 6 0 30 | ), 31 | $rounded 32 | ); 33 | // Global Typography 34 | $typography: () !default; 35 | $typography: map-deep-merge( 36 | ( 37 | 'h1': ( 38 | 'size': 2.25rem, 39 | 'weight': 600, 40 | 'line-height': 2.75rem, 41 | 'font-family': inherit 42 | ), 43 | 'h2': ( 44 | 'size': 1.875rem, 45 | 'weight': 600, 46 | 'line-height': 2.25rem, 47 | 'font-family': inherit 48 | ), 49 | 'h3': ( 50 | 'size': 1.5rem, 51 | 'weight': 600, 52 | 'line-height': 2rem, 53 | 'font-family': inherit 54 | ), 55 | 'h4': ( 56 | 'size': 1.3125rem, 57 | 'weight': 600, 58 | 'line-height': 1.6rem, 59 | 'font-family': inherit 60 | ), 61 | 'h5': ( 62 | 'size': 1.125rem, 63 | 'weight': 600, 64 | 'line-height': 1.6rem, 65 | 'font-family': inherit 66 | ), 67 | 'h6': ( 68 | 'size': 1rem, 69 | 'weight': 600, 70 | 'line-height': 1.2rem, 71 | 'font-family': inherit 72 | ), 73 | 'subtitle-1': ( 74 | 'size': 0.875rem, 75 | 'weight': 400, 76 | 'line-height': 1.1rem, 77 | 'font-family': inherit 78 | ), 79 | 'subtitle-2': ( 80 | 'size': 0.75rem, 81 | 'weight': 400, 82 | 'line-height': 1rem, 83 | 'font-family': inherit 84 | ), 85 | 'body-1': ( 86 | 'size': 0.875rem, 87 | 'weight': 400, 88 | 'font-family': inherit 89 | ), 90 | 'body-2': ( 91 | 'size': 0.75rem, 92 | 'weight': 400, 93 | 'font-family': inherit 94 | ), 95 | 'button': ( 96 | 'size': 0.875rem, 97 | 'weight': 500, 98 | 'font-family': inherit, 99 | 'text-transform': capitalize 100 | ), 101 | 'caption': ( 102 | 'size': 0.75rem, 103 | 'weight': 400, 104 | 'font-family': inherit 105 | ), 106 | 'overline': ( 107 | 'size': 0.75rem, 108 | 'weight': 500, 109 | 'font-family': inherit, 110 | 'text-transform': uppercase 111 | ) 112 | ), 113 | $typography 114 | ); 115 | 116 | // Custom Variables 117 | // colors 118 | $white: #fff !default; 119 | 120 | // cards 121 | $card-item-spacer-xy: 20px 24px !default; 122 | $card-text-spacer: 24px !default; 123 | $card-title-size: 18px !default; 124 | // Global Shadow 125 | $box-shadow: rgb(145 158 171 / 20%) 0px 0px 2px 0px, rgb(145 158 171 / 12%) 0px 12px 24px -4px; 126 | -------------------------------------------------------------------------------- /package/scss/components/_VButtons.scss: -------------------------------------------------------------------------------- 1 | // 2 | // Light Buttons 3 | // 4 | 5 | .v-btn { 6 | &.bg-lightprimary { 7 | &:hover, 8 | &:active, 9 | &:focus { 10 | background-color: rgb(var(--v-theme-primary)) !important; 11 | color: $white !important; 12 | } 13 | } 14 | &.bg-lightsecondary { 15 | &:hover, 16 | &:active, 17 | &:focus { 18 | background-color: rgb(var(--v-theme-secondary)) !important; 19 | color: $white !important; 20 | } 21 | } 22 | &.text-facebook { 23 | &:hover, 24 | &:active, 25 | &:focus { 26 | background-color: rgb(var(--v-theme-facebook)) !important; 27 | color: $white !important; 28 | } 29 | } 30 | &.text-twitter { 31 | &:hover, 32 | &:active, 33 | &:focus { 34 | background-color: rgb(var(--v-theme-twitter)) !important; 35 | color: $white !important; 36 | } 37 | } 38 | &.text-linkedin { 39 | &:hover, 40 | &:active, 41 | &:focus { 42 | background-color: rgb(var(--v-theme-linkedin)) !important; 43 | color: $white !important; 44 | } 45 | } 46 | } 47 | 48 | .v-btn { 49 | text-transform: capitalize; 50 | letter-spacing: $btn-letter-spacing; 51 | } 52 | .v-btn--icon.v-btn--density-default { 53 | width: calc(var(--v-btn-height) + 6px); 54 | height: calc(var(--v-btn-height) + 6px); 55 | } 56 | 57 | .v-btn-group .v-btn { 58 | height: inherit !important; 59 | } 60 | -------------------------------------------------------------------------------- /package/scss/components/_VCard.scss: -------------------------------------------------------------------------------- 1 | // Outline Card 2 | .v-card--variant-outlined { 3 | border-color: rgba(var(--v-theme-borderLight)); 4 | .v-divider { 5 | border-color: rgba(var(--v-theme-borderLight)); 6 | } 7 | } 8 | 9 | .v-card-text { 10 | padding: $card-text-spacer; 11 | } 12 | 13 | .v-card-actions { 14 | padding: 0.625rem $card-text-spacer $card-text-spacer; 15 | } 16 | 17 | .v-card { 18 | width: 100%; 19 | overflow: visible; 20 | &.withbg { 21 | background-color: rgb(var(--v-theme-background)); 22 | } 23 | &.w-auto { 24 | width: auto !important; 25 | } 26 | &.overflow-hidden { 27 | overflow: hidden; 28 | } 29 | } 30 | 31 | .v-card-item { 32 | padding: $card-item-spacer-xy; 33 | } 34 | 35 | .card-hover-border { 36 | &:hover { 37 | border: 1px solid rgb(var(--v-theme-primary)); 38 | } 39 | } 40 | -------------------------------------------------------------------------------- /package/scss/components/_VInput.scss: -------------------------------------------------------------------------------- 1 | .v-input--density-default, 2 | .v-field--variant-solo, 3 | .v-field--variant-filled { 4 | --v-input-control-height: 51px; 5 | --v-input-padding-top: 14px; 6 | } 7 | .v-input--density-comfortable { 8 | --v-input-control-height: 56px; 9 | --v-input-padding-top: 17px; 10 | } 11 | .v-switch .v-label, 12 | .v-checkbox .v-label { 13 | opacity: 1; 14 | } 15 | .v-label{ 16 | opacity: 1; 17 | font-size: 0.875rem; 18 | } -------------------------------------------------------------------------------- /package/scss/components/_VNavigationDrawer.scss: -------------------------------------------------------------------------------- 1 | .v-navigation-drawer__scrim.fade-transition-leave-to { 2 | display: none; 3 | } 4 | -------------------------------------------------------------------------------- /package/scss/components/_VShadow.scss: -------------------------------------------------------------------------------- 1 | .elevation-10 { 2 | box-shadow: $box-shadow !important; 3 | } -------------------------------------------------------------------------------- /package/scss/components/_VTextField.scss: -------------------------------------------------------------------------------- 1 | .v-text-field input { 2 | font-size: 0.875rem; 3 | } 4 | .v-field__outline { 5 | color: rgb(var(--v-theme-inputBorder),0.5); 6 | } 7 | .inputWithbg { 8 | .v-field--variant-outlined { 9 | background-color: rgba(0, 0, 0, 0.025); 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /package/scss/layout/_container.scss: -------------------------------------------------------------------------------- 1 | html { 2 | overflow-y: auto; 3 | } 4 | 5 | .v-main { 6 | margin-right: 20px; 7 | --v-layout-top: 0 !important; 8 | } 9 | @media (max-width: 1279px) { 10 | .v-main { 11 | margin: 0 10px; 12 | } 13 | } 14 | .spacer { 15 | padding: 100px 0; 16 | } 17 | @media (max-width: 800px) { 18 | .spacer { 19 | padding: 40px 0; 20 | } 21 | } 22 | .cursor-pointer { 23 | cursor: pointer; 24 | } 25 | .page-wrapper { 26 | min-height: calc(100vh - 100px); 27 | padding: 24px; 28 | padding-bottom: 30px; 29 | 30 | @media screen and (max-width:600px){ 31 | padding: 10px; 32 | } 33 | } 34 | .maxWidth { 35 | max-width: 1200px; 36 | margin: 0 auto; 37 | } 38 | $sizes: ( 39 | 'display-1': 44px, 40 | 'display-2': 40px, 41 | 'display-3': 30px, 42 | 'h1': 36px, 43 | 'h2': 30px, 44 | 'h3': 21px, 45 | 'h4': 18px, 46 | 'h5': 16px, 47 | 'h6': 14px, 48 | 'text-8': 8px, 49 | 'text-10': 10px, 50 | 'text-13': 13px, 51 | 'text-15': 15px, 52 | 'text-18': 18px, 53 | 'text-20': 20px, 54 | 'text-24': 24px, 55 | 'body-text-1': 10px 56 | ); 57 | 58 | @each $pixel, $size in $sizes { 59 | .#{$pixel} { 60 | font-size: $size; 61 | line-height: $size + 10; 62 | } 63 | } 64 | 65 | .customizer-btn { 66 | position: fixed; 67 | bottom: 30px; 68 | right: 30px; 69 | border-radius: 50%; 70 | .icon { 71 | animation: progress-circular-rotate 1.4s linear infinite; 72 | transform-origin: center center; 73 | transition: all 0.2s ease-in-out; 74 | } 75 | } 76 | .fixed-width { 77 | max-width: 1300px; 78 | } 79 | .h-100 { 80 | height: 100%; 81 | } 82 | .w-100 { 83 | width: 100%; 84 | } 85 | 86 | .h-100vh { 87 | height: 100vh; 88 | } 89 | .gap-2 { 90 | gap: 8px; 91 | } 92 | 93 | .gap-3 { 94 | gap: 16px; 95 | } 96 | 97 | .gap-4 { 98 | gap: 24px; 99 | } 100 | 101 | .text-white { 102 | color: rgb(255, 255, 255) !important; 103 | } 104 | // border 105 | .border-right { 106 | border-right: 1px solid rgba(0, 0, 0, 0.12); 107 | } 108 | .border-bottom { 109 | border-bottom: 1px solid rgba(0, 0, 0, 0.05); 110 | } 111 | .opacity-50 { 112 | opacity: 0.5; 113 | } 114 | .link { 115 | color: rgb(var(--v-theme-lightText)); 116 | text-decoration: none; 117 | &:hover { 118 | color: rgb(var(--v-theme-primary)); 119 | } 120 | } 121 | .z-auto.v-card { 122 | z-index: auto; 123 | } 124 | 125 | .obj-cover { 126 | object-fit: cover; 127 | } 128 | 129 | .right-pos-img { 130 | position: absolute; 131 | right: 0; 132 | top: 0; 133 | height: 100%; 134 | } 135 | 136 | .text-hover-primary { 137 | color: rgb(var(--v-theme-darkText)); 138 | &:hover { 139 | color: rgb(var(--v-theme-primary)); 140 | } 141 | } 142 | -------------------------------------------------------------------------------- /package/scss/layout/_sidebar.scss: -------------------------------------------------------------------------------- 1 | /*This is for the logo*/ 2 | .leftSidebar { 3 | box-shadow: none !important; 4 | border-right: 1px solid rgb(var(--v-theme-borderColor)); 5 | top: 75px !important; 6 | .logo { 7 | padding-left: 7px; 8 | } 9 | 10 | .mini-icon { 11 | display: none; 12 | } 13 | 14 | .mini-text { 15 | display: block; 16 | } 17 | 18 | .v-navigation-drawer__content { 19 | 20 | .side-profile { 21 | position: absolute; 22 | top: -15px; 23 | right: 0; 24 | max-height: 100px; 25 | } 26 | .side-profile-text{ 27 | max-width: 100px; 28 | } 29 | } 30 | } 31 | 32 | /*This is for the Vertical sidebar*/ 33 | .scrollnavbar { 34 | height: calc(100vh - 150px); 35 | 36 | .userbottom { 37 | position: fixed; 38 | bottom: 0px; 39 | width: 100%; 40 | } 41 | 42 | .smallCap { 43 | padding: 3px 0px !important; 44 | font-size: 0.875rem; 45 | font-weight: 500; 46 | margin-top: 24px; 47 | color: rgb(var(--v-theme-textPrimary)); 48 | 49 | &:first-child { 50 | margin-top: 0 !important; 51 | } 52 | } 53 | 54 | /*General Menu css*/ 55 | .v-list-group__items .v-list-item, 56 | .v-list-item { 57 | border-radius: $border-radius-root + 4; 58 | padding-inline-start: calc(12px + var(--indent-padding) / 10) !important; 59 | 60 | margin: 0 0 2px; 61 | 62 | &:hover { 63 | color: rgb(var(--v-theme-primary)); 64 | } 65 | 66 | .v-list-item__prepend { 67 | margin-inline-end: 13px; 68 | } 69 | 70 | .v-list-item__append { 71 | font-size: 0.875rem; 72 | 73 | .v-icon { 74 | margin-inline-start: 13px; 75 | } 76 | } 77 | 78 | .v-list-item-title { 79 | font-size: 0.875rem; 80 | } 81 | } 82 | 83 | .v-list { 84 | color: rgb(var(--v-theme-textSecondary)); 85 | 86 | >.v-list-item.v-list-item--active, 87 | .v-list-item--active>.v-list-item__overlay { 88 | background: rgb(var(--v-theme-primary)); 89 | color: white !important; 90 | } 91 | 92 | >.v-list-group { 93 | position: relative; 94 | 95 | >.v-list-item--active, 96 | >.v-list-item--active:hover { 97 | background: rgb(var(--v-theme-primary)); 98 | color: white; 99 | } 100 | 101 | .v-list-group__items .v-list-item.v-list-item--active, 102 | .v-list-group__items .v-list-item.v-list-item--active>.v-list-item__overlay { 103 | background: transparent; 104 | color: rgb(var(--v-theme-primary)); 105 | } 106 | } 107 | } 108 | } 109 | 110 | @media only screen and (min-width: 1170px) { 111 | .mini-sidebar { 112 | .logo { 113 | width: 40px; 114 | overflow: hidden; 115 | padding-left: 0; 116 | } 117 | 118 | .mini-icon { 119 | display: block; 120 | } 121 | 122 | .mini-text { 123 | display: none; 124 | } 125 | 126 | .v-list { 127 | padding: 14px !important; 128 | } 129 | 130 | .leftSidebar:hover { 131 | box-shadow: $box-shadow !important; 132 | 133 | .mini-icon { 134 | display: none; 135 | } 136 | 137 | .mini-text { 138 | display: block; 139 | } 140 | } 141 | 142 | .v-navigation-drawer--expand-on-hover:hover { 143 | .logo { 144 | width: 100%; 145 | } 146 | 147 | .v-list .v-list-group__items, 148 | .hide-menu { 149 | opacity: 1; 150 | } 151 | } 152 | } 153 | } 154 | 155 | @media screen and (max-width:1280px) { 156 | .leftSidebar { 157 | top: 0 !important; 158 | } 159 | } -------------------------------------------------------------------------------- /package/scss/layout/_topbar.scss: -------------------------------------------------------------------------------- 1 | .profileBtn { 2 | margin: 0 35px 0 10px !important; 3 | 4 | @media screen and (max-width:1024px) { 5 | margin: 0 25px 0 10px !important; 6 | } 7 | 8 | @media screen and (max-width:600px) { 9 | margin: 0 15px 0 10px !important; 10 | } 11 | } 12 | 13 | .feature-topbar { 14 | position: sticky; 15 | top: 0; 16 | z-index: 15; 17 | background: linear-gradient(90deg, #001138 0%, #001E66 100%); 18 | 19 | 20 | .text-linear-gradient { 21 | background: linear-gradient(90deg, #FFFFFF 0%, #3772FF 100%); 22 | -webkit-background-clip: text; 23 | -webkit-text-fill-color: transparent; 24 | background-clip: text; 25 | 26 | 27 | } 28 | 29 | .border-blue { 30 | border-radius: 9px; 31 | border: 1px solid rgb(236, 240, 242, 0.5); 32 | 33 | } 34 | 35 | .purple-btn { 36 | background-color: #8D70F8; 37 | border-radius: 9px; 38 | 39 | &:hover { 40 | background-color: #714BFF; 41 | } 42 | 43 | } 44 | 45 | .green-btn { 46 | background-color: #B3F143; 47 | border-radius: 9px; 48 | 49 | &:hover { 50 | background-color: #90DE03; 51 | } 52 | 53 | } 54 | } 55 | 56 | .top-header{ 57 | position: relative !important; 58 | z-index: 0 !important; 59 | } 60 | 61 | .topbar-links { 62 | .v-btn { 63 | &:hover { 64 | background-color: rgba(var(--v-theme-primary)); 65 | } 66 | } 67 | } 68 | 69 | .topbar-links { 70 | a { 71 | text-decoration: none; 72 | color: rgba(var(--v-theme-surface)); 73 | 74 | &:hover { 75 | color: rgba(var(--v-theme-primary)) !important; 76 | } 77 | } 78 | } -------------------------------------------------------------------------------- /package/scss/pages/_auth.scss: -------------------------------------------------------------------------------- 1 | .authentication{ 2 | &::before{ 3 | content: ""; 4 | position: absolute; 5 | height: 100%; 6 | width: 100%; 7 | opacity: 0.3; 8 | left: 0; 9 | top: 0; 10 | bottom: 0; 11 | background: radial-gradient(rgb(210, 241, 223), rgb(211, 215, 250), rgb(186, 216, 244)) 0% 0% / 400% 400%; 12 | } 13 | } -------------------------------------------------------------------------------- /package/scss/pages/_dashboards.scss: -------------------------------------------------------------------------------- 1 | .month-table { 2 | &.custom-px-0 { 3 | thead { 4 | tr { 5 | th:first-child { 6 | padding-left: 0 !important; 7 | } 8 | th:last-child { 9 | padding-right: 0 !important; 10 | } 11 | } 12 | } 13 | tr.month-item { 14 | td:first-child { 15 | padding-left: 0 !important; 16 | } 17 | td:last-child { 18 | padding-right: 0 !important; 19 | } 20 | } 21 | } 22 | tr.month-item { 23 | td { 24 | padding-top: 16px !important; 25 | padding-bottom: 16px !important; 26 | } 27 | &:hover { 28 | background: transparent !important; 29 | } 30 | } 31 | } 32 | -------------------------------------------------------------------------------- /package/scss/style.scss: -------------------------------------------------------------------------------- 1 | @import url("https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600&display=swap"); 2 | @import './variables'; 3 | @import 'vuetify/styles/main.sass'; 4 | @import './override'; 5 | @import './layout/container'; 6 | @import './layout/sidebar'; 7 | @import './layout/topbar'; 8 | @import './components/VButtons'; 9 | @import './components/VCard'; 10 | @import './components/VInput'; 11 | @import './components/VNavigationDrawer'; 12 | @import './components/VShadow'; 13 | @import './components/VTextField'; 14 | @import './pages/dashboards'; 15 | @import './pages/auth'; 16 | @import 'vue3-perfect-scrollbar/dist/vue3-perfect-scrollbar.css'; -------------------------------------------------------------------------------- /package/theme/LightTheme.ts: -------------------------------------------------------------------------------- 1 | import type { ThemeTypes } from '@/types/themeTypes/ThemeType'; 2 | 3 | const PurpleTheme: ThemeTypes = { 4 | name: 'PurpleTheme', 5 | dark: false, 6 | variables: { 7 | 'border-color': '#eeeeee', 8 | 'carousel-control-size': 10 9 | }, 10 | colors: { 11 | primary: '#5D87FF', 12 | secondary: '#49BEFF', 13 | info: '#539BFF', 14 | success: '#13DEB9', 15 | accent: '#FFAB91', 16 | warning: '#FFAE1F', 17 | error: '#FA896B', 18 | muted:'#5a6a85', 19 | lightprimary: '#ECF2FF', 20 | lightsecondary: '#E8F7FF', 21 | lightsuccess: '#E6FFFA', 22 | lighterror: '#FDEDE8', 23 | lightwarning: '#FEF5E5', 24 | textPrimary: '#2A3547', 25 | textSecondary: '#2A3547', 26 | borderColor: '#e5eaef', 27 | inputBorder: '#000', 28 | containerBg: '#ffffff', 29 | hoverColor: '#f6f9fc', 30 | surface: '#fff', 31 | 'on-surface-variant': '#fff', 32 | grey100: '#F2F6FA', 33 | grey200: '#EAEFF4' 34 | } 35 | }; 36 | export { PurpleTheme}; 37 | -------------------------------------------------------------------------------- /package/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | // https://nuxt.com/docs/guide/concepts/typescript 3 | "extends": "./.nuxt/tsconfig.json" 4 | } 5 | -------------------------------------------------------------------------------- /package/types/dashboard/index.ts: -------------------------------------------------------------------------------- 1 | /*Recent Transaction*/ 2 | type recentTrans = { 3 | title: string; 4 | subtitle: string; 5 | textcolor: string; 6 | boldtext: boolean; 7 | line: boolean; 8 | link: string; 9 | url: string; 10 | }; 11 | 12 | /*product performance*/ 13 | type productPerformanceType = { 14 | id: number; 15 | name: string; 16 | post: string; 17 | pname: string; 18 | status: string; 19 | statuscolor: string; 20 | budget: string; 21 | }; 22 | 23 | /*Products card types*/ 24 | type productsCards = { 25 | title: string; 26 | link: string; 27 | photo: string; 28 | salesPrice: number; 29 | price: number; 30 | rating: number; 31 | }; 32 | 33 | export type { recentTrans, productPerformanceType, productsCards } -------------------------------------------------------------------------------- /package/types/themeTypes/ThemeType.ts: -------------------------------------------------------------------------------- 1 | export type ThemeTypes = { 2 | name: string; 3 | dark: boolean; 4 | variables?: object; 5 | colors: { 6 | primary?: string; 7 | secondary?: string; 8 | info?: string; 9 | success?: string; 10 | accent?: string; 11 | warning?: string; 12 | error?: string; 13 | lightprimary?: string; 14 | lightsecondary?: string; 15 | lightsuccess?: string; 16 | lighterror?: string; 17 | lightinfo?: string; 18 | lightwarning?: string; 19 | textPrimary?: string; 20 | textSecondary?: string; 21 | borderColor?: string; 22 | hoverColor?: string; 23 | inputBorder?: string; 24 | containerBg?: string; 25 | surface?: string; 26 | 'on-surface-variant'?: string; 27 | grey100?: string; 28 | grey200?: string; 29 | muted?:string; 30 | }; 31 | }; 32 | --------------------------------------------------------------------------------