Skip to content

Commit 1031675

Browse files
CodeDevErrorCodeDevError
authored
Add files via upload
Signed-off-by: CodeDevError <coreycook09@icloud.com>
1 parent ed2d4d6 commit 1031675

File tree

22 files changed

+1037
-0
lines changed

22 files changed

+1037
-0
lines changed

‎Crotamine-main/Website/css/styles-dark.css‎

Lines changed: 44 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,44 @@
1+
/* styles-dark.css */
2+
body.dark {
3+
background-color: #333;
4+
color: #fff;
5+
}
6+
7+
.menu.dark {
8+
background: #222;
9+
color: #fff;
10+
}
11+
12+
.big-box.dark {
13+
background: #444;
14+
color: #fff;
15+
}
16+
17+
.menu li.dark:hover, .menu li.active.dark {
18+
background: #555;
19+
transition: background 0.3s ease;
20+
}
21+
22+
table th.dark, table td.dark {
23+
color: #000; /* Ensure text color is black in dark mode */
24+
}
25+
26+
/* Additional dark theme-specific styles */
27+
table th.dark {
28+
background-color: #555; /* Set background color for table headers in dark mode */
29+
color: #000; /* Ensure text color is black */
30+
}
31+
32+
table td.dark {
33+
background-color: #444; /* Set background color for table cells in dark mode */
34+
color: #000; /* Ensure text color is black */
35+
}
36+
37+
/* Ensure these styles are applied */
38+
body.dark table th {
39+
color: #000;
40+
}
41+
42+
body.dark table td {
43+
color: #000;
44+
}

‎Crotamine-main/Website/css/styles-light.css‎

Lines changed: 42 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,42 @@
1+
/* styles-light.css */
2+
/* Base styles for light theme */
3+
body.white {
4+
background-color: #ffffff;
5+
color: #000000;
6+
}
7+
8+
.menu.white {
9+
background-color: #f8f9fa;
10+
}
11+
12+
.menu.white li:hover,
13+
.menu.white li.active {
14+
background-color: #e2e6ea;
15+
}
16+
17+
.logout-button.white {
18+
background-color: #f8f9fa;
19+
color: #000000;
20+
}
21+
22+
.logout-button.white:hover {
23+
background-color: #e2e6ea;
24+
}
25+
26+
.small-box button.white {
27+
background-color: #f8f9fa;
28+
color: #000000;
29+
border: 1px solid #000000;
30+
}
31+
32+
.small-box button.white:hover {
33+
background-color: #e2e6ea;
34+
}
35+
36+
table.white th, table.white td {
37+
color: #000000;
38+
}
39+
40+
table.white th {
41+
background-color: #e2e6ea;
42+
}

‎Crotamine-main/Website/css/styles.css‎

Lines changed: 217 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,217 @@
1+
/* Base styles */
2+
* {
3+
box-sizing: border-box;
4+
margin: 0;
5+
padding: 0;
6+
font-family: Arial, sans-serif;
7+
}
8+
9+
body, html {
10+
height: 100%;
11+
}
12+
13+
#loading-screen {
14+
display: flex;
15+
justify-content: center;
16+
align-items: center;
17+
height: 100vh;
18+
background-color: #fff; /* Set background to white */
19+
}
20+
21+
#loading-screen video {
22+
max-width: 100%;
23+
max-height: 100%;
24+
}
25+
26+
.container {
27+
display: flex;
28+
height: 100vh;
29+
transition: all 0.5s ease-in-out;
30+
}
31+
32+
.menu {
33+
width: 200px;
34+
transition: all 0.5s ease-in-out;
35+
display: flex;
36+
flex-direction: column;
37+
justify-content: space-between;
38+
border-radius: 10px; /* Rounded corners */
39+
}
40+
41+
.menu ul {
42+
list-style-type: none;
43+
padding: 20px 0;
44+
}
45+
46+
.menu li {
47+
padding: 15px;
48+
cursor: pointer;
49+
transition: background 0.3s;
50+
border-radius: 5px; /* Rounded corners */
51+
}
52+
53+
.menu li:hover, .menu li.active {
54+
background: #555;
55+
transition: background 0.3s ease;
56+
}
57+
58+
.logout-button {
59+
margin: 20px;
60+
padding: 10px 20px;
61+
border: none;
62+
cursor: pointer;
63+
border-radius: 5px;
64+
transition: background 0.3s;
65+
}
66+
67+
.logout-button:hover {
68+
background: #444;
69+
}
70+
71+
.content {
72+
flex: 1;
73+
padding: 20px;
74+
overflow-y: auto;
75+
position: relative;
76+
transition: all 0.5s ease-in-out;
77+
border-radius: 10px; /* Rounded corners */
78+
}
79+
80+
.screen {
81+
display: none;
82+
animation: fadeIn 0.5s;
83+
}
84+
85+
.screen.active {
86+
display: block;
87+
}
88+
89+
.big-box {
90+
width: 100%;
91+
height: calc(100vh - 120px);
92+
border: 1px solid #ccc;
93+
margin-bottom: 20px;
94+
padding: 10px;
95+
overflow-y: auto;
96+
border-radius: 10px; /* Rounded corners */
97+
transition: all 0.5s ease-in-out;
98+
}
99+
100+
.small-box {
101+
display: flex;
102+
align-items: center;
103+
}
104+
105+
.small-box input {
106+
flex: 1;
107+
padding: 10px;
108+
margin-right: 10px;
109+
border-radius: 5px; /* Rounded corners */
110+
border: 1px solid #ccc;
111+
transition: all 0.5s ease-in-out;
112+
}
113+
114+
.small-box button {
115+
padding: 10px 20px;
116+
border-radius: 5px; /* Rounded corners */
117+
border: 1px solid #333; /* Match border color with sidebar */
118+
background-color: #333; /* Match background color with sidebar */
119+
color: #fff;
120+
cursor: pointer;
121+
transition: background-color 0.3s;
122+
}
123+
124+
.small-box button:hover {
125+
background-color: #444; /* Match hover color with sidebar */
126+
}
127+
128+
table {
129+
width: 100%;
130+
border-collapse: collapse;
131+
transition: all 0.5s ease-in-out;
132+
border-radius: 10px; /* Rounded corners */
133+
}
134+
135+
table th, table td {
136+
border: 1px solid #ddd;
137+
padding: 10px;
138+
}
139+
140+
table th {
141+
background: #f2f2f2;
142+
}
143+
144+
body.dark table th, body.dark table td {
145+
color: #fff; /* Set text color to white for dark theme */
146+
}
147+
148+
body.white table th, body.white table td {
149+
color: #000; /* Set text color to black for white theme */
150+
}
151+
152+
.theme-selector {
153+
display: flex;
154+
justify-content: space-around;
155+
margin-top: 20px;
156+
}
157+
158+
.theme-option {
159+
padding: 10px 20px;
160+
border: none;
161+
border-radius: 5px;
162+
cursor: pointer;
163+
transition: background 0.3s;
164+
}
165+
166+
.theme-option:hover {
167+
opacity: 0.7;
168+
}
169+
170+
@keyframes fadeIn {
171+
from { opacity: 0; }
172+
to { opacity: 1; }
173+
}
174+
175+
@media (max-width: 768px) {
176+
.menu {
177+
width: 60px;
178+
}
179+
180+
.menu ul {
181+
padding: 10px 0;
182+
}
183+
184+
.menu li {
185+
padding: 10px;
186+
}
187+
188+
.content {
189+
padding: 10px;
190+
}
191+
192+
.big-box {
193+
height: calc(100vh - 140px);
194+
}
195+
}
196+
197+
@media (max-width: 480px) {
198+
.menu {
199+
width: 50px;
200+
}
201+
202+
.menu ul {
203+
padding: 5px 0;
204+
}
205+
206+
.menu li {
207+
padding: 8px;
208+
}
209+
210+
.content {
211+
padding: 5px;
212+
}
213+
214+
.big-box {
215+
height: calc(100vh - 160px);
216+
}
217+
}

‎Crotamine-main/Website/index.html‎

Lines changed: 64 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,64 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6+
<title>Crotamine</title>
7+
<link rel="icon" href="media/logo.png" type="image/png">
8+
<link rel="stylesheet" href="css/styles.css">
9+
<link rel="stylesheet" href="css/styles-dark.css" id="dark-theme" disabled>
10+
<link rel="stylesheet" href="css/styles-light.css" id="light-theme">
11+
<script src="https://cdn.socket.io/4.0.0/socket.io.min.js"></script>
12+
</head>
13+
<body>
14+
<div id="loading-screen">
15+
<video src="media/loading.mov" autoplay loop muted></video>
16+
</div>
17+
<div class="container" id="main-content" style="display: none;">
18+
<nav class="menu" aria-label="Main Navigation">
19+
<ul>
20+
<li data-screen="dashboard" class="active" role="tab" aria-selected="true" tabindex="0">Dashboard</li>
21+
<li data-screen="client" role="tab" tabindex="0">Client</li>
22+
<li data-screen="channel-log" role="tab" tabindex="0">Channel Log</li>
23+
<li data-screen="settings" role="tab" tabindex="0">Settings</li>
24+
</ul>
25+
<button class="logout-button" onclick="logout()" aria-label="Logout">Logout</button>
26+
</nav>
27+
<div class="content">
28+
<div id="dashboard" class="screen active" role="tabpanel" aria-labelledby="dashboard-tab">
29+
<div class="big-box" id="server-output"></div>
30+
<div class="small-box">
31+
<input type="text" id="input-command" placeholder="Enter command...">
32+
<button onclick="sendCommand()">Send</button>
33+
<div id="loading-spinner" style="display: none;">Loading...</div>
34+
</div>
35+
</div>
36+
<div id="client" class="screen" role="tabpanel" aria-labelledby="client-tab">
37+
<table>
38+
<thead>
39+
<tr>
40+
<th>Name</th>
41+
<th>Version</th>
42+
<th>IP Address</th>
43+
</tr>
44+
</thead>
45+
<tbody id="client-table-body">
46+
<!-- Filled dynamically -->
47+
</tbody>
48+
</table>
49+
</div>
50+
<div id="channel-log" class="screen" role="tabpanel" aria-labelledby="channel-log-tab">
51+
<p>Channel log placeholder</p>
52+
</div>
53+
<div id="settings" class="screen" role="tabpanel" aria-labelledby="settings-tab">
54+
<h2>Customize Theme</h2>
55+
<div class="theme-selector">
56+
<button class="theme-option dark" onclick="changeTheme('dark')" title="Dark Theme">Dark</button>
57+
<button class="theme-option white" onclick="changeTheme('white')" title="Light Theme">White</button>
58+
</div>
59+
</div>
60+
</div>
61+
</div>
62+
<script src="js/main.js" type="module"></script>
63+
</body>
64+
</html>

0 commit comments

Comments
 (0)