aboutsummaryrefslogtreecommitdiff
path: root/src
diff options
context:
space:
mode:
Diffstat (limited to 'src')
-rw-r--r--src/components/Display/Display.css65
-rw-r--r--src/components/Display/DisplayItem.js2
-rw-r--r--src/components/Display/ItemsDisplay.js2
-rw-r--r--src/components/Display/SummaryDisplay.js2
-rw-r--r--src/components/Form/AddNewItemForm.js2
-rw-r--r--src/components/Form/Form.css136
-rw-r--r--src/components/Form/MetaInfoForm.js2
-rw-r--r--src/components/Form/RegisterItemForm.js2
-rw-r--r--src/components/Header/Header.css45
-rw-r--r--src/components/Header/Header.js3
-rw-r--r--src/index.js2
-rw-r--r--src/styles/Form.css0
-rw-r--r--src/styles/global.css40
13 files changed, 8 insertions, 295 deletions
diff --git a/src/components/Display/Display.css b/src/components/Display/Display.css
deleted file mode 100644
index c5917e3..0000000
--- a/src/components/Display/Display.css
+++ /dev/null
@@ -1,65 +0,0 @@
-@import url("https://fonts.googleapis.com/css2?family=Quicksand:wght@500&display=swap");
-/* Experimental color scheme */
-/* light theme */
-/*
-$defBG: #FFFFFF;
-$altBG: lightgray;
-$defFG: #000000;
-$altFG: #232627;
-$defLink: brown;
-$altLink: brown;
-
-$defShadow: 0px 0px 4px #232627;
-*/
-/* Inspired by Dracula */
-.ItemsDisplay,
-.ItemsDisplay table {
- width: 100%; }
-
-.ItemsDisplay {
- margin: 3rem auto; }
-
-.ItemsDisplay .legend {
- background-color: #383A59; }
-
-.ItemsDisplay th {
- font-size: 1.2rem; }
-
-.ItemsDisplay td {
- text-align: center;
- border-bottom: 1px solid lightblue;
- font-size: 1.5rem; }
-
-.ItemsDisplay .disabledBorder {
- border-bottom: 1px solid gray; }
-
-.ItemsDisplay .warningBorder {
- border-bottom: 1px solid red; }
-
-.ItemsDisplay .leftAlign {
- text-align: left; }
-
-.SummaryDisplayTR td {
- color: #FF79C6;
- font-size: 1.7rem; }
-
-.SummaryDisplay {
- width: 30%;
- padding: 0.5rem 2rem; }
-
-.SummaryDisplay h1 {
- font-size: 3rem;
- margin: 0.5rem -1.5rem;
- border-bottom: 1px dotted lightblue; }
-
-.SummaryDisplay table {
- width: 100%;
- margin: auto; }
-
-.SummaryDisplay td {
- font-size: 1.25rem;
- padding: 0.2rem 0; }
-
-.SummaryDisplay .grandTotal td {
- font-size: 2rem;
- color: #FF79C6; }
diff --git a/src/components/Display/DisplayItem.js b/src/components/Display/DisplayItem.js
index 8fe6d9a..04a7d8b 100644
--- a/src/components/Display/DisplayItem.js
+++ b/src/components/Display/DisplayItem.js
@@ -7,7 +7,7 @@
*/
import React from "react";
-import "./Display.css";
+import "./Display.scss";
const DisplayItem = (props) => {
const itemNumber = props.itemNumber;
diff --git a/src/components/Display/ItemsDisplay.js b/src/components/Display/ItemsDisplay.js
index c8aeb76..0a349f2 100644
--- a/src/components/Display/ItemsDisplay.js
+++ b/src/components/Display/ItemsDisplay.js
@@ -7,7 +7,7 @@
*/
import React from "react";
-import "./Display.css";
+import "./Display.scss";
import DisplayItem from "./DisplayItem";
import {SummaryDisplayTR} from "./SummaryDisplay";
diff --git a/src/components/Display/SummaryDisplay.js b/src/components/Display/SummaryDisplay.js
index 5cdcc93..a44e036 100644
--- a/src/components/Display/SummaryDisplay.js
+++ b/src/components/Display/SummaryDisplay.js
@@ -7,7 +7,7 @@
*/
import React from "react";
-import "./Display.css";
+import "./Display.scss";
const getBasicSummary = (items) => {
let totalRawPrice = 0;
diff --git a/src/components/Form/AddNewItemForm.js b/src/components/Form/AddNewItemForm.js
index 95145b1..3fc4c46 100644
--- a/src/components/Form/AddNewItemForm.js
+++ b/src/components/Form/AddNewItemForm.js
@@ -7,7 +7,7 @@
*/
import React, { useState } from "react";
-import "./Form.css";
+import "./Form.scss";
const AddNewItemForm = (props) => {
diff --git a/src/components/Form/Form.css b/src/components/Form/Form.css
deleted file mode 100644
index 1340151..0000000
--- a/src/components/Form/Form.css
+++ /dev/null
@@ -1,136 +0,0 @@
-/*
- * OpenBills - Self hosted browser app to generate and keep track of simple invoices
- * Version - 0
- * Licensed under the MIT license - https://opensource.org/licenses/MIT
- *
- * Copyright (c) 2021 Vidhu Kant Sharma
-*/
-@import url("https://fonts.googleapis.com/css2?family=Quicksand:wght@500&display=swap");
-/* Experimental color scheme */
-/* light theme */
-/*
-$defBG: #FFFFFF;
-$altBG: lightgray;
-$defFG: #000000;
-$altFG: #232627;
-$defLink: brown;
-$altLink: brown;
-
-$defShadow: 0px 0px 4px #232627;
-*/
-/* Inspired by Dracula */
-/* hide arrows in numericInputs */
-/* Chrome, Safari, Edge, Opera */
-input::-webkit-outer-spin-button,
-input::-webkit-inner-spin-button {
- -webkit-appearance: none;
- margin: 0; }
-
-/* Firefox */
-input[type=number] {
- -moz-appearance: textfield; }
-
-.formContainer {
- /*border: 1px solid pink;*/
- /*padding: 2rem;*/
- height: 50vh;
- border-radius: 1rem;
- padding: 1.5rem 0; }
-
-.addNewItemForm .textInputs,
-.addNewItemForm .numericInputs
-label {
- font-size: 1.5rem; }
-
-.addNewItemForm {
- display: flex;
- flex-direction: row;
- justify-content: space-between;
- height: 100%; }
-
-.addNewItemForm .textInputs,
-.addNewItemForm .numericInputs {
- border: 1px solid pink;
- width: 30%;
- justify-content: space-around; }
-
-.addNewItemForm .numericInputs input {
- width: 5.5rem; }
-
-.addNewItemForm .menuButtons {
- border: 1px solid pink;
- width: 15%;
- justify-content: space-around; }
-
-.addNewItemForm .menuButtons * {
- width: 100%; }
-
-.addNewItemForm div {
- display: flex;
- flex-direction: column;
- /*border-radius: 1rem;*/
- padding: 1.5rem;
- overflow: scroll; }
-
-/* hide scrollbars */
-.addNewItemForm div::-webkit-scrollbar {
- display: none;
- /* Chrome/Safari/Opera */ }
-
-.addNewItemForm div {
- -ms-overflow-style: none;
- /* IE and Edge */
- scrollbar-width: none;
- /* Firefox */ }
-
-.addNewItemForm label {
- display: flex;
- justify-content: space-between;
- padding: 0.8rem 0;
- border-bottom: 1px dotted lightblue; }
-
-.RegisterItemFormContainer {
- /*display: none;*/
- position: fixed;
- width: 95%;
- height: 70vh;
- left: 0;
- right: 0;
- margin: auto;
- top: 15vh;
- background-color: #383A59; }
-
-.RegisterItemForm .textInputs,
-.RegisterItemForm .numericInputs {
- width: 40%; }
-
-.RegisterItemForm {
- width: 95%;
- height: 60vh;
- margin: 1rem auto;
- justify-content: space-around; }
-
-.RegisterItemFormContainer .menu {
- position: absolute;
- right: 1rem;
- bottom: 0.25rem; }
-
-.RegisterItemFormContainer input[type=submit],
-.RegisterItemFormContainer input[type=button] {
- margin: 1rem; }
-
-.MetaInfoForm {
- width: 60%; }
-
-@media only screen and (max-device-width: 480px) {
- .formContainer {
- padding: 0.5rem;
- height: auto; }
- .addNewItemForm {
- flex-direction: column; }
- .addNewItemForm .textInputs,
- .addNewItemForm .numericInputs,
- .addNewItemForm .menuButtons {
- width: 90%;
- padding: 1rem;
- margin: 1rem auto; } }
diff --git a/src/components/Form/MetaInfoForm.js b/src/components/Form/MetaInfoForm.js
index 96287bb..5d9e3c3 100644
--- a/src/components/Form/MetaInfoForm.js
+++ b/src/components/Form/MetaInfoForm.js
@@ -7,7 +7,7 @@
*/
import React /*, { useState }*/ from "react";
-import "./Form.css";
+import "./Form.scss";
const MetaInfoForm = () => {
return (
diff --git a/src/components/Form/RegisterItemForm.js b/src/components/Form/RegisterItemForm.js
index 1e2f32d..ca4d991 100644
--- a/src/components/Form/RegisterItemForm.js
+++ b/src/components/Form/RegisterItemForm.js
@@ -13,7 +13,7 @@
import React, { useState } from "react";
import axios from "axios";
-import "./Form.css";
+import "./Form.scss";
const RegisterItemForm = (props) => {
diff --git a/src/components/Header/Header.css b/src/components/Header/Header.css
deleted file mode 100644
index 5dc483d..0000000
--- a/src/components/Header/Header.css
+++ /dev/null
@@ -1,45 +0,0 @@
-@import url("https://fonts.googleapis.com/css2?family=Quicksand:wght@500&display=swap");
-/* Experimental color scheme */
-/* light theme */
-/*
-$defBG: #FFFFFF;
-$altBG: lightgray;
-$defFG: #000000;
-$altFG: #232627;
-$defLink: brown;
-$altLink: brown;
-
-$defShadow: 0px 0px 4px #232627;
-*/
-/* Inspired by Dracula */
-.header {
- display: flex;
- flex-direction: row;
- flex-wrap: nowrap;
- align-items: center;
- justify-content: space-between;
- position: static;
- margin: 0 0 1.5rem 0;
- padding: none;
- width: 100%;
- height: 5rem;
- background-color: #383A59;
- box-shadow: 0px 4px 4px #383A59; }
-
-.header div {
- margin: auto 1rem; }
-
-nav a {
- text-decoration: none;
- padding: 0.3rem;
- color: #F2F2F2; }
-
-.placeholder {
- width: 5rem;
- height: 3rem; }
-
-.inlineBlock {
- display: inline-block; }
-
-p, h1, h2, h3, h4, h5, h6 {
- color: #F2F2F2; }
diff --git a/src/components/Header/Header.js b/src/components/Header/Header.js
index ad8d59a..14edb76 100644
--- a/src/components/Header/Header.js
+++ b/src/components/Header/Header.js
@@ -7,8 +7,7 @@
*/
import React from "react";
-import "./Header.css";
-// import React, { useState } from "react";
+import "./Header.scss";
const Header = () => {
// const [activeLink, updateActiveLink] = useState("home")
diff --git a/src/index.js b/src/index.js
index f618682..0d1a5dc 100644
--- a/src/index.js
+++ b/src/index.js
@@ -8,7 +8,7 @@
// import React from 'react';
import ReactDOM from 'react-dom';
-import "./styles/global.css"
+import "./styles/global.scss"
import App from "./components/App";
ReactDOM.render(App(), document.getElementById("root"))
diff --git a/src/styles/Form.css b/src/styles/Form.css
deleted file mode 100644
index e69de29..0000000
--- a/src/styles/Form.css
+++ /dev/null
diff --git a/src/styles/global.css b/src/styles/global.css
deleted file mode 100644
index 30fc9e5..0000000
--- a/src/styles/global.css
+++ /dev/null
@@ -1,40 +0,0 @@
-@import url("https://fonts.googleapis.com/css2?family=Quicksand:wght@500&display=swap");
-/* Experimental color scheme */
-/* light theme */
-/*
-$defBG: #FFFFFF;
-$altBG: lightgray;
-$defFG: #000000;
-$altFG: #232627;
-$defLink: brown;
-$altLink: brown;
-
-$defShadow: 0px 0px 4px #232627;
-*/
-/* Inspired by Dracula */
-* {
- font-family: "Quicksand", sans-serif; }
-
-body {
- background-color: #282A36;
- color: #F2F2F2;
- margin: 0; }
-
-.root-content {
- width: 95%;
- margin: auto;
- margin-bottom: 3rem; }
-
-.BillingPageFlex {
- display: flex;
- flex-direction: row;
- justify-content: space-between;
- height: 70vh; }
-
-.BillingPageFlex div {
- box-sizing: border-box;
- border: 1px solid pink; }
-
-@media only screen and (max-device-width: 480px) {
- .root-content {
- width: 95%; } }