diff --git a/.env b/.env deleted file mode 100644 index 0c48d3cda..000000000 --- a/.env +++ /dev/null @@ -1,2 +0,0 @@ -PORT=3000 -CHOKIDAR_USEPOLLING=true diff --git a/.eslintrc.js b/.eslintrc.js index e08f0b57a..e9c55eec0 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -13,8 +13,6 @@ module.exports = { }, }, extends: [ - 'react-app', - 'react-app/jest', 'plugin:react/recommended', // Uses the recommended rules from @eslint-plugin-react 'plugin:prettier/recommended', // Enables eslint-plugin-prettier and eslint-config-prettier. This will display prettier errors as ESLint errors. Make sure this is always the last configuration in the extends array. ], diff --git a/.prettierignore b/.prettierignore index 849ddff3b..567609b12 100644 --- a/.prettierignore +++ b/.prettierignore @@ -1 +1 @@ -dist/ +build/ diff --git a/.prettierrc.js b/.prettierrc.js index 415ca0578..66f90b933 100644 --- a/.prettierrc.js +++ b/.prettierrc.js @@ -1,7 +1,7 @@ module.exports = { semi: false, - trailingComma: "all", + trailingComma: 'all', singleQuote: true, printWidth: 100, - tabWidth: 2 -}; \ No newline at end of file + tabWidth: 2, +} diff --git a/LICENSE b/LICENSE index b4870dd91..eee6fcc1f 100644 --- a/LICENSE +++ b/LICENSE @@ -1,6 +1,6 @@ The MIT License (MIT) -Copyright (c) 2023 creativeLabs Łukasz Holeczek. +Copyright (c) 2024 creativeLabs Łukasz Holeczek. Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal diff --git a/README.md b/README.md index 1df83973f..101aa0a32 100644 --- a/README.md +++ b/README.md @@ -40,7 +40,8 @@ CoreUI is meant to be the UX game changer. Pure & transparent code is devoid of * [CoreUI Free Bootstrap Admin Template](https://github.com/coreui/coreui-free-bootstrap-admin-template) * [CoreUI Free Angular Admin Template](https://github.com/coreui/coreui-free-angular-admin-template) -* [CoreUI Free React.js Admin Template](https://github.com/coreui/coreui-free-react-admin-template) +* [CoreUI Free React.js Admin Template (Vite)](https://github.com/coreui/coreui-free-react-admin-template) +* [CoreUI Free React.js Admin Template (Create React App)](https://github.com/coreui/coreui-free-react-admin-template-cra) * [CoreUI Free Vue.js Admin Template](https://github.com/coreui/coreui-free-vue-admin-template) ## CoreUI PRO @@ -116,7 +117,8 @@ Within the download you'll find the following directories and files, logically g ``` coreui-free-react-admin-template ├── public/ # static files -│ └── index.html # html template +│ ├── favicon.ico +│ └── manifest.json │ ├── src/ # project root │ ├── assets/ # images, icons, etc. @@ -126,17 +128,20 @@ coreui-free-react-admin-template │ ├── views/ # application views │ ├── _nav.js # sidebar navigation config │ ├── App.js -│ ├── ... │ ├── index.js │ ├── routes.js # routes config │ └── store.js # template state example │ -└── package.json +├── index.html # html template +├── ... +├── package.json +├── ... +└── vite.config.mjs # vite config ``` ## Documentation -The documentation for the CoreUI Admin Template is hosted at our website [CoreUI for React](https://coreui.io/react/) +The documentation for the CoreUI Admin Template is hosted at our website [CoreUI for React](https://coreui.io/react/docs/templates/installation/) ## Versioning @@ -174,6 +179,6 @@ CoreUI is an MIT-licensed open source project and is completely free to use. How ## Copyright and License -copyright 2023 creativeLabs Łukasz Holeczek. +copyright 2024 creativeLabs Łukasz Holeczek. Code released under [the MIT license](https://github.com/coreui/coreui-free-react-admin-template/blob/main/LICENSE). \ No newline at end of file diff --git a/index.html b/index.html new file mode 100644 index 000000000..2e283fb93 --- /dev/null +++ b/index.html @@ -0,0 +1,29 @@ + + + + + + + + + + + CoreUI Free React.js Admin Template + + + + + +
+ + + + diff --git a/jest.config.js b/jest.config.js deleted file mode 100644 index abf16ab93..000000000 --- a/jest.config.js +++ /dev/null @@ -1,17 +0,0 @@ -/** - * Copyright (c) 2013-present, creativeLabs Lukasz Holeczek. - * - * This source code is licensed under the MIT license found in the - * LICENSE file in the root directory of this source tree. - */ - -'use strict' - -module.exports = { - collectCoverageFrom: [ - 'src/**/*.{js,jsx}', - '!**/*index.js', - '!src/serviceWorker.js', - '!src/polyfill.js', - ], -} diff --git a/jsconfig.json b/jsconfig.json deleted file mode 100644 index 63f923e44..000000000 --- a/jsconfig.json +++ /dev/null @@ -1,6 +0,0 @@ -{ - "compilerOptions": { - "baseUrl": "." - }, - "include": ["src"] -} \ No newline at end of file diff --git a/package.json b/package.json index c377ac217..4e1c09bf6 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@coreui/coreui-free-react-admin-template", - "version": "5.0.0-rc.0", + "version": "5.0.0-rc.1", "description": "CoreUI Free React Admin Template", "homepage": ".", "bugs": { @@ -13,49 +13,42 @@ "license": "MIT", "author": "The CoreUI Team (https://github.com/orgs/coreui/people)", "scripts": { - "build": "react-scripts build", - "eject": "react-scripts eject", + "build": "vite build", "lint": "eslint \"src/**/*.js\"", - "start": "react-scripts start", - "test": "react-scripts test", - "test:cov": "npm test -- --coverage --watchAll=false", - "test:debug": "react-scripts --inspect-brk test --runInBand" + "serve": "vite preview", + "start": "vite" }, "dependencies": { "@coreui/chartjs": "^4.0.0-rc.0", - "@coreui/coreui": "^5.0.0-rc.0", + "@coreui/coreui": "^5.0.0-rc-2", "@coreui/icons": "^3.0.1", "@coreui/icons-react": "^2.2.1", - "@coreui/react": "^5.0.0-rc.0", + "@coreui/react": "^5.0.0-rc.3", "@coreui/react-chartjs": "^3.0.0-rc.0", "@coreui/utils": "^2.0.2", "@popperjs/core": "^2.11.8", - "chart.js": "^4.4.0", - "classnames": "^2.3.2", - "core-js": "^3.33.2", + "chart.js": "^4.4.2", + "classnames": "^2.5.1", + "core-js": "^3.36.1", "prop-types": "^15.8.1", "react": "^18.2.0", - "react-app-polyfill": "^3.0.0", "react-dom": "^18.2.0", - "react-redux": "^8.1.3", - "react-router-dom": "^6.18.0", - "redux": "4.2.1", + "react-redux": "^9.1.0", + "react-router-dom": "^6.22.3", + "redux": "5.0.1", "simplebar-react": "^3.2.4" }, "devDependencies": { - "@babel/plugin-proposal-private-property-in-object": "^7.21.11", - "@testing-library/jest-dom": "^6.1.4", - "@testing-library/react": "^14.1.0", - "@testing-library/user-event": "^14.5.1", - "eslint-config-prettier": "^9.0.0", - "eslint-plugin-prettier": "^5.0.1", - "prettier": "3.1.0", - "react-scripts": "5.0.1", - "sass": "^1.69.5", - "web-vitals": "^3.5.0" - }, - "engines": { - "node": ">=10", - "npm": ">=6" + "@vitejs/plugin-react": "^4.2.1", + "autoprefixer": "^10.4.19", + "eslint": "^8.57.0", + "eslint-config-prettier": "^9.1.0", + "eslint-plugin-prettier": "^5.1.3", + "eslint-plugin-react": "^7.34.1", + "eslint-plugin-react-hooks": "^4.6.0", + "postcss": "^8.4.38", + "prettier": "3.2.5", + "sass": "^1.72.0", + "vite": "^5.2.2" } } diff --git a/public/index.html b/public/index.html deleted file mode 100644 index 851936cc6..000000000 --- a/public/index.html +++ /dev/null @@ -1,50 +0,0 @@ - - - - - - - - - - - CoreUI Free React.js Admin Template - - - - - - - -
- - - diff --git a/src/App.test.js b/src/App.test.js deleted file mode 100644 index 3a7a8cc56..000000000 --- a/src/App.test.js +++ /dev/null @@ -1,9 +0,0 @@ -import React from 'react' -import { render, screen } from '@testing-library/react' -import App from './App' - -test('renders learn react link', () => { - render() - const linkElement = screen.getByText(/learn react/i) - expect(linkElement).toBeInTheDocument() -}) diff --git a/src/components/AppFooter.js b/src/components/AppFooter.js index 2f26d8b6e..fd126f460 100644 --- a/src/components/AppFooter.js +++ b/src/components/AppFooter.js @@ -8,7 +8,7 @@ const AppFooter = () => { CoreUI - © 2023 creativeLabs. + © 2024 creativeLabs.
Powered by diff --git a/src/components/AppHeader.js b/src/components/AppHeader.js index ac85c429b..b10bd7e12 100644 --- a/src/components/AppHeader.js +++ b/src/components/AppHeader.js @@ -53,7 +53,7 @@ const AppHeader = () => { - + Dashboard @@ -99,7 +99,7 @@ const AppHeader = () => { setColorMode('light')} > @@ -108,7 +108,7 @@ const AppHeader = () => { setColorMode('dark')} > @@ -117,7 +117,7 @@ const AppHeader = () => { setColorMode('auto')} > diff --git a/src/components/AppSidebar.js b/src/components/AppSidebar.js index 6e9f3495f..021cb52c3 100644 --- a/src/components/AppSidebar.js +++ b/src/components/AppSidebar.js @@ -7,7 +7,6 @@ import { CSidebarBrand, CSidebarFooter, CSidebarHeader, - CSidebarNav, CSidebarToggler, } from '@coreui/react' import CIcon from '@coreui/icons-react' @@ -17,9 +16,6 @@ import { AppSidebarNav } from './AppSidebarNav' import { logo } from 'src/assets/brand/logo' import { sygnet } from 'src/assets/brand/sygnet' -import SimpleBar from 'simplebar-react' -import 'simplebar-react/dist/simplebar.min.css' - // sidebar nav config import navigation from '../_nav' @@ -50,12 +46,7 @@ const AppSidebar = () => { onClick={() => dispatch({ type: 'set', sidebarShow: false })} /> - - - - - - + dispatch({ type: 'set', sidebarUnfoldable: !unfoldable })} diff --git a/src/components/AppSidebarNav.js b/src/components/AppSidebarNav.js index 1cadaff25..6b73cec4e 100644 --- a/src/components/AppSidebarNav.js +++ b/src/components/AppSidebarNav.js @@ -1,11 +1,13 @@ import React from 'react' -import { NavLink, useLocation } from 'react-router-dom' +import { NavLink } from 'react-router-dom' import PropTypes from 'prop-types' -import { CBadge } from '@coreui/react' +import SimpleBar from 'simplebar-react' +import 'simplebar-react/dist/simplebar.min.css' + +import { CBadge, CNavLink, CSidebarNav } from '@coreui/react' export const AppSidebarNav = ({ items }) => { - const location = useLocation() const navLink = (name, icon, badge, indent = false) => { return ( <> @@ -30,30 +32,23 @@ export const AppSidebarNav = ({ items }) => { const { component, name, badge, icon, ...rest } = item const Component = component return ( - - {navLink(name, icon, badge, indent)} + + {rest.to || rest.href ? ( + + {navLink(name, icon, badge, indent)} + + ) : ( + navLink(name, icon, badge, indent) + )} ) } + const navGroup = (item, index) => { const { component, name, icon, items, to, ...rest } = item const Component = component return ( - + {item.items?.map((item, index) => item.items ? navGroup(item, index) : navItem(item, index, true), )} @@ -62,10 +57,10 @@ export const AppSidebarNav = ({ items }) => { } return ( - + {items && items.map((item, index) => (item.items ? navGroup(item, index) : navItem(item, index)))} - + ) } diff --git a/src/components/header/AppHeaderDropdown.js b/src/components/header/AppHeaderDropdown.js index c377ff699..30c0df82b 100644 --- a/src/components/header/AppHeaderDropdown.js +++ b/src/components/header/AppHeaderDropdown.js @@ -31,7 +31,7 @@ const AppHeaderDropdown = () => { - Account + Account Updates @@ -60,7 +60,7 @@ const AppHeaderDropdown = () => { 42 - Settings + Settings Profile diff --git a/src/index.js b/src/index.js index d19a3bcd3..11d6e8658 100644 --- a/src/index.js +++ b/src/index.js @@ -1,10 +1,9 @@ -import 'react-app-polyfill/stable' -import 'core-js' import React from 'react' import { createRoot } from 'react-dom/client' -import App from './App' -import reportWebVitals from './reportWebVitals' import { Provider } from 'react-redux' +import 'core-js' + +import App from './App' import store from './store' createRoot(document.getElementById('root')).render( @@ -12,8 +11,3 @@ createRoot(document.getElementById('root')).render( , ) - -// If you want to start measuring performance in your app, pass a function -// to log results (for example: reportWebVitals(console.log)) -// or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals -reportWebVitals() diff --git a/src/reportWebVitals.js b/src/reportWebVitals.js deleted file mode 100644 index dc6ff0781..000000000 --- a/src/reportWebVitals.js +++ /dev/null @@ -1,13 +0,0 @@ -const reportWebVitals = (onPerfEntry) => { - if (onPerfEntry && onPerfEntry instanceof Function) { - import('web-vitals').then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => { - getCLS(onPerfEntry) - getFID(onPerfEntry) - getFCP(onPerfEntry) - getLCP(onPerfEntry) - getTTFB(onPerfEntry) - }) - } -} - -export default reportWebVitals diff --git a/src/scss/_custom.scss b/src/scss/_custom.scss index 4301405f0..15d367af4 100644 --- a/src/scss/_custom.scss +++ b/src/scss/_custom.scss @@ -1,29 +1 @@ -// Custom styles for this theme - -.header > .container-fluid, -.sidebar-header { - min-height: calc(4rem + 1px); // stylelint-disable-line function-disallowed-list -} - -.header > .container-fluid + .container-fluid { - min-height: 3rem; -} - -.sidebar-brand-full { - margin-left: 3px; -} - -.sidebar-toggler { - @include ltr-rtl("margin-left", auto); -} - -.sidebar-narrow, -.sidebar-narrow-unfoldable:not(:hover) { - .sidebar-toggler { - @include ltr-rtl("margin-right", auto); - } -} - -.footer { - min-height: calc(3rem + 1px); // stylelint-disable-line function-disallowed-list -} +// Here you can add other styles diff --git a/src/scss/_layout.scss b/src/scss/_layout.scss deleted file mode 100644 index 7e2ee4f81..000000000 --- a/src/scss/_layout.scss +++ /dev/null @@ -1,22 +0,0 @@ -body { - background-color: var(--cui-tertiary-bg); -} - -.wrapper { - width: 100%; - @include ltr-rtl("padding-left", var(--cui-sidebar-occupy-start, 0)); - will-change: auto; - @include transition(padding .15s); -} - -@if $enable-dark-mode { - @include color-mode(dark) { - body { - background-color: var(--cui-dark-bg-subtle); - } - - .footer { - --cui-footer-bg: var(--cui-body-bg); - } - } -} diff --git a/src/scss/_theme.scss b/src/scss/_theme.scss new file mode 100644 index 000000000..49e1c79e6 --- /dev/null +++ b/src/scss/_theme.scss @@ -0,0 +1,64 @@ +body { + background-color: var(--cui-tertiary-bg); +} + +.wrapper { + width: 100%; + @include ltr-rtl("padding-left", var(--cui-sidebar-occupy-start, 0)); + @include ltr-rtl("padding-right", var(--cui-sidebar-occupy-end, 0)); + will-change: auto; + @include transition(padding .15s); +} + +.header > .container-fluid, +.sidebar-header { + min-height: calc(4rem + 1px); // stylelint-disable-line function-disallowed-list +} + +.sidebar-brand-full { + margin-left: 3px; +} + +.sidebar-header { + .nav-underline-border { + --cui-nav-underline-border-link-padding-x: 1rem; + --cui-nav-underline-border-gap: 0; + } + + .nav-link { + display: flex; + align-items: center; + min-height: calc(4rem + 1px); // stylelint-disable-line function-disallowed-list + } +} + +.sidebar-toggler { + @include ltr-rtl("margin-left", auto); +} + +.sidebar-narrow, +.sidebar-narrow-unfoldable:not(:hover) { + .sidebar-toggler { + @include ltr-rtl("margin-right", auto); + } +} + +.header > .container-fluid + .container-fluid { + min-height: 3rem; +} + +.footer { + min-height: calc(3rem + 1px); // stylelint-disable-line function-disallowed-list +} + +@if $enable-dark-mode { + @include color-mode(dark) { + body { + background-color: var(--cui-dark-bg-subtle); + } + + .footer { + --cui-footer-bg: var(--cui-body-bg); + } + } +} diff --git a/src/scss/_variables.scss b/src/scss/_variables.scss index 5ac5b7265..b0f8a52a3 100644 --- a/src/scss/_variables.scss +++ b/src/scss/_variables.scss @@ -2,5 +2,4 @@ // // If you want to customize your project please add your variables below. -$enable-rtl: true; /* stylelint-disable-line scss/dollar-variable-default */ -$enable-deprecation-messages: false; /* stylelint-disable-line scss/dollar-variable-default */ +$enable-deprecation-messages: false !default; diff --git a/src/scss/_examples.scss b/src/scss/examples.scss similarity index 92% rename from src/scss/_examples.scss rename to src/scss/examples.scss index f1e6ed856..2390ba194 100644 --- a/src/scss/_examples.scss +++ b/src/scss/examples.scss @@ -1,4 +1,6 @@ /* stylelint-disable declaration-no-important, scss/selector-no-redundant-nesting-selector */ +$enable-deprecation-messages: false; /* stylelint-disable-line scss/dollar-variable-default */ + @import "@coreui/coreui/scss/functions"; @import "@coreui/coreui/scss/variables"; @import "@coreui/coreui/scss/mixins"; @@ -9,7 +11,7 @@ } .tab-content { - background-color: rgba(var(--#{$prefix}tertiary-bg-rgb), var(--#{$prefix}bg-opacity, 1)); + background-color: var(--#{$prefix}tertiary-bg); } & + p { @@ -51,9 +53,6 @@ } // Buttons - .col > .btn, - .col-auto > .btn, - .d-md-block > .btn, > .btn, > .btn-group { margin: .25rem .125rem; @@ -114,4 +113,4 @@ background-color: var(--#{$prefix}secondary-bg) !important; } } -} \ No newline at end of file +} diff --git a/src/scss/style.scss b/src/scss/style.scss index de0c64a08..6fbabff00 100644 --- a/src/scss/style.scss +++ b/src/scss/style.scss @@ -1,16 +1,14 @@ // If you want to override variables do it here @import "variables"; -// Import CoreUI for React components library +// Import styles @import "@coreui/coreui/scss/coreui"; -// Import Chart.js custom tooltips styles -@import "@coreui/chartjs/scss/coreui-chartjs"; +// Vendors +@import "vendors/simplebar"; -@import "layout"; +// Custom styles for this theme +@import "theme"; -// Preview -@import "examples"; - -// If you want to add custom CSS you can put it here. +// If you want to add custom CSS you can put it here @import "custom"; diff --git a/src/scss/vendors/simplebar.scss b/src/scss/vendors/simplebar.scss new file mode 100644 index 000000000..59c81b8a9 --- /dev/null +++ b/src/scss/vendors/simplebar.scss @@ -0,0 +1,5 @@ +.simplebar-content { + display: flex; + flex-direction: column; + min-height: 100%; +} diff --git a/src/setupTests.js b/src/setupTests.js deleted file mode 100644 index 52aaef1d2..000000000 --- a/src/setupTests.js +++ /dev/null @@ -1,5 +0,0 @@ -// jest-dom adds custom jest matchers for asserting on DOM nodes. -// allows you to do things like: -// expect(element).toHaveTextContent(/react/i) -// learn more: https://github.com/testing-library/jest-dom -import '@testing-library/jest-dom' diff --git a/src/views/base/cards/Cards.js b/src/views/base/cards/Cards.js index bb89cc03c..8c3fb2582 100644 --- a/src/views/base/cards/Cards.js +++ b/src/views/base/cards/Cards.js @@ -248,7 +248,7 @@ const Cards = () => {

- Header + Header Special title treatment diff --git a/src/views/base/collapses/Collapses.js b/src/views/base/collapses/Collapses.js index 218518933..98a6beb5c 100644 --- a/src/views/base/collapses/Collapses.js +++ b/src/views/base/collapses/Collapses.js @@ -19,6 +19,7 @@ const Collapses = () => {

You can use a link or a button component.

{ e.preventDefault() @@ -53,6 +54,7 @@ const Collapses = () => { setVisibleHorizontal(!visibleHorizontal)} aria-expanded={visibleHorizontal} aria-controls="collapseWidthExample" @@ -90,6 +92,7 @@ const Collapses = () => { Toggle second element { setVisibleA(!visibleA) setVisibleB(!visibleB) diff --git a/src/views/base/list-groups/ListGroups.js b/src/views/base/list-groups/ListGroups.js index bcadf474d..07ad20055 100644 --- a/src/views/base/list-groups/ListGroups.js +++ b/src/views/base/list-groups/ListGroups.js @@ -97,19 +97,19 @@ const ListGroups = () => {

- + Cras justo odio - + Dapibus ac facilisis in - + Morbi leo risus - + Porta ac consectetur ac - + Vestibulum at eros @@ -201,7 +201,7 @@ const ListGroups = () => {

- + Dapibus ac facilisis in {[ @@ -214,7 +214,7 @@ const ListGroups = () => { 'light', 'dark', ].map((color, index) => ( - + A simple {color} list group item ))} @@ -269,7 +269,7 @@ const ListGroups = () => {

- +
List group item heading
3 days ago @@ -280,7 +280,7 @@ const ListGroups = () => {

Donec id elit non mi porta. - +
List group item heading
3 days ago @@ -291,7 +291,7 @@ const ListGroups = () => {

Donec id elit non mi porta. - +
List group item heading
3 days ago diff --git a/src/views/base/navs/Navs.js b/src/views/base/navs/Navs.js index 15319461b..e2a627ff2 100644 --- a/src/views/base/navs/Navs.js +++ b/src/views/base/navs/Navs.js @@ -58,7 +58,7 @@ const Navs = () => { without the extra markup.

- + Active @@ -308,7 +308,7 @@ const Navs = () => { horizontal layout that fills the available width starting from the small breakpoint.

- + Active diff --git a/src/views/base/placeholders/Placeholders.js b/src/views/base/placeholders/Placeholders.js index 4f0e80f21..3be06a69a 100644 --- a/src/views/base/placeholders/Placeholders.js +++ b/src/views/base/placeholders/Placeholders.js @@ -71,6 +71,7 @@ const Placeholders = () => { {

diff --git a/src/views/forms/input-group/InputGroup.js b/src/views/forms/input-group/InputGroup.js index 3bc7237e1..880cff38e 100644 --- a/src/views/forms/input-group/InputGroup.js +++ b/src/views/forms/input-group/InputGroup.js @@ -21,7 +21,7 @@ import { } from '@coreui/react' import { DocsExample } from 'src/components' -const Select = () => { +const InputGroup = () => { return ( @@ -394,7 +394,7 @@ const Select = () => { - + Options @@ -411,7 +411,7 @@ const Select = () => { - + Options @@ -449,14 +449,14 @@ const Select = () => { - + Upload - + Upload @@ -500,4 +500,4 @@ const Select = () => { ) } -export default Select +export default InputGroup diff --git a/src/views/forms/range/Range.js b/src/views/forms/range/Range.js index 727ce75e5..1e31cabca 100644 --- a/src/views/forms/range/Range.js +++ b/src/views/forms/range/Range.js @@ -52,7 +52,7 @@ const Range = () => {

Example range - + @@ -70,7 +70,7 @@ const Range = () => {

Example range - + diff --git a/src/views/notifications/alerts/Alerts.js b/src/views/notifications/alerts/Alerts.js index 99f43629b..f51b62e28 100644 --- a/src/views/notifications/alerts/Alerts.js +++ b/src/views/notifications/alerts/Alerts.js @@ -99,7 +99,7 @@ const Alerts = () => {

- Well done! + Well done!

Aww yeah, you successfully read this important alert message. This example text is going to run a bit longer so that you can see how spacing within an alert works diff --git a/src/views/notifications/toasts/Toasts.js b/src/views/notifications/toasts/Toasts.js index 639b78b48..10b9b7e40 100644 --- a/src/views/notifications/toasts/Toasts.js +++ b/src/views/notifications/toasts/Toasts.js @@ -62,7 +62,7 @@ const Toasts = () => { dismiss button.

- + { Toasts are slightly translucent to blend in with what's below them.

- + {

- + { Hello, world! This is a toast message. - + { Take action - + Close
diff --git a/src/views/widgets/Widgets.js b/src/views/widgets/Widgets.js index a9bf51e12..4a34afe4c 100644 --- a/src/views/widgets/Widgets.js +++ b/src/views/widgets/Widgets.js @@ -126,7 +126,7 @@ const Widgets = () => { - + { value="1,123" /> - + { value="1,123" /> - + { value="1,123" /> - + { value="1,123" /> - + { value="1,123" /> - + { - + } value="87.500" @@ -784,7 +784,7 @@ const Widgets = () => { progress={{ color: 'info', value: 75 }} /> - + } value="385" @@ -792,7 +792,7 @@ const Widgets = () => { progress={{ color: 'success', value: 75 }} /> - + } value="1238" @@ -800,7 +800,7 @@ const Widgets = () => { progress={{ color: 'warning', value: 75 }} /> - + } value="28%" @@ -808,7 +808,7 @@ const Widgets = () => { progress={{ color: 'primary', value: 75 }} /> - + } value="5:34:11" @@ -816,7 +816,7 @@ const Widgets = () => { progress={{ color: 'danger', value: 75 }} /> - + } value="972" @@ -828,7 +828,7 @@ const Widgets = () => { - + } @@ -838,7 +838,7 @@ const Widgets = () => { progress={{ value: 75 }} /> - + } @@ -848,7 +848,7 @@ const Widgets = () => { progress={{ value: 75 }} /> - + } @@ -858,7 +858,7 @@ const Widgets = () => { progress={{ value: 75 }} /> - + } @@ -868,7 +868,7 @@ const Widgets = () => { progress={{ value: 75 }} /> - + } @@ -878,7 +878,7 @@ const Widgets = () => { progress={{ value: 75 }} /> - + } diff --git a/src/views/widgets/WidgetsBrand.js b/src/views/widgets/WidgetsBrand.js index f09393aae..03eea83ef 100644 --- a/src/views/widgets/WidgetsBrand.js +++ b/src/views/widgets/WidgetsBrand.js @@ -70,7 +70,6 @@ const WidgetsBrand = (props) => { }} /> - { }} /> - { }} /> - { + // Load .env + const env = loadEnv(mode, process.cwd(), '') + process.env = { ...process.env, ...env } + + return { + base: './', + build: { + outDir: 'build', + }, + css: { + postcss: { + plugins: [ + autoprefixer({}), // add options if needed + ], + }, + }, + define: { + // vitejs does not support process.env so we have to redefine it + 'process.env': process.env, + }, + esbuild: { + loader: 'jsx', + include: /src\/.*\.jsx?$/, + exclude: [], + }, + optimizeDeps: { + force: true, + esbuildOptions: { + loader: { + '.js': 'jsx', + }, + }, + }, + plugins: [react()], + resolve: { + alias: [ + { + find: 'src/', + replacement: `${path.resolve(__dirname, 'src')}/`, + }, + ], + extensions: ['.mjs', '.js', '.ts', '.jsx', '.tsx', '.json', '.scss'], + }, + server: { + port: 3000, + proxy: { + // https://vitejs.dev/config/server-options.html + }, + }, + } +})