Skip to content

Commit d003438

Browse files
committed
tailwind config changes
1 parent 66ccfe6 commit d003438

File tree

7 files changed

+70
-92
lines changed

7 files changed

+70
-92
lines changed

package.json

Lines changed: 52 additions & 52 deletions
Original file line numberDiff line numberDiff line change
@@ -1,54 +1,54 @@
11
{
2-
"name": "vue-tailwindcss-dark-mode",
3-
"version": "0.1.0",
4-
"private": true,
5-
"scripts": {
6-
"serve": "vue-cli-service serve",
7-
"build": "vue-cli-service build",
8-
"lint": "vue-cli-service lint"
9-
},
10-
"dependencies": {
11-
"@tailwindcss/forms": "^0.3.3",
12-
"@tailwindcss/postcss7-compat": "^2.0.2",
13-
"autoprefixer": "^9",
14-
"core-js": "^3.6.5",
15-
"feather-icons": "^4.28.0",
16-
"postcss": "^7",
17-
"postcss-flexbugs-fixes": "^5.0.2",
18-
"postcss-import": "^14.0.2",
19-
"postcss-preset-env": "^6.7.0",
20-
"tailwindcss": "npm:@tailwindcss/postcss7-compat@^2.0.2",
21-
"vue": "^3.0.0",
22-
"vue-router": "^4.0.0-0"
23-
},
24-
"devDependencies": {
25-
"@vue/cli-plugin-babel": "~4.5.0",
26-
"@vue/cli-plugin-eslint": "~4.5.0",
27-
"@vue/cli-plugin-router": "~4.5.0",
28-
"@vue/cli-service": "~4.5.0",
29-
"@vue/compiler-sfc": "^3.0.0",
30-
"babel-eslint": "^10.1.0",
31-
"eslint": "^6.7.2",
32-
"eslint-plugin-vue": "^7.0.0",
33-
"vue-cli-plugin-tailwind": "~2.0.6"
34-
},
35-
"eslintConfig": {
36-
"root": true,
37-
"env": {
38-
"node": true
39-
},
40-
"extends": [
41-
"plugin:vue/vue3-essential",
42-
"eslint:recommended"
43-
],
44-
"parserOptions": {
45-
"parser": "babel-eslint"
46-
},
47-
"rules": {}
48-
},
49-
"browserslist": [
50-
"> 1%",
51-
"last 2 versions",
52-
"not dead"
53-
]
2+
"name": "vuejs-tailwindcss-portfolio",
3+
"version": "0.1.0",
4+
"private": true,
5+
"scripts": {
6+
"serve": "vue-cli-service serve",
7+
"build": "vue-cli-service build",
8+
"lint": "vue-cli-service lint"
9+
},
10+
"dependencies": {
11+
"@tailwindcss/forms": "^0.3.3",
12+
"@tailwindcss/postcss7-compat": "^2.0.2",
13+
"autoprefixer": "^9",
14+
"core-js": "^3.6.5",
15+
"feather-icons": "^4.28.0",
16+
"postcss": "^7",
17+
"postcss-flexbugs-fixes": "^5.0.2",
18+
"postcss-import": "^14.0.2",
19+
"postcss-preset-env": "^6.7.0",
20+
"tailwindcss": "npm:@tailwindcss/postcss7-compat@^2.0.2",
21+
"vue": "^3.0.0",
22+
"vue-router": "^4.0.0-0"
23+
},
24+
"devDependencies": {
25+
"@vue/cli-plugin-babel": "~4.5.0",
26+
"@vue/cli-plugin-eslint": "~4.5.0",
27+
"@vue/cli-plugin-router": "~4.5.0",
28+
"@vue/cli-service": "~4.5.0",
29+
"@vue/compiler-sfc": "^3.0.0",
30+
"babel-eslint": "^10.1.0",
31+
"eslint": "^6.7.2",
32+
"eslint-plugin-vue": "^7.0.0",
33+
"vue-cli-plugin-tailwind": "~2.0.6"
34+
},
35+
"eslintConfig": {
36+
"root": true,
37+
"env": {
38+
"node": true
39+
},
40+
"extends": [
41+
"plugin:vue/vue3-essential",
42+
"eslint:recommended"
43+
],
44+
"parserOptions": {
45+
"parser": "babel-eslint"
46+
},
47+
"rules": {}
48+
},
49+
"browserslist": [
50+
"> 1%",
51+
"last 2 versions",
52+
"not dead"
53+
]
5454
}

src/assets/css/app.css

Lines changed: 6 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -7,28 +7,16 @@
77
/*
88
** Light Mode: Background Colors Variables
99
*/
10-
--bg-background-primary: #f7f8fc;
11-
--bg-background-secondary: #ffffff;
12-
--bg-background-ternary: #f6f7f8;
13-
/*
14-
** Light Mode: Body Text Colors Variables
15-
*/
16-
--text-liText-primary: rgba(107, 114, 128, 1);
17-
--text-liText-secondary: rgba(75, 85, 99, 1);
18-
--text-liText-ternary: rgba(31, 41, 55, 1);
10+
--bg-primary: #f7f8fc;
11+
--bg-secondary: #ffffff;
12+
--bg-ternary: #f6f7f8;
1913
}
2014

2115
.theme-dark {
2216
/*
2317
** Dark Mode: Background Colors Variables
2418
*/
25-
--bg-background-primary: #0d2438;
26-
--bg-background-secondary: #102d44;
27-
--bg-background-ternary: #1e3851;
28-
/*
29-
** Dark Mode: Body Text Colors Variables
30-
*/
31-
--text-liText-primary: #ffffff;
32-
--text-liText-secondary: #f7f8fc;
33-
--text-liText-ternary: #f6f7f8;
19+
--bg-primary: #0d2438;
20+
--bg-secondary: #102d44;
21+
--bg-ternary: #1e3851;
3422
}

src/assets/css/tailwind.css

Lines changed: 6 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -8,28 +8,16 @@
88
/*
99
** Light Mode: Background Colors Variables
1010
*/
11-
--bg-background-primary: #f7f8fc;
12-
--bg-background-secondary: #ffffff;
13-
--bg-background-ternary: #f6f7f8;
14-
/*
15-
** Light Mode: Body Text Colors Variables
16-
*/
17-
--text-liText-primary: rgba(107, 114, 128, 1);
18-
--text-liText-secondary: rgba(75, 85, 99, 1);
19-
--text-liText-ternary: rgba(31, 41, 55, 1);
11+
--bg-primary: #f7f8fc;
12+
--bg-secondary: #ffffff;
13+
--bg-ternary: #f6f7f8;
2014
}
2115

2216
.theme-dark {
2317
/*
2418
** Dark Mode: Background Colors Variables
2519
*/
26-
--bg-background-primary: #0d2438;
27-
--bg-background-secondary: #102d44;
28-
--bg-background-ternary: #1e3851;
29-
/*
30-
** Dark Mode: Body Text Colors Variables
31-
*/
32-
--text-liText-primary: #ffffff;
33-
--text-liText-secondary: #f7f8fc;
34-
--text-liText-ternary: #f6f7f8;
20+
--bg-primary: #0d2438;
21+
--bg-secondary: #102d44;
22+
--bg-ternary: #1e3851;
3523
}

src/components/about/AboutCounter.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
<template>
2-
<div class="mt-10 sm:mt-20 bg-primary-light dark:bg-primary-dark shadow-sm">
2+
<div class="mt-10 sm:mt-20 bg-primary-light dark:bg-ternary-dark shadow-sm">
33
<div
44
class="container mx-auto py-20 block sm:flex sm:justify-between sm:items-center"
55
>

src/main.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,5 +19,5 @@ if (
1919
) {
2020
document.querySelector('body').classList.add('bg-primary-dark');
2121
} else {
22-
document.querySelector('body').classList.add('bg-primary-light');
22+
document.querySelector('body').classList.add('bg-secondary-light');
2323
}

src/views/Contact.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
<div class="w-full sm:w-1/2">
44
<div class="leading-loose">
55
<form
6-
class="max-w-xl m-4 p-6 sm:p-10 bg-white rounded-xl shadow-xl text-left"
6+
class="max-w-xl m-4 p-6 sm:p-10 bg-secondary-light dark:bg-secondary-dark rounded-xl shadow-xl text-left"
77
>
88
<p class="text-gray-600 text-2xl font-semibold mb-8">
99
Contact Form

tailwind.config.js

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,7 @@
11
module.exports = {
2-
content: ['./src/**/*.vue', './src/**/*.js', './src/**/*.html'],
2+
purge: {
3+
content: ['./src/**/*.vue', './src/**/*.js', './src/**/*.html'],
4+
},
35
darkMode: 'class',
46
theme: {
57
extend: {

0 commit comments

Comments
 (0)