Skip to content

Commit f90d6e6

Browse files
committed
preliminary cleanup
1 parent d2ee60d commit f90d6e6

13 files changed

+61
-104
lines changed

package-lock.json

-39
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

package.json

-1
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,6 @@
2020
"@babel/core": "^7.16.7",
2121
"@babel/preset-env": "^7.16.8",
2222
"@babel/preset-react": "^7.16.7",
23-
"@fortawesome/fontawesome-svg-core": "^1.2.36",
2423
"@hot-loader/react-dom": "^17.0.2",
2524
"@monaco-editor/react": "^4.3.1",
2625
"@types/react": "^17.0.38",

src/components/CodePreview.jsx

+11-12
Original file line numberDiff line numberDiff line change
@@ -40,7 +40,7 @@ const CodePreview = () => {
4040
return (
4141

4242
<div className="codePreviewContainer">
43-
43+
{/*
4444
<div class="mb-4 border-b border-gray-200 dark:border-gray-700">
4545
<ul class="flex flex-wrap -mb-px" id="myTab" data-tabs-toggle="#myTabContent" role="tablist">
4646
@@ -57,7 +57,7 @@ const CodePreview = () => {
5757
</li>
5858
5959
</ul>
60-
</div>
60+
</div> */}
6161

6262
<div className="tabContainer">
6363
<button
@@ -71,10 +71,9 @@ const CodePreview = () => {
7171
onClick={() => toggleTab(3)}>CSS Editor</button>
7272
</div>
7373
<div className="contentContainer">
74-
<div className={tabState === 1 ? "content active-content" : "content"}><div className="codeEditorContainer">
75-
76-
77-
74+
<div className={tabState === 1 ? "content active-content" : "content"}>
75+
76+
<div className="codeEditorContainer">
7877
{/* <Editor
7978
height="80vh"
8079
defaultLanguage="javascript"
@@ -90,20 +89,20 @@ const CodePreview = () => {
9089
}}
9190
/> */}
9291
<div className='code-compiler'>
93-
<label for="code-editor-themes">Choose a Theme:</label>
92+
{/* <label for="code-editor-themes">Choose a Theme:</label>
9493
<select name="code-editor-themes" id="editor-names">
9594
<option value="monokai">Monokai</option>
9695
<option value="github">Github</option>
97-
</select>
96+
</select> */}
9897

99-
<select class="selectpicker" data-live-search="true" class="form-control" name="Language" id="mode" onchange="changeMode()">
98+
{/* <select class="selectpicker" data-live-search="true" class="form-control" name="Language" id="mode" onchange="changeMode()">
10099
<option value="CSS" id="CSS" selected>CSS</option>
101100
<option value="JavaScript" id="JavaScript" selected>JavaScript</option>
102-
</select>
101+
</select> */}
103102
</div>
104-
<button onClick={toggleTheme}>
103+
{/* <button id='code-editor-theme-toggle' onClick={toggleTheme}>
105104
Toggle theme
106-
</button>
105+
</button> */}
107106
<AceEditor
108107
width="100%"
109108
height="100%"

src/components/Navigation.jsx

+6-6
Original file line numberDiff line numberDiff line change
@@ -3,12 +3,12 @@ import '../stylesheets/Navigation.css';
33

44
const Navigation = () => {
55
return (
6-
<div className='navigation'>
7-
<i class="fas fa-pencil-ruler"></i>
8-
<i class="fas fa-drafting-compass"></i>
9-
<i class="fas fa-cog"></i>
10-
<i class="fas fa-save"></i>
11-
<i class="fas fa-download"></i>
6+
<div className='navigation-bar'>
7+
<a href="#"><i class="fas fa-pencil-ruler"></i></a>
8+
<a href="#"><i class="fas fa-drafting-compass"></i></a>
9+
<a href="#"><i class="fas fa-cog"></i></a>
10+
<a href="#"><i class="fas fa-save"></i></a>
11+
<a href="#"><i class="fas fa-download"></i></a>
1212
</div>
1313
)
1414
}

src/index.html

+2-11
Original file line numberDiff line numberDiff line change
@@ -5,18 +5,9 @@
55
<meta http-equiv="X-UA-Compatible" content="IE=edge">
66
<meta name="viewport" content="width=device-width, initial-scale=1.0">
77
<link rel="stylesheet" href="https://unpkg.com/@themesberg/[email protected]/dist/flowbite.min.css" />
8-
<style>
9-
body {
10-
margin: 0;
11-
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
12-
'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
13-
sans-serif;
14-
-webkit-font-smoothing: antialiased;
15-
-moz-osx-font-smoothing: grayscale;
16-
}
17-
</style>
8+
<link rel="stylesheet" href="https://rsms.me/inter/inter.css">
189
<script src="https://kit.fontawesome.com/4a4720e8ee.js" crossorigin="anonymous"></script>
19-
<title>My Electron App</title>
10+
<title>Our OSP</title>
2011
</head>
2112
<body>
2213
<div id='root'></div>

src/stylesheets/App.css

+7-3
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,9 @@ html, body {
44
max-height: 1200px;
55
overflow-y: none;
66
}
7-
7+
body {
8+
margin: 0;
9+
}
810
:root {
911
--backgroundColor: #121212;
1012
--secondaryBackgroundColor: #272727;
@@ -87,8 +89,9 @@ html, body {
8789
margin: 0;
8890
padding: 0;
8991
overflow: hidden;
90-
--navigation-panel-background-color: var(--neutral-700);
92+
--navigation-panel-background-color: var(--backgroundColor);
9193
--navigation-panel-textColor: #ffffff;
94+
--tab-bottom-borderColor: var(--textColor);
9295
}
9396
.theme-light {
9497
--backgroundColor: #eeeeee;
@@ -99,8 +102,9 @@ html, body {
99102
margin: 0;
100103
padding: 0;
101104
overflow: hidden;
102-
--navigation-panel-background-color: var(--purple-300);
105+
--navigation-panel-background-color: #4338ca;
103106
--navigation-panel-textColor: #ffffff;
107+
--tab-bottom-borderColor: var(--neutral-200);
104108
}
105109

106110

src/stylesheets/BodyContainer.css

+1-1
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
"navigation dnd header header"
66
"navigation dnd canvas code"
77
"navigation dnd canvas code";
8-
grid-template-columns: 2.5% 15% 55% 30%;
8+
grid-template-columns: 2.5% 15% auto 25%;
99
grid-template-rows: 3% auto 25%;
1010
/* gap: 0.5rem; */
1111
}

src/stylesheets/Canvas.css

+2
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,8 @@
44
box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
55
margin-left: 2.5%;
66
margin-right: 2.5%;
7+
/* margin-bottom: 3%; */
8+
margin-top: 2%;
79
border-radius: 8px;
810
display: flex;
911
flex-direction: column;

src/stylesheets/CodePreview.css

+13-8
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,9 @@
33
background-color: var(--thirdBackgroundColor);
44
box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
55
margin-left: 5%;
6+
margin-right: 2%;
7+
border-radius: 8px;
8+
margin-top: 5%;
69
}
710

811
.tabContainer {
@@ -12,19 +15,21 @@
1215
.tabs {
1316
text-align: center;
1417
width: 50%;
15-
background: #272727;
16-
color: white;
18+
background: var(--thirdBackgroundColor);
19+
color: var(--neutral-600);
1720
cursor: pointer;
18-
border-bottom: 1px solid #6200ee;
21+
border-bottom: 1px solid var(--tab-bottom-borderColor);
1922
box-sizing: content-box;
2023
position: relative;
2124
outline: none;
25+
font-size: 14px;
26+
padding: 10px;
2227
}
2328

2429
.active-tabs {
25-
background: #272727;
26-
border-bottom: 1px solid transparent;
27-
/* border-bottom: 1px solid #6200ee; */
30+
background: var(--thirdBackgroundColor);
31+
border-bottom: 1px solid #4f46e5;
32+
color: #4f46e5;
2833
}
2934

3035
.active-tabs::before {
@@ -61,7 +66,7 @@
6166
padding: 0;
6267
margin: 0;
6368
}
64-
69+
/*
6570
[role="tab"].active {
6671
@apply text-red-600 border-red-600 dark:text-red-500 dark:border-red-500 hover:text-red-600 hover:border-red-600 dark:hover:text-red-500 dark:hover:border-red-500;
67-
}
72+
} */

src/stylesheets/DnD.css

+1-1
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@
1616
top: 5%;
1717
height: 90%;
1818
flex-direction: column;
19-
justify-content: space-evenly;
19+
justify-content: space-around;
2020
align-items: center;
2121
overflow-y: hidden;
2222
}

src/stylesheets/DragList.css

+3-18
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,8 @@
1616
/* font-size: 1rem; */
1717
/* font-size: 15px;
1818
min-height: 3vh; */
19-
color: var(--purple-200);
19+
/* color: var(--purple-200); */
20+
color: #4338ca;
2021
text-transform: uppercase;
2122
font-size: 13px;
2223
background-color: var(--thirdBackgroundColor);
@@ -32,20 +33,4 @@
3233
.dragItems p:hover {
3334
background-color: var(--neutral-200);
3435
border-radius: 3px;
35-
}
36-
37-
/*
38-
#button-container div { */
39-
/* flex: 0 0 5rem; */
40-
/* margin: 0.5rem; */
41-
/* background-color: var(--neutral-100); */
42-
/* box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px; */
43-
/* color: var(--purple-200);
44-
flex: 0 0 2rem;
45-
background-color: var(--thirdBackgroundColor);
46-
height: 5vh;
47-
padding: 5px 8px;
48-
font-size: 12px;
49-
text-transform: uppercase;
50-
border: 0.5px solid var(--neutral-700);
51-
} */
36+
}

src/stylesheets/Navigation.css

+8-3
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,12 @@
1-
.navigation {
1+
.navigation-bar {
22
grid-area: navigation;
33
/* background-color: var(--thirdBackgroundColor); */
44
/* border: 0.5px solid var(--neutral-600); */
55
background-color: var(--navigation-panel-background-color);
66
display: flex;
77
/* opacity: 0.5; */
88
flex-direction: column;
9-
justify-content: space-around;
9+
/* justify-content: space-around; */
1010
}
1111

1212
.fa-pencil-ruler {
@@ -28,4 +28,9 @@
2828
.fa-download{
2929
color: #ffffff;
3030
opacity: 0.8;
31-
}
31+
}
32+
33+
.navigation-bar a:hover {
34+
background-color: #000;
35+
}
36+

tailwind.config.js

+7-1
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,15 @@
1+
const defaultTheme = require('tailwindcss/defaultTheme');
2+
13
module.exports = {
24
content: [
35
"./src/**/*.{js,jsx,ts,tsx}",
46
],
57
theme: {
6-
extend: {},
8+
extend: {
9+
fontFamily: {
10+
sans: ['Inter var', ...defaultTheme.fontFamily.sans],
11+
},
12+
},
713
},
814
plugins: [
915
require('@themesberg/flowbite/plugin')

0 commit comments

Comments
 (0)