├── .eslintrc.json
├── .gitignore
├── .npmrc
├── .prettierrc.json
├── CHANGELOG.md
├── ISSUE_TEMPLATE.md
├── LICENSE.md
├── README.md
├── genezio.yaml
├── jsconfig.json
├── package.json
├── public
├── apple-icon.png
├── favicon.png
├── index.html
├── manifest.json
└── robots.txt
└── src
├── App.js
├── assets
├── images
│ ├── BalanceCardBg.png
│ ├── avatar-simmmple.png
│ ├── avatar1.png
│ ├── avatar10.png
│ ├── avatar2.png
│ ├── avatar3.png
│ ├── avatar4.png
│ ├── avatar5.png
│ ├── avatar6.png
│ ├── avatar7.png
│ ├── avatar8.png
│ ├── avatar9.png
│ ├── background-card-reports.png
│ ├── billing-background-balance.png
│ ├── billing-background-card.png
│ ├── body-background.png
│ ├── bruce-mars.jpg
│ ├── cardimgfree.png
│ ├── curved-images
│ │ └── white-curved.jpeg
│ ├── ivana-square.jpg
│ ├── ivana-squares.jpg
│ ├── kal-visuals-square.jpg
│ ├── logo-ct.png
│ ├── logos
│ │ ├── mastercard.png
│ │ └── visa.png
│ ├── marie.jpg
│ ├── profile-1.png
│ ├── profile-2.png
│ ├── profile-3.png
│ ├── shapes
│ │ ├── car-profile.svg
│ │ ├── graph-billing.svg
│ │ ├── green-lightning.svg
│ │ ├── waves-white.svg
│ │ └── white-lightning.svg
│ ├── sidenav
│ │ └── sidenav-card-background.png
│ ├── signInImage.png
│ ├── signUpImage.png
│ ├── small-logos
│ │ ├── icon-sun-cloud.png
│ │ ├── logo-apple.svg
│ │ ├── logo-atlassian.svg
│ │ ├── logo-facebook.svg
│ │ ├── logo-google.svg
│ │ ├── logo-invision.svg
│ │ ├── logo-jira.svg
│ │ ├── logo-slack.svg
│ │ ├── logo-spotify.svg
│ │ ├── logo-webdev.svg
│ │ └── logo-xd.svg
│ ├── team-1.jpg
│ ├── team-2.jpg
│ ├── team-3.jpg
│ ├── team-4.jpg
│ ├── team-5.jpg
│ └── welcome-profile.png
└── theme
│ ├── base
│ ├── borders.js
│ ├── boxShadows.js
│ ├── breakpoints.js
│ ├── colors.js
│ ├── globals.js
│ ├── typography.css
│ └── typography.js
│ ├── components
│ ├── appBar.js
│ ├── avatar.js
│ ├── breadcrumbs.js
│ ├── button
│ │ ├── contained.js
│ │ ├── index.js
│ │ ├── outlined.js
│ │ ├── root.js
│ │ └── text.js
│ ├── buttonBase.js
│ ├── card
│ │ ├── cardContent.js
│ │ ├── cardMedia.js
│ │ └── index.js
│ ├── container.js
│ ├── dialog
│ │ ├── dialogActions.js
│ │ ├── dialogContent.js
│ │ ├── dialogContentText.js
│ │ ├── dialogTitle.js
│ │ └── index.js
│ ├── divider.js
│ ├── form
│ │ ├── autocomplete.js
│ │ ├── checkbox.js
│ │ ├── formControlLabel.js
│ │ ├── formLabel.js
│ │ ├── input.js
│ │ ├── inputBase.js
│ │ ├── radio.js
│ │ ├── select.js
│ │ └── switchButton.js
│ ├── icon.js
│ ├── iconButton.js
│ ├── linearProgress.js
│ ├── link.js
│ ├── list
│ │ ├── index.js
│ │ ├── listItem.js
│ │ └── listItemText.js
│ ├── menu
│ │ ├── index.js
│ │ └── menuItem.js
│ ├── popover.js
│ ├── sidenav.js
│ ├── slider.js
│ ├── stepper
│ │ ├── index.js
│ │ ├── step.js
│ │ ├── stepConnector.js
│ │ ├── stepIcon.js
│ │ └── stepLabel.js
│ ├── svgIcon.js
│ ├── table
│ │ ├── tableCell.js
│ │ ├── tableContainer.js
│ │ └── tableHead.js
│ ├── tabs
│ │ ├── index.js
│ │ └── tab.js
│ └── tooltip.js
│ ├── functions
│ ├── boxShadow.js
│ ├── gradientChartLine.js
│ ├── hexToRgb.js
│ ├── linearGradient.js
│ ├── pxToRem.js
│ ├── radialGradient.js
│ ├── rgba.js
│ └── tripleLinearGradient.js
│ ├── index.js
│ └── theme-rtl.js
├── components
├── VuiAlert
│ ├── VuiAlertCloseIcon.js
│ ├── VuiAlertRoot.js
│ └── index.js
├── VuiAvatar
│ ├── VuiAvatarRoot.js
│ └── index.js
├── VuiBadge
│ ├── VuiBadgeRoot.js
│ └── index.js
├── VuiBox
│ ├── VuiBoxRoot.js
│ └── index.js
├── VuiButton
│ ├── VuiButtonRoot.js
│ └── index.js
├── VuiInput
│ ├── VuiInputIconBoxRoot.js
│ ├── VuiInputIconRoot.js
│ ├── VuiInputRoot.js
│ ├── VuiInputWithIconRoot.js
│ └── index.js
├── VuiPagination
│ ├── VuiPaginationItemRoot.js
│ └── index.js
├── VuiProgress
│ ├── VuiProgressRoot.js
│ └── index.js
├── VuiSwitch
│ ├── VuiSwitchRoot.js
│ └── index.js
└── VuiTypography
│ ├── VuiTypographyRoot.js
│ └── index.js
├── context
└── index.js
├── examples
├── Breadcrumbs
│ └── index.js
├── Cards
│ ├── InfoCards
│ │ └── ProfileInfoCard
│ │ │ └── index.js
│ ├── MasterCard
│ │ └── index.js
│ ├── ProjectCards
│ │ └── DefaultProjectCard
│ │ │ └── index.js
│ └── StatisticsCards
│ │ └── MiniStatisticsCard
│ │ └── index.js
├── Charts
│ ├── BarCharts
│ │ └── BarChart.js
│ └── LineCharts
│ │ └── LineChart.js
├── Configurator
│ ├── ConfiguratorRoot.js
│ └── index.js
├── Footer
│ └── index.js
├── GradientBorder
│ ├── GradientBorderRoot.js
│ └── index.js
├── Icons
│ ├── AdobeXD.js
│ ├── Atlassian.js
│ ├── Basket.js
│ ├── Cart.js
│ ├── Credit.js
│ ├── CreditCard.js
│ ├── Cube.js
│ ├── CustomerSupport.js
│ ├── Document.js
│ ├── DocumentV.js
│ ├── Invision.js
│ ├── Jira.js
│ ├── Mastercard.js
│ ├── Office.js
│ ├── Settings.js
│ ├── Shop.js
│ ├── SimmmpleLogo.js
│ ├── Slack.js
│ ├── SpaceShip.js
│ ├── Spotify.js
│ └── Visa.js
├── Items
│ └── NotificationItem
│ │ ├── index.js
│ │ └── styles.js
├── LayoutContainers
│ ├── DashboardLayout
│ │ └── index.js
│ └── PageLayout
│ │ └── index.js
├── Lists
│ └── ProfilesList
│ │ └── index.js
├── Navbars
│ ├── DashboardNavbar
│ │ ├── index.js
│ │ └── styles.js
│ └── DefaultNavbar
│ │ ├── DefaultNavbarLink.js
│ │ ├── DefaultNavbarMobile.js
│ │ └── index.js
├── Sidenav
│ ├── SidenavCard.js
│ ├── SidenavCollapse.js
│ ├── SidenavRoot.js
│ ├── index.js
│ └── styles
│ │ ├── sidenav.js
│ │ ├── sidenavCard.js
│ │ └── sidenavCollapse.js
├── Tables
│ └── Table
│ │ └── index.js
└── Timeline
│ ├── TimelineItem
│ ├── index.js
│ └── styles.js
│ ├── TimelineList
│ └── index.js
│ └── context
│ └── index.js
├── index.js
├── layouts
├── authentication
│ ├── components
│ │ ├── BasicLayout
│ │ │ └── index.js
│ │ ├── CoverLayout
│ │ │ └── index.js
│ │ ├── Footer
│ │ │ └── index.js
│ │ ├── IllustrationLayout
│ │ │ └── index.js
│ │ ├── Separator
│ │ │ └── index.js
│ │ └── Socials
│ │ │ └── index.js
│ ├── sign-in
│ │ └── index.js
│ └── sign-up
│ │ └── index.js
├── billing
│ ├── components
│ │ ├── Bill
│ │ │ └── index.js
│ │ ├── BillingInformation
│ │ │ └── index.js
│ │ ├── CreditBalance
│ │ │ └── index.js
│ │ ├── Invoice
│ │ │ └── index.js
│ │ ├── Invoices
│ │ │ └── index.js
│ │ ├── PaymentMethod
│ │ │ └── index.js
│ │ ├── Transaction
│ │ │ └── index.js
│ │ └── Transactions
│ │ │ └── index.js
│ └── index.js
├── dashboard
│ ├── components
│ │ ├── OrderOverview
│ │ │ └── index.js
│ │ ├── Projects
│ │ │ ├── data
│ │ │ │ └── index.js
│ │ │ └── index.js
│ │ ├── ReferralTracking
│ │ │ └── index.js
│ │ ├── SatisfactionRate
│ │ │ └── index.js
│ │ └── WelcomeMark
│ │ │ └── index.js
│ ├── data
│ │ ├── barChartData.js
│ │ ├── barChartOptions.js
│ │ ├── lineChartData.js
│ │ └── lineChartOptions.js
│ └── index.js
├── profile
│ ├── components
│ │ ├── CarInformations
│ │ │ └── index.js
│ │ ├── Header
│ │ │ └── index.js
│ │ ├── PlatformSettings
│ │ │ └── index.js
│ │ └── Welcome
│ │ │ └── index.js
│ ├── data
│ │ ├── lineChartData1.js
│ │ ├── lineChartData2.js
│ │ ├── lineChartOptions1.js
│ │ └── lineChartOptions2.js
│ └── index.js
├── rtl
│ ├── components
│ │ ├── OrderOverview
│ │ │ └── index.js
│ │ ├── Projects
│ │ │ ├── data
│ │ │ │ └── index.js
│ │ │ └── index.js
│ │ ├── ReferralTracking
│ │ │ └── index.js
│ │ ├── SatisfactionRate
│ │ │ └── index.js
│ │ └── WelcomeMark
│ │ │ └── index.js
│ ├── data
│ │ ├── barChartData.js
│ │ ├── barChartOptions.js
│ │ ├── lineChartData.js
│ │ └── lineChartOptions.js
│ └── index.js
└── tables
│ ├── data
│ ├── authorsTableData.js
│ └── projectsTableData.js
│ └── index.js
├── routes.js
└── variables
└── charts.js
/.eslintrc.json:
--------------------------------------------------------------------------------
1 | {
2 | "env": {
3 | "browser": true,
4 | "es2021": true
5 | },
6 | "parserOptions": {
7 | "ecmaFeatures": {
8 | "jsx": true
9 | },
10 | "ecmaVersion": 12,
11 | "sourceType": "module"
12 | },
13 | "plugins": ["react"]
14 | }
15 |
--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
1 | # See https://help.github.com/ignore-files/ for more about ignoring files.
2 |
3 | # dependencies
4 | /node_modules
5 |
6 | # testing
7 | /coverage
8 |
9 | # production
10 | /build
11 |
12 | # misc
13 | .DS_Store
14 | .env.local
15 | .env.development.local
16 | .env.test.local
17 | .env.production.local
18 |
19 | npm-debug.log*
20 | yarn-debug.log*
21 | yarn-error.log*
22 |
23 | package-lock.json
24 | yarn.lock
25 |
26 | commit.sh
27 |
--------------------------------------------------------------------------------
/.npmrc:
--------------------------------------------------------------------------------
1 | legacy-peer-deps=true
2 | auto-install-peers=true
3 | strict-peer-dependencies=true
4 |
--------------------------------------------------------------------------------
/.prettierrc.json:
--------------------------------------------------------------------------------
1 | {
2 | "printWidth": 100,
3 | "trailingComma": "es5",
4 | "tabWidth": 2,
5 | "semi": true,
6 | "singleQuote": false,
7 | "endOfLine": "auto"
8 | }
9 |
--------------------------------------------------------------------------------
/CHANGELOG.md:
--------------------------------------------------------------------------------
1 | # Changelog
2 | ## [1.0.1] 2022-07-26
3 |
4 | - We used the Material UI Circular Progress instead of the plugins since they were deprecated. We also removed the tilt card for the same reason. The plugins are still used in previous versions!
5 | ## [1.0.0] 2022-01-03
6 |
7 | ### Original Release
8 |
--------------------------------------------------------------------------------
/ISSUE_TEMPLATE.md:
--------------------------------------------------------------------------------
1 |
8 |
9 |
14 |
--------------------------------------------------------------------------------
/LICENSE.md:
--------------------------------------------------------------------------------
1 | MIT License
2 |
3 | Copyright (c) 2013-2021 Creative Tim (https://www.creative-tim.com)
4 |
5 | Permission is hereby granted, free of charge, to any person obtaining a copy
6 | of this software and associated documentation files (the "Software"), to deal
7 | in the Software without restriction, including without limitation the rights
8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9 | copies of the Software, and to permit persons to whom the Software is
10 | furnished to do so, subject to the following conditions:
11 |
12 | The above copyright notice and this permission notice shall be included in all
13 | copies or substantial portions of the Software.
14 |
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21 | SOFTWARE.
22 |
--------------------------------------------------------------------------------
/genezio.yaml:
--------------------------------------------------------------------------------
1 | name: vision-ui-dashboard-react
2 | region: us-east-1
3 | frontend:
4 | # Specifies the path of your code.
5 | path: .
6 | # Specifies the folder where the build is located.
7 | # This is the folder that will be deployed.
8 | publish: build
9 | # Scripts will run in the specified `path` folder.
10 | scripts:
11 | # The command to build your frontend project. This is custom to your project.
12 | # It must to populate the specified `publish` folder with a `index.html` file.
13 | deploy:
14 | - npm install --legacy-peer-deps
15 | - npm run build
16 | yamlVersion: 2
17 |
--------------------------------------------------------------------------------
/jsconfig.json:
--------------------------------------------------------------------------------
1 | {
2 | "compilerOptions": {
3 | "baseUrl": "src",
4 | "paths": {
5 | "*": ["src/*"]
6 | }
7 | }
8 | }
9 |
--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "vision-ui-dashboard-react",
3 | "version": "3.0.0",
4 | "private": true,
5 | "author": "Creative Tim",
6 | "license": "See license in https://www.creative-tim.com/license",
7 | "description": "Material UI version of Vision UI Dashboard by Creative Tim",
8 | "homepage": "https://demos.creative-tim.com/vision-ui-dashboard-react/#/dashboard",
9 | "bugs": {
10 | "url": "https://github.com/creativetimofficial/vision-ui-dashboard-react/issues"
11 | },
12 | "repository": {
13 | "type": "git",
14 | "url": "git+https://github.com/creativetimofficial/vision-ui-dashboard-react.git"
15 | },
16 | "dependencies": {
17 | "@emotion/cache": "11.4.0",
18 | "@emotion/react": "^11.9.3",
19 | "@emotion/styled": "^11.9.3",
20 | "@mui/icons-material": "5.1.1",
21 | "@mui/material": "^5.9.2",
22 | "@mui/styled-engine": "5.1.1",
23 | "@mui/styles": "^5.2.0",
24 | "ajv": "^8.17.1",
25 | "apexcharts": "^3.30.0",
26 | "chroma-js": "2.1.2",
27 | "install": "^0.13.0",
28 | "prop-types": "15.7.2",
29 | "react": "^18.2.0",
30 | "react-apexcharts": "^1.3.9",
31 | "react-countup": "5.2.0",
32 | "react-dom": "^18.2.0",
33 | "react-flatpickr": "3.10.7",
34 | "react-github-btn": "1.2.1",
35 | "react-icons": "^4.3.1",
36 | "react-router-dom": "5.2.0",
37 | "stylis": "4.0.10",
38 | "stylis-plugin-rtl": "2.1.0",
39 | "uuid": "8.3.2",
40 | "web-vitals": "1.0.1"
41 | },
42 | "devDependencies": {
43 | "@testing-library/jest-dom": "5.11.4",
44 | "@testing-library/react": "11.1.0",
45 | "@testing-library/user-event": "12.1.10",
46 | "cross-env": "^7.0.3",
47 | "eslint": "^7.11.0",
48 | "react-scripts": "5.0.1"
49 | },
50 | "scripts": {
51 | "start": "react-scripts start",
52 | "build": "cross-env PUBLIC_URL=/ react-scripts build",
53 | "test": "react-scripts test",
54 | "eject": "react-scripts eject",
55 | "install:clean": "rm -rf node_modules/ && rm -rf package-lock.json && npm install && npm start"
56 | },
57 | "eslintConfig": {
58 | "extends": [
59 | "react-app",
60 | "react-app/jest"
61 | ]
62 | },
63 | "browserslist": {
64 | "production": [
65 | ">0.2%",
66 | "not dead",
67 | "not op_mini all"
68 | ],
69 | "development": [
70 | "last 1 chrome version",
71 | "last 1 firefox version",
72 | "last 1 safari version"
73 | ]
74 | }
75 | }
76 |
--------------------------------------------------------------------------------
/public/apple-icon.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/creativetimofficial/vision-ui-dashboard-react/78762699ec3de2882dda9ee9ea3bec164fc94f88/public/apple-icon.png
--------------------------------------------------------------------------------
/public/favicon.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/creativetimofficial/vision-ui-dashboard-react/78762699ec3de2882dda9ee9ea3bec164fc94f88/public/favicon.png
--------------------------------------------------------------------------------
/public/index.html:
--------------------------------------------------------------------------------
1 |
20 |
21 |
22 |
23 |
24 |
25 |
26 |
27 |
28 |
29 | Vision UI Dashboard Free React
30 |
34 |
40 |
44 |
45 |
46 |
47 |
48 |
49 |
50 |
51 |
--------------------------------------------------------------------------------
/public/manifest.json:
--------------------------------------------------------------------------------
1 | {
2 | "short_name": "Vision UI Dashboard",
3 | "name": "Vision UI Dashboard React",
4 | "icons": [
5 | {
6 | "src": "favicon.png",
7 | "sizes": "64x64 32x32 24x24 16x16",
8 | "type": "image/png"
9 | }
10 | ],
11 | "start_url": ".",
12 | "display": "standalone",
13 | "theme_color": "#17c1e8",
14 | "background_color": "#ffffff"
15 | }
16 |
--------------------------------------------------------------------------------
/public/robots.txt:
--------------------------------------------------------------------------------
1 | # https://www.robotstxt.org/robotstxt.html
2 | User-agent: *
3 | Disallow:
4 |
--------------------------------------------------------------------------------
/src/assets/images/BalanceCardBg.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/creativetimofficial/vision-ui-dashboard-react/78762699ec3de2882dda9ee9ea3bec164fc94f88/src/assets/images/BalanceCardBg.png
--------------------------------------------------------------------------------
/src/assets/images/avatar-simmmple.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/creativetimofficial/vision-ui-dashboard-react/78762699ec3de2882dda9ee9ea3bec164fc94f88/src/assets/images/avatar-simmmple.png
--------------------------------------------------------------------------------
/src/assets/images/avatar1.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/creativetimofficial/vision-ui-dashboard-react/78762699ec3de2882dda9ee9ea3bec164fc94f88/src/assets/images/avatar1.png
--------------------------------------------------------------------------------
/src/assets/images/avatar10.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/creativetimofficial/vision-ui-dashboard-react/78762699ec3de2882dda9ee9ea3bec164fc94f88/src/assets/images/avatar10.png
--------------------------------------------------------------------------------
/src/assets/images/avatar2.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/creativetimofficial/vision-ui-dashboard-react/78762699ec3de2882dda9ee9ea3bec164fc94f88/src/assets/images/avatar2.png
--------------------------------------------------------------------------------
/src/assets/images/avatar3.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/creativetimofficial/vision-ui-dashboard-react/78762699ec3de2882dda9ee9ea3bec164fc94f88/src/assets/images/avatar3.png
--------------------------------------------------------------------------------
/src/assets/images/avatar4.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/creativetimofficial/vision-ui-dashboard-react/78762699ec3de2882dda9ee9ea3bec164fc94f88/src/assets/images/avatar4.png
--------------------------------------------------------------------------------
/src/assets/images/avatar5.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/creativetimofficial/vision-ui-dashboard-react/78762699ec3de2882dda9ee9ea3bec164fc94f88/src/assets/images/avatar5.png
--------------------------------------------------------------------------------
/src/assets/images/avatar6.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/creativetimofficial/vision-ui-dashboard-react/78762699ec3de2882dda9ee9ea3bec164fc94f88/src/assets/images/avatar6.png
--------------------------------------------------------------------------------
/src/assets/images/avatar7.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/creativetimofficial/vision-ui-dashboard-react/78762699ec3de2882dda9ee9ea3bec164fc94f88/src/assets/images/avatar7.png
--------------------------------------------------------------------------------
/src/assets/images/avatar8.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/creativetimofficial/vision-ui-dashboard-react/78762699ec3de2882dda9ee9ea3bec164fc94f88/src/assets/images/avatar8.png
--------------------------------------------------------------------------------
/src/assets/images/avatar9.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/creativetimofficial/vision-ui-dashboard-react/78762699ec3de2882dda9ee9ea3bec164fc94f88/src/assets/images/avatar9.png
--------------------------------------------------------------------------------
/src/assets/images/background-card-reports.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/creativetimofficial/vision-ui-dashboard-react/78762699ec3de2882dda9ee9ea3bec164fc94f88/src/assets/images/background-card-reports.png
--------------------------------------------------------------------------------
/src/assets/images/billing-background-balance.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/creativetimofficial/vision-ui-dashboard-react/78762699ec3de2882dda9ee9ea3bec164fc94f88/src/assets/images/billing-background-balance.png
--------------------------------------------------------------------------------
/src/assets/images/billing-background-card.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/creativetimofficial/vision-ui-dashboard-react/78762699ec3de2882dda9ee9ea3bec164fc94f88/src/assets/images/billing-background-card.png
--------------------------------------------------------------------------------
/src/assets/images/body-background.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/creativetimofficial/vision-ui-dashboard-react/78762699ec3de2882dda9ee9ea3bec164fc94f88/src/assets/images/body-background.png
--------------------------------------------------------------------------------
/src/assets/images/bruce-mars.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/creativetimofficial/vision-ui-dashboard-react/78762699ec3de2882dda9ee9ea3bec164fc94f88/src/assets/images/bruce-mars.jpg
--------------------------------------------------------------------------------
/src/assets/images/cardimgfree.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/creativetimofficial/vision-ui-dashboard-react/78762699ec3de2882dda9ee9ea3bec164fc94f88/src/assets/images/cardimgfree.png
--------------------------------------------------------------------------------
/src/assets/images/curved-images/white-curved.jpeg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/creativetimofficial/vision-ui-dashboard-react/78762699ec3de2882dda9ee9ea3bec164fc94f88/src/assets/images/curved-images/white-curved.jpeg
--------------------------------------------------------------------------------
/src/assets/images/ivana-square.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/creativetimofficial/vision-ui-dashboard-react/78762699ec3de2882dda9ee9ea3bec164fc94f88/src/assets/images/ivana-square.jpg
--------------------------------------------------------------------------------
/src/assets/images/ivana-squares.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/creativetimofficial/vision-ui-dashboard-react/78762699ec3de2882dda9ee9ea3bec164fc94f88/src/assets/images/ivana-squares.jpg
--------------------------------------------------------------------------------
/src/assets/images/kal-visuals-square.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/creativetimofficial/vision-ui-dashboard-react/78762699ec3de2882dda9ee9ea3bec164fc94f88/src/assets/images/kal-visuals-square.jpg
--------------------------------------------------------------------------------
/src/assets/images/logo-ct.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/creativetimofficial/vision-ui-dashboard-react/78762699ec3de2882dda9ee9ea3bec164fc94f88/src/assets/images/logo-ct.png
--------------------------------------------------------------------------------
/src/assets/images/logos/mastercard.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/creativetimofficial/vision-ui-dashboard-react/78762699ec3de2882dda9ee9ea3bec164fc94f88/src/assets/images/logos/mastercard.png
--------------------------------------------------------------------------------
/src/assets/images/logos/visa.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/creativetimofficial/vision-ui-dashboard-react/78762699ec3de2882dda9ee9ea3bec164fc94f88/src/assets/images/logos/visa.png
--------------------------------------------------------------------------------
/src/assets/images/marie.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/creativetimofficial/vision-ui-dashboard-react/78762699ec3de2882dda9ee9ea3bec164fc94f88/src/assets/images/marie.jpg
--------------------------------------------------------------------------------
/src/assets/images/profile-1.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/creativetimofficial/vision-ui-dashboard-react/78762699ec3de2882dda9ee9ea3bec164fc94f88/src/assets/images/profile-1.png
--------------------------------------------------------------------------------
/src/assets/images/profile-2.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/creativetimofficial/vision-ui-dashboard-react/78762699ec3de2882dda9ee9ea3bec164fc94f88/src/assets/images/profile-2.png
--------------------------------------------------------------------------------
/src/assets/images/profile-3.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/creativetimofficial/vision-ui-dashboard-react/78762699ec3de2882dda9ee9ea3bec164fc94f88/src/assets/images/profile-3.png
--------------------------------------------------------------------------------
/src/assets/images/shapes/car-profile.svg:
--------------------------------------------------------------------------------
1 |
7 |
--------------------------------------------------------------------------------
/src/assets/images/shapes/graph-billing.svg:
--------------------------------------------------------------------------------
1 |
4 |
--------------------------------------------------------------------------------
/src/assets/images/shapes/green-lightning.svg:
--------------------------------------------------------------------------------
1 |
4 |
--------------------------------------------------------------------------------
/src/assets/images/shapes/white-lightning.svg:
--------------------------------------------------------------------------------
1 |
4 |
--------------------------------------------------------------------------------
/src/assets/images/sidenav/sidenav-card-background.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/creativetimofficial/vision-ui-dashboard-react/78762699ec3de2882dda9ee9ea3bec164fc94f88/src/assets/images/sidenav/sidenav-card-background.png
--------------------------------------------------------------------------------
/src/assets/images/signInImage.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/creativetimofficial/vision-ui-dashboard-react/78762699ec3de2882dda9ee9ea3bec164fc94f88/src/assets/images/signInImage.png
--------------------------------------------------------------------------------
/src/assets/images/signUpImage.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/creativetimofficial/vision-ui-dashboard-react/78762699ec3de2882dda9ee9ea3bec164fc94f88/src/assets/images/signUpImage.png
--------------------------------------------------------------------------------
/src/assets/images/small-logos/icon-sun-cloud.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/creativetimofficial/vision-ui-dashboard-react/78762699ec3de2882dda9ee9ea3bec164fc94f88/src/assets/images/small-logos/icon-sun-cloud.png
--------------------------------------------------------------------------------
/src/assets/images/small-logos/logo-apple.svg:
--------------------------------------------------------------------------------
1 |
2 |
--------------------------------------------------------------------------------
/src/assets/images/small-logos/logo-atlassian.svg:
--------------------------------------------------------------------------------
1 |
2 |
--------------------------------------------------------------------------------
/src/assets/images/small-logos/logo-facebook.svg:
--------------------------------------------------------------------------------
1 |
2 |
--------------------------------------------------------------------------------
/src/assets/images/small-logos/logo-google.svg:
--------------------------------------------------------------------------------
1 |
2 |
--------------------------------------------------------------------------------
/src/assets/images/small-logos/logo-invision.svg:
--------------------------------------------------------------------------------
1 |
2 |
--------------------------------------------------------------------------------
/src/assets/images/small-logos/logo-jira.svg:
--------------------------------------------------------------------------------
1 |
2 |
--------------------------------------------------------------------------------
/src/assets/images/small-logos/logo-spotify.svg:
--------------------------------------------------------------------------------
1 |
2 |
--------------------------------------------------------------------------------
/src/assets/images/small-logos/logo-webdev.svg:
--------------------------------------------------------------------------------
1 |
2 |
--------------------------------------------------------------------------------
/src/assets/images/team-1.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/creativetimofficial/vision-ui-dashboard-react/78762699ec3de2882dda9ee9ea3bec164fc94f88/src/assets/images/team-1.jpg
--------------------------------------------------------------------------------
/src/assets/images/team-2.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/creativetimofficial/vision-ui-dashboard-react/78762699ec3de2882dda9ee9ea3bec164fc94f88/src/assets/images/team-2.jpg
--------------------------------------------------------------------------------
/src/assets/images/team-3.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/creativetimofficial/vision-ui-dashboard-react/78762699ec3de2882dda9ee9ea3bec164fc94f88/src/assets/images/team-3.jpg
--------------------------------------------------------------------------------
/src/assets/images/team-4.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/creativetimofficial/vision-ui-dashboard-react/78762699ec3de2882dda9ee9ea3bec164fc94f88/src/assets/images/team-4.jpg
--------------------------------------------------------------------------------
/src/assets/images/team-5.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/creativetimofficial/vision-ui-dashboard-react/78762699ec3de2882dda9ee9ea3bec164fc94f88/src/assets/images/team-5.jpg
--------------------------------------------------------------------------------
/src/assets/images/welcome-profile.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/creativetimofficial/vision-ui-dashboard-react/78762699ec3de2882dda9ee9ea3bec164fc94f88/src/assets/images/welcome-profile.png
--------------------------------------------------------------------------------
/src/assets/theme/base/borders.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | /**
20 | * The base border styles for the Vision UI Dashboard Material.
21 | * You can add new border width, border color or border radius using this file.
22 | * You can customized the borders value for the entire Vision UI Dashboard Material using thie file.
23 | */
24 |
25 | // Vision UI Dashboard React Base Styles
26 | import colors from "assets/theme/base/colors";
27 |
28 | // Vision UI Dashboard React Helper Functions
29 | import pxToRem from "assets/theme/functions/pxToRem";
30 |
31 | const { borderCol } = colors;
32 |
33 | export default {
34 | borderColor: {
35 | grey: { borderCol },
36 | white: "rgba(226, 232, 240, 0.3)",
37 | },
38 |
39 | borderWidth: {
40 | 0: 0,
41 | 1: pxToRem(1),
42 | 2: pxToRem(2),
43 | 3: pxToRem(3),
44 | 4: pxToRem(4),
45 | 5: pxToRem(5),
46 | },
47 |
48 | borderRadius: {
49 | xs: pxToRem(2),
50 | sm: pxToRem(4),
51 | md: pxToRem(8),
52 | button: pxToRem(12),
53 | lg: pxToRem(15),
54 | xl: pxToRem(20),
55 | xxl: pxToRem(24),
56 | form: pxToRem(24),
57 | section: pxToRem(160),
58 | },
59 | };
60 |
--------------------------------------------------------------------------------
/src/assets/theme/base/breakpoints.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | /**
20 | * The base breakpoints for the Vision UI Dashboard Material.
21 | * You can add new breakpoints using this file.
22 | * You can customized the breakpoints for the entire Vision UI Dashboard Material using thie file.
23 | */
24 |
25 | export default {
26 | values: {
27 | xs: 375,
28 | sm: 425,
29 | md: 768,
30 | lg: 1024,
31 | xl: 1440,
32 | xxl: 1680,
33 | },
34 | };
35 |
--------------------------------------------------------------------------------
/src/assets/theme/base/globals.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | // Vision UI Dashboard React Base Styles
20 | import colors from "assets/theme/base/colors";
21 | import bgAdmin from "assets/images/body-background.png";
22 |
23 | const { info, dark } = colors;
24 | export default {
25 | html: {
26 | scrollBehavior: "smooth",
27 | background: dark.body,
28 | },
29 | body: {
30 | background: `url(${bgAdmin})`,
31 | backgroundSize: "cover",
32 | },
33 | "*, *::before, *::after": {
34 | margin: 0,
35 | padding: 0,
36 | },
37 | "a, a:link, a:visited": {
38 | textDecoration: "none !important",
39 | },
40 | "a.link, .link, a.link:link, .link:link, a.link:visited, .link:visited": {
41 | color: `${dark.main} !important`,
42 | transition: "color 150ms ease-in !important",
43 | },
44 | "a.link:hover, .link:hover, a.link:focus, .link:focus": {
45 | color: `${info.main} !important`,
46 | },
47 | };
48 |
--------------------------------------------------------------------------------
/src/assets/theme/base/typography.css:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | @import url(https://cdn.jsdelivr.net/npm/@xz/fonts@1/serve/plus-jakarta-display.min.css);
20 |
--------------------------------------------------------------------------------
/src/assets/theme/components/appBar.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | export default {
20 | defaultProps: {
21 | color: "transparent",
22 | },
23 |
24 | styleOverrides: {
25 | root: {
26 | boxShadow: "none",
27 | },
28 | },
29 | };
30 |
--------------------------------------------------------------------------------
/src/assets/theme/components/avatar.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | // Vision UI Dashboard React base styles
20 | import borders from "assets/theme/base/borders";
21 |
22 | const { borderRadius } = borders;
23 |
24 | export default {
25 | styleOverrides: {
26 | root: {
27 | transition: "all 200ms ease-in-out",
28 | },
29 |
30 | rounded: {
31 | borderRadius: borderRadius.lg,
32 | },
33 |
34 | img: {
35 | height: "auto",
36 | },
37 | },
38 | };
39 |
--------------------------------------------------------------------------------
/src/assets/theme/components/breadcrumbs.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | // Vision UI Dashboard React base styles
20 | import colors from "assets/theme/base/colors";
21 | import typography from "assets/theme/base/typography";
22 |
23 | const { grey, text, info } = colors;
24 | const { size } = typography;
25 |
26 | export default {
27 | styleOverrides: {
28 | li: {
29 | lineHeight: 0,
30 | },
31 |
32 | separator: {
33 | fontSize: size.sm,
34 | },
35 | },
36 | };
37 |
--------------------------------------------------------------------------------
/src/assets/theme/components/button/index.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | // Vision UI Dashboard React Button Styles
20 | import root from "assets/theme/components/button/root";
21 | import contained from "assets/theme/components/button/contained";
22 | import outlined from "assets/theme/components/button/outlined";
23 | import text from "assets/theme/components/button/text";
24 |
25 | export default {
26 | defaultProps: {
27 | disableRipple: true,
28 | },
29 | styleOverrides: {
30 | root: { ...root },
31 | contained: { ...contained.base },
32 | containedSizeSmall: { ...contained.small },
33 | containedSizeLarge: { ...contained.large },
34 | containedPrimary: { ...contained.primary },
35 | containedSecondary: { ...contained.secondary },
36 | outlined: { ...outlined.base },
37 | outlinedSizeSmall: { ...outlined.small },
38 | outlinedSizeLarge: { ...outlined.large },
39 | outlinedPrimary: { ...outlined.primary },
40 | outlinedSecondary: { ...outlined.secondary },
41 | text: { ...text.base },
42 | textSizeSmall: { ...text.small },
43 | textSizeLarge: { ...text.large },
44 | textPrimary: { ...text.primary },
45 | textSecondary: { ...text.secondary },
46 | },
47 | };
48 |
--------------------------------------------------------------------------------
/src/assets/theme/components/button/root.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | // Vision UI Dashboard React Base Styles
20 | import typography from "assets/theme/base/typography";
21 | import borders from "assets/theme/base/borders";
22 |
23 | // Vision UI Dashboard React Helper Functions
24 | import pxToRem from "assets/theme/functions/pxToRem";
25 |
26 | const { fontWeightBold, size } = typography;
27 | const { borderRadius } = borders;
28 |
29 | export default {
30 | display: "inline-flex",
31 | justifyContent: "center",
32 | alignItems: "center",
33 | fontSize: size.xs,
34 | fontWeight: fontWeightBold,
35 | borderRadius: borderRadius.button,
36 | padding: `${pxToRem(12)} ${pxToRem(24)}`,
37 | lineHeight: 1.4,
38 | textAlign: "center",
39 | textTransform: "unset",
40 | userSelect: "none",
41 | backgroundSize: "150% !important",
42 | backgroundPositionX: "25% !important",
43 | transition: `all 150ms ease-in`,
44 |
45 | "&:hover": {
46 | transform: "scale(1.02)",
47 | },
48 |
49 | "&:disabled": {
50 | pointerEvent: "none",
51 | opacity: 0.65,
52 | },
53 |
54 | "& .material-icons": {
55 | fontSize: pxToRem(15),
56 | marginTop: pxToRem(-2),
57 | },
58 | };
59 |
--------------------------------------------------------------------------------
/src/assets/theme/components/buttonBase.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | export default {
20 | defaultProps: {
21 | disableRipple: true,
22 | },
23 | };
24 |
--------------------------------------------------------------------------------
/src/assets/theme/components/card/cardContent.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | // Vision UI Dashboard React Helper Functions
20 | import pxToRem from "assets/theme/functions/pxToRem";
21 |
22 | export default {
23 | styleOverrides: {
24 | root: {
25 | marginTop: 0,
26 | marginBottom: 0,
27 | padding: `${pxToRem(8)} ${pxToRem(24)} ${pxToRem(24)}`,
28 | },
29 | },
30 | };
31 |
--------------------------------------------------------------------------------
/src/assets/theme/components/card/cardMedia.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | // Vision UI Dashboard React Base Styles
20 | import borders from "assets/theme/base/borders";
21 |
22 | // Vision UI Dashboard React Helper Functions
23 | import pxToRem from "assets/theme/functions/pxToRem";
24 |
25 | const { borderRadius } = borders;
26 |
27 | export default {
28 | styleOverrides: {
29 | root: {
30 | borderRadius: borderRadius.xl,
31 | margin: `${pxToRem(16)} ${pxToRem(16)} 0`,
32 | },
33 |
34 | media: {
35 | width: "auto",
36 | },
37 | },
38 | };
39 |
--------------------------------------------------------------------------------
/src/assets/theme/components/card/index.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | // Vision UI Dashboard React Base Styles
20 | import colors from "assets/theme/base/colors";
21 | import linearGradient from "assets/theme/functions/linearGradient";
22 | import borders from "assets/theme/base/borders";
23 | import boxShadows from "assets/theme/base/boxShadows";
24 |
25 | // Vision UI Dashboard React Helper Function
26 | import rgba from "assets/theme/functions/rgba";
27 |
28 | const { black, gradients } = colors;
29 | const { card } = gradients;
30 | const { borderWidth, borderRadius } = borders;
31 | const { xxl } = boxShadows;
32 |
33 | export default {
34 | styleOverrides: {
35 | root: {
36 | display: "flex",
37 | flexDirection: "column",
38 | background: linearGradient(card.main, card.state, card.deg),
39 | backdropFilter: "blur(120px)",
40 | position: "relative",
41 | minWidth: 0,
42 | padding: "22px",
43 | wordWrap: "break-word",
44 | backgroundClip: "border-box",
45 | border: `${borderWidth[0]} solid ${rgba(black.main, 0.125)}`,
46 | borderRadius: borderRadius.xl,
47 | boxShadow: xxl,
48 | },
49 | },
50 | };
51 |
--------------------------------------------------------------------------------
/src/assets/theme/components/container.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | // Vision UI Dashboard React base styles
20 | import breakpoints from "assets/theme/base/breakpoints";
21 |
22 | // Vision UI Dashboard React helper functions
23 | import pxToRem from "assets/theme/functions/pxToRem";
24 |
25 | const {
26 | values: { sm, md, lg, xl, xxl },
27 | } = breakpoints;
28 |
29 | const SM = `@media (min-width: ${sm}px)`;
30 | const MD = `@media (min-width: ${md}px)`;
31 | const LG = `@media (min-width: ${lg}px)`;
32 | const XL = `@media (min-width: ${xl}px)`;
33 | const XXL = `@media (min-width: ${xxl}px)`;
34 |
35 | const sharedClasses = {
36 | paddingRight: `${pxToRem(24)} !important`,
37 | paddingLeft: `${pxToRem(24)} !important`,
38 | marginRight: "auto !important",
39 | marginLeft: "auto !important",
40 | width: "100% !important",
41 | position: "relative",
42 | };
43 |
44 | export default {
45 | [SM]: {
46 | ".MuiContainer-root": {
47 | ...sharedClasses,
48 | maxWidth: "540px !important",
49 | },
50 | },
51 | [MD]: {
52 | ".MuiContainer-root": {
53 | ...sharedClasses,
54 | maxWidth: "720px !important",
55 | },
56 | },
57 | [LG]: {
58 | ".MuiContainer-root": {
59 | ...sharedClasses,
60 | maxWidth: "960px !important",
61 | },
62 | },
63 | [XL]: {
64 | ".MuiContainer-root": {
65 | ...sharedClasses,
66 | maxWidth: "1140px !important",
67 | },
68 | },
69 | [XXL]: {
70 | ".MuiContainer-root": {
71 | ...sharedClasses,
72 | maxWidth: "1320px !important",
73 | },
74 | },
75 | };
76 |
--------------------------------------------------------------------------------
/src/assets/theme/components/dialog/dialogActions.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | // Vision UI Dashboard React helper functions
20 | import pxToRem from "assets/theme/functions/pxToRem";
21 |
22 | export default {
23 | styleOverrides: {
24 | root: {
25 | padding: pxToRem(16),
26 | },
27 | },
28 | };
29 |
--------------------------------------------------------------------------------
/src/assets/theme/components/dialog/dialogContent.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | // Vision UI Dashboard React base styles
20 | import typography from "assets/theme/base/typography";
21 | import borders from "assets/theme/base/borders";
22 | import colors from "assets/theme/base/colors";
23 |
24 | // Vision UI Dashboard React helper functions
25 | import pxToRem from "assets/theme/functions/pxToRem";
26 |
27 | const { size } = typography;
28 | const { text } = colors;
29 | const { borderWidth, borderColor } = borders;
30 |
31 | export default {
32 | styleOverrides: {
33 | root: {
34 | padding: pxToRem(16),
35 | fontSize: size.md,
36 | color: text.main,
37 | },
38 |
39 | dividers: {
40 | borderTop: `${borderWidth[1]} solid ${borderColor}`,
41 | borderBottom: `${borderWidth[1]} solid ${borderColor}`,
42 | },
43 | },
44 | };
45 |
--------------------------------------------------------------------------------
/src/assets/theme/components/dialog/dialogContentText.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | // Vision UI Dashboard React base styles
20 | import typography from "assets/theme/base/typography";
21 | import colors from "assets/theme/base/colors";
22 |
23 | // Vision UI Dashboard React helper functions
24 | // import pxToRem from "assets/theme/functions/pxToRem";
25 |
26 | const { size } = typography;
27 | const { text } = colors;
28 |
29 | export default {
30 | styleOverrides: {
31 | root: {
32 | fontSize: size.md,
33 | color: text.main,
34 | },
35 | },
36 | };
37 |
--------------------------------------------------------------------------------
/src/assets/theme/components/dialog/dialogTitle.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | // Vision UI Dashboard React base styles
20 | import typography from "assets/theme/base/typography";
21 |
22 | // Vision UI Dashboard React helper functions
23 | import pxToRem from "assets/theme/functions/pxToRem";
24 |
25 | const { size } = typography;
26 |
27 | export default {
28 | styleOverrides: {
29 | root: {
30 | padding: pxToRem(16),
31 | fontSize: size.xl,
32 | },
33 | },
34 | };
35 |
--------------------------------------------------------------------------------
/src/assets/theme/components/dialog/index.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | // Vision UI Dashboard React base styles
20 | import borders from "assets/theme/base/borders";
21 | import boxShadows from "assets/theme/base/boxShadows";
22 |
23 | const { borderRadius } = borders;
24 | const { xxl } = boxShadows;
25 |
26 | export default {
27 | styleOverrides: {
28 | paper: {
29 | borderRadius: borderRadius.lg,
30 | boxShadow: xxl,
31 | },
32 |
33 | paperFullScreen: {
34 | borderRadius: 0,
35 | },
36 | },
37 | };
38 |
--------------------------------------------------------------------------------
/src/assets/theme/components/divider.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | // Vision UI Dashboard React base styles
20 | import colors from "assets/theme/base/colors";
21 |
22 | // Vision UI Dashboard React helper functions
23 | import rgba from "assets/theme/functions/rgba";
24 | import pxToRem from "assets/theme/functions/pxToRem";
25 |
26 | const { dark, transparent, white, info } = colors;
27 |
28 | export default {
29 | styleOverrides: {
30 | root: {
31 | backgroundColor: transparent.main,
32 | backgroundImage: `linear-gradient(to right, ${rgba(dark.main, 0)}, ${rgba(
33 | dark.main,
34 | 0.5
35 | )}, ${rgba(dark.main, 0)}) !important`,
36 | height: pxToRem(1),
37 | margin: `${pxToRem(16)} 0`,
38 | borderBottom: "none",
39 | opacity: 0.25,
40 | },
41 |
42 | vertical: {
43 | backgroundColor: transparent.main,
44 | backgroundImage: `linear-gradient(to bottom, ${rgba(dark.main, 0)}, ${rgba(
45 | dark.main,
46 | 0.5
47 | )}, ${rgba(dark.main, 0)}) !important`,
48 | width: pxToRem(1),
49 | height: "100%",
50 | margin: `0 ${pxToRem(16)}`,
51 | borderRight: "none",
52 | },
53 |
54 | light: {
55 | backgroundColor: transparent.main,
56 | backgroundImage: `linear-gradient(to right, ${rgba(info.main, 0)}, ${rgba(
57 | white.main,
58 | 1
59 | )}, ${rgba(white.main, 0)}) !important`,
60 |
61 | "&.MuiDivider-vertical": {
62 | backgroundImage: `linear-gradient(to bottom, ${rgba(white.main, 0)}, ${rgba(
63 | white.main,
64 | 0.5
65 | )}, ${rgba(white.main, 0)}) !important`,
66 | },
67 | },
68 | },
69 | };
70 |
--------------------------------------------------------------------------------
/src/assets/theme/components/form/formControlLabel.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | // Vision UI Dashboard React base styles
20 | import colors from "assets/theme/base/colors";
21 | import typography from "assets/theme/base/typography";
22 |
23 | // Vision UI Dashboard React helper functions
24 | import pxToRem from "assets/theme/functions/pxToRem";
25 |
26 | const { dark } = colors;
27 | const { size, fontWeightBold } = typography;
28 |
29 | export default {
30 | styleOverrides: {
31 | root: {
32 | display: "block",
33 | minHeight: pxToRem(24),
34 | marginBottom: pxToRem(2),
35 | },
36 |
37 | label: {
38 | display: "inline-block",
39 | fontSize: size.sm,
40 | fontWeight: fontWeightBold,
41 | color: dark.main,
42 | lineHeight: 1,
43 | transform: `translateY(${pxToRem(1)})`,
44 | marginLeft: pxToRem(4),
45 |
46 | "&.Mui-disabled": {
47 | color: dark.main,
48 | },
49 | },
50 | },
51 | };
52 |
--------------------------------------------------------------------------------
/src/assets/theme/components/form/formLabel.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | // Vision UI Dashboard React base styles
20 | import colors from "assets/theme/base/colors";
21 |
22 | const { dark } = colors;
23 |
24 | export default {
25 | styleOverrides: {
26 | root: {
27 | color: dark.main,
28 | },
29 | },
30 | };
31 |
--------------------------------------------------------------------------------
/src/assets/theme/components/form/input.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | // Vision UI Dashboard React Base Styles
20 | import colors from "assets/theme/base/colors";
21 | import borders from "assets/theme/base/borders";
22 |
23 | // Vision UI Dashboard helper functions
24 | import pxToRem from "assets/theme/functions/pxToRem";
25 |
26 | const { inputColors } = colors;
27 | const { borderWidth, borderRadius } = borders;
28 |
29 | export default {
30 | styleOverrides: {
31 | root: {
32 | display: "flex !important",
33 | padding: `${pxToRem(8)} ${pxToRem(28)} ${pxToRem(8)} ${pxToRem(12)} !important`,
34 | border: `${borderWidth[1]} solid ${inputColors.borderColor.main}`,
35 | borderRadius: `${borderRadius.md} !important`,
36 |
37 | "& fieldset": {
38 | border: "none",
39 | },
40 | },
41 |
42 | input: {
43 | height: pxToRem(22),
44 | width: "max-content !important",
45 | },
46 |
47 | inputSizeSmall: {
48 | height: pxToRem(14),
49 | },
50 | },
51 | };
52 |
--------------------------------------------------------------------------------
/src/assets/theme/components/form/inputBase.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | // Vision UI Dashboard React Base Styles
20 | import colors from "assets/theme/base/colors";
21 | import typography from "assets/theme/base/typography";
22 | import borders from "assets/theme/base/borders";
23 |
24 | // Vision UI Dashboard helper functions
25 | import pxToRem from "assets/theme/functions/pxToRem";
26 |
27 | const { dark, white, grey, inputColors } = colors;
28 | const { size, fontWeightRegular } = typography;
29 | const { borderWidth, borderRadius } = borders;
30 |
31 | export default {
32 | styleOverrides: {
33 | root: {
34 | display: "grid !important",
35 | placeItems: "center !important",
36 | width: "100% !important",
37 | height: "auto !important",
38 | padding: `${pxToRem(8)} ${pxToRem(12)}`,
39 | fontSize: `${size.sm} !important`,
40 | fontWeight: `${fontWeightRegular} !important`,
41 | lineHeight: "1.4 !important",
42 | color: `${grey[700]} !important`,
43 | backgroundColor: `${white.main} !important`,
44 | backgroundClip: "padding-box !important",
45 | border: `${borderWidth[1]} solid ${inputColors.borderColor.main}`,
46 | appearance: "none !important",
47 | borderRadius: borderRadius.md,
48 | transition: "box-shadow 150ms ease, border-color 150ms ease, padding 150ms ease !important",
49 | },
50 |
51 | input: {
52 | width: "100% !important",
53 | height: `${pxToRem(22)}`,
54 | padding: "0 !important",
55 |
56 | "&::-webkit-input-placeholder": {
57 | color: `${dark.main} !important`,
58 | },
59 | },
60 | },
61 | };
62 |
--------------------------------------------------------------------------------
/src/assets/theme/components/form/select.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | // Vision UI Dashboard React base styles
20 | import colors from "assets/theme/base/colors";
21 |
22 | // Vision UI Dashboard React helper functions
23 | import pxToRem from "assets/theme/functions/pxToRem";
24 |
25 | const { transparent } = colors;
26 |
27 | export default {
28 | styleOverrides: {
29 | select: {
30 | display: "grid",
31 | alignItems: "center",
32 | padding: `0 ${pxToRem(12)} !important`,
33 |
34 | "& .Mui-selected": {
35 | backgroundColor: transparent.main,
36 | },
37 | },
38 |
39 | selectMenu: {
40 | background: "none",
41 | height: "none",
42 | minHeight: "none",
43 | overflow: "unset",
44 | },
45 |
46 | icon: {
47 | display: "none",
48 | },
49 | },
50 | };
51 |
--------------------------------------------------------------------------------
/src/assets/theme/components/icon.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | // Vision UI Dashboard React helper functions
20 | import pxToRem from "assets/theme/functions/pxToRem";
21 |
22 | export default {
23 | defaultProps: {
24 | baseClassName: "material-icons-round",
25 | fontSize: "inherit",
26 | },
27 |
28 | styleOverrides: {
29 | fontSizeInherit: {
30 | fontSize: "inherit !important",
31 | },
32 |
33 | fontSizeSmall: {
34 | fontSize: `${pxToRem(20)} !important`,
35 | },
36 |
37 | fontSizeLarge: {
38 | fontSize: `${pxToRem(36)} !important`,
39 | },
40 | },
41 | };
42 |
--------------------------------------------------------------------------------
/src/assets/theme/components/iconButton.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | // Vision UI Dashboard React Base Styles
20 | import colors from "assets/theme/base/colors";
21 |
22 | const { transparent } = colors;
23 |
24 | export default {
25 | styleOverrides: {
26 | root: {
27 | "&:hover": {
28 | backgroundColor: transparent.main,
29 | },
30 | },
31 | },
32 | };
33 |
--------------------------------------------------------------------------------
/src/assets/theme/components/linearProgress.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | // Vision UI Dashboard React base styles
20 | import borders from "assets/theme/base/borders";
21 | import colors from "assets/theme/base/colors";
22 |
23 | // Vision UI Dashboard React helper functions
24 | import pxToRem from "assets/theme/functions/pxToRem";
25 |
26 | const { borderRadius } = borders;
27 | const { light } = colors;
28 |
29 | export default {
30 | styleOverrides: {
31 | root: {
32 | height: pxToRem(3),
33 | borderRadius: borderRadius.md,
34 | overflow: "visible",
35 | position: "relative",
36 | },
37 |
38 | colorPrimary: {
39 | backgroundColor: light.main,
40 | },
41 |
42 | colorSecondary: {
43 | backgroundColor: light.main,
44 | },
45 |
46 | bar: {
47 | height: pxToRem(6),
48 | borderRadius: borderRadius.sm,
49 | position: "absolute",
50 | transform: `translate(0, ${pxToRem(-1.5)}) !important`,
51 | transition: "width 0.6s ease !important",
52 | },
53 | },
54 | };
55 |
--------------------------------------------------------------------------------
/src/assets/theme/components/link.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | export default {
20 | defaultProps: {
21 | underline: "none",
22 | color: "inherit",
23 | },
24 | };
25 |
--------------------------------------------------------------------------------
/src/assets/theme/components/list/index.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | export default {
20 | styleOverrides: {
21 | padding: {
22 | paddingTop: 0,
23 | paddingBottom: 0,
24 | },
25 | },
26 | };
27 |
--------------------------------------------------------------------------------
/src/assets/theme/components/list/listItem.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | export default {
20 | defaultProps: {
21 | disableGutters: true,
22 | },
23 |
24 | styleOverrides: {
25 | root: {
26 | paddingTop: 0,
27 | paddingBottom: 0,
28 | },
29 | },
30 | };
31 |
--------------------------------------------------------------------------------
/src/assets/theme/components/list/listItemText.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | export default {
20 | styleOverrides: {
21 | root: {
22 | marginTop: 0,
23 | marginBottom: 0,
24 | },
25 | },
26 | };
27 |
--------------------------------------------------------------------------------
/src/assets/theme/components/menu/index.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | // Vision UI Dashboard React base styles
20 | import boxShadows from "assets/theme/base/boxShadows";
21 | import typography from "assets/theme/base/typography";
22 | import colors from "assets/theme/base/colors";
23 | import borders from "assets/theme/base/borders";
24 | import linearGradient from "assets/theme/functions/linearGradient";
25 |
26 | // Vision UI Dashboard React helper functions
27 | import pxToRem from "assets/theme/functions/pxToRem";
28 |
29 | const { borderWidth } = borders;
30 | const { lg } = boxShadows;
31 | const { size } = typography;
32 | const { white, borderCol, gradients, transparent } = colors;
33 | const { borderRadius } = borders;
34 |
35 | export default {
36 | defaultProps: {
37 | disableAutoFocusItem: true,
38 | },
39 |
40 | styleOverrides: {
41 | "& .MuiIcon-root": {
42 | stroke: white.main,
43 | },
44 | paper: {
45 | minWidth: pxToRem(160),
46 | boxShadow: lg,
47 | padding: `0 !important`,
48 | fontSize: size.sm,
49 | color: white.main,
50 | textAlign: "left",
51 | border: `${borderWidth[1]} solid ${borderCol.navbar}`,
52 | borderRadius: borderRadius.md,
53 | },
54 | list: {
55 | background: linearGradient(gradients.menu.main, gradients.menu.state, gradients.menu.deg),
56 | "& .MuiMenuItem-root": {
57 | "& .MuiBox-root .MuiTypography-root": {
58 | color: white.main,
59 | },
60 | "&:hover": {
61 | background: transparent.main,
62 | },
63 | },
64 | },
65 | },
66 | };
67 |
--------------------------------------------------------------------------------
/src/assets/theme/components/menu/menuItem.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | // Vision UI Dashboard React base styles
20 | import colors from "assets/theme/base/colors";
21 | import borders from "assets/theme/base/borders";
22 | import typography from "assets/theme/base/typography";
23 |
24 | // Vision UI Dashboard React helper functions
25 | import pxToRem from "assets/theme/functions/pxToRem";
26 |
27 | const { light, text, dark } = colors;
28 | const { borderRadius } = borders;
29 | const { size } = typography;
30 |
31 | export default {
32 | styleOverrides: {
33 | root: {
34 | minWidth: pxToRem(160),
35 | minHeight: "unset",
36 | padding: `${pxToRem(4.8)} ${pxToRem(16)}`,
37 | borderRadius: borderRadius.md,
38 | fontSize: size.sm,
39 | color: text.main,
40 | transition: "background-color 300ms ease, color 300ms ease",
41 |
42 | "&:hover, &:focus, &.Mui-selected, &.Mui-selected:hover, &.Mui-selected:focus": {
43 | backgroundColor: light.main,
44 | color: dark.main,
45 | },
46 | },
47 | },
48 | };
49 |
--------------------------------------------------------------------------------
/src/assets/theme/components/popover.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | // Vision UI Dashboard React helper functions
20 | import pxToRem from "assets/theme/functions/pxToRem";
21 |
22 | // Vision UI Dashboard React base styles
23 | import colors from "assets/theme/base/colors";
24 | import boxShadows from "assets/theme/base/boxShadows";
25 | import borders from "assets/theme/base/borders";
26 |
27 | const { transparent } = colors;
28 | const { lg } = boxShadows;
29 | const { borderRadius } = borders;
30 |
31 | export default {
32 | styleOverrides: {
33 | paper: {
34 | backgroundColor: transparent.main,
35 | boxShadow: lg,
36 | padding: pxToRem(8),
37 | borderRadius: borderRadius.lg,
38 | },
39 | },
40 | };
41 |
--------------------------------------------------------------------------------
/src/assets/theme/components/sidenav.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | // Vision UI Dashboard React base styles
20 | import colors from "assets/theme/base/colors";
21 | import borders from "assets/theme/base/borders";
22 |
23 | // Vision UI Dashboard React helper functions
24 | import rgba from "assets/theme/functions/rgba";
25 | import pxToRem from "assets/theme/functions/pxToRem";
26 |
27 | const { white } = colors;
28 | const { borderRadius } = borders;
29 |
30 | export default {
31 | styleOverrides: {
32 | root: {
33 | width: pxToRem(250),
34 | whiteSpace: "nowrap",
35 | border: "none",
36 | },
37 |
38 | paper: {
39 | width: pxToRem(250),
40 | backgroundColor: rgba(white.main, 0.8),
41 | backdropFilter: `saturate(200%) blur(${pxToRem(30)})`,
42 | height: `calc(100vh - ${pxToRem(32)})`,
43 | margin: pxToRem(16),
44 | borderRadius: borderRadius.xl,
45 | border: "none",
46 | },
47 |
48 | paperAnchorDockedLeft: {
49 | borderRight: "none",
50 | },
51 | },
52 | };
53 |
--------------------------------------------------------------------------------
/src/assets/theme/components/slider.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | // Vision UI Dashboard React base styles
20 | import colors from "assets/theme/base/colors";
21 | import borders from "assets/theme/base/borders";
22 | import boxShadows from "assets/theme/base/boxShadows";
23 |
24 | // Vision UI Dashboard React helper functions
25 | import linearGradient from "assets/theme/functions/linearGradient";
26 | import pxToRem from "assets/theme/functions/pxToRem";
27 |
28 | const { light, white, sliderColors, black, gradients } = colors;
29 | const { borderRadius, borderWidth } = borders;
30 | const { sliderBoxShadow } = boxShadows;
31 |
32 | export default {
33 | styleOverrides: {
34 | root: {
35 | width: "100%",
36 |
37 | "& .MuiSlider-active, & .Mui-focusVisible": {
38 | boxShadow: "none !important",
39 | },
40 |
41 | "& .MuiSlider-valueLabel": {
42 | color: black.main,
43 | },
44 | },
45 |
46 | rail: {
47 | height: pxToRem(3),
48 | backgroundColor: light.main,
49 | borderRadius: borderRadius.sm,
50 | },
51 |
52 | track: {
53 | backgroundImage: linearGradient(gradients.info.main, gradients.info.state),
54 | height: pxToRem(6),
55 | position: "relative",
56 | top: pxToRem(2),
57 | border: "none",
58 | borderRadius: borderRadius.lg,
59 | zIndex: 1,
60 | },
61 |
62 | thumb: {
63 | width: pxToRem(15),
64 | height: pxToRem(15),
65 | backgroundColor: white.main,
66 | zIndex: 10,
67 | boxShadow: sliderBoxShadow.thumb,
68 | border: `${borderWidth[1]} solid ${sliderColors.thumb.borderColor}`,
69 |
70 | "&:hover": {
71 | boxShadow: "none",
72 | },
73 | },
74 | },
75 | };
76 |
--------------------------------------------------------------------------------
/src/assets/theme/components/stepper/index.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | // Vision UI Dashboard React base styles
20 | import colors from "assets/theme/base/colors";
21 |
22 | // Vision UI Dashboard React helper functions
23 | import pxToRem from "assets/theme/functions/pxToRem";
24 |
25 | const { transparent } = colors;
26 |
27 | export default {
28 | styleOverrides: {
29 | root: {
30 | margin: `${pxToRem(48)} 0`,
31 | padding: `0 ${pxToRem(12)}`,
32 |
33 | "&.MuiPaper-root": {
34 | backgroundColor: transparent.main,
35 | },
36 | },
37 | },
38 | };
39 |
--------------------------------------------------------------------------------
/src/assets/theme/components/stepper/step.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | // Vision UI Dashboard React helper functions
20 | import pxToRem from "assets/theme/functions/pxToRem";
21 |
22 | export default {
23 | styleOverrides: {
24 | root: {
25 | padding: `0 ${pxToRem(6)}`,
26 | },
27 | },
28 | };
29 |
--------------------------------------------------------------------------------
/src/assets/theme/components/stepper/stepConnector.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | // Vision UI Dashboard React base styles
20 | import borders from "assets/theme/base/borders";
21 | import colors from "assets/theme/base/colors";
22 |
23 | const { dark } = colors;
24 | const { borderWidth, borderColor } = borders;
25 |
26 | export default {
27 | styleOverrides: {
28 | root: {
29 | color: borderColor,
30 | transition: "all 200ms linear",
31 |
32 | "&.Mui-active": {
33 | color: dark.main,
34 | },
35 |
36 | "&.Mui-completed": {
37 | color: dark.main,
38 | },
39 | },
40 |
41 | alternativeLabel: {
42 | top: "14%",
43 | left: "-50%",
44 | right: "50%",
45 | },
46 |
47 | line: {
48 | borderWidth: `${borderWidth[2]} !important`,
49 | borderColor: "currentColor",
50 | },
51 | },
52 | };
53 |
--------------------------------------------------------------------------------
/src/assets/theme/components/stepper/stepIcon.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | // Vision UI Dashboard React base styles
20 | import colors from "assets/theme/base/colors";
21 | import borders from "assets/theme/base/borders";
22 |
23 | // Vision UI Dashboard React helper functions
24 | import pxToRem from "assets/theme/functions/pxToRem";
25 | import boxShadow from "assets/theme/functions/boxShadow";
26 |
27 | const { dark, white } = colors;
28 | const { borderWidth, borderColor } = borders;
29 |
30 | export default {
31 | styleOverrides: {
32 | root: {
33 | background: white.main,
34 | fill: white.main,
35 | stroke: white.main,
36 | strokeWidth: pxToRem(10),
37 | width: pxToRem(13),
38 | height: pxToRem(13),
39 | border: `${borderWidth[2]} solid ${borderColor}`,
40 | borderRadius: "50%",
41 | zIndex: 99,
42 | transition: "all 200ms linear",
43 |
44 | "&.Mui-active": {
45 | background: dark.main,
46 | fill: dark.main,
47 | stroke: dark.main,
48 | borderColor: dark.main,
49 | boxShadow: boxShadow([0, 0], [0, 2], dark.main, 1),
50 | },
51 |
52 | "&.Mui-completed": {
53 | background: dark.main,
54 | fill: dark.main,
55 | stroke: dark.main,
56 | borderColor: dark.main,
57 | boxShadow: boxShadow([0, 0], [0, 2], dark.main, 1),
58 | },
59 | },
60 | },
61 | };
62 |
--------------------------------------------------------------------------------
/src/assets/theme/components/stepper/stepLabel.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | // Vision UI Dashboard React base styles
20 | import typography from "assets/theme/base/typography";
21 | import colors from "assets/theme/base/colors";
22 |
23 | // Vision UI Dashboard React helper functions
24 | import pxToRem from "assets/theme/functions/pxToRem";
25 |
26 | const { size, fontWeightRegular } = typography;
27 | const { grey, dark, text } = colors;
28 |
29 | export default {
30 | styleOverrides: {
31 | label: {
32 | marginTop: `${pxToRem(8)} !important`,
33 | fontWeight: fontWeightRegular,
34 | fontSize: size.md,
35 | color: grey[300],
36 |
37 | "&.Mui-active": {
38 | fontWeight: `${fontWeightRegular} !important`,
39 | color: `${dark.main} !important`,
40 | },
41 |
42 | "&.Mui-completed": {
43 | fontWeight: `${fontWeightRegular} !important`,
44 | color: `${text.main} !important`,
45 | },
46 | },
47 | },
48 | };
49 |
--------------------------------------------------------------------------------
/src/assets/theme/components/svgIcon.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | // Vision UI Dashboard React helper functions
20 | import pxToRem from "assets/theme/functions/pxToRem";
21 |
22 | export default {
23 | defaultProps: {
24 | fontSize: "inherit",
25 | },
26 |
27 | styleOverrides: {
28 | fontSizeInherit: {
29 | fontSize: "inherit !important",
30 | },
31 |
32 | fontSizeSmall: {
33 | fontSize: `${pxToRem(20)} !important`,
34 | },
35 |
36 | fontSizeLarge: {
37 | fontSize: `${pxToRem(36)} !important`,
38 | },
39 | },
40 | };
41 |
--------------------------------------------------------------------------------
/src/assets/theme/components/table/tableCell.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | // Vision UI Dashboard React base styles
20 | import borders from "assets/theme/base/borders";
21 | import colors from "assets/theme/base/colors";
22 |
23 | // Vision UI Dashboard React helper functions
24 | import pxToRem from "assets/theme/functions/pxToRem";
25 |
26 | const { borderWidth } = borders;
27 | const { light } = colors;
28 |
29 | export default {
30 | styleOverrides: {
31 | root: {
32 | backgroundColor: `${light.main} !important`,
33 | padding: `${pxToRem(12)} ${pxToRem(16)}`,
34 | "& .MuiBox-root": {
35 | pl: "0px !important",
36 | },
37 | borderBottom: `${borderWidth[1]} solid ${light.main}`,
38 | },
39 | },
40 | };
41 |
--------------------------------------------------------------------------------
/src/assets/theme/components/table/tableContainer.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | // Vision UI Dashboard React base styles
20 | import colors from "assets/theme/base/colors";
21 | import boxShadows from "assets/theme/base/boxShadows";
22 | import borders from "assets/theme/base/borders";
23 |
24 | const { transparent } = colors;
25 | const { xxl } = boxShadows;
26 | const { borderRadius } = borders;
27 |
28 | export default {
29 | styleOverrides: {
30 | root: {
31 | backgroundColor: transparent.main,
32 | boxShadow: xxl,
33 | borderRadius: borderRadius.xl,
34 | "& thead": {
35 | "& tr": {
36 | "& th": {
37 | "&:first-of-type": {
38 | paddingLeft: "0px !important",
39 | },
40 | },
41 | },
42 | },
43 | "& .MuiTableBody-root": {
44 | "& tr": {
45 | "& td": {
46 | "&:first-of-type": {
47 | paddingLeft: "0px !important",
48 | "& .MuiBox-root": {
49 | paddingLeft: "0px !important",
50 | },
51 | },
52 | },
53 | },
54 | },
55 | },
56 | },
57 | };
58 |
--------------------------------------------------------------------------------
/src/assets/theme/components/table/tableHead.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | // Vision UI Dashboard React base styles
20 | import borders from "assets/theme/base/borders";
21 |
22 | // Vision UI Dashboard React helper functions
23 | import pxToRem from "assets/theme/functions/pxToRem";
24 |
25 | const { borderRadius } = borders;
26 |
27 | export default {
28 | styleOverrides: {
29 | root: {
30 | display: "block",
31 | padding: `${pxToRem(16)} ${pxToRem(16)} 0 0`,
32 | borderRadius: `${borderRadius.xl} ${borderRadius.xl} 0 0`,
33 | },
34 | },
35 | };
36 |
--------------------------------------------------------------------------------
/src/assets/theme/components/tabs/index.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | // Vision UI Dashboard React base styles
20 | import colors from "assets/theme/base/colors";
21 | import borders from "assets/theme/base/borders";
22 |
23 | // Vision UI Dashboard React helper functions
24 | import pxToRem from "assets/theme/functions/pxToRem";
25 |
26 | const { grey, info } = colors;
27 | const { borderRadius } = borders;
28 |
29 | export default {
30 | styleOverrides: {
31 | root: {
32 | position: "relative",
33 | backgroundColor: grey[100],
34 | borderRadius: borderRadius.md,
35 | minHeight: "unset",
36 | padding: pxToRem(4),
37 | },
38 |
39 | flexContainer: {
40 | height: "100%",
41 | position: "relative",
42 | zIndex: 10,
43 | },
44 |
45 | fixed: {
46 | overflow: "unset !important",
47 | overflowX: "unset !important",
48 | },
49 |
50 | vertical: {
51 | "& .MuiTabs-indicator": {
52 | width: "100%",
53 | },
54 | },
55 |
56 | indicator: {
57 | height: "100%",
58 | borderRadius: borderRadius.lg,
59 | backgroundColor: info.main,
60 | transition: "all 500ms ease",
61 | },
62 | },
63 | };
64 |
--------------------------------------------------------------------------------
/src/assets/theme/components/tabs/tab.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | // Vision UI Dashboard React base styles
20 | import typography from "assets/theme/base/typography";
21 | import borders from "assets/theme/base/borders";
22 | import colors from "assets/theme/base/colors";
23 |
24 | // Vision UI Dashboard React helper functions
25 | import pxToRem from "assets/theme/functions/pxToRem";
26 |
27 | const { size, fontWeightRegular } = typography;
28 | const { borderRadius } = borders;
29 | const { white } = colors;
30 |
31 | export default {
32 | styleOverrides: {
33 | root: {
34 | display: "flex",
35 | alignItems: "center",
36 | flexDirection: "row",
37 | textAlign: "center",
38 | maxWidth: "unset !important",
39 | minWidth: "150px",
40 | minHeight: "35px",
41 | fontSize: size.xs,
42 | fontWeight: fontWeightRegular,
43 | textTransform: "none",
44 | lineHeight: "inherit",
45 | padding: `${pxToRem(10)} !important`,
46 | borderRadius: borderRadius.md,
47 | color: `${white.main} !important`,
48 | opacity: "1 !important",
49 |
50 | "& .material-icons, .material-icons-round": {
51 | marginBottom: "0 !important",
52 | marginRight: pxToRem(4),
53 | },
54 |
55 | "& svg": {
56 | marginBottom: "0 !important",
57 | color: `#fff !important`,
58 | marginRight: pxToRem(6),
59 | },
60 | },
61 |
62 | labelIcon: {
63 | paddingTop: pxToRem(4),
64 | },
65 | },
66 | };
67 |
--------------------------------------------------------------------------------
/src/assets/theme/components/tooltip.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | // @mui material components
20 | import Fade from "@mui/material/Fade";
21 |
22 | // Vision UI Dashboard React base styles
23 | import colors from "assets/theme/base/colors";
24 | import typography from "assets/theme/base/typography";
25 | import borders from "assets/theme/base/borders";
26 |
27 | // Vision UI Dashboard React helper functions
28 | import pxToRem from "assets/theme/functions/pxToRem";
29 |
30 | const { black, light } = colors;
31 | const { size, fontWeightRegular } = typography;
32 | const { borderRadius } = borders;
33 |
34 | export default {
35 | defaultProps: {
36 | arrow: true,
37 | TransitionComponent: Fade,
38 | },
39 |
40 | styleOverrides: {
41 | tooltip: {
42 | maxWidth: pxToRem(200),
43 | backgroundColor: black.main,
44 | color: light.main,
45 | fontSize: size.sm,
46 | fontWeight: fontWeightRegular,
47 | textAlign: "center",
48 | borderRadius: borderRadius.md,
49 | opacity: 0.7,
50 | padding: `${pxToRem(5)} ${pxToRem(8)} ${pxToRem(4)}`,
51 | },
52 |
53 | arrow: {
54 | color: black.main,
55 | },
56 | },
57 | };
58 |
--------------------------------------------------------------------------------
/src/assets/theme/functions/boxShadow.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | /**
20 | The boxShadow() function helps you to create a box shadow for an element
21 | */
22 |
23 | // Vision UI Dashboard React helper functions
24 | import rgba from "assets/theme/functions/rgba";
25 | import pxToRem from "assets/theme/functions/pxToRem";
26 |
27 | function boxShadow(offset = [], radius = [], color, opacity, inset = "") {
28 | const [x, y] = offset;
29 | const [blur, spread] = radius;
30 |
31 | return `${inset} ${pxToRem(x)} ${pxToRem(y)} ${pxToRem(blur)} ${pxToRem(spread)} ${rgba(
32 | color,
33 | opacity
34 | )}`;
35 | }
36 |
37 | export default boxShadow;
38 |
--------------------------------------------------------------------------------
/src/assets/theme/functions/gradientChartLine.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | /**
20 | The gradientChartLine() function helps you to create a gradient color for the chart line
21 | */
22 |
23 | // Vision UI Dashboard React helper functions
24 | import rgba from "assets/theme/functions/rgba";
25 |
26 | function gradientChartLine(chart, color, opacity = 0.2) {
27 | const ctx = chart.getContext("2d");
28 | const gradientStroke = ctx.createLinearGradient(0, 230, 0, 50);
29 | const primaryColor = rgba(color, opacity).toString();
30 |
31 | gradientStroke.addColorStop(1, primaryColor);
32 | gradientStroke.addColorStop(0.2, "rgba(72, 72, 176, 0.0)");
33 | gradientStroke.addColorStop(0, "rgba(203, 12, 159, 0)");
34 |
35 | return gradientStroke;
36 | }
37 |
38 | export default gradientChartLine;
39 |
--------------------------------------------------------------------------------
/src/assets/theme/functions/hexToRgb.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | /**
20 | The hexToRgb() function helps you to change the hex color code to rgb
21 | using chroma-js library.
22 | */
23 |
24 | // chroma-js is a library for all kinds of color conversions and color scales.
25 | import chroma from "chroma-js";
26 |
27 | function hexToRgb(color) {
28 | return chroma(color).rgb().join(", ");
29 | }
30 |
31 | export default hexToRgb;
32 |
--------------------------------------------------------------------------------
/src/assets/theme/functions/linearGradient.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | /**
20 | The linearGradient() function helps you to create a linear gradient color background
21 | */
22 |
23 | function linearGradient(color, colorState, angle) {
24 | if (angle === undefined) {
25 | angle = 310;
26 | }
27 | return `linear-gradient(${angle}deg, ${color}, ${colorState})`;
28 | }
29 |
30 | export default linearGradient;
31 |
--------------------------------------------------------------------------------
/src/assets/theme/functions/pxToRem.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | /**
20 | The pxToRem() function helps you to convert a px unit into a rem unit,
21 | */
22 |
23 | function pxToRem(number, baseNumber = 16) {
24 | return `${number / baseNumber}rem`;
25 | }
26 |
27 | export default pxToRem;
28 |
--------------------------------------------------------------------------------
/src/assets/theme/functions/radialGradient.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | /**
20 | The radialGradient() function helps you to create a radial gradient color background
21 | */
22 |
23 | function radialGradient(color, colorState, angle) {
24 | if (angle === undefined) {
25 | angle = "69.43% 69.43% at 50% 50%";
26 | }
27 | return `radial-gradient(${angle}, ${color}, ${colorState})`;
28 | }
29 |
30 | export default radialGradient;
31 |
--------------------------------------------------------------------------------
/src/assets/theme/functions/rgba.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | /**
20 | The rgba() function helps you to create a rgba color code, it uses the hexToRgb() function
21 | to convert the hex code into rgb for using it inside the rgba color format.
22 | */
23 |
24 | // Vision UI Dashboard React helper functions
25 | import hexToRgb from "assets/theme/functions/hexToRgb";
26 |
27 | function rgba(color, opacity) {
28 | return `rgba(${hexToRgb(color)}, ${opacity})`;
29 | }
30 |
31 | export default rgba;
32 |
--------------------------------------------------------------------------------
/src/assets/theme/functions/tripleLinearGradient.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | /**
20 | The linearGradient() function helps you to create a linear gradient color background
21 | */
22 |
23 | function tripleLinearGradient(color, colorState, colorStateSecondary, angle) {
24 | if (angle === undefined) {
25 | angle = 310;
26 | }
27 | return `linear-gradient(${angle}deg, ${color}, ${colorState}, ${colorStateSecondary})`;
28 | }
29 |
30 | export default tripleLinearGradient;
31 |
--------------------------------------------------------------------------------
/src/components/VuiAlert/VuiAlertCloseIcon.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | // @mui material components
20 | import { styled } from "@mui/material/styles";
21 |
22 | export default styled("span")(({ theme }) => {
23 | const { palette, typography, functions, transitions } = theme;
24 |
25 | const { white } = palette;
26 | const { size, fontWeightMedium } = typography;
27 | const { pxToRem } = functions;
28 |
29 | return {
30 | color: white.main,
31 | fontSize: size.xl,
32 | padding: `${pxToRem(9)} ${pxToRem(6)} ${pxToRem(8)}`,
33 | marginLeft: pxToRem(40),
34 | fontWeight: fontWeightMedium,
35 | opacity: 0.5,
36 | cursor: "pointer",
37 | lineHeight: 0,
38 | transition: transitions.create("opacity", {
39 | easing: transitions.easing.easeInOut,
40 | duration: transitions.duration.shorter,
41 | }),
42 |
43 | "&:hover": {
44 | opacity: 1,
45 | },
46 | };
47 | });
48 |
--------------------------------------------------------------------------------
/src/components/VuiAlert/VuiAlertRoot.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | // @mui material components
20 | import Box from "@mui/material/Box";
21 | import { styled } from "@mui/material/styles";
22 |
23 | export default styled(Box)(({ theme, ownerState }) => {
24 | const { palette, typography, borders, functions } = theme;
25 | const { color } = ownerState;
26 |
27 | const { white, alertColors } = palette;
28 | const { fontSizeRegular, fontWeightMedium } = typography;
29 | const { borderWidth, borderRadius } = borders;
30 | const { pxToRem, linearGradient } = functions;
31 |
32 | // backgroundImage value
33 | const backgroundImageValue = alertColors[color]
34 | ? linearGradient(alertColors[color].main, alertColors[color].state)
35 | : linearGradient(alertColors.info.main, alertColors.info.state);
36 |
37 | // border value
38 | const borderValue = alertColors[color]
39 | ? `${borderWidth[1]} solid ${alertColors[color].border}`
40 | : `${borderWidth[1]} solid ${alertColors.info.border}`;
41 |
42 | return {
43 | display: "flex",
44 | justifyContent: "space-between",
45 | alignItems: "center",
46 | minHeight: pxToRem(60),
47 | backgroundImage: backgroundImageValue,
48 | color: white.main,
49 | position: "relative",
50 | padding: pxToRem(16),
51 | marginBottom: pxToRem(16),
52 | border: borderValue,
53 | borderRadius: borderRadius.md,
54 | fontSize: fontSizeRegular,
55 | fontWeight: fontWeightMedium,
56 | };
57 | });
58 |
--------------------------------------------------------------------------------
/src/components/VuiAvatar/index.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | import { forwardRef } from "react";
20 |
21 | // prop-types is a library for typechecking of props
22 | import PropTypes from "prop-types";
23 |
24 | // Custom styles for VuiAvatar
25 | import VuiAvatarRoot from "components/VuiAvatar/VuiAvatarRoot";
26 |
27 | const VuiAvatar = forwardRef(({ bgColor, size, shadow, ...rest }, ref) => (
28 |
29 | ));
30 |
31 | // Setting default values for the props of VuiAvatar
32 | VuiAvatar.defaultProps = {
33 | bgColor: "transparent",
34 | size: "md",
35 | shadow: "none",
36 | };
37 |
38 | // Typechecking props for the VuiAvatar
39 | VuiAvatar.propTypes = {
40 | bgColor: PropTypes.oneOf([
41 | "transparent",
42 | "primary",
43 | "secondary",
44 | "info",
45 | "success",
46 | "warning",
47 | "error",
48 | "light",
49 | "dark",
50 | ]),
51 | size: PropTypes.oneOf(["xs", "sm", "md", "lg", "xl", "xxl"]),
52 | shadow: PropTypes.oneOf(["none", "xs", "sm", "md", "lg", "xl", "xxl", "inset"]),
53 | };
54 |
55 | export default VuiAvatar;
56 |
--------------------------------------------------------------------------------
/src/components/VuiBadge/index.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | import { forwardRef } from "react";
20 |
21 | // prop-types is a library for typechecking of props
22 | import PropTypes from "prop-types";
23 |
24 | // Custom styles for the VuiBadge
25 | import VuiBadgeRoot from "components/VuiBadge/VuiBadgeRoot";
26 |
27 | const VuiBadge = forwardRef(
28 | ({ color, variant, size, circular, indicator, border, container, children, ...rest }, ref) => (
29 |
35 | {children}
36 |
37 | )
38 | );
39 |
40 | // Setting default values for the props of VuiBadge
41 | VuiBadge.defaultProps = {
42 | color: "info",
43 | variant: "gradient",
44 | size: "sm",
45 | circular: false,
46 | indicator: false,
47 | border: false,
48 | children: false,
49 | container: false,
50 | };
51 |
52 | // Typechecking props of the VuiBadge
53 | VuiBadge.propTypes = {
54 | color: PropTypes.oneOf([
55 | "primary",
56 | "secondary",
57 | "info",
58 | "success",
59 | "warning",
60 | "error",
61 | "light",
62 | "dark",
63 | ]),
64 | variant: PropTypes.oneOf(["gradient", "contained", "standard"]),
65 | size: PropTypes.oneOf(["xs", "sm", "md", "lg"]),
66 | circular: PropTypes.bool,
67 | indicator: PropTypes.bool,
68 | border: PropTypes.bool,
69 | children: PropTypes.node,
70 | container: PropTypes.bool,
71 | };
72 |
73 | export default VuiBadge;
74 |
--------------------------------------------------------------------------------
/src/components/VuiBox/index.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | import { forwardRef } from "react";
20 |
21 | // prop-types is a library for typechecking of props
22 | import PropTypes from "prop-types";
23 |
24 | // Custom styles for VuiBox
25 | import VuiBoxRoot from "components/VuiBox/VuiBoxRoot";
26 |
27 | const VuiBox = forwardRef(
28 | ({ variant, bgColor, color, opacity, borderRadius, shadow, ...rest }, ref) => (
29 |
34 | )
35 | );
36 |
37 | // Setting default values for the props of VuiBox
38 | VuiBox.defaultProps = {
39 | variant: "contained",
40 | bgColor: "transparent",
41 | color: "dark",
42 | opacity: 1,
43 | borderRadius: "none",
44 | shadow: "none",
45 | };
46 |
47 | // Typechecking props for the VuiBox
48 | VuiBox.propTypes = {
49 | variant: PropTypes.oneOf(["contained", "gradient"]),
50 | bgColor: PropTypes.string,
51 | color: PropTypes.string,
52 | opacity: PropTypes.number,
53 | borderRadius: PropTypes.string,
54 | shadow: PropTypes.string,
55 | };
56 |
57 | export default VuiBox;
58 |
--------------------------------------------------------------------------------
/src/components/VuiButton/index.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | import { forwardRef } from "react";
20 |
21 | // prop-types is a library for typechecking of props
22 | import PropTypes from "prop-types";
23 |
24 | // Custom styles for VuiButton
25 | import VuiButtonRoot from "components/VuiButton/VuiButtonRoot";
26 |
27 | const VuiButton = forwardRef(
28 | ({ color, variant, size, circular, iconOnly, children, ...rest }, ref) => (
29 |
37 | {children}
38 |
39 | )
40 | );
41 |
42 | // Setting default values for the props of VuiButton
43 | VuiButton.defaultProps = {
44 | size: "medium",
45 | variant: "contained",
46 | color: "white",
47 | circular: false,
48 | iconOnly: false,
49 | };
50 |
51 | // Typechecking props for the VuiButton
52 | VuiButton.propTypes = {
53 | size: PropTypes.oneOf(["small", "medium", "large"]),
54 | variant: PropTypes.oneOf(["text", "contained", "outlined", "gradient"]),
55 | color: PropTypes.oneOf([
56 | "white",
57 | "primary",
58 | "secondary",
59 | "info",
60 | "success",
61 | "warning",
62 | "error",
63 | "light",
64 | "dark",
65 | "text",
66 | ]),
67 | circular: PropTypes.bool,
68 | iconOnly: PropTypes.bool,
69 | children: PropTypes.node.isRequired,
70 | };
71 |
72 | export default VuiButton;
73 |
--------------------------------------------------------------------------------
/src/components/VuiInput/VuiInputIconBoxRoot.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | import { styled } from "@mui/material/styles";
20 |
21 | export default styled("div")(({ theme, ownerState }) => {
22 | const { palette, functions } = theme;
23 | const { size } = ownerState;
24 |
25 | const { dark } = palette;
26 | const { pxToRem } = functions;
27 |
28 | return {
29 | lineHeight: 0,
30 | padding: size === "small" ? `${pxToRem(4)} ${pxToRem(10)}` : `${pxToRem(8)} ${pxToRem(10)}`,
31 | width: pxToRem(39),
32 | height: "100%",
33 | color: dark.main,
34 | };
35 | });
36 |
--------------------------------------------------------------------------------
/src/components/VuiInput/VuiInputIconRoot.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | import Icon from "@mui/material/Icon";
20 | import { styled } from "@mui/material/styles";
21 |
22 | export default styled(Icon)(({ theme, ownerState }) => {
23 | const { typography } = theme;
24 | const { size } = ownerState;
25 |
26 | const { fontWeightBold, size: fontSize } = typography;
27 |
28 | return {
29 | fontWeight: fontWeightBold,
30 | fontSize: size === "small" && `${fontSize.md} !important`,
31 | };
32 | });
33 |
--------------------------------------------------------------------------------
/src/components/VuiInput/VuiInputWithIconRoot.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | import { styled } from "@mui/material/styles";
20 |
21 | export default styled("div")(({ theme, ownerState }) => {
22 | const { palette, functions, borders } = theme;
23 | const { error, success, disabled } = ownerState;
24 |
25 | const { inputColors, grey, white } = palette;
26 | const { pxToRem } = functions;
27 | const { borderRadius, borderWidth } = borders;
28 |
29 | // border color value
30 | let borderColorValue = inputColors.borderColor.main;
31 |
32 | if (error) {
33 | borderColorValue = inputColors.error;
34 | } else if (success) {
35 | borderColorValue = inputColors.success;
36 | }
37 |
38 | return {
39 | display: "flex",
40 | alignItems: "center",
41 | backgroundColor: disabled ? grey[600] : inputColors.backgroundColor,
42 | border: `${borderWidth[1]} solid`,
43 | borderRadius: borderRadius.lg,
44 | borderColor: borderColorValue,
45 | "& .MuiIcon-root": {
46 | color: grey[500],
47 | },
48 |
49 | "& .MuiInputBase-input": {
50 | color: white.main,
51 | height: "100%",
52 | paddingX: pxToRem(20),
53 | backgroundColor: disabled ? grey[600] : inputColors.backgroundColor,
54 | },
55 | "& .MuiInputBase-root": {
56 | border: `unset`,
57 | borderRadius: borderRadius.lg,
58 | borderTopLeftRadius: "0px",
59 | borderBottomLeftRadius: "0px",
60 | backgroundColor: `${disabled ? grey[600] : inputColors.backgroundColor} !important`,
61 | "& ::placeholder": {
62 | color: `${white.main} !important`,
63 | },
64 | },
65 | };
66 | });
67 |
--------------------------------------------------------------------------------
/src/components/VuiPagination/VuiPaginationItemRoot.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | // @mui material components
20 | import { styled } from "@mui/material/styles";
21 |
22 | // Vision UI Dashboard React components
23 | import VuiButton from "components/VuiButton";
24 |
25 | export default styled(VuiButton)(({ theme, ownerState }) => {
26 | const { borders, functions, typography, palette } = theme;
27 | const { variant, paginationSize, active } = ownerState;
28 |
29 | const { borderColor } = borders;
30 | const { pxToRem } = functions;
31 | const { fontWeightRegular, size: fontSize } = typography;
32 | const { light } = palette;
33 |
34 | // width, height, minWidth and minHeight values
35 | let sizeValue = pxToRem(36);
36 |
37 | if (paginationSize === "small") {
38 | sizeValue = pxToRem(30);
39 | } else if (paginationSize === "large") {
40 | sizeValue = pxToRem(46);
41 | }
42 |
43 | return {
44 | borderColor,
45 | margin: `0 ${pxToRem(2)}`,
46 | pointerEvents: active ? "none" : "auto",
47 | fontWeight: fontWeightRegular,
48 | fontSize: fontSize.sm,
49 | width: sizeValue,
50 | minWidth: sizeValue,
51 | height: sizeValue,
52 | minHeight: sizeValue,
53 |
54 | "&:hover, &:focus, &:active": {
55 | transform: "none",
56 | boxShadow: (variant !== "gradient" || variant !== "contained") && "none !important",
57 | opacity: "1 !important",
58 | },
59 |
60 | "&:hover": {
61 | backgroundColor: light.main,
62 | borderColor,
63 | },
64 | };
65 | });
66 |
--------------------------------------------------------------------------------
/src/components/VuiProgress/VuiProgressRoot.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | // @mui material components
20 | import { styled } from "@mui/material/styles";
21 | import LinearProgress from "@mui/material/LinearProgress";
22 |
23 | export default styled(LinearProgress)(({ theme, ownerState }) => {
24 | const { palette, functions } = theme;
25 | const { color, value, variant } = ownerState;
26 |
27 | const { text, gradients } = palette;
28 | const { linearGradient } = functions;
29 |
30 | // background value
31 | let backgroundValue;
32 |
33 | if (variant === "gradient") {
34 | backgroundValue = gradients[color]
35 | ? linearGradient(gradients[color].main, gradients[color].state)
36 | : linearGradient(gradients.info.main, gradients.info.state);
37 | } else {
38 | backgroundValue = palette[color] ? palette[color].main : palette.info.main;
39 | }
40 |
41 | return {
42 | "& .MuiLinearProgress-bar": {
43 | background: backgroundValue,
44 | width: `${value}%`,
45 | color: text.main,
46 | },
47 | };
48 | });
49 |
--------------------------------------------------------------------------------
/src/components/VuiProgress/index.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | import { forwardRef } from "react";
20 |
21 | // prop-types is a library for typechecking of props
22 | import PropTypes from "prop-types";
23 |
24 | // Vision UI Dashboard React components
25 | import VuiTypography from "components/VuiTypography";
26 |
27 | // Custom styles for VuiProgress
28 | import VuiProgressRoot from "components/VuiProgress/VuiProgressRoot";
29 |
30 | const VuiProgress = forwardRef(({ variant, color, value, label, ...rest }, ref) => (
31 | <>
32 | {label && (
33 |
34 | {value}%
35 |
36 | )}
37 |
44 | >
45 | ));
46 |
47 | // Setting default values for the props of VuiProgress
48 | VuiProgress.defaultProps = {
49 | variant: "contained",
50 | color: "info",
51 | value: 0,
52 | label: false,
53 | };
54 |
55 | // Typechecking props for the VuiProgress
56 | VuiProgress.propTypes = {
57 | variant: PropTypes.oneOf(["contained", "gradient"]),
58 | color: PropTypes.oneOf([
59 | "primary",
60 | "secondary",
61 | "info",
62 | "success",
63 | "warning",
64 | "error",
65 | "light",
66 | "dark",
67 | ]),
68 | value: PropTypes.number,
69 | label: PropTypes.bool,
70 | };
71 |
72 | export default VuiProgress;
73 |
--------------------------------------------------------------------------------
/src/components/VuiSwitch/VuiSwitchRoot.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | // @mui material components
20 | import Switch from "@mui/material/Switch";
21 | import { styled } from "@mui/material/styles";
22 |
23 | export default styled(Switch)(({ theme, ownerState }) => {
24 | const { palette } = theme;
25 | const { color } = ownerState;
26 | const { white, secondary } = palette;
27 |
28 | // styles for the button with variant="contained"
29 | const containedStyles = () => {
30 | // background color value
31 | const backgroundValue = palette[color] ? palette[color].main : white.main;
32 |
33 | // color value when button is focused
34 |
35 | return {
36 | "&.MuiSwitch-root": {
37 | "& .MuiSwitch-thumb": {
38 | backgroundColor: white.main,
39 | },
40 | "& .MuiSwitch-track": {
41 | backgroundColor: `${secondary.main} !important`,
42 | borderColor: "transparent",
43 | },
44 | "& .Mui-checked+.MuiSwitch-track": {
45 | backgroundColor: `${backgroundValue} !important`,
46 | },
47 | },
48 | };
49 | };
50 |
51 | return {
52 | ...containedStyles(),
53 | };
54 | });
55 |
--------------------------------------------------------------------------------
/src/components/VuiSwitch/index.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | import { forwardRef } from "react";
20 |
21 | // prop-types is a library for typechecking of props
22 | import PropTypes from "prop-types";
23 |
24 | // Custom styles for VuiSwitch
25 | import VuiSwitchRoot from "components/VuiSwitch/VuiSwitchRoot";
26 |
27 | const VuiSwitch = forwardRef(({ color, size, ...rest }, ref) => (
28 |
29 | ));
30 |
31 | // Setting default values for the props of VuiSwitch
32 | VuiSwitch.defaultProps = {
33 | size: "medium",
34 | color: "white",
35 | };
36 |
37 | // Typechecking props for the VuiSwitch
38 | VuiSwitch.propTypes = {
39 | size: PropTypes.oneOf(["small", "medium", "large"]),
40 | color: PropTypes.oneOf([
41 | "white",
42 | "primary",
43 | "secondary",
44 | "info",
45 | "success",
46 | "warning",
47 | "error",
48 | "light",
49 | "dark",
50 | ]),
51 | };
52 |
53 | export default VuiSwitch;
54 |
--------------------------------------------------------------------------------
/src/components/VuiTypography/VuiTypographyRoot.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | // @mui material components
20 | import Typography from "@mui/material/Typography";
21 | import { styled } from "@mui/material/styles";
22 |
23 | export default styled(Typography)(({ theme, ownerState }) => {
24 | const { palette, typography, functions } = theme;
25 | const { color, textTransform, verticalAlign, fontWeight, opacity, textGradient } = ownerState;
26 |
27 | const { gradients, transparent } = palette;
28 | const { fontWeightLight, fontWeightRegular, fontWeightMedium, fontWeightBold } = typography;
29 | const { linearGradient } = functions;
30 |
31 | // fontWeight styles
32 | const fontWeights = {
33 | light: fontWeightLight,
34 | regular: fontWeightRegular,
35 | medium: fontWeightMedium,
36 | bold: fontWeightBold,
37 | };
38 |
39 | // styles for the typography with textGradient={true}
40 | const gradientStyles = () => ({
41 | backgroundImage:
42 | color !== "inherit" && color !== "text" && color !== "white" && gradients[color]
43 | ? linearGradient(gradients[color].main, gradients[color].state, gradients[color].deg)
44 | : linearGradient(gradients.primary.main, gradients.primary.state),
45 | display: "inline-block",
46 | WebkitBackgroundClip: "text",
47 | WebkitTextFillColor: transparent.main,
48 | position: "relative",
49 | zIndex: 1,
50 | });
51 |
52 | return {
53 | opacity,
54 | textTransform,
55 | verticalAlign,
56 | textDecoration: "none",
57 | color: color === "inherit" || !palette[color] ? "inherit" : palette[color].main,
58 | fontWeight: fontWeights[fontWeight] && fontWeights[fontWeight],
59 | ...(textGradient && gradientStyles()),
60 | };
61 | });
62 |
--------------------------------------------------------------------------------
/src/examples/Charts/BarCharts/BarChart.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | import React, { Component } from "react";
20 | import Chart from "react-apexcharts";
21 |
22 | class BarChart extends Component {
23 | constructor(props) {
24 | super(props);
25 | this.state = {
26 | chartData: [],
27 | chartOptions: {},
28 | };
29 | }
30 |
31 | componentDidMount() {
32 | const { barChartData, barChartOptions } = this.props;
33 |
34 | this.setState({
35 | chartData: barChartData,
36 | chartOptions: barChartOptions,
37 | });
38 | }
39 |
40 | render() {
41 | return (
42 |
49 | );
50 | }
51 | }
52 |
53 | export default BarChart;
54 |
--------------------------------------------------------------------------------
/src/examples/Charts/LineCharts/LineChart.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | import React from "react";
20 | import ReactApexChart from "react-apexcharts";
21 |
22 | class LineChart extends React.Component {
23 | constructor(props) {
24 | super(props);
25 |
26 | this.state = {
27 | chartData: [],
28 | chartOptions: {},
29 | };
30 | }
31 |
32 | componentDidMount() {
33 | const { lineChartData, lineChartOptions } = this.props;
34 |
35 | this.setState({
36 | chartData: lineChartData,
37 | chartOptions: lineChartOptions,
38 | });
39 | }
40 |
41 | render() {
42 | return (
43 |
50 | );
51 | }
52 | }
53 |
54 | export default LineChart;
55 |
--------------------------------------------------------------------------------
/src/examples/Configurator/ConfiguratorRoot.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | // @mui material components
20 | import Drawer from "@mui/material/Drawer";
21 | import { styled } from "@mui/material/styles";
22 |
23 | export default styled(Drawer)(({ theme, ownerState }) => {
24 | const { boxShadows, functions, transitions, palette } = theme;
25 | const { openConfigurator } = ownerState;
26 |
27 | const { gradients } = palette;
28 | const configuratorWidth = 360;
29 | const { lg } = boxShadows;
30 | const { pxToRem, linearGradient } = functions;
31 |
32 | // drawer styles when openConfigurator={true}
33 | const drawerOpenStyles = () => ({
34 | width: configuratorWidth,
35 | left: "initial",
36 | right: 0,
37 | transition: transitions.create("right", {
38 | easing: transitions.easing.sharp,
39 | duration: transitions.duration.short,
40 | }),
41 | });
42 |
43 | // drawer styles when openConfigurator={false}
44 | const drawerCloseStyles = () => ({
45 | left: "initial",
46 | right: pxToRem(-350),
47 | transition: transitions.create("all", {
48 | easing: transitions.easing.sharp,
49 | duration: transitions.duration.short,
50 | }),
51 | });
52 |
53 | return {
54 | "& .MuiDrawer-paper": {
55 | backdropFilter: `blur(${pxToRem(42)})`,
56 | background: linearGradient(
57 | gradients.sidenav.main,
58 | gradients.sidenav.state,
59 | gradients.sidenav.deg
60 | ),
61 |
62 | height: "100vh",
63 | margin: 0,
64 | padding: `0 ${pxToRem(10)}`,
65 | borderRadius: 0,
66 | boxShadow: lg,
67 | overflowY: "auto",
68 | ...(openConfigurator ? drawerOpenStyles() : drawerCloseStyles()),
69 | },
70 | };
71 | });
72 |
--------------------------------------------------------------------------------
/src/examples/GradientBorder/GradientBorderRoot.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | // @mui material components
20 | import Box from "@mui/material/Box";
21 | import { styled } from "@mui/material/styles";
22 |
23 | export default styled(Box)(() => {
24 | return {
25 | width: "fit-content",
26 | height: "fit-content",
27 | backgroundImage:
28 | "radial-gradient(69.43% 69.43% at 50% 50%, #FFFFFF 0%, rgba(255, 255, 255, 0) 100%) ",
29 | };
30 | });
31 |
--------------------------------------------------------------------------------
/src/examples/GradientBorder/index.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | // Vision UI Dashboard React components
20 | import VuiBox from "components/VuiBox";
21 |
22 | // Vision UI Dashboard React context
23 |
24 | function GradientBorder(props) {
25 | const { backgroundImage, children, borderRadius, width, minWidth, ...rest } = props;
26 | return (
27 |
41 | {children}
42 |
43 | );
44 | }
45 |
46 | export default GradientBorder;
47 |
--------------------------------------------------------------------------------
/src/examples/Icons/Cart.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | // prop-types is a library for typechecking of props
20 | import PropTypes from "prop-types";
21 |
22 | // Vision UI Dashboard React base styles
23 | import colors from "assets/theme/base/colors";
24 |
25 | function Cart({ color, size }) {
26 | return (
27 |
33 | );
34 | }
35 |
36 | // Setting default values for the props of Cart
37 | Cart.defaultProps = {
38 | color: "dark",
39 | size: "16px",
40 | };
41 |
42 | // Typechecking props for the Cart
43 | Cart.propTypes = {
44 | color: PropTypes.oneOf([
45 | "primary",
46 | "secondary",
47 | "info",
48 | "success",
49 | "warning",
50 | "error",
51 | "dark",
52 | "light",
53 | "white",
54 | ]),
55 | size: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
56 | };
57 |
58 | export default Cart;
59 |
--------------------------------------------------------------------------------
/src/examples/Icons/Credit.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | // prop-types is a library for typechecking of props
20 | import PropTypes from "prop-types";
21 |
22 | // Vision UI Dashboard React base styles
23 | import colors from "assets/theme/base/colors";
24 |
25 | function Credit({ color, size }) {
26 | return (
27 |
33 | );
34 | }
35 |
36 | // Setting default values for the props of Credit
37 | Credit.defaultProps = {
38 | color: "dark",
39 | size: "16px",
40 | };
41 |
42 | // Typechecking props for the Credit
43 | Credit.propTypes = {
44 | color: PropTypes.oneOf([
45 | "primary",
46 | "secondary",
47 | "info",
48 | "success",
49 | "warning",
50 | "error",
51 | "dark",
52 | "light",
53 | "white",
54 | ]),
55 | size: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
56 | };
57 |
58 | export default Credit;
59 |
--------------------------------------------------------------------------------
/src/examples/Icons/Document.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | // prop-types is a library for typechecking of props
20 | import PropTypes from "prop-types";
21 |
22 | // Vision UI Dashboard React base styles
23 | import colors from "assets/theme/base/colors";
24 | function Document({ color, size }) {
25 | return (
26 |
42 | );
43 | }
44 |
45 | // Setting default values for the props of Document
46 | Document.defaultProps = {
47 | color: "dark",
48 | size: "16px",
49 | };
50 |
51 | // Typechecking props for the Document
52 | Document.propTypes = {
53 | color: PropTypes.oneOf([
54 | "primary",
55 | "secondary",
56 | "info",
57 | "success",
58 | "warning",
59 | "error",
60 | "dark",
61 | "light",
62 | "white",
63 | ]),
64 | size: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
65 | };
66 |
67 | export default Document;
68 |
--------------------------------------------------------------------------------
/src/examples/Icons/DocumentV.js:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/src/examples/Icons/Mastercard.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | // prop-types is a library for typechecking of props
20 | import PropTypes from "prop-types";
21 |
22 | function Mastercard({ width, height }) {
23 | return (
24 |
34 | );
35 | }
36 |
37 | // Setting default values for the props of Mastercard
38 | Mastercard.defaultProps = {
39 | color: "dark",
40 | size: "16px",
41 | };
42 |
43 | // Typechecking props for the Mastercard
44 | Mastercard.propTypes = {
45 | size: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
46 | };
47 |
48 | export default Mastercard;
49 |
--------------------------------------------------------------------------------
/src/examples/Items/NotificationItem/styles.js:
--------------------------------------------------------------------------------
1 | function menuItem(theme) {
2 | const { palette, borders, transitions } = theme;
3 |
4 | const { text, light } = palette;
5 | const { borderRadius } = borders;
6 |
7 | return {
8 | display: "flex",
9 | alignItems: "center",
10 | width: "100%",
11 | color: text.main,
12 | py: 1,
13 | px: 2,
14 | borderRadius: borderRadius.md,
15 | transition: transitions.create("background-color", {
16 | easing: transitions.easing.easeInOut,
17 | duration: transitions.duration.standard,
18 | }),
19 |
20 | "&:not(:last-child)": {
21 | mb: 1.25,
22 | },
23 |
24 | "&:hover": {
25 | backgroundColor: light.main,
26 | },
27 | };
28 | }
29 |
30 | function menuImage(theme, ownerState) {
31 | const { functions, palette, borders } = theme;
32 | const { color } = ownerState;
33 |
34 | const { linearGradient } = functions;
35 | const { gradients } = palette;
36 | const { borderRadius } = borders;
37 |
38 | return {
39 | display: "grid",
40 | placeItems: "center",
41 | backgroundImage: gradients[color]
42 | ? linearGradient(gradients[color].main, gradients[color].state)
43 | : linearGradient(gradients.dark.main, gradients.dark.state),
44 |
45 | "& img": {
46 | width: "100%",
47 | borderRadius: borderRadius.lg,
48 | },
49 | };
50 | }
51 |
52 | export { menuItem, menuImage };
53 |
--------------------------------------------------------------------------------
/src/examples/LayoutContainers/DashboardLayout/index.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | import { useEffect } from "react";
20 |
21 | // react-router-dom components
22 | import { useLocation } from "react-router-dom";
23 |
24 | // prop-types is a library for typechecking of props.
25 | import PropTypes from "prop-types";
26 |
27 | // Vision UI Dashboard React components
28 | import VuiBox from "components/VuiBox";
29 |
30 | // Vision UI Dashboard React context
31 | import { useVisionUIController, setLayout } from "context";
32 |
33 | function DashboardLayout({ children }) {
34 | const [controller, dispatch] = useVisionUIController();
35 | const { miniSidenav } = controller;
36 | const { pathname } = useLocation();
37 |
38 | useEffect(() => {
39 | setLayout(dispatch, "dashboard");
40 | }, [pathname]);
41 |
42 | return (
43 | ({
45 | p: 3,
46 | position: "relative",
47 |
48 | [breakpoints.up("xl")]: {
49 | marginLeft: miniSidenav ? pxToRem(120) : pxToRem(274),
50 | transition: transitions.create(["margin-left", "margin-right"], {
51 | easing: transitions.easing.easeInOut,
52 | duration: transitions.duration.standard,
53 | }),
54 | },
55 | })}
56 | >
57 | {children}
58 |
59 | );
60 | }
61 |
62 | // Typechecking props for the DashboardLayout
63 | DashboardLayout.propTypes = {
64 | children: PropTypes.node.isRequired,
65 | };
66 |
67 | export default DashboardLayout;
68 |
--------------------------------------------------------------------------------
/src/examples/LayoutContainers/PageLayout/index.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | import { useEffect } from "react";
20 |
21 | // react-router-dom components
22 | import { useLocation } from "react-router-dom";
23 |
24 | // prop-types is a library for typechecking of props.
25 | import PropTypes from "prop-types";
26 |
27 | // Vision UI Dashboard React components
28 | import VuiBox from "components/VuiBox";
29 |
30 | // Vision UI Dashboard React context
31 | import { useVisionUIController, setLayout } from "context";
32 |
33 | function PageLayout({ children }) {
34 | const [, dispatch] = useVisionUIController();
35 | const { pathname } = useLocation();
36 |
37 | useEffect(() => {
38 | setLayout(dispatch, "page");
39 | }, [pathname]);
40 |
41 | return (
42 | ({
48 | overflowX: "hidden",
49 | backgroundImage: tripleLinearGradient(
50 | gradients.cover.main,
51 | gradients.cover.state,
52 | gradients.cover.stateSecondary,
53 | gradients.cover.deg
54 | ),
55 | position: "relative",
56 | })}
57 | >
58 | {children}
59 |
60 | );
61 | }
62 |
63 | // Setting default values for the props for PageLayout
64 | PageLayout.defaultProps = {
65 | background: "default",
66 | };
67 |
68 | // Typechecking props for the PageLayout
69 | PageLayout.propTypes = {
70 | children: PropTypes.node.isRequired,
71 | };
72 |
73 | export default PageLayout;
74 |
--------------------------------------------------------------------------------
/src/examples/Navbars/DefaultNavbar/DefaultNavbarLink.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | // react-router-dom components
20 | import { Link } from "react-router-dom";
21 |
22 | // prop-types is a library for typechecking of props
23 | import PropTypes from "prop-types";
24 |
25 | // @mui material components
26 | import Icon from "@mui/material/Icon";
27 |
28 | // Vision UI Dashboard React components
29 | import VuiBox from "components/VuiBox";
30 | import VuiTypography from "components/VuiTypography";
31 |
32 | function DefaultNavbarLink({ icon, name, route }) {
33 | return (
34 | <>
35 |
44 | white.main,
47 | verticalAlign: "middle",
48 | }}
49 | >
50 | {icon}
51 |
52 |
59 | {name}
60 |
61 |
62 | >
63 | );
64 | }
65 |
66 | // Typechecking props for the DefaultNavbarLink
67 | DefaultNavbarLink.propTypes = {
68 | icon: PropTypes.string.isRequired,
69 | name: PropTypes.string.isRequired,
70 | route: PropTypes.string.isRequired,
71 | };
72 |
73 | export default DefaultNavbarLink;
74 |
--------------------------------------------------------------------------------
/src/examples/Sidenav/styles/sidenav.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | export default function sidenavLogoLabel(theme, ownerState) {
20 | const { functions, transitions, typography, breakpoints } = theme;
21 | const { transparentSidenav } = ownerState;
22 |
23 | const { pxToRem } = functions;
24 | const { fontWeightMedium } = typography;
25 |
26 | return {
27 | ml: 0.5,
28 | fontWeight: fontWeightMedium,
29 | wordSpacing: pxToRem(-1),
30 | transition: transitions.create("opacity", {
31 | easing: transitions.easing.easeInOut,
32 | duration: transitions.duration.standard,
33 | }),
34 |
35 | [breakpoints.up("xl")]: {
36 | opacity: transparentSidenav ? 0 : 1,
37 | },
38 | };
39 | }
40 |
--------------------------------------------------------------------------------
/src/examples/Sidenav/styles/sidenavCard.js:
--------------------------------------------------------------------------------
1 | // Images
2 | import backgroundImage from "assets/images/sidenav/sidenav-card-background.png";
3 |
4 | function card(theme, ownerState) {
5 | const { borders, functions, transitions, breakpoints } = theme;
6 | const { miniSidenav } = ownerState;
7 |
8 | const { borderRadius } = borders;
9 | const { pxToRem } = functions;
10 |
11 | return {
12 | minWidth: "auto",
13 | backgroundImage: `url(${backgroundImage})`,
14 | backgroundPosition: "50%",
15 | backgroundSize: "cover",
16 | borderRadius: borderRadius.xl,
17 | boxShadow: "none",
18 |
19 | [breakpoints.up("xl")]: {
20 | maxHeight: miniSidenav ? pxToRem(64) : pxToRem(192),
21 | transition: transitions.create("max-height", {
22 | easing: transitions.easing.easeInOut,
23 | duration: transitions.duration.standard,
24 | }),
25 | },
26 | padding: "0px",
27 | };
28 | }
29 |
30 | function cardContent(theme) {
31 | const { palette, borders } = theme;
32 |
33 | const { white, dark } = palette;
34 | const { borderRadius } = borders;
35 |
36 | return {
37 | color: white,
38 | position: "relative",
39 | zIndex: 2,
40 | width: "100%",
41 | height: "100%",
42 | p: 2,
43 |
44 | "&::after": {
45 | content: '""',
46 | display: "block",
47 | height: "100%",
48 | width: "100%",
49 | borderRadius: borderRadius.xl,
50 | position: "absolute",
51 | top: 0,
52 | left: 0,
53 | opacity: 0.65,
54 | zIndex: -1,
55 | },
56 |
57 | "& .MuiButton-root": {
58 | color: dark.main,
59 | },
60 |
61 | "&:last-child": {
62 | pb: 2,
63 | },
64 | };
65 | }
66 |
67 | const cardIconBox = {
68 | display: "grid",
69 | placeItems: "center",
70 | transition: ({ transitions }) =>
71 | transitions.create("margin", {
72 | easing: transitions.easing.easeInOut,
73 | duration: transitions.duration.standard,
74 | }),
75 | };
76 |
77 | function cardIcon(theme, ownerState) {
78 | const { palette } = theme;
79 | const { color } = ownerState;
80 |
81 | return {
82 | WebkitTextFillColor: palette[color].main,
83 | };
84 | }
85 |
86 | export { card, cardContent, cardIconBox, cardIcon };
87 |
--------------------------------------------------------------------------------
/src/examples/Timeline/TimelineItem/styles.js:
--------------------------------------------------------------------------------
1 | function timelineItem(theme, ownerState) {
2 | const { borders } = theme;
3 | const { lastItem } = ownerState;
4 |
5 | const { borderWidth, borderColor } = borders;
6 |
7 | return {
8 | "&:after": {
9 | content: "''",
10 | position: "absolute",
11 | top: "10%",
12 | left: "14px",
13 | height: lastItem ? "90%" : "100%",
14 | borderRight: `${borderWidth[2]} solid ${borderColor}`,
15 | },
16 | };
17 | }
18 |
19 | function timelineItemIcon(theme, ownerState) {
20 | const { palette, typography, functions } = theme;
21 | const { color } = ownerState;
22 |
23 | const { gradients, transparent } = palette;
24 | const { size, fontWeightMedium } = typography;
25 | const { linearGradient } = functions;
26 |
27 | return {
28 | position: "absolute",
29 | top: "50%",
30 | left: "50%",
31 | transform: "translate(-52%, -50%)",
32 | fontSize: size.xl,
33 | fontWeight: fontWeightMedium,
34 | zIndex: 1,
35 | backgroundImage: linearGradient(gradients[color].main, gradients[color].state),
36 | WebkitBackgroundClip: "text",
37 | WebkitTextFillColor: transparent.main,
38 | };
39 | }
40 |
41 | export { timelineItem, timelineItemIcon };
42 |
--------------------------------------------------------------------------------
/src/examples/Timeline/TimelineList/index.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | // prop-types is a library for typechecking of props
20 | import PropTypes from "prop-types";
21 |
22 | // @mui material components
23 | import Card from "@mui/material/Card";
24 |
25 | // Vision UI Dashboard React components
26 | import VuiBox from "components/VuiBox";
27 | import VuiTypography from "components/VuiTypography";
28 |
29 | // Timeline context
30 | import { TimelineProvider } from "examples/Timeline/context";
31 |
32 | function TimelineList({ title, dark, children }) {
33 | return (
34 |
35 |
36 |
37 |
38 |
39 | {title}
40 |
41 |
42 | {children}
43 |
44 |
45 |
46 | );
47 | }
48 |
49 | // Setting default values for the props of TimelineList
50 | TimelineList.defaultProps = {
51 | dark: false,
52 | };
53 |
54 | // Typechecking props for the TimelineList
55 | TimelineList.propTypes = {
56 | title: PropTypes.string.isRequired,
57 | dark: PropTypes.bool,
58 | children: PropTypes.node.isRequired,
59 | };
60 |
61 | export default TimelineList;
62 |
--------------------------------------------------------------------------------
/src/examples/Timeline/context/index.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | /* eslint-disable react/prop-types */
20 | /**
21 | This file is used for controlling the dark and light state of the TimelineList and TimelineItem.
22 | */
23 |
24 | import { createContext, useContext } from "react";
25 |
26 | // The Timeline main context
27 | const Timeline = createContext();
28 |
29 | // Timeline context provider
30 | function TimelineProvider({ children, value }) {
31 | return {children};
32 | }
33 |
34 | // Timeline custom hook for using context
35 | function useTimeline() {
36 | return useContext(Timeline);
37 | }
38 |
39 | export { TimelineProvider, useTimeline };
40 | /* eslint-enable react/prop-types */
41 |
--------------------------------------------------------------------------------
/src/index.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the software.
16 |
17 | */
18 |
19 | import React from "react";
20 | import { createRoot} from "react-dom/client";
21 | import { BrowserRouter } from "react-router-dom";
22 | import App from "App";
23 |
24 | // Vision UI Dashboard React Context Provider
25 | import { VisionUIControllerProvider } from "context";
26 |
27 | const rootElement = document.getElementById('root');
28 | const root = createRoot(rootElement);
29 |
30 |
31 | root.render(
32 |
33 |
34 |
35 | )
36 |
37 |
--------------------------------------------------------------------------------
/src/layouts/authentication/components/Separator/index.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | // @mui material components
20 | import Divider from "@mui/material/Divider";
21 |
22 | // Vision UI Dashboard React components
23 | import VuiBox from "components/VuiBox";
24 | import VuiTypography from "components/VuiTypography";
25 |
26 | function Separator() {
27 | return (
28 |
29 |
30 |
39 |
40 | or
41 |
42 |
43 |
44 | );
45 | }
46 |
47 | export default Separator;
48 |
--------------------------------------------------------------------------------
/src/layouts/billing/components/BillingInformation/index.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | // @mui material components
20 | import Card from "@mui/material/Card";
21 |
22 | // Vision UI Dashboard React components
23 | import VuiBox from "components/VuiBox";
24 | import VuiTypography from "components/VuiTypography";
25 |
26 | // Billing page components
27 | import Bill from "layouts/billing/components/Bill";
28 |
29 | function BillingInformation() {
30 | return (
31 |
32 |
33 |
34 | Billing Information
35 |
36 |
37 |
38 |
39 |
45 |
51 |
58 |
59 |
60 |
61 | );
62 | }
63 |
64 | export default BillingInformation;
65 |
--------------------------------------------------------------------------------
/src/layouts/billing/components/Invoice/index.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | // prop-types is a library for typechecking of props
20 | import PropTypes from "prop-types";
21 |
22 | // Vision UI Dashboard React components
23 | import VuiBox from "components/VuiBox";
24 | import VuiTypography from "components/VuiTypography";
25 | import { IoDocumentText } from "react-icons/io5";
26 |
27 | function Invoice({ date, id, price }) {
28 | return (
29 |
36 |
37 |
38 | {date}
39 |
40 |
41 | {id}
42 |
43 |
44 |
45 |
46 | {price}
47 |
48 |
49 |
50 |
51 | PDF
52 |
53 |
54 |
55 |
56 | );
57 | }
58 |
59 | // Setting default values for the props of Invoice
60 | Invoice.defaultProps = {
61 | noGutter: false,
62 | };
63 |
64 | // Typechecking props for the Invoice
65 | Invoice.propTypes = {
66 | date: PropTypes.string.isRequired,
67 | id: PropTypes.string.isRequired,
68 | price: PropTypes.string.isRequired,
69 | noGutter: PropTypes.bool,
70 | };
71 |
72 | export default Invoice;
73 |
--------------------------------------------------------------------------------
/src/layouts/billing/components/Invoices/index.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | // @mui material components
20 | import Card from "@mui/material/Card";
21 |
22 | // Vision UI Dashboard React components
23 | import VuiBox from "components/VuiBox";
24 | import VuiTypography from "components/VuiTypography";
25 | import VuiButton from "components/VuiButton";
26 |
27 | // Billing page components
28 | import Invoice from "layouts/billing/components/Invoice";
29 |
30 | function Invoices() {
31 | return (
32 |
33 |
34 |
35 | Invoices
36 |
37 |
38 | VIEW ALL
39 |
40 |
41 |
42 |
43 |
44 |
45 |
46 |
47 |
48 |
49 |
50 |
51 | );
52 | }
53 |
54 | export default Invoices;
55 |
--------------------------------------------------------------------------------
/src/layouts/dashboard/components/WelcomeMark/index.js:
--------------------------------------------------------------------------------
1 | import React from "react";
2 |
3 | import { Card, Icon } from "@mui/material";
4 | import VuiBox from "components/VuiBox";
5 | import VuiTypography from "components/VuiTypography";
6 |
7 | import gif from "assets/images/cardimgfree.png";
8 |
9 | const WelcomeMark = () => {
10 | return (
11 | ({
12 | height: "340px",
13 | py: "32px",
14 | backgroundImage: `url(${gif})`,
15 | backgroundSize: "cover",
16 | backgroundPosition: "50%"
17 | })}>
18 |
19 |
20 |
21 | Welcome back,
22 |
23 |
24 | Mark Johnson
25 |
26 |
27 | Glad to see you again!
28 |
Ask me anything.
29 |
30 |
31 |
54 | Tap to record
55 | arrow_forward
56 |
57 |
58 |
59 | );
60 | };
61 |
62 | export default WelcomeMark;
63 |
--------------------------------------------------------------------------------
/src/layouts/dashboard/data/barChartData.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | export const barChartDataDashboard = [
20 | {
21 | name: "Sales",
22 | data: [330, 250, 110, 300, 490, 350, 270, 130, 425],
23 | },
24 | ];
25 |
--------------------------------------------------------------------------------
/src/layouts/dashboard/data/barChartOptions.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | export const barChartOptionsDashboard = {
20 | chart: {
21 | toolbar: {
22 | show: false,
23 | },
24 | },
25 | tooltip: {
26 | style: {
27 | fontSize: "10px",
28 | fontFamily: "Plus Jakarta Display",
29 | },
30 | onDatasetHover: {
31 | style: {
32 | fontSize: "10px",
33 | fontFamily: "Plus Jakarta Display",
34 | },
35 | },
36 | theme: "dark",
37 | },
38 | xaxis: {
39 | categories: ["Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"],
40 | show: false,
41 | labels: {
42 | show: false,
43 | style: {
44 | colors: "#fff",
45 | fontSize: "10px",
46 | },
47 | },
48 | axisBorder: {
49 | show: false,
50 | },
51 | axisTicks: {
52 | show: false,
53 | },
54 | },
55 | yaxis: {
56 | show: true,
57 | color: "#fff",
58 | labels: {
59 | show: true,
60 | style: {
61 | colors: "#fff",
62 | fontSize: "10px",
63 | fontFamily: "Plus Jakarta Display",
64 | },
65 | },
66 | },
67 | grid: {
68 | show: false,
69 | },
70 | fill: {
71 | colors: "#fff",
72 | },
73 | dataLabels: {
74 | enabled: false,
75 | },
76 | plotOptions: {
77 | bar: {
78 | borderRadius: 8,
79 | columnWidth: "12px",
80 | },
81 | },
82 | responsive: [
83 | {
84 | breakpoint: 768,
85 | options: {
86 | plotOptions: {
87 | bar: {
88 | borderRadius: 0,
89 | },
90 | },
91 | },
92 | },
93 | ],
94 | };
95 |
--------------------------------------------------------------------------------
/src/layouts/dashboard/data/lineChartData.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | export const lineChartDataDashboard = [
20 | {
21 | name: "Mobile apps",
22 | data: [500, 250, 300, 220, 500, 250, 300, 230, 300, 350, 250, 400],
23 | },
24 | {
25 | name: "Websites",
26 | data: [200, 230, 300, 350, 370, 420, 550, 350, 400, 500, 330, 550],
27 | },
28 | ];
29 |
--------------------------------------------------------------------------------
/src/layouts/dashboard/data/lineChartOptions.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | export const lineChartOptionsDashboard = {
20 | chart: {
21 | toolbar: {
22 | show: false,
23 | },
24 | },
25 | tooltip: {
26 | theme: "dark",
27 | },
28 | dataLabels: {
29 | enabled: false,
30 | },
31 | stroke: {
32 | curve: "smooth",
33 | },
34 | xaxis: {
35 | type: "datetime",
36 | categories: [
37 | "Jan",
38 | "Feb",
39 | "Mar",
40 | "Apr",
41 | "May",
42 | "Jun",
43 | "Jul",
44 | "Aug",
45 | "Sep",
46 | "Oct",
47 | "Nov",
48 | "Dec",
49 | ],
50 | labels: {
51 | style: {
52 | colors: "#c8cfca",
53 | fontSize: "10px",
54 | },
55 | },
56 | axisBorder: {
57 | show: false,
58 | },
59 | axisTicks: {
60 | show: false,
61 | },
62 | },
63 | yaxis: {
64 | labels: {
65 | style: {
66 | colors: "#c8cfca",
67 | fontSize: "10px",
68 | },
69 | },
70 | },
71 | legend: {
72 | show: false,
73 | },
74 | grid: {
75 | strokeDashArray: 5,
76 | borderColor: "#56577A",
77 | },
78 | fill: {
79 | type: "gradient",
80 | gradient: {
81 | shade: "dark",
82 | type: "vertical",
83 | shadeIntensity: 0,
84 | gradientToColors: undefined, // optional, if not defined - uses the shades of same color in series
85 | inverseColors: true,
86 | opacityFrom: 0.8,
87 | opacityTo: 0,
88 | stops: [],
89 | },
90 | colors: ["#0075FF", "#2CD9FF"],
91 | },
92 | colors: ["#0075FF", "#2CD9FF"],
93 | };
94 |
--------------------------------------------------------------------------------
/src/layouts/profile/data/lineChartData1.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | export const lineChartDataProfile1 = [
20 | {
21 | name: "Mobile apps",
22 | data: [100, 250, 300, 220, 500, 250, 300, 230, 300, 350, 250, 400],
23 | },
24 | ];
25 |
--------------------------------------------------------------------------------
/src/layouts/profile/data/lineChartData2.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | export const lineChartDataProfile2 = [
20 | {
21 | name: "Mobile apps",
22 | data: [100, 250, 300, 220, 500, 250, 300, 230, 300, 350, 250, 400],
23 | },
24 | ];
25 |
--------------------------------------------------------------------------------
/src/layouts/profile/data/lineChartOptions1.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | export const lineChartOptionsProfile1 = {
20 | chart: {
21 | height: "50px",
22 | toolbar: {
23 | show: false,
24 | },
25 | redrawOnParentResize: true,
26 | },
27 | tooltip: {
28 | theme: "dark",
29 | },
30 | dataLabels: {
31 | enabled: false,
32 | },
33 | stroke: {
34 | curve: "smooth",
35 | },
36 | xaxis: {
37 | type: "datetime",
38 | categories: [
39 | "Jan",
40 | "Feb",
41 | "Mar",
42 | "Apr",
43 | "May",
44 | "Jun",
45 | "Jul",
46 | "Aug",
47 | "Sep",
48 | "Oct",
49 | "Nov",
50 | "Dec",
51 | ],
52 | labels: {
53 | show: false,
54 | style: {
55 | colors: "#c8cfca",
56 | fontSize: "12px",
57 | },
58 | },
59 | axisBorder: {
60 | show: false,
61 | },
62 | axisTicks: {
63 | show: false,
64 | },
65 | },
66 | yaxis: {
67 | show: false,
68 | labels: {
69 | style: {
70 | colors: "#c8cfca",
71 | fontSize: "12px",
72 | },
73 | },
74 | },
75 | legend: {
76 | show: false,
77 | },
78 | grid: {
79 | show: false,
80 | strokeDashArray: 5,
81 | borderColor: "#56577A",
82 | },
83 | fill: {
84 | type: "gradient",
85 | gradient: {
86 | shade: "dark",
87 | type: "vertical",
88 | shadeIntensity: 0,
89 | gradientToColors: undefined, // optional, if not defined - uses the shades of same color in series
90 | inverseColors: true,
91 | opacityFrom: 0.8,
92 | opacityTo: 0,
93 | stops: [],
94 | },
95 | colors: ["#01B574"],
96 | },
97 | colors: ["#01B574"],
98 | };
99 |
--------------------------------------------------------------------------------
/src/layouts/profile/data/lineChartOptions2.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | export const lineChartOptionsProfile2 = {
20 | chart: {
21 | height: "50px",
22 | toolbar: {
23 | show: false,
24 | },
25 | redrawOnParentResize: true,
26 | },
27 | tooltip: {
28 | theme: "dark",
29 | },
30 | dataLabels: {
31 | enabled: false,
32 | },
33 | stroke: {
34 | curve: "smooth",
35 | },
36 | xaxis: {
37 | type: "datetime",
38 | categories: [
39 | "Jan",
40 | "Feb",
41 | "Mar",
42 | "Apr",
43 | "May",
44 | "Jun",
45 | "Jul",
46 | "Aug",
47 | "Sep",
48 | "Oct",
49 | "Nov",
50 | "Dec",
51 | ],
52 | labels: {
53 | show: false,
54 | style: {
55 | colors: "#c8cfca",
56 | fontSize: "12px",
57 | },
58 | },
59 | axisBorder: {
60 | show: false,
61 | },
62 | axisTicks: {
63 | show: false,
64 | },
65 | },
66 | yaxis: {
67 | show: false,
68 | labels: {
69 | style: {
70 | colors: "#c8cfca",
71 | fontSize: "12px",
72 | },
73 | },
74 | },
75 | legend: {
76 | show: false,
77 | },
78 | grid: {
79 | show: false,
80 | strokeDashArray: 5,
81 | borderColor: "#56577A",
82 | },
83 | fill: {
84 | type: "gradient",
85 | gradient: {
86 | shade: "dark",
87 | type: "vertical",
88 | shadeIntensity: 0,
89 | gradientToColors: undefined, // optional, if not defined - uses the shades of same color in series
90 | inverseColors: true,
91 | opacityFrom: 0.8,
92 | opacityTo: 0,
93 | stops: [],
94 | },
95 | colors: ["#582CFF"],
96 | },
97 | colors: ["#582CFF"],
98 | };
99 |
--------------------------------------------------------------------------------
/src/layouts/rtl/components/WelcomeMark/index.js:
--------------------------------------------------------------------------------
1 | import React from "react";
2 |
3 | import { Card, Icon } from "@mui/material";
4 | import VuiBox from "components/VuiBox";
5 | import VuiTypography from "components/VuiTypography";
6 |
7 | const WelcomeMark = () => {
8 | return (
9 |
10 |
11 |
12 |
13 | مرحبا بعودتك،
14 |
15 |
16 | Mark Johnson
17 |
18 |
19 | سعيد لرؤيتك مرة أخرى!
20 |
اسألني اي شئ.
21 |
22 |
23 |
46 | اضغط للتسجيل
47 | arrow_backward
48 |
49 |
50 |
51 | );
52 | };
53 |
54 | export default WelcomeMark;
55 |
--------------------------------------------------------------------------------
/src/layouts/rtl/data/barChartData.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | export const barChartDataDashboard = [
20 | {
21 | name: "مبيعات",
22 | data: [330, 250, 110, 300, 490, 350, 270, 130, 425],
23 | },
24 | ];
25 |
--------------------------------------------------------------------------------
/src/layouts/rtl/data/barChartOptions.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | export const barChartOptionsDashboard = {
20 | chart: {
21 | toolbar: {
22 | show: false,
23 | },
24 | },
25 | tooltip: {
26 | style: {
27 | fontSize: "10px",
28 | fontFamily: "Plus Jakarta Display",
29 | },
30 | onDatasetHover: {
31 | style: {
32 | fontSize: "10px",
33 | fontFamily: "Plus Jakarta Display",
34 | },
35 | },
36 | theme: "dark",
37 | },
38 | xaxis: {
39 | categories: ["Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"],
40 | show: false,
41 | labels: {
42 | show: false,
43 | style: {
44 | colors: "#fff",
45 | fontSize: "10px",
46 | },
47 | },
48 | axisBorder: {
49 | show: false,
50 | },
51 | axisTicks: {
52 | show: false,
53 | },
54 | },
55 | yaxis: {
56 | show: true,
57 | color: "#fff",
58 | labels: {
59 | show: true,
60 | style: {
61 | colors: "#fff",
62 | fontSize: "10px",
63 | fontFamily: "Plus Jakarta Display",
64 | },
65 | },
66 | },
67 | grid: {
68 | show: false,
69 | },
70 | fill: {
71 | colors: "#fff",
72 | },
73 | dataLabels: {
74 | enabled: false,
75 | },
76 | plotOptions: {
77 | bar: {
78 | borderRadius: 8,
79 | columnWidth: "12px",
80 | },
81 | },
82 | responsive: [
83 | {
84 | breakpoint: 768,
85 | options: {
86 | plotOptions: {
87 | bar: {
88 | borderRadius: 0,
89 | },
90 | },
91 | },
92 | },
93 | ],
94 | };
95 |
--------------------------------------------------------------------------------
/src/layouts/rtl/data/lineChartData.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | export const lineChartDataDashboard = [
20 | {
21 | name: "تطبيقات الموبايل",
22 | data: [500, 250, 300, 220, 500, 250, 300, 230, 300, 350, 250, 400],
23 | },
24 | {
25 | name: "مواقع الويب",
26 | data: [200, 230, 300, 350, 370, 420, 550, 350, 400, 500, 330, 550],
27 | },
28 | ];
29 |
--------------------------------------------------------------------------------
/src/layouts/rtl/data/lineChartOptions.js:
--------------------------------------------------------------------------------
1 | /*!
2 |
3 | =========================================================
4 | * Vision UI Free React - v1.0.0
5 | =========================================================
6 |
7 | * Product Page: https://www.creative-tim.com/product/vision-ui-free-react
8 | * Copyright 2021 Creative Tim (https://www.creative-tim.com/)
9 | * Licensed under MIT (https://github.com/creativetimofficial/vision-ui-free-react/blob/master LICENSE.md)
10 |
11 | * Design and Coded by Simmmple & Creative Tim
12 |
13 | =========================================================
14 |
15 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
16 |
17 | */
18 |
19 | export const lineChartOptionsDashboard = {
20 | chart: {
21 | toolbar: {
22 | show: false,
23 | },
24 | },
25 | tooltip: {
26 | theme: "dark",
27 | },
28 | dataLabels: {
29 | enabled: false,
30 | },
31 | stroke: {
32 | curve: "smooth",
33 | },
34 | xaxis: {
35 | type: "datetime",
36 | categories: [
37 | "Jan",
38 | "Feb",
39 | "Mar",
40 | "Apr",
41 | "May",
42 | "Jun",
43 | "Jul",
44 | "Aug",
45 | "Sep",
46 | "Oct",
47 | "Nov",
48 | "Dec",
49 | ],
50 | labels: {
51 | style: {
52 | colors: "#c8cfca",
53 | fontSize: "10px",
54 | },
55 | },
56 | axisBorder: {
57 | show: false,
58 | },
59 | axisTicks: {
60 | show: false,
61 | },
62 | },
63 | yaxis: {
64 | labels: {
65 | style: {
66 | colors: "#c8cfca",
67 | fontSize: "10px",
68 | },
69 | },
70 | },
71 | legend: {
72 | show: false,
73 | },
74 | grid: {
75 | strokeDashArray: 5,
76 | borderColor: "#56577A",
77 | },
78 | fill: {
79 | type: "gradient",
80 | gradient: {
81 | shade: "dark",
82 | type: "vertical",
83 | shadeIntensity: 0,
84 | gradientToColors: undefined, // optional, if not defined - uses the shades of same color in series
85 | inverseColors: true,
86 | opacityFrom: 0.8,
87 | opacityTo: 0,
88 | stops: [],
89 | },
90 | colors: ["#0075FF", "#2CD9FF"],
91 | },
92 | colors: ["#0075FF", "#2CD9FF"],
93 | };
94 |
--------------------------------------------------------------------------------