From d1814ac895ee79de7b23a55c6388bb62b70bcbf4 Mon Sep 17 00:00:00 2001 From: codevictory Date: Sun, 14 Nov 2021 20:47:57 +0200 Subject: [PATCH] CSS -> SCSS --- package-lock.json | 202 ++++++++++++++++++ package.json | 1 + src/{App.css => App.scss} | 0 src/App.tsx | 2 +- src/components/Header.tsx | 2 +- src/components/Menu.tsx | 2 +- src/components/NotFound.tsx | 2 +- src/components/Program.tsx | 2 +- src/components/RegForm.tsx | 2 +- src/components/SideNav.tsx | 2 +- .../styles/{header.css => header.scss} | 0 src/components/styles/{menu.css => menu.scss} | 0 .../styles/{notFound.css => notFound.scss} | 0 .../styles/{program.css => program.scss} | 0 .../styles/{regForm.css => regForm.scss} | 0 .../styles/{sideNav.css => sideNav.scss} | 0 src/{index.css => index.scss} | 0 src/index.tsx | 2 +- src/pages/Main.tsx | 2 +- src/pages/Registration.tsx | 2 +- src/pages/styles/{main.css => main.scss} | 0 .../{registration.css => registration.scss} | 0 src/shared.css | 0 23 files changed, 213 insertions(+), 10 deletions(-) rename src/{App.css => App.scss} (100%) rename src/components/styles/{header.css => header.scss} (100%) rename src/components/styles/{menu.css => menu.scss} (100%) rename src/components/styles/{notFound.css => notFound.scss} (100%) rename src/components/styles/{program.css => program.scss} (100%) rename src/components/styles/{regForm.css => regForm.scss} (100%) rename src/components/styles/{sideNav.css => sideNav.scss} (100%) rename src/{index.css => index.scss} (100%) rename src/pages/styles/{main.css => main.scss} (100%) rename src/pages/styles/{registration.css => registration.scss} (100%) delete mode 100644 src/shared.css diff --git a/package-lock.json b/package-lock.json index 8c04bb5..fcf8d9d 100644 --- a/package-lock.json +++ b/package-lock.json @@ -19,6 +19,7 @@ "react-dom": "^17.0.2", "react-router-dom": "^5.3.0", "react-scripts": "4.0.3", + "sass": "^1.43.4", "typescript": "^4.1.2" }, "devDependencies": { @@ -17127,6 +17128,20 @@ "resolved": "https://registry.npmjs.org/sanitize.css/-/sanitize.css-10.0.0.tgz", "integrity": "sha512-vTxrZz4dX5W86M6oVWVdOVe72ZiPs41Oi7Z6Km4W5Turyz28mrXSJhhEBZoRtzJWIv3833WKVwLSDWWkEfupMg==" }, + "node_modules/sass": { + "version": "1.43.4", + "resolved": "https://registry.npmjs.org/sass/-/sass-1.43.4.tgz", + "integrity": "sha512-/ptG7KE9lxpGSYiXn7Ar+lKOv37xfWsZRtFYal2QHNigyVQDx685VFT/h7ejVr+R8w7H4tmUgtulsKl5YpveOg==", + "dependencies": { + "chokidar": ">=3.0.0 <4.0.0" + }, + "bin": { + "sass": "sass.js" + }, + "engines": { + "node": ">=8.9.0" + } + }, "node_modules/sass-loader": { "version": "10.1.1", "resolved": "https://registry.npmjs.org/sass-loader/-/sass-loader-10.1.1.tgz", @@ -17194,6 +17209,109 @@ "node": ">=10" } }, + "node_modules/sass/node_modules/anymatch": { + "version": "3.1.2", + "resolved": "https://registry.npmjs.org/anymatch/-/anymatch-3.1.2.tgz", + "integrity": "sha512-P43ePfOAIupkguHUycrc4qJ9kz8ZiuOUijaETwX7THt0Y/GNK7v0aa8rY816xWjZ7rJdA5XdMcpVFTKMq+RvWg==", + "dependencies": { + "normalize-path": "^3.0.0", + "picomatch": "^2.0.4" + }, + "engines": { + "node": ">= 8" + } + }, + "node_modules/sass/node_modules/binary-extensions": { + "version": "2.2.0", + "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-2.2.0.tgz", + "integrity": "sha512-jDctJ/IVQbZoJykoeHbhXpOlNBqGNcwXJKJog42E5HDPUwQTSdjCHdihjj0DlnheQ7blbT6dHOafNAiS8ooQKA==", + "engines": { + "node": ">=8" + } + }, + "node_modules/sass/node_modules/braces": { + "version": "3.0.2", + "resolved": "https://registry.npmjs.org/braces/-/braces-3.0.2.tgz", + "integrity": "sha512-b8um+L1RzM3WDSzvhm6gIz1yfTbBt6YTlcEKAvsmqCZZFw46z626lVj9j1yEPW33H5H+lBQpZMP1k8l+78Ha0A==", + "dependencies": { + "fill-range": "^7.0.1" + }, + "engines": { + "node": ">=8" + } + }, + "node_modules/sass/node_modules/chokidar": { + "version": "3.5.2", + "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.5.2.tgz", + "integrity": "sha512-ekGhOnNVPgT77r4K/U3GDhu+FQ2S8TnK/s2KbIGXi0SZWuwkZ2QNyfWdZW+TVfn84DpEP7rLeCt2UI6bJ8GwbQ==", + "dependencies": { + "anymatch": "~3.1.2", + "braces": "~3.0.2", + "glob-parent": "~5.1.2", + "is-binary-path": "~2.1.0", + "is-glob": "~4.0.1", + "normalize-path": "~3.0.0", + "readdirp": "~3.6.0" + }, + "engines": { + "node": ">= 8.10.0" + }, + "optionalDependencies": { + "fsevents": "~2.3.2" + } + }, + "node_modules/sass/node_modules/fill-range": { + "version": "7.0.1", + "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.0.1.tgz", + "integrity": "sha512-qOo9F+dMUmC2Lcb4BbVvnKJxTPjCm+RRpe4gDuGrzkL7mEVl/djYSu2OdQ2Pa302N4oqkSg9ir6jaLWJ2USVpQ==", + "dependencies": { + "to-regex-range": "^5.0.1" + }, + "engines": { + "node": ">=8" + } + }, + "node_modules/sass/node_modules/is-binary-path": { + "version": "2.1.0", + "resolved": "https://registry.npmjs.org/is-binary-path/-/is-binary-path-2.1.0.tgz", + "integrity": "sha512-ZMERYes6pDydyuGidse7OsHxtbI7WVeUEozgR/g7rd0xUimYNlvZRE/K2MgZTjWy725IfelLeVcEM97mmtRGXw==", + "dependencies": { + "binary-extensions": "^2.0.0" + }, + "engines": { + "node": ">=8" + } + }, + "node_modules/sass/node_modules/is-number": { + "version": "7.0.0", + "resolved": "https://registry.npmjs.org/is-number/-/is-number-7.0.0.tgz", + "integrity": "sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==", + "engines": { + "node": ">=0.12.0" + } + }, + "node_modules/sass/node_modules/readdirp": { + "version": "3.6.0", + "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-3.6.0.tgz", + "integrity": "sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==", + "dependencies": { + "picomatch": "^2.2.1" + }, + "engines": { + "node": ">=8.10.0" + } + }, + "node_modules/sass/node_modules/to-regex-range": { + "version": "5.0.1", + "resolved": "https://registry.npmjs.org/to-regex-range/-/to-regex-range-5.0.1.tgz", + "integrity": "sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==", + "dependencies": { + "is-number": "^7.0.0" + }, + "engines": { + "node": ">=8.0" + } + }, "node_modules/sax": { "version": "1.2.4", "resolved": "https://registry.npmjs.org/sax/-/sax-1.2.4.tgz", @@ -33982,6 +34100,90 @@ "resolved": "https://registry.npmjs.org/sanitize.css/-/sanitize.css-10.0.0.tgz", "integrity": "sha512-vTxrZz4dX5W86M6oVWVdOVe72ZiPs41Oi7Z6Km4W5Turyz28mrXSJhhEBZoRtzJWIv3833WKVwLSDWWkEfupMg==" }, + "sass": { + "version": "1.43.4", + "resolved": "https://registry.npmjs.org/sass/-/sass-1.43.4.tgz", + "integrity": "sha512-/ptG7KE9lxpGSYiXn7Ar+lKOv37xfWsZRtFYal2QHNigyVQDx685VFT/h7ejVr+R8w7H4tmUgtulsKl5YpveOg==", + "requires": { + "chokidar": ">=3.0.0 <4.0.0" + }, + "dependencies": { + "anymatch": { + "version": "3.1.2", + "resolved": "https://registry.npmjs.org/anymatch/-/anymatch-3.1.2.tgz", + "integrity": "sha512-P43ePfOAIupkguHUycrc4qJ9kz8ZiuOUijaETwX7THt0Y/GNK7v0aa8rY816xWjZ7rJdA5XdMcpVFTKMq+RvWg==", + "requires": { + "normalize-path": "^3.0.0", + "picomatch": "^2.0.4" + } + }, + "binary-extensions": { + "version": "2.2.0", + "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-2.2.0.tgz", + "integrity": "sha512-jDctJ/IVQbZoJykoeHbhXpOlNBqGNcwXJKJog42E5HDPUwQTSdjCHdihjj0DlnheQ7blbT6dHOafNAiS8ooQKA==" + }, + "braces": { + "version": "3.0.2", + "resolved": "https://registry.npmjs.org/braces/-/braces-3.0.2.tgz", + "integrity": "sha512-b8um+L1RzM3WDSzvhm6gIz1yfTbBt6YTlcEKAvsmqCZZFw46z626lVj9j1yEPW33H5H+lBQpZMP1k8l+78Ha0A==", + "requires": { + "fill-range": "^7.0.1" + } + }, + "chokidar": { + "version": "3.5.2", + "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.5.2.tgz", + "integrity": "sha512-ekGhOnNVPgT77r4K/U3GDhu+FQ2S8TnK/s2KbIGXi0SZWuwkZ2QNyfWdZW+TVfn84DpEP7rLeCt2UI6bJ8GwbQ==", + "requires": { + "anymatch": "~3.1.2", + "braces": "~3.0.2", + "fsevents": "~2.3.2", + "glob-parent": "~5.1.2", + "is-binary-path": "~2.1.0", + "is-glob": "~4.0.1", + "normalize-path": "~3.0.0", + "readdirp": "~3.6.0" + } + }, + "fill-range": { + "version": "7.0.1", + "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.0.1.tgz", + "integrity": "sha512-qOo9F+dMUmC2Lcb4BbVvnKJxTPjCm+RRpe4gDuGrzkL7mEVl/djYSu2OdQ2Pa302N4oqkSg9ir6jaLWJ2USVpQ==", + "requires": { + "to-regex-range": "^5.0.1" + } + }, + "is-binary-path": { + "version": "2.1.0", + "resolved": "https://registry.npmjs.org/is-binary-path/-/is-binary-path-2.1.0.tgz", + "integrity": "sha512-ZMERYes6pDydyuGidse7OsHxtbI7WVeUEozgR/g7rd0xUimYNlvZRE/K2MgZTjWy725IfelLeVcEM97mmtRGXw==", + "requires": { + "binary-extensions": "^2.0.0" + } + }, + "is-number": { + "version": "7.0.0", + "resolved": "https://registry.npmjs.org/is-number/-/is-number-7.0.0.tgz", + "integrity": "sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==" + }, + "readdirp": { + "version": "3.6.0", + "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-3.6.0.tgz", + "integrity": "sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==", + "requires": { + "picomatch": "^2.2.1" + } + }, + "to-regex-range": { + "version": "5.0.1", + "resolved": "https://registry.npmjs.org/to-regex-range/-/to-regex-range-5.0.1.tgz", + "integrity": "sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==", + "requires": { + "is-number": "^7.0.0" + } + } + } + }, "sass-loader": { "version": "10.1.1", "resolved": "https://registry.npmjs.org/sass-loader/-/sass-loader-10.1.1.tgz", diff --git a/package.json b/package.json index 1aa2ccb..f7ce3ba 100644 --- a/package.json +++ b/package.json @@ -14,6 +14,7 @@ "react-dom": "^17.0.2", "react-router-dom": "^5.3.0", "react-scripts": "4.0.3", + "sass": "^1.43.4", "typescript": "^4.1.2" }, "scripts": { diff --git a/src/App.css b/src/App.scss similarity index 100% rename from src/App.css rename to src/App.scss diff --git a/src/App.tsx b/src/App.tsx index 0dbde27..4258b9e 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -1,4 +1,4 @@ -import './App.css'; +import "./App.scss"; import { BrowserRouter as Router, Switch, Route, Redirect } from "react-router-dom"; import { Main } from './pages/Main'; import { Registration } from './pages/Registration'; diff --git a/src/components/Header.tsx b/src/components/Header.tsx index eacd691..3590012 100644 --- a/src/components/Header.tsx +++ b/src/components/Header.tsx @@ -1,4 +1,4 @@ -import "./styles/header.css" +import "./styles/header.scss" export const Header = () => { return ( diff --git a/src/components/Menu.tsx b/src/components/Menu.tsx index d1a2f09..b530182 100644 --- a/src/components/Menu.tsx +++ b/src/components/Menu.tsx @@ -1,4 +1,4 @@ -import "./styles/menu.css"; +import "./styles/menu.scss"; export const Menu = () => { return ( diff --git a/src/components/NotFound.tsx b/src/components/NotFound.tsx index 1fbaa7e..9fdda6e 100644 --- a/src/components/NotFound.tsx +++ b/src/components/NotFound.tsx @@ -1,4 +1,4 @@ -import "./styles/notFound.css"; +import "./styles/notFound.scss"; export const NotFound = () => { return ( diff --git a/src/components/Program.tsx b/src/components/Program.tsx index 9c5b7aa..515fd79 100644 --- a/src/components/Program.tsx +++ b/src/components/Program.tsx @@ -1,5 +1,5 @@ import { Link } from 'react-router-dom'; -import "./styles/program.css"; +import "./styles/program.scss"; export const Program = () => { return ( diff --git a/src/components/RegForm.tsx b/src/components/RegForm.tsx index 8021631..b4752a3 100644 --- a/src/components/RegForm.tsx +++ b/src/components/RegForm.tsx @@ -2,7 +2,7 @@ import { Button, Checkbox, Col, Form, Input, Row, Select } from 'antd'; import { useParams } from 'react-router'; import { MinusCircleOutlined, PlusOutlined } from '@ant-design/icons'; -import "./styles/regForm.css"; +import "./styles/regForm.scss"; import { addVisitor } from '../api'; import { arrayToString, capFirstLetter } from './utils'; import { Visitor } from '../model/visitor'; diff --git a/src/components/SideNav.tsx b/src/components/SideNav.tsx index 4c09d09..d67f77d 100644 --- a/src/components/SideNav.tsx +++ b/src/components/SideNav.tsx @@ -1,4 +1,4 @@ -import "./styles/sideNav.css"; +import "./styles/sideNav.scss"; import { Link } from 'react-router-dom'; export const SideNav = () => { diff --git a/src/components/styles/header.css b/src/components/styles/header.scss similarity index 100% rename from src/components/styles/header.css rename to src/components/styles/header.scss diff --git a/src/components/styles/menu.css b/src/components/styles/menu.scss similarity index 100% rename from src/components/styles/menu.css rename to src/components/styles/menu.scss diff --git a/src/components/styles/notFound.css b/src/components/styles/notFound.scss similarity index 100% rename from src/components/styles/notFound.css rename to src/components/styles/notFound.scss diff --git a/src/components/styles/program.css b/src/components/styles/program.scss similarity index 100% rename from src/components/styles/program.css rename to src/components/styles/program.scss diff --git a/src/components/styles/regForm.css b/src/components/styles/regForm.scss similarity index 100% rename from src/components/styles/regForm.css rename to src/components/styles/regForm.scss diff --git a/src/components/styles/sideNav.css b/src/components/styles/sideNav.scss similarity index 100% rename from src/components/styles/sideNav.css rename to src/components/styles/sideNav.scss diff --git a/src/index.css b/src/index.scss similarity index 100% rename from src/index.css rename to src/index.scss diff --git a/src/index.tsx b/src/index.tsx index 6832e78..fe78e25 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -1,6 +1,6 @@ import React from 'react'; import ReactDOM from 'react-dom'; -import './index.css'; +import './index.scss'; import App from './App'; ReactDOM.render( diff --git a/src/pages/Main.tsx b/src/pages/Main.tsx index 60e4fcc..d12cb31 100644 --- a/src/pages/Main.tsx +++ b/src/pages/Main.tsx @@ -1,4 +1,4 @@ -import "./styles/main.css"; +import "./styles/main.scss"; import { useParams } from "react-router-dom"; import { Menu } from '../components/Menu'; diff --git a/src/pages/Registration.tsx b/src/pages/Registration.tsx index 5d497d1..d3074b0 100644 --- a/src/pages/Registration.tsx +++ b/src/pages/Registration.tsx @@ -1,4 +1,4 @@ -import "./styles/registration.css"; +import "./styles/registration.scss"; import { Header } from '../components/Header' import { RegForm } from '../components/RegForm' diff --git a/src/pages/styles/main.css b/src/pages/styles/main.scss similarity index 100% rename from src/pages/styles/main.css rename to src/pages/styles/main.scss diff --git a/src/pages/styles/registration.css b/src/pages/styles/registration.scss similarity index 100% rename from src/pages/styles/registration.css rename to src/pages/styles/registration.scss diff --git a/src/shared.css b/src/shared.css deleted file mode 100644 index e69de29..0000000