diff --git a/.github/workflows/main.yml b/.github/workflows/main.yml new file mode 100644 index 0000000..b49285b --- /dev/null +++ b/.github/workflows/main.yml @@ -0,0 +1,12 @@ +name: Autocloser +on: [issues] +jobs: + autoclose: + runs-on: ubuntu-latest + steps: + - name: Issue auto-closer + uses: roots/issue-closer-action@v1.1 + with: + repo-token: ${{ secrets.GITHUB_TOKEN }} + issue-close-message: "@${issue.user.login} this issue was automatically closed because it did not follow our rules:\n\n
\n\n\n\nIMPORTANT: Please use the following link to create a new issue:\n\nhttps://www.creative-tim.com/new-issue/vue-tailwind-webapp?ref=vtw-new-issue\n\n**If your issue was not created using the app above, it will be closed immediately.**\n\n\n\nLove Creative Tim? Do you need Angular, React, Vuejs or HTML? You can visit:\n👉 https://www.creative-tim.com/bundles\n👉 https://www.creative-tim.com\n\n\n\n\n" + issue-pattern: (\#\#\# Version([\S\s.*]*?)\#\#\# Reproduction link([\S\s.*]*?)\#\#\# Operating System([\S\s.*]*?)\#\#\# Device([\S\s.*]*?)\#\#\# Browser & Version([\S\s.*]*?)\#\#\# Steps to reproduce([\S\s.*]*?)\#\#\# What is expected([\S\s.*]*?)\#\#\# What is actually happening([\S\s.*]*?)---([\S\s.*]*?)\#\#\# Solution([\S\s.*]*?)\#\#\# Additional comments([\S\s.*]*?)\<\!-- generated by creative-tim-issues\. DO NOT REMOVE --\>)|(\#\#\# What is your enhancement([\S\s.*]*?)\<\!-- generated by creative-tim-issues\. DO NOT REMOVE --\>) diff --git a/CHANGELOG.md b/CHANGELOG.md new file mode 100644 index 0000000..67bd706 --- /dev/null +++ b/CHANGELOG.md @@ -0,0 +1,6 @@ +# Change Log + +## [1.0.0] 2020-09-29 +### Original Release +- Started project from [Tailwind Starter Kit by Creative Tim](https://www.creative-tim.com/learning-lab/tailwind-starter-kit/presentation?ref=vtw-changelog) +- Added design from Tailwind Starter Kit by Creative Tim diff --git a/ISSUE_TEMPLATE.md b/ISSUE_TEMPLATE.md new file mode 100644 index 0000000..d7bd5a3 --- /dev/null +++ b/ISSUE_TEMPLATE.md @@ -0,0 +1,13 @@ + + + diff --git a/LICENSE.md b/LICENSE.md new file mode 100644 index 0000000..c195e33 --- /dev/null +++ b/LICENSE.md @@ -0,0 +1,9 @@ +MIT License + +Copyright (c) 2020 Creative Tim (https://www.creative-tim.com?ref=vtw-license) + +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 index bb41fa3..cbacb94 100644 --- a/README.md +++ b/README.md @@ -1,68 +1,186 @@ -# ![Tweet](https://img.shields.io/twitter/url/http/shields.io.svg?style=social&logo=twitter) +# Vue Tailwind WebApp ![Tweet](https://img.shields.io/twitter/url/http/shields.io.svg?style=social&logo=twitter) +![version](https://img.shields.io/badge/version-1.0.0-blue.svg) ![license](https://img.shields.io/badge/license-MIT-blue.svg) ![GitHub issues open](https://img.shields.io/github/issues/creativetimofficial/vue-tailwind-webapp.svg) ![GitHub issues closed](https://img.shields.io/github/issues-closed-raw/creativetimofficial/vue-tailwind-webapp.svg) ![Join the chat at https://gitter.im/NIT-dgp/General](https://badges.gitter.im/NIT-dgp/General.svg) ![Chat](https://img.shields.io/badge/chat-on%20discord-7289da.svg) -![version](https://img.shields.io/badge/version-1.0.0-blue.svg) ![license](https://img.shields.io/badge/license-MIT-blue.svg) ![GitHub issues open](https://img.shields.io/github/issues/creativetimofficial/tailwind-starter-kit.svg?maxAge=2592000) ![GitHub issues closed](https://img.shields.io/github/issues-closed-raw/creativetimofficial/tailwind-starter-kit.svg?maxAge=2592000) ![Join the chat at https://gitter.im/NIT-dgp/General](https://badges.gitter.im/NIT-dgp/General.svg) ![Chat](https://img.shields.io/badge/chat-on%20discord-7289da.svg) +![Vue Tailwind WebApp](https://github.com/creativetimofficial/public-assets/blob/master/vue-tailwind-webapp/vue-tailwind-webapp.jpg?raw=true) +### A beautiful UI Kit and Admin for Tailwind CSS and VueJS. -![Product Presentation Image](https://raw.githubusercontent.com/creativetimofficial/tailwind-starter-kit/master/images/dashboard.jpg) +Start your development with a Free Tailwind CSS and VueJS UI Kit and Admin. Let Vue Tailwind WebApp amaze you with its cool features and build tools and get your project to a whole new level. -## Table of Contents +Vue Tailwind WebApp is Free and Open Source. It features multiple HTML and VueJS elements and it comes with dynamic components for VueJS. -* [Description](#description) -* [Documentation](#documentation) -* [Quick Start](#quick-start) -* [Browser Support](#browser-support) -* [Reporting Issues](#reporting-issues) -* [Licensing](#licensing) -* [Useful Links](#useful-links) -* [Resources](#resources) -* [Versions](#versions) -* [File Structure](#file-structure) +It is based on [Tailwind Starter Kit](https://www.creative-tim.com/learning-lab/tailwind-starter-kit/presentation?ref=vtw-github-readme) by Creative Tim, and it is build with both presentation pages, and pages for an admin dashboard. +Speed up your web development with a beautiful product made by Creative Tim . +If you like bright and fresh colors, you will love this Free Tailwind CSS Template! It features a huge number of components that can help you create amazing websites. -## Description +### Get Started -### VueJS Dashboard Page +- Install NodeJS **LTS** version from NodeJs Official Page +- Download the product on this page +- Unzip the downloaded file to a folder in your computer +- Open Terminal +- Go to your file project (where you’ve unzipped the product) +- (If you are on a linux based terminal) Simply run `npm run install:clean` +- (If not) Run in terminal `npm install` +- (If not) Run in terminal `npm run build:tailwind` (each time you add a new class, a class that does not exist in `src/assets/styles/tailwind.css`, you will need to run this command) +- (If not) Run in terminal `npm run serve` +- Navigate to https://localhost:8080 +- Check more about [Tailwind CSS](https://tailwindcss.com/?ref=creativetim) -### Project setup -``` -npm install -``` +### Pages -#### Compiles and hot-reloads for development -``` -npm run serve -``` +If you want to get inspiration or just show something directly to your clients, +you can jump start your development with our pre-built example pages. You will be able +to quickly set up the basic structure for your web project. -#### Compiles and minifies for production -``` -npm run build -``` +Here are all the page from the project: +- [Presentation](https://demos.creative-tim.com/vue-tailwind-webapp/?ref=vtw-github-readme) +- Admin Samples + - [Dashboard](https://demos.creative-tim.com/vue-tailwind-webapp/admin/dashboard?ref=vtw-github-readme) + - [Settings](https://demos.creative-tim.com/vue-tailwind-webapp/admin/settings?ref=vtw-github-readme) + - [Tables](https://demos.creative-tim.com/vue-tailwind-webapp/admin/tables?ref=vtw-github-readme) + - [Maps](https://demos.creative-tim.com/vue-tailwind-webapp/admin/maps?ref=vtw-github-readme) +- Authentication Samples + - [Login](https://demos.creative-tim.com/vue-tailwind-webapp/auth/login?ref=vtw-github-readme) + - [Register](https://demos.creative-tim.com/vue-tailwind-webapp/auth/register?ref=vtw-github-readme) +- Presentation Samples + - [Landing](https://demos.creative-tim.com/vue-tailwind-webapp/landing?ref=vtw-github-readme) + - [Profile](https://demos.creative-tim.com/vue-tailwind-webapp/profile?ref=vtw-github-readme) -#### Lints and fixes files -``` -npm run lint -``` -#### Customize configuration -See [Configuration Reference](https://cli.vuejs.org/config/). +### Fully Coded Components +Vue Tailwind WebApp is built with over frontend 120 components, giving you the freedom of choosing and combining. All components can take variations in colors, that you can easily modify using Tailwind CSS classes (NOTE: each time you add a new class, a class that does not exist in `src/assets/styles/tailwind.css`, you will need to compile again tailwind). +You will save a lot of time going from prototyping to full-functional code, because all elements are implemented. +This Free Tailwind CSS Template is coming with prebuilt examples, so the development process is seamless, switching from our pages to the real website is very easy to be done. +Every element has multiple states for colors, styles, hover, focus, that you can easily access and use. -## Documentation -The documentation for the VueJS Dashboard Page is hosted at our website. +### CSS Components + +Vue Tailwind WebApp comes with 120 Fully Coded CSS elements, such as [Alerts](https://www.creative-tim.com/learning-lab/tailwind/vue/alerts/webapp?ref=vtw-github-readme), [Buttons](https://www.creative-tim.com/learning-lab/tailwind/buttons/webapp-vuejs?ref=vtw-github-readme), [Inputs](https://www.creative-tim.com/learning-lab/tailwind/inputs/webapp-vuejs?ref=vtw-github-readme) and many more. + +Please [check all of them here](https://www.creative-tim.com/learning-lab/tailwind/vue/alerts/webapp?ref=vtw-github-readme). + +### VueJS Components + +We also feature the following 18 dynamic components: +- [Alerts](https://www.creative-tim.com/learning-lab/tailwind/vue/alerts/webapp?tws=vtw-github-readme) +- [Popper for Menus](https://www.creative-tim.com/learning-lab/tailwind/vue/dropdowns/webapp?tws=vtw-github-readme) +- [Menus](https://www.creative-tim.com/learning-lab/tailwind/vue/menus/webapp?ref=vtw-github-readme) +- [Modals](https://www.creative-tim.com/learning-lab/tailwind/vue/modals/webapp?ref=vtw-github-readme) +- [Navbars](https://www.creative-tim.com/learning-lab/tailwind/vue/navbar/webapp?ref=vtw-github-readme) +- [Popper for popover content](https://www.creative-tim.com/learning-lab/tailwind/vue/popovers/webapp?ref=vtw-github-readme) +- [Tabs](https://www.creative-tim.com/learning-lab/tailwind/vue/tabs/webapp?ref=vtw-github-readme) +- [Popper for tooltips content](https://www.creative-tim.com/learning-lab/tailwind/vue/tooltips/webapp?ref=vtw-github-readme) + + +## Table of Contents + +* [Versions](#versions) +* [Documentation](#documentation) +* [Quick Start](#quick-start) +* [Files and folders](#files-and-folders) +* [Browser Support](#browser-support) +* [Reporting Issues](#reporting-issues) +* [Licensing](#licensing) +* [Useful Links](#useful-links) +* [Resources](#resources) + +## Versions + +[](https://www.creative-tim.com/product/tailwind-webapp-angular?ref=vtw-github-readme)[](https://www.creative-tim.com/product/tailwind-webapp-js?ref=vtw-github-readme)[](https://www.creative-tim.com/product/tailwind-webapp-nextjs?ref=vtw-github-readme)[](https://www.creative-tim.com/product/tailwind-webapp-react?ref=vtw-github-readme)[](https://www.creative-tim.com/product/tailwind-webapp-svelte?ref=vtw-github-readme)[](https://www.creative-tim.com/product/vue-tailwind-webapp?ref=vtw-github-readme) -View More +| Angular | JavaScript / HTML | NextJS | React | Svelte | VueJS | +| :---: | :---: | :---: | :---: | :---: | :---: | +| [![Tailwind WebApp Angular](https://github.com/creativetimofficial/public-assets/blob/master/tailwind-webapp-angular/tailwind-webapp-angular.jpg?raw=true)](https://www.creative-tim.com/product/tailwind-webapp-angular?ref=vtw-github-readme) | [![Tailwind WebApp](https://github.com/creativetimofficial/public-assets/blob/master/tailwind-webapp-js/tailwind-webapp-js.jpg?raw=true)](https://www.creative-tim.com/product/tailwind-webapp-js?ref=vtw-github-readme) | [![Tailwind WebApp NextJS](https://github.com/creativetimofficial/public-assets/blob/master/tailwind-webapp-nextjs/tailwind-webapp-nextjs.jpg?raw=true)](https://www.creative-tim.com/product/tailwind-webapp-nextjs?ref=vtw-github-readme) | [![Tailwind WebApp React](https://github.com/creativetimofficial/public-assets/blob/master/tailwind-webapp-react/tailwind-webapp-react.jpg?raw=true)](https://www.creative-tim.com/product/tailwind-webapp-react?ref=vtw-github-readme) | [![Tailwind WebApp Svelte](https://github.com/creativetimofficial/public-assets/blob/master/tailwind-webapp-svelte/tailwind-webapp-svelte.jpg?raw=true)](https://www.creative-tim.com/product/tailwind-webapp-svelte?ref=vtw-github-readme) | [![Vue Tailwind WebApp](https://github.com/creativetimofficial/public-assets/blob/master/vue-tailwind-webapp/vue-tailwind-webapp.jpg?raw=true)](https://www.creative-tim.com/product/vue-tailwind-webapp?ref=vtw-github-readme) + +## Documentation +The documentation for the Vue Tailwind WebApp is hosted at our website. ## Quick start +- Download from Creative Tim. +- Check it on Github. +## Files and Folder -- Download from Github. -- Check it on Github. +This is the project structure that you will get upon the download: +``` +vue-tailwind-webapp +. +├── CHANGELOG.md +├── ISSUE_TEMPLATE.md +├── LICENSE.md +├── README.md +├── babel.config.js +├── package.json +├── public +│ ├── favicon.ico +│ └── index.html +├── src +│ ├── App.vue +│ ├── assets +│ │ ├── img +│ │ │ ├── github.svg +│ │ │ └── google.svg +│ │ └── styles +│ │ ├── index.css +│ │ └── tailwind.css +│ ├── components +│ │ ├── Cards +│ │ │ ├── CardBarChart.vue +│ │ │ ├── CardLineChart.vue +│ │ │ ├── CardPageVisits.vue +│ │ │ ├── CardProfile.vue +│ │ │ ├── CardSettings.vue +│ │ │ ├── CardSocialTraffic.vue +│ │ │ ├── CardStats.vue +│ │ │ └── CardTable.vue +│ │ ├── Dropdowns +│ │ │ ├── IndexDropdown.vue +│ │ │ ├── NotificationDropdown.vue +│ │ │ ├── PagesDropdown.vue +│ │ │ ├── TableDropdown.vue +│ │ │ └── UserDropdown.vue +│ │ ├── Footers +│ │ │ ├── Footer.vue +│ │ │ ├── FooterAdmin.vue +│ │ │ └── FooterSmall.vue +│ │ ├── Headers +│ │ │ └── HeaderStats.vue +│ │ ├── Maps +│ │ │ └── MapExample.vue +│ │ ├── Navbars +│ │ │ ├── AdminNavbar.vue +│ │ │ ├── AuthNavbar.vue +│ │ │ └── IndexNavbar.vue +│ │ └── Sidebar +│ │ └── Sidebar.vue +│ ├── layouts +│ │ ├── Admin.vue +│ │ └── Auth.vue +│ ├── main.js +│ └── views +│ ├── Index.vue +│ ├── Landing.vue +│ ├── Profile.vue +│ ├── admin +│ │ ├── Dashboard.vue +│ │ ├── Maps.vue +│ │ ├── Settings.vue +│ │ └── Tables.vue +│ └── auth +│ ├── Login.vue +│ └── Register.vue +├── tailwind.config.js +└── vue.config.js +``` ## Browser Support @@ -74,32 +192,32 @@ At present, we officially aim to support the last two versions of the following ## Reporting Issues -We use GitHub Issues as the official bug tracker for the VueJS Dashboard Page. Here are some advices for our users that want to report an issue: +We use GitHub Issues as the official bug tracker for the Vue Tailwind WebApp. Here are some advices for our users that want to report an issue: -1. Make sure that you are using the latest version of the VueJS Dashboard Page. Check the CHANGELOG from your dashboard on our website. +1. Make sure that you are using the latest version of the Vue Tailwind WebApp. Check the CHANGELOG from your dashboard on our website. 2. Providing us reproducible steps for the issue will shorten the time it takes for it to be fixed. 3. Some issues may be browser specific, so specifying in what browser you encountered the issue might help. ## Licensing -- Copyright 2019 Creative Tim +- Copyright 2020 Creative Tim - - -- Licensed under MIT +- Licensed under MIT ## Useful Links - Tutorials -- Affiliate Program (earn money) -- Blog Creative Tim -- Free Products from Creative Tim -- Premium Products from Creative Tim -- React Products from Creative Tim -- Angular Products from Creative Tim -- VueJS Products from Creative Tim -- More products from Creative Tim -- Check our Bundles here +- Affiliate Program (earn money) +- Blog Creative Tim +- Free Products from Creative Tim +- Premium Products from Creative Tim +- React Products from Creative Tim +- Angular Products from Creative Tim +- VueJS Products from Creative Tim +- More products from Creative Tim +- Check our Bundles here +- Check our awesome builder here +- Check Tailwind Starter Kit, the project behind this product here ### Social Media @@ -113,77 +231,9 @@ Instagram: https://www.creative-tim.com/learning-lab/tailwind-starter-kit/#/dashboard?ref=vdp-tsk-readme -- Download Page: https://github.com/creativetimofficial/tailwind-starter-kit/tree/master/Dashboard%20Page/vuejs-dashboard-page?ref=vdp-tsk-readme -- Documentation: https://www.creative-tim.com/learning-lab/tailwind-starter-kit/#/documentation/dashboard?ref=vdp-tsk-readme -- License Agreement: https://www.creative-tim.com/license?ref=vdp-tsk-readme -- Support: https://www.creative-tim.com/contact-us?ref=vdp-tsk-readme -- Issues: Github Issues Page - - -## Versions - - - -### FREE Dashboards - -|Angular Dashboard Page|HTML Dashboard Page|React Dashboard Page|VueJS Dashboard Page| -| --- | --- | --- | --- | -| ![Angular Dashboard Page](https://raw.githubusercontent.com/creativetimofficial/tailwind-starter-kit/master/images/dashboard.jpg) | ![HTML Dashboard Page](https://raw.githubusercontent.com/creativetimofficial/tailwind-starter-kit/master/images/dashboard.jpg) | ![React Dashboard Page](https://raw.githubusercontent.com/creativetimofficial/tailwind-starter-kit/master/images/dashboard.jpg) | ![VueJS Dashboard Page](https://raw.githubusercontent.com/creativetimofficial/tailwind-starter-kit/master/images/dashboard.jpg) | - - - - -### FREE Design Systems (Kits) - - -|Angular Landing Page|HTML Landing Page|React Landing Page|VueJS Landing Page| -| --- | --- | --- | --- | -| ![Angular Landing Page](https://raw.githubusercontent.com/creativetimofficial/tailwind-starter-kit/master/images/landing.jpg) | ![HTML Landing Page](https://raw.githubusercontent.com/creativetimofficial/tailwind-starter-kit/master/images/landing.jpg) | ![React Landing Page](https://raw.githubusercontent.com/creativetimofficial/tailwind-starter-kit/master/images/landing.jpg) | ![VueJS Landing Page](https://raw.githubusercontent.com/creativetimofficial/tailwind-starter-kit/master/images/landing.jpg) | - - -|Angular Login Page|HTML Login Page|React Login Page|VueJS Login Page| -| --- | --- | --- | --- | -| ![Angular Login Page](https://raw.githubusercontent.com/creativetimofficial/tailwind-starter-kit/master/images/login.jpg) | ![HTML Login Page](https://raw.githubusercontent.com/creativetimofficial/tailwind-starter-kit/master/images/login.jpg) | ![React Login Page](https://raw.githubusercontent.com/creativetimofficial/tailwind-starter-kit/master/images/login.jpg) | ![VueJS Login Page](https://raw.githubusercontent.com/creativetimofficial/tailwind-starter-kit/master/images/login.jpg) | - - - -|Angular Profile Page|HTML Profile Page|React Profile Page|VueJS Profile Page| -| --- | --- | --- | --- | -| ![Angular Profile Page](https://raw.githubusercontent.com/creativetimofficial/tailwind-starter-kit/master/images/profile.jpg) | ![HTML Profile Page](https://raw.githubusercontent.com/creativetimofficial/tailwind-starter-kit/master/images/profile.jpg) | ![React Profile Page](https://raw.githubusercontent.com/creativetimofficial/tailwind-starter-kit/master/images/profile.jpg) | ![VueJS Profile Page](https://raw.githubusercontent.com/creativetimofficial/tailwind-starter-kit/master/images/profile.jpg) | - - - - - - - - -## File Structure -Within the download you'll find the following directories and files: - -``` -. -|-- README.md -|-- babel.config.js -|-- package.json -|-- public -| |-- apple-icon.png -| |-- favicon.ico -| `-- index.html -`-- src - |-- assets - | `-- img - | |-- blue.png - | `-- team-1-800x800.jpg - |-- components - | |-- BarChart.vue - | |-- LineChart.vue - | |-- Navbar.vue - | |-- NotificationDropdown.vue - | |-- Sidebar.vue - | `-- UserDropdown.vue - |-- main.js - `-- views - `-- Dashboard.vue -``` +- Demo: https://demos.creative-tim.com/vue-tailwind-webapp/?ref=vtw-readme +- Download Page: https://www.creative-tim.com/product/vue-tailwind-webapp +- Documentation: https://www.creative-tim.com/learning-lab/tailwind/overview-vuejs/webapp-js?ref=vtw-readme +- License Agreement: https://www.creative-tim.com/license?ref=vtw-readme +- Support: https://www.creative-tim.com/contact-us?ref=vtw-readme +- Issues: Github Issues Page diff --git a/babel.config.js b/babel.config.js index e955840..162a3ea 100644 --- a/babel.config.js +++ b/babel.config.js @@ -1,5 +1,3 @@ module.exports = { - presets: [ - '@vue/cli-plugin-babel/preset' - ] -} + presets: ["@vue/cli-plugin-babel/preset"], +}; diff --git a/gulpfile.js b/gulpfile.js new file mode 100644 index 0000000..9f8e5d7 --- /dev/null +++ b/gulpfile.js @@ -0,0 +1,83 @@ +const gulp = require("gulp"); +const gap = require("gulp-append-prepend"); + +gulp.task("licenses", async function () { + // this is to add Creative Tim licenses in the production mode for the minified js + gulp + .src("dist/js/*.js", { base: "./" }) + .pipe( + gap.prependText(`/*! + +========================================================= +* Vue Tailwind WebApp - v1.0.0 based on Tailwind Starter Kit by Creative Tim +========================================================= + +* Product Page: https://www.creative-tim.com/product/vue-tailwind-webapp +* Copyright 2020 Creative Tim (https://www.creative-tim.com) +* Licensed under MIT (https://github.com/creativetimofficial/vue-tailwind-webapp/blob/master/LICENSE.md) + +* Tailwind Starter Kit Page: https://www.creative-tim.com/learning-lab/tailwind-starter-kit/presentation + +* Coded by Creative Tim + +========================================================= + +* The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. + +*/`) + ) + .pipe(gulp.dest("./", { overwrite: true })); + + // this is to add Creative Tim licenses in the production mode for the minified html + gulp + .src("dist/index.html", { base: "./" }) + .pipe( + gap.prependText(``) + ) + .pipe(gulp.dest("./", { overwrite: true })); + + // this is to add Creative Tim licenses in the production mode for the minified css + gulp + .src("dist/css/*.css", { base: "./" }) + .pipe( + gap.prependText(`/*! + +========================================================= +* Vue Tailwind WebApp - v1.0.0 based on Tailwind Starter Kit by Creative Tim +========================================================= + +* Product Page: https://www.creative-tim.com/product/vue-tailwind-webapp +* Copyright 2020 Creative Tim (https://www.creative-tim.com) +* Licensed under MIT (https://github.com/creativetimofficial/vue-tailwind-webapp/blob/master/LICENSE.md) + +* Tailwind Starter Kit Page: https://www.creative-tim.com/learning-lab/tailwind-starter-kit/presentation + +* Coded by Creative Tim + +========================================================= + +* The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. + +*/`) + ) + .pipe(gulp.dest("./", { overwrite: true })); + return; +}); diff --git a/package.json b/package.json index 5986fd8..d0cecbd 100644 --- a/package.json +++ b/package.json @@ -1,23 +1,33 @@ { - "name": "vuejs-landing-page", - "version": "0.1.0", - "private": true, + "name": "vue-tailwind-webapp", + "homepage": "https://demos.creative-tim.com/vue-tailwind-webapp/", + "version": "1.0.0", + "description": "Vue Tailwind WebApp - A free Tailwind and VueJS WebApp template by Creative Tim.", + "repository": "https://github.com/creativetimofficial/vue-tailwind-webapp", + "license": "MIT", "scripts": { "serve": "vue-cli-service serve", - "build": "vue-cli-service build", - "lint": "vue-cli-service lint" + "build": "vue-cli-service build && gulp licenses", + "lint": "vue-cli-service lint", + "build:tailwind": "tailwind build src/assets/styles/index.css -o src/assets/styles/tailwind.css", + "install:clean": "rm -rf node_modules/ && rm -rf package-lock.json && npm install && npm run build:tailwind && npm run serve" }, "dependencies": { "@fortawesome/fontawesome-free": "5.14.0", - "@popperjs/core": "2.4.4", + "@popperjs/core": "2.5.1", + "@tailwindcss/custom-forms": "0.2.1", "chart.js": "2.9.3", "core-js": "3.6.5", - "vue": "2.6.12" + "gulp": "4.0.2", + "gulp-append-prepend": "1.0.8", + "tailwindcss": "1.8.10", + "vue": "2.6.12", + "vue-router": "3.4.3" }, "devDependencies": { - "@vue/cli-plugin-babel": "4.5.4", - "@vue/cli-plugin-eslint": "4.5.4", - "@vue/cli-service": "4.5.4", + "@vue/cli-plugin-babel": "4.5.6", + "@vue/cli-plugin-eslint": "4.5.6", + "@vue/cli-service": "4.5.6", "babel-eslint": "10.1.0", "eslint": "6.8.0", "eslint-plugin-vue": "6.2.2", diff --git a/public/index.html b/public/index.html index 2d8f29a..d8917a6 100644 --- a/public/index.html +++ b/public/index.html @@ -1,24 +1,43 @@ + - - - + + + - -
+ Page name + | ++ Visitors + | ++ Unique users + | ++ Bounce rate + | +
---|---|---|---|
+ /argon/ + | ++ 4,569 + | ++ 340 + | ++ + 46,53% + | +
+ /argon/index.html + | ++ 3,985 + | ++ 319 + | ++ + 46,53% + | +
+ /argon/charts.html + | ++ 3,513 + | ++ 294 + | ++ + 36,49% + | +
+ /argon/tables.html + | ++ 2,050 + | ++ 147 + | ++ + 50,87% + | +
+ /argon/profile.html + | ++ 1,795 + | ++ 190 + | ++ + 46,53% + | +
+ An artist of considerable range, Jenna the name taken by + Melbourne-raised, Brooklyn-based Nick Murphy writes, performs and + records all of his own music, giving it a warm, intimate feel with + a solid groove structure. An artist of considerable range. +
+ + Show more + ++ Referral + | ++ Visitors + | ++ |
---|---|---|
+ Facebook + | ++ 1,480 + | +
+
+ 60%
+
+
+
+
+
+
+ |
+
+ Facebook + | ++ 5,480 + | +
+
+ 70%
+
+
+
+
+
+
+ |
+
+ Google + | ++ 4,807 + | +
+
+ 80%
+
+
+
+
+
+
+ |
+
+ Instagram + | ++ 3,678 + | +
+
+ 75%
+
+
+
+
+
+
+ |
+
+ twitter + | ++ 2,645 + | +
+
+ 30%
+
+
+
+
+
+
+ |
+
+ + + {{ statPercent }}% + + {{ statDescripiron }} +
++ Project + | ++ Budget + | ++ Status + | ++ Users + | ++ Completion + | ++ |
---|---|---|---|---|---|
+ + + Argon Design System + + | ++ $2,500 USD + | ++ pending + | +
+
+
+
+
+
+
+ |
+
+
+ 60%
+
+
+
+
+
+
+ |
+
+ |
+
+ + + Angular Now UI Kit PRO + + | ++ $1,800 USD + | ++ + completed + | +
+
+
+
+
+
+
+ |
+
+
+ 100%
+
+
+
+
+
+
+ |
+
+ |
+
+ + + Black Dashboard Sketch + + | ++ $3,150 USD + | ++ delayed + | +
+
+
+
+
+
+
+ |
+
+
+ 73%
+
+
+
+
+
+
+ |
+
+ |
+
+ + + React Material Dashboard + + | ++ $4,400 USD + | ++ on schedule + | +
+
+
+
+
+
+
+ |
+
+
+ 90%
+
+
+
+
+
+
+ |
+
+ |
+
+ + + React Material Dashboard + + | ++ $2,200 USD + | ++ + completed + | +
+
+
+
+
+
+
+ |
+
+
+ 100%
+
+
+
+
+
+
+ |
+
+ |
+
- - 3.48% - - - Since last month - -
-- - 3.48% - - - Since last week - -
-- - 1.10% - - - Since yesterday - -
-- - 12% - - - Since last month - -
-- Page name - | -- Visitors - | -- Unique users - | -- Bounce rate - | -
---|---|---|---|
- /argon/ - | -- 4,569 - | -- 340 - | -- - 46,53% - | -
- /argon/index.html - | -- 3,985 - | -- 319 - | -- - 46,53% - | -
- /argon/charts.html - | -- 3,513 - | -- 294 - | -- - 36,49% - | -
- /argon/tables.html - | -- 2,050 - | -- 147 - | -- - 50,87% - | -
- /argon/profile.html - | -- 1,795 - | -- 190 - | -- - 46,53% - | -
- Referral - | -- Visitors - | -- |
---|---|---|
- Facebook - | -- 1,480 - | -
-
- 60%
-
-
-
-
-
-
- |
-
- Facebook - | -- 5,480 - | -
-
- 70%
-
-
-
-
-
-
- |
-
- Google - | -- 4,807 - | -
-
- 80%
-
-
-
-
-
-
- |
-
- Instagram - | -- 3,678 - | -
-
- 75%
-
-
-
-
-
-
- |
-
- twitter - | -- 2,645 - | -
-
- 30%
-
-
-
-
-
-
- |
-
+ Vue Tailwind WebApp is Free and Open Source. It does not change + or add any CSS to the already one from + + Tailwind CSS + + . It features multiple HTML elements and it comes with dynamic + components for ReactJS, Vue and Angular. +
+ ++ +++ Great for your awesome project +
++ Putting together a page has never been easier than matching + together pre-made components. From landing pages presentation + to login areas, you can easily customise and built your pages. +
+
+ Tailwind WebApp comes with a huge number of Fully Coded + CSS components. +
++ We also feature many dynamic components for React, NextJS, + Vue and Angular. +
++ This extension also comes with 3 sample pages. They are + fully coded so you can start working instantly. +
++ Built by developers for developers. You will love how easy + is to to work with Vue Tailwind WebApp. +
++ Every element that you need in a product comes built in as a + component. All components fit perfectly with each other and can + have different colours. +
++ In order to create a great User Experience some components require + JavaScript. In this way you can manipulate the elements on the + page and give more options to your users. +
++ We created a set of Components that are dynamic and come to help + you. +
++ This extension comes a lot of fully coded examples that help you + get started faster. You can adjust the colors and also the + programming language. You can change the text and images and + you're good to go. +
++ Vue Tailwind WebApp is a completly new product built using our + past experience in web templates. Take the examples we made for you + and start playing with them. +
++ Since + + Tailwind CSS + + is an open source project we wanted to continue this movement too. + You can give this version a try to feel the design and also test + the quality of the code! +
++ Get it free on Github and please help us spread the news with a + Star! +
+ + Github Star + ++ + 😍 + +
++ Cause if you do, it can be yours now. Hit the buttons below to + navigate to get the Free version for your next project. Build a + new web app or give an old project a new look! +
+ + ++ This is a simple example of a Landing Page you can build using + Vue Tailwind WebApp. It features multiple CSS components + based on the Tailwind CSS design system. +
++ Divide details about your product or agency work into parts. + A paragraph describing a feature will be enough. +
++ Keep you user engaged by providing meaningful information. + Remember that by this time, the user is curious. +
++ Write a few lines about each one. A paragraph describing a + feature will be enough. Keep you user engaged! +
++ Don't let your uses guess by attaching tooltips and popoves to + any element. Just make sure you enable them first via + JavaScript. +
++ The kit comes with three pre-built pages to help you get started + faster. You can change the text and images and you're good to + go. Just make sure you enable them first via JavaScript. +
++ +++ Top Notch Services +
++ The Arctic Ocean freezes every winter and much of the + sea-ice then thaws every summer, and that process will + continue whatever happens. +
+
+ The extension comes with three pre-built pages to help you get + started faster. You can change the text and images and you're + good to go. +
++ According to the National Oceanic and Atmospheric + Administration, Ted, Scambos, NSIDClead scentist, puts the + potentially record maximum. +
++ Web Developer +
++ Marketing Specialist +
++ UI/UX Designer +
++ Founder and CEO +
++ Put the potentially record low maximum sea ice extent tihs year + down to low ice. According to the National Oceanic and + Atmospheric Administration, Ted, Scambos. +
++ Some quick example text to build on the card title and make up + the bulk of the card's content. +
++ Some quick example text to build on the card title and make up + the bulk of the card's content. +
++ Some quick example text to build on the card title and make up + the bulk of the card's content. +
++ Complete this form and we will get back to you in 24 hours. +
++ An artist of considerable range, Jenna the name taken by + Melbourne-raised, Brooklyn-based Nick Murphy writes, + performs and records all of his own music, giving it a + warm, intimate feel with a solid groove structure. An + artist of considerable range. +
+ + Show more + +