Skip to content

Commit 667ec2f

Browse files
kRxZykRxZykRxZykRxZy
authored
Update wiki.html
1 parent db72835 commit 667ec2f

File tree

1 file changed

+152
-34
lines changed

1 file changed

+152
-34
lines changed

‎src/wiki.html

Lines changed: 152 additions & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -3,62 +3,173 @@
33
<head>
44
<meta charset="UTF-8">
55
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6-
<title>Scratch Coding Hut | Wiki</title>
6+
<title>Scratch Coding Hut Wiki</title>
77
<style>
8+
/* Reset some default styling */
9+
* {
10+
margin: 0;
11+
padding: 0;
12+
box-sizing: border-box;
13+
}
14+
815
body {
9-
font-family: Arial, sans-serif;
10-
padding: 20px;
16+
font-family: 'Arial', sans-serif;
17+
background: #fff4f4;
18+
color: #333;
19+
padding: 40px;
20+
display: flex;
21+
flex-direction: column;
22+
align-items: center;
23+
text-align: center;
1124
}
1225

1326
h1 {
14-
color: #333;
27+
font-size: 3rem;
28+
color: #ff4d4d;
29+
margin-bottom: 30px;
30+
font-weight: bold;
1531
}
1632

1733
.form-container {
34+
background-color: #ffcccc;
35+
padding: 30px;
36+
border-radius: 10px;
37+
box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1);
38+
width: 100%;
39+
max-width: 500px;
40+
margin-bottom: 30px;
41+
}
42+
43+
.form-container h2 {
44+
font-size: 1.5rem;
45+
color: #e60000;
1846
margin-bottom: 20px;
1947
}
2048

2149
input, textarea {
2250
width: 100%;
23-
margin: 5px 0;
24-
padding: 10px;
51+
padding: 15px;
52+
margin-bottom: 15px;
53+
border-radius: 8px;
54+
border: 2px solid #e60000;
55+
font-size: 1rem;
56+
outline: none;
57+
}
58+
59+
input:focus, textarea:focus {
60+
border-color: #ff4d4d;
61+
box-shadow: 0 0 5px rgba(255, 77, 77, 0.5);
2562
}
2663

2764
button {
28-
background-color: #4CAF50;
65+
background-color: #ff4d4d;
2966
color: white;
30-
padding: 10px 20px;
67+
padding: 15px 30px;
3168
border: none;
69+
border-radius: 8px;
3270
cursor: pointer;
71+
font-size: 1.1rem;
72+
transition: background-color 0.3s ease;
3373
}
3474

3575
button:hover {
36-
background-color: #45a049;
76+
background-color: #ff1a1a;
3777
}
3878

3979
.wikis-container {
40-
margin-top: 20px;
80+
width: 100%;
81+
max-width: 800px;
82+
margin-top: 50px;
83+
}
84+
85+
.wikis-container h2 {
86+
color: #e60000;
87+
font-size: 2rem;
88+
margin-bottom: 20px;
4189
}
4290

4391
ul {
4492
list-style: none;
45-
padding-left: 0;
93+
padding: 0;
4694
}
4795

4896
li {
49-
padding: 10px;
50-
border: 1px solid #ddd;
51-
margin-bottom: 10px;
97+
background-color: #ffe6e6;
98+
padding: 20px;
99+
margin-bottom: 15px;
100+
border-radius: 10px;
101+
box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1);
102+
position: relative;
103+
}
104+
105+
li h3 {
106+
font-size: 1.8rem;
107+
color: #ff4d4d;
108+
}
109+
110+
li p {
111+
font-size: 1.1rem;
112+
color: #333;
113+
}
114+
115+
li small {
116+
font-size: 0.9rem;
117+
color: #777;
118+
}
119+
120+
.edit, .delete {
121+
position: absolute;
122+
top: 10px;
123+
padding: 8px 15px;
124+
border-radius: 5px;
125+
font-size: 1rem;
126+
cursor: pointer;
127+
transition: transform 0.2s ease;
52128
}
53129

54-
button.delete {
55-
background-color: red;
130+
.edit {
131+
background-color: #ffcc00;
56132
color: white;
133+
right: 60px;
57134
}
58135

59-
button.edit {
60-
background-color: yellow;
61-
color: black;
136+
.edit:hover {
137+
transform: scale(1.1);
138+
}
139+
140+
.delete {
141+
background-color: #ff4d4d;
142+
color: white;
143+
right: 10px;
144+
}
145+
146+
.delete:hover {
147+
transform: scale(1.1);
148+
}
149+
150+
/* Mobile Responsive Styling */
151+
@media (max-width: 768px) {
152+
.form-container {
153+
width: 90%;
154+
padding: 20px;
155+
}
156+
157+
.wikis-container {
158+
width: 90%;
159+
}
160+
161+
h1 {
162+
font-size: 2.5rem;
163+
}
164+
165+
li h3 {
166+
font-size: 1.5rem;
167+
}
168+
169+
button {
170+
font-size: 1rem;
171+
padding: 12px 25px;
172+
}
62173
}
63174
</style>
64175
</head>
@@ -70,7 +181,6 @@ <h2>Create a Wiki</h2>
70181
<form id="createWikiForm">
71182
<input type="text" id="wikiTitle" placeholder="Title" required>
72183
<textarea id="wikiContent" placeholder="Content" required></textarea>
73-
<input type="text" id="wikiOwner" placeholder="Your Username" required>
74184
<button type="submit">Create Wiki</button>
75185
</form>
76186
</div>
@@ -105,13 +215,18 @@ <h2>Wikis</h2>
105215
<h3>${wiki.title}</h3>
106216
<p>${wiki.content}</p>
107217
<small>Owner: ${wiki.owner}</small>
108-
<button class="edit" onclick="editWiki(${wiki.id})">Edit</button>
109-
<button class="delete" onclick="deleteWiki(${wiki.id})">Delete</button>
218+
${isOwnerOrAdmin(wiki.owner) ? `<button class="edit" onclick="editWiki(${wiki.id}, '${wiki.title}', '${wiki.content}')">Edit</button>` : ''}
219+
${isOwnerOrAdmin(wiki.owner) ? `<button class="delete" onclick="deleteWiki(${wiki.id})">Delete</button>` : ''}
110220
`;
111221
wikiList.appendChild(li);
112222
});
113223
};
114224

225+
// Check if user is the owner or admin
226+
const isOwnerOrAdmin = (owner) => {
227+
return owner === username || username === "kRxZy_kRxZy" || username === "MyScratchedAccount" || username === "mcgdj";
228+
};
229+
115230
// Create a new wiki
116231
createWikiForm.addEventListener('submit', async (e) => {
117232
e.preventDefault();
@@ -150,25 +265,28 @@ <h3>${wiki.title}</h3>
150265
};
151266

152267
// Edit a wiki
153-
window.editWiki = async (id) => {
268+
window.editWiki = async (id, title, content) => {
154269
if (!username) {
155270
alert('You must be logged in to edit a wiki.');
156271
return;
157272
}
158273

159-
const newTitle = prompt('New title:');
160-
const newContent = prompt('New content:');
274+
// Open the title and content in editable textareas
275+
const newTitle = prompt('New title:', title);
276+
const newContent = prompt('New content:', content);
161277

162-
const response = await fetch(`${backendUrl}/wikis/${id}`, {
163-
method: 'PUT',
164-
headers: { 'Content-Type': 'application/json' },
165-
body: JSON.stringify({ title: newTitle, content: newContent, owner: username }), // Send username from localStorage
166-
});
278+
if (newTitle && newContent) {
279+
const response = await fetch(`${backendUrl}/wikis/${id}`, {
280+
method: 'PUT',
281+
headers: { 'Content-Type': 'application/json' },
282+
body: JSON.stringify({ title: newTitle, content: newContent, owner: username }), // Send username from localStorage
283+
});
167284

168-
if (response.ok) {
169-
fetchWikis(); // Refresh wiki list
170-
} else {
171-
alert('Not authorized to edit this wiki or wiki not found');
285+
if (response.ok) {
286+
fetchWikis(); // Refresh wiki list
287+
} else {
288+
alert('Not authorized to edit this wiki or wiki not found');
289+
}
172290
}
173291
};
174292

0 commit comments

Comments
 (0)