From 5db7ec334878df5e482978a6e487c80b0052c346 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=AE=87=E9=98=B3?= <3311118881@qq.com> Date: Thu, 25 Jul 2024 19:33:25 +0800 Subject: [PATCH] =?UTF-8?q?=E9=A1=B9=E7=9B=AE=E5=88=9D=E5=A7=8B=E5=8C=96?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .prettierrc | 3 + .vite/deps_temp_474a67bf/package.json | 3 + LICENSE.md | 21 ++ README.md | 101 ++++++++++ index.html | 13 ++ package.json | 10 +- public/favicon.ico | Bin 0 -> 15406 bytes src/App.tsx | 149 ++++++++++++++ src/pages/Calendar.tsx | 273 ++++++++++++++++++++++++++ src/pages/Create/index.tsx | 2 - tailwind.config.cjs | 254 ++++++++++++++++++++++++ 11 files changed, 822 insertions(+), 7 deletions(-) create mode 100644 .prettierrc create mode 100644 .vite/deps_temp_474a67bf/package.json create mode 100644 LICENSE.md create mode 100644 README.md create mode 100644 index.html create mode 100644 public/favicon.ico create mode 100644 src/App.tsx create mode 100644 src/pages/Calendar.tsx create mode 100644 tailwind.config.cjs diff --git a/.prettierrc b/.prettierrc new file mode 100644 index 0000000..544138b --- /dev/null +++ b/.prettierrc @@ -0,0 +1,3 @@ +{ + "singleQuote": true +} diff --git a/.vite/deps_temp_474a67bf/package.json b/.vite/deps_temp_474a67bf/package.json new file mode 100644 index 0000000..3dbc1ca --- /dev/null +++ b/.vite/deps_temp_474a67bf/package.json @@ -0,0 +1,3 @@ +{ + "type": "module" +} diff --git a/LICENSE.md b/LICENSE.md new file mode 100644 index 0000000..cb92d41 --- /dev/null +++ b/LICENSE.md @@ -0,0 +1,21 @@ +MIT License + +Copyright (c) 2023 TailAdmin + +Permission is hereby granted, free of charge, to any person obtaining a copy +of this software and associated documentation files (the "Software"), to deal +in the Software without restriction, including without limitation the rights +to use, copy, modify, merge, publish, distribute, sublicense, and/or sell +copies of the Software, and to permit persons to whom the Software is +furnished to do so, subject to the following conditions: + +The above copyright notice and this permission notice shall be included in all +copies or substantial portions of the Software. + +THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR +IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, +FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE +AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER +LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, +OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE +SOFTWARE. diff --git a/README.md b/README.md new file mode 100644 index 0000000..ad0ee19 --- /dev/null +++ b/README.md @@ -0,0 +1,101 @@ +# TailAdmin React - Free React Tailwind Admin Dashboard Template + +TailAdmin is a free and open-source admin dashboard template built on **React and Tailwind CSS**, providing developers with everything they need to create a comprehensive, data-driven back-end, +dashboard, or admin panel solution for upcoming web projects. + +[![tailwind react admin template](https://ucarecdn.com/d2a6daed-eb9c-4c2f-8a95-4419c450e23a/tailadminreact.jpg)](https://react-demo.tailadmin.com/) + + +With TailAdmin, you get access to all the necessary dashboard UI components, elements, and pages required to build a feature-rich and complete dashboard or admin panel. Whether you're building dashboard or admin panel for a complex web application or a simple website, TailAdmin is the perfect solution to help you get up and running quickly. + +### [✨ Visit Website](https://tailadmin.com/) + +### [🚀 PRO Demo](https://react-demo.tailadmin.com/) +### [🚀 FREE Demo](https://free-react-demo.tailadmin.com/) + +### TailAdmin React PRO vs TailAdmin React FREE Comparison 📊 + +#### [TailAdmin React PRO](https://react-demo.tailadmin.com/) +- 4 Unique Dashboards: Analytics, Ecommerce, Marketing, and CRM (More will be added) +- 120+ Dashboard UI Components +- 200+ Total UI Elements +- 45+ HTML Files +- All Essential Elements and Files +- Full Figma Design Source - As Shown on Demo + +___ + +#### [TailAdmin React FREE](https://free-react-demo.tailadmin.com/) +- 1 Unique Dashboard +- 30+ Dashboard UI Components +- 50+ Total UI Elements +- 10+ HTML Files +- TypeScript Support +- Basic UI Kit Elements and Files +- Figma Design Source - Free Sample +___ + +### [⬇️ Download Now](https://tailadmin.com/download) + +### [⚡ Get PRO Version](https://tailadmin.com/pricing) + +### [📄 Documentation/Installation](https://tailadmin.com/docs) + +### [🖌️ TailAdmin Figma Free Sample](https://www.figma.com/community/file/1214477970819985778) + +### [👉 TailAdmin HTML Version](https://github.com/TailAdmin/tailadmin-free-tailwind-dashboard-template) + +TailAdmin React dashboard template based on Tailwind CSS is a pre-designed starting point for building a web-based dashboard using the React JavaScript library and the Tailwind CSS utility-first framework. This Tailwind CSS + React Dashboard Template - built using Tailwind CSS and **includes pre-built components, such as navigation menus, charts, tables, and forms, which can be easily customized and integrated into a small-to-large React web application**. + +If you're looking for a high-quality **React-Tailwind Dashboard, Admin Panel Template, or UI Kit**, TailAdmin will be the perfect choice for you! + +## TailAdmin React - Installation + +You'll need to install Node.js >=v14.16+ (Recommended Version) (NPM comes along with it) and TailAdmin uses **Vite** for frontend tooling, to peform installation and building production version, please follow these steps from below: + +- Use terminal and navigate to the project (tailadmin-react) root. + +- Then run : npm install + +- Then run : npm run dev + +Now, in the browser go to localhost:5173 + +**For Production Build** +Run : npm run build + +Default build output directory: /dist + +This command will generate a dist as build folder in the root of your template that you can upload to your server. + +## Tons of React Tailwind Components for Dashboard +React and Tailwind are two popular technologies that have taken the web development world by storm. React is a JavaScript library for building user interfaces, while Tailwind is a utility-first CSS framework that makes it easy to style web applications. TailAdmin React Offers 200+ Essential React + Tailwind CSS UI Components that you copy-paste and use with your dashboard projects. That includes - charts, graphs, navbars, tabs, buttons, cards, tables, profile, tabs, forms, modals, app pages, calender, web apps example templates and more... for React and Styled using Tailwind CSS + + + +## Update Logs + +### Version 1.3.7 - [June 20, 2024] + +#### Enhancements + +- **Enhancement 01:** Remove Repetition of DefaultLayout in every Pages +- **Enhancement 02:** Add ClickOutside Component for reduce repeated functionality in Header Message, Notification and User Dropdowns. + +### Version 1.3.6 - [Jan 31, 2024] + +#### Enhancements + +- **Enhancement 01:** Integrate flatpickr in [Date Picker/Form Elements] +- **Enhancement 02:** Change color after select an option [Select Element/Form Elements]. +- **Enhancement 03:** Make it functional [Multiselect Dropdown/Form Elements]. +- **Enhancement 04:** Make best value editable [Pricing Table One/Pricing Table]. +- **Enhancement 05:** Rearrange Folder structure. + +### Version 1.2.0 - [Apr 28, 2023] + +- Add Typescript in TailAdmin React. + +### Version 1.0.0 - Initial Release - [Mar 13, 2023] + +- Initial release of TailAdmin React. \ No newline at end of file diff --git a/index.html b/index.html new file mode 100644 index 0000000..7c83ab2 --- /dev/null +++ b/index.html @@ -0,0 +1,13 @@ + + + + + + + TailAdmin - Tailwind CSS Admin Dashboard Template + + +
+ + + diff --git a/package.json b/package.json index fcb55dc..6272484 100644 --- a/package.json +++ b/package.json @@ -1,5 +1,5 @@ { - "name": "tailadmin-react-free", + "name": "ThriveX", "private": true, "version": "1.3.7", "type": "module", @@ -9,9 +9,9 @@ "preview": "vite preview" }, "author": { - "name": "TailAdmin", - "email": "hello@tailadmin.com", - "url": "https://tailadmin.com" + "name": "YuYang", + "email": "liuyuyang1024@yeah.net", + "url": "https://blog.liuyuyang.net" }, "dependencies": { "apexcharts": "^3.41.0", @@ -41,4 +41,4 @@ "vite": "^4.4.7", "webpack": "^5.88.2" } -} +} \ No newline at end of file diff --git a/public/favicon.ico b/public/favicon.ico new file mode 100644 index 0000000000000000000000000000000000000000..cf3128aaf3bdc9c30e84f6da5f1498c906c58046 GIT binary patch literal 15406 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 + const { pathname } = useLocation(); + + useEffect(() => { + window.scrollTo(0, 0); + }, [pathname]); + + useEffect(() => { + setTimeout(() => setLoading(false), 1000); + }, []); + + return loading ? ( + + ) : ( + + + + + + + } + /> + + + + } + /> + + + + + } + /> + + + + + } + /> + + + + + } + /> + + + + + } + /> + + + + + } + /> + + + + + } + /> + + + + + } + /> + + + + + } + /> + + + + + } + /> + + + + + } + /> + + + ); +} + +export default App; diff --git a/src/pages/Calendar.tsx b/src/pages/Calendar.tsx new file mode 100644 index 0000000..d291825 --- /dev/null +++ b/src/pages/Calendar.tsx @@ -0,0 +1,273 @@ +import Breadcrumb from '../components/Breadcrumbs/Breadcrumb'; + +const Calendar = () => { + return ( + <> + + + {/* */} +
+ + + + + + + + + + + + + + {/* */} + + + + + + + + + + {/* */} + {/* */} + + + + + + + + + + {/* */} + {/* */} + + + + + + + + + + {/* */} + {/* */} + + + + + + + + + + {/* */} + {/* */} + + + + + + + + + + {/* */} + +
+ Sunday + Sun + + Monday + Mon + + Tuesday + Tue + + Wednesday + Wed + + Thursday + Thur + + Friday + Fri + + Saturday + Sat +
+ + 1 + +
+ + More + +
+ + Redesign Website + + + 1 Dec - 2 Dec + +
+
+ 		+ + 2 + + + + 3 + + + + 4 + + + + 5 + + + + 6 + + + + 7 + +
+ + 8 + + + + 9 + + + + 10 + + + + 11 + + + + 12 + + + + 13 + + + + 14 + +
+ + 15 + + + + 16 + + + + 17 + + + + 18 + + + + 19 + + + + 20 + + + + 21 + +
+ + 22 + + + + 23 + + + + 24 + + + + 25 + +
+ + More + +
+ + App Design + + + 25 Dec - 27 Dec + +
+
+ 		+ + 26 + + + + 27 + + + + 28 + +
+ + 29 + + + + 30 + + + + 31 + + + + 1 + + + + 2 + + + + 3 + + + + 4 + +
+
+ {/* */} + + ); +}; + +export default Calendar; diff --git a/src/pages/Create/index.tsx b/src/pages/Create/index.tsx index 650115d..b750507 100644 --- a/src/pages/Create/index.tsx +++ b/src/pages/Create/index.tsx @@ -4,8 +4,6 @@ const Create = () => { return ( <> - - ); }; diff --git a/tailwind.config.cjs b/tailwind.config.cjs new file mode 100644 index 0000000..345dfac --- /dev/null +++ b/tailwind.config.cjs @@ -0,0 +1,254 @@ +const defaultTheme = require('tailwindcss/defaultTheme') + +/** @type {import('tailwindcss').Config} */ +module.exports = { + content: ['./index.html', './src/**/*.{js,ts,jsx,tsx}'], + darkMode: 'class', + theme: { + fontFamily: { + satoshi: ['Satoshi', 'sans-serif'], + }, + screens: { + '2xsm': '375px', + xsm: '425px', + '3xl': '2000px', + ...defaultTheme.screens, + }, + extend: { + colors: { + current: 'currentColor', + transparent: 'transparent', + white: '#FFFFFF', + black: '#1C2434', + 'black-2': '#010101', + body: '#64748B', + bodydark: '#AEB7C0', + bodydark1: '#DEE4EE', + bodydark2: '#8A99AF', + primary: '#3C50E0', + secondary: '#80CAEE', + stroke: '#E2E8F0', + gray: '#EFF4FB', + graydark: '#333A48', + 'gray-2': '#F7F9FC', + 'gray-3': '#FAFAFA', + whiten: '#F1F5F9', + whiter: '#F5F7FD', + boxdark: '#24303F', + 'boxdark-2': '#1A222C', + strokedark: '#2E3A47', + 'form-strokedark': '#3d4d60', + 'form-input': '#1d2a39', + 'meta-1': '#DC3545', + 'meta-2': '#EFF2F7', + 'meta-3': '#10B981', + 'meta-4': '#313D4A', + 'meta-5': '#259AE6', + 'meta-6': '#FFBA00', + 'meta-7': '#FF6766', + 'meta-8': '#F0950C', + 'meta-9': '#E5E7EB', + success: '#219653', + danger: '#D34053', + warning: '#FFA70B', + }, + fontSize: { + 'title-xxl': ['44px', '55px'], + 'title-xl': ['36px', '45px'], + 'title-xl2': ['33px', '45px'], + 'title-lg': ['28px', '35px'], + 'title-md': ['24px', '30px'], + 'title-md2': ['26px', '30px'], + 'title-sm': ['20px', '26px'], + 'title-xsm': ['18px', '24px'], + }, + spacing: { + 4.5: '1.125rem', + 5.5: '1.375rem', + 6.5: '1.625rem', + 7.5: '1.875rem', + 8.5: '2.125rem', + 9.5: '2.375rem', + 10.5: '2.625rem', + 11: '2.75rem', + 11.5: '2.875rem', + 12.5: '3.125rem', + 13: '3.25rem', + 13.5: '3.375rem', + 14: '3.5rem', + 14.5: '3.625rem', + 15: '3.75rem', + 15.5: '3.875rem', + 16: '4rem', + 16.5: '4.125rem', + 17: '4.25rem', + 17.5: '4.375rem', + 18: '4.5rem', + 18.5: '4.625rem', + 19: '4.75rem', + 19.5: '4.875rem', + 21: '5.25rem', + 21.5: '5.375rem', + 22: '5.5rem', + 22.5: '5.625rem', + 24.5: '6.125rem', + 25: '6.25rem', + 25.5: '6.375rem', + 26: '6.5rem', + 27: '6.75rem', + 27.5: '6.875rem', + 29: '7.25rem', + 29.5: '7.375rem', + 30: '7.5rem', + 31: '7.75rem', + 32.5: '8.125rem', + 34: '8.5rem', + 34.5: '8.625rem', + 35: '8.75rem', + 36.5: '9.125rem', + 37.5: '9.375rem', + 39: '9.75rem', + 39.5: '9.875rem', + 40: '10rem', + 42.5: '10.625rem', + 44: '11rem', + 45: '11.25rem', + 46: '11.5rem', + 47.5: '11.875rem', + 49: '12.25rem', + 50: '12.5rem', + 52: '13rem', + 52.5: '13.125rem', + 54: '13.5rem', + 54.5: '13.625rem', + 55: '13.75rem', + 55.5: '13.875rem', + 59: '14.75rem', + 60: '15rem', + 62.5: '15.625rem', + 65: '16.25rem', + 67: '16.75rem', + 67.5: '16.875rem', + 70: '17.5rem', + 72.5: '18.125rem', + 73: '18.25rem', + 75: '18.75rem', + 90: '22.5rem', + 94: '23.5rem', + 95: '23.75rem', + 100: '25rem', + 115: '28.75rem', + 125: '31.25rem', + 132.5: '33.125rem', + 150: '37.5rem', + 171.5: '42.875rem', + 180: '45rem', + 187.5: '46.875rem', + 203: '50.75rem', + 230: '57.5rem', + 242.5: '60.625rem', + }, + maxWidth: { + 2.5: '0.625rem', + 3: '0.75rem', + 4: '1rem', + 11: '2.75rem', + 13: '3.25rem', + 14: '3.5rem', + 15: '3.75rem', + 22.5: '5.625rem', + 25: '6.25rem', + 30: '7.5rem', + 34: '8.5rem', + 35: '8.75rem', + 40: '10rem', + 42.5: '10.625rem', + 44: '11rem', + 45: '11.25rem', + 70: '17.5rem', + 90: '22.5rem', + 94: '23.5rem', + 125: '31.25rem', + 132.5: '33.125rem', + 142.5: '35.625rem', + 150: '37.5rem', + 180: '45rem', + 203: '50.75rem', + 230: '57.5rem', + 242.5: '60.625rem', + 270: '67.5rem', + 280: '70rem', + 292.5: '73.125rem', + }, + maxHeight: { + 35: '8.75rem', + 70: '17.5rem', + 90: '22.5rem', + 550: '34.375rem', + 300: '18.75rem', + }, + minWidth: { + 22.5: '5.625rem', + 42.5: '10.625rem', + 47.5: '11.875rem', + 75: '18.75rem', + }, + zIndex: { + 999999: '999999', + 99999: '99999', + 9999: '9999', + 999: '999', + 99: '99', + 9: '9', + 1: '1', + }, + opacity: { + 65: '.65', + }, + backgroundImage: { + video: "url('../images/video/video.png')", + }, + content: { + 'icon-copy': 'url("../images/icon/icon-copy-alt.svg")', + }, + transitionProperty: { width: 'width', stroke: 'stroke' }, + borderWidth: { + 6: '6px', + }, + boxShadow: { + default: '0px 8px 13px -3px rgba(0, 0, 0, 0.07)', + card: '0px 1px 3px rgba(0, 0, 0, 0.12)', + 'card-2': '0px 1px 2px rgba(0, 0, 0, 0.05)', + switcher: + '0px 2px 4px rgba(0, 0, 0, 0.2), inset 0px 2px 2px #FFFFFF, inset 0px -1px 1px rgba(0, 0, 0, 0.1)', + 'switch-1': '0px 0px 5px rgba(0, 0, 0, 0.15)', + 1: '0px 1px 3px rgba(0, 0, 0, 0.08)', + 2: '0px 1px 4px rgba(0, 0, 0, 0.12)', + 3: '0px 1px 5px rgba(0, 0, 0, 0.14)', + 4: '0px 4px 10px rgba(0, 0, 0, 0.12)', + 5: '0px 1px 1px rgba(0, 0, 0, 0.15)', + 6: '0px 3px 15px rgba(0, 0, 0, 0.1)', + 7: '-5px 0 0 #313D4A, 5px 0 0 #313D4A', + 8: '1px 0 0 #313D4A, -1px 0 0 #313D4A, 0 1px 0 #313D4A, 0 -1px 0 #313D4A, 0 3px 13px rgb(0 0 0 / 8%)', + }, + dropShadow: { + 1: '0px 1px 0px #E2E8F0', + 2: '0px 1px 4px rgba(0, 0, 0, 0.12)', + }, + keyframes: { + rotating: { + '0%, 100%': { transform: 'rotate(360deg)' }, + '50%': { transform: 'rotate(0deg)' }, + }, + }, + animation: { + 'ping-once': 'ping 5s cubic-bezier(0, 0, 0.2, 1)', + rotating: 'rotating 30s linear infinite', + 'spin-1.5': 'spin 1.5s linear infinite', + 'spin-2': 'spin 2s linear infinite', + 'spin-3': 'spin 3s linear infinite', + }, + }, + }, + plugins: [], +}