Skip to content

Commit

Permalink
Improve dark themes
Browse files Browse the repository at this point in the history
  • Loading branch information
foivospro committed Aug 9, 2024
1 parent 8d4ed8c commit 24a6db1
Show file tree
Hide file tree
Showing 9 changed files with 568 additions and 1,947 deletions.
1,109 changes: 0 additions & 1,109 deletions index.html

This file was deleted.

759 changes: 0 additions & 759 deletions index2.html

This file was deleted.

36 changes: 36 additions & 0 deletions msg/el.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,36 @@
var MSG_EL = {
TEXT_PROCESSING: 'Επεξεργασία Κειμένου',
FILE_INPUTS: 'Είσοδοι Αρχείων',
FILE_DIR_OPERATIONS: 'Λειτουργίες Αρχείων και Καταλόγων',
IO_REDIRECTION: 'Ανακατεύθυνση Εισόδου/Εξόδου',
REGULAR_EXPRESSIONS: 'Κανονικές Εκφράσεις',
DATA_PROCESSING: 'Επεξεργασία Δεδομένων',
VARIABLES: 'Μεταβλητές',
title: 'Κώδικας',
blocks: 'Μπλοκ',
linkTooltip: 'Αποθήκευση και σύνδεση με τα μπλοκ.',
runTooltip:
'Εκτελέστε το πρόγραμμα που ορίζεται από τα μπλοκ στον χώρο εργασίας.',
badCode: 'Σφάλμα προγράμματος:\n%1',
timeout: 'Υπερβήκατε τον μέγιστο αριθμό επαναλήψεων εκτέλεσης.',
trashTooltip: 'Απόρριψη όλων των μπλοκ.',
catLogic: 'Λογική',
catLoops: 'Βρόχοι',
catMath: 'Μαθηματικά',
catText: 'Κείμενο',
catLists: 'Λίστες',
catColour: 'Χρώμα',
catVariables: 'Μεταβλητές',
catFunctions: 'Συναρτήσεις',
listVariable: 'λίστα',
textVariable: 'κείμενο',
httpRequestError: 'Υπήρξε πρόβλημα με το αίτημα.',
linkAlert:
'Μοιραστείτε τα μπλοκ σας με αυτόν τον δημόσιο σύνδεσμο. Θα τα διαγράψουμε αν δεν χρησιμοποιηθούν για έναν χρόνο. Δεν συνδέονται με τον λογαριασμό σας και διαχειρίζονται σύμφωνα με την Πολιτική Απορρήτου της Google. Παρακαλούμε να μην συμπεριλάβετε προσωπικές πληροφορίες.\n\n%1',
hashError:
"Συγνώμη, το '%1' δεν αντιστοιχεί σε κανένα αποθηκευμένο πρόγραμμα.",
loadError:
'Δεν ήταν δυνατή η φόρτωση του αποθηκευμένου αρχείου σας. Ίσως δημιουργήθηκε με διαφορετική έκδοση του Blockly;',
parseError:
"Σφάλμα ανάλυσης %1:\n%2\n\nΕπιλέξτε 'OK' για να εγκαταλείψετε τις αλλαγές σας ή 'Ακύρωση' για να συνεχίσετε να επεξεργάζεστε το %1."
};
338 changes: 265 additions & 73 deletions package-lock.json

Large diffs are not rendered by default.

4 changes: 2 additions & 2 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,6 @@
"keywords": [],
"author": "",
"devDependencies": {
"prettier": "^3.3.3",
"bcrypt": "^5.1.1",
"bcryptjs": "^2.4.3",
"cookie-parser": "^1.4.6",
Expand All @@ -27,7 +26,8 @@
"method-override": "^3.0.0",
"mysql": "^2.18.1",
"passport": "^0.7.0",
"passport-local": "^1.0.0"
"passport-local": "^1.0.0",
"prettier": "^3.3.3"
},
"license": "ISC"
}
Binary file removed public/img/copy_icon.png
Binary file not shown.
12 changes: 12 additions & 0 deletions public/main.js
Original file line number Diff line number Diff line change
Expand Up @@ -16,8 +16,20 @@ document
var selectedTheme = this.value;
if (selectedTheme === 'halloween') {
workspace.setTheme(Blockly.Themes.Halloween);
document.getElementById('light-theme').disabled = false;
document.getElementById('dark-theme').disabled = true;
} else if (selectedTheme === 'dark') {
document.getElementById('light-theme').disabled = true;
document.getElementById('dark-theme').disabled = false;
workspace.setTheme(Blockly.Themes.Dark);
} else if (selectedTheme === 'tritanopia') {
workspace.setTheme(Blockly.Themes.Tritanopia);
document.getElementById('light-theme').disabled = false;
document.getElementById('dark-theme').disabled = true;
} else if (selectedTheme === 'dark-tritanopia') {
workspace.setTheme(Blockly.Themes.DarkTritanopia);
document.getElementById('light-theme').disabled = true;
document.getElementById('dark-theme').disabled = false;
}
});

Expand Down
244 changes: 244 additions & 0 deletions public/styledark.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,244 @@
html[dir='RTL'] .farSide {
text-align: left;
}

.farSide {
text-align: right;
}

html,
body {
height: 100%;
}

body {
background-color: #1e1e1e; /* Dark background for the entire page */
font-family: sans-serif;
margin: 0;
padding: 0;
overflow: auto;
color: rgb(208, 208, 208); /* Light text color for contrast */
}

#blocklyArea {
height: 85%;
}

#blocklyDiv {
height: 100%;
width: 100%;
overflow: auto;
background-color: #252526; /* Dark background for Blockly workspace */
}

#controlArea {
padding: 4px;
background: #333; /* Dark background for control area */
border-bottom: 1px solid #555; /* Darker border for separation */
text-align: right;
color: rgb(208, 208, 208); /* White text for control area */
}

#resultsWrapper {
box-sizing: border-box;
padding: 10px;
border-top: 1px solid #555; /* Darker border for results area */
background-color: #2e2e2e; /* Dark background for results wrapper */
}

#resultsArea {
position: relative;
margin-top: 8px;
padding: 9px;
background: #3a3a3a; /* Darker background for results area */
height: 25px;
overflow-y: hidden;
border-radius: 8px;
color: rgb(208, 208, 208); /* White text for results area */
}

.blockly-minimap {
position: absolute;
box-shadow: none;
width: 200px;
height: 150px;
top: 50px;
left: 258px;
overflow: hidden;
border-radius: 3px;
background-color: #2a2a2a; /* Dark background for minimap */
}

#copyButton {
position: absolute;
right: 10px;
bottom: 21px;
background-color: rgb(37, 37, 38) !important; /* Μαύρο-γκρι χρώμα */
border: none !important; /* Αφαίρεση περιγράμματος */
outline: none !important; /* Αφαίρεση του outline (αν υπάρχει) */
box-shadow: none !important; /* Αφαίρεση σκιάς (αν υπάρχει) */
border-radius: 0%; /* Καμία στρογγυλοποίηση στις γωνίες */
color: rgb(208, 208, 208); /* Λευκό χρώμα για το εικονίδιο */
}

.icon-button:hover {
background-color: #444; /* Darker hover state color */
}

.icon-button i {
font-size: 16px; /* Icon size */
color: #d0d0d0; /* Light gray for icons */
}

#executeButton {
background-color: rgb(34, 139, 34); /* Darker green for execute button */
color: #fff; /* White text */
}

#executeButton:hover {
background-color: rgb(28, 115, 28); /* Darker green on hover */
}

#resetButton {
background-color: rgb(255, 140, 0); /* Darker orange for reset button */
color: #fff; /* White text */
}

#resetButton:hover {
background-color: rgb(220, 120, 0); /* Darker orange on hover */
}

/* Navbar */

#navbar {
display: flex;
align-items: center;
height: 5.5%; /* Increased height */
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.4); /* Darker shadow for depth */
background-color: #333; /* Dark background for navbar */
}

#helloMessage {
flex: 2;
width: 30%;
display: flex;
align-items: center;
justify-content: flex-start;
padding: 4px;
height: 100%;
border-radius: 5px; /* Rounded corners */

background-color: rgb(37, 37, 38); /* Dark background for hello message */
color: #fff; /* White text */
}

#loginButton,
#registerButton,
#logoutButton {
display: none; /* Hide by default */
}

#buttonContainer {
flex: 4;
width: 70%;
display: flex;
align-items: center;
justify-content: flex-end;
padding: 4px;
}

button {
border-radius: 4px;
border: 1px solid #555; /* Darker border for buttons */
font-size: large;
background-color: #444; /* Dark background for buttons */
color: #d0d0d0; /* Light gray text */
cursor: pointer;
padding: 1px 10px;
margin: 1px 5px;
}

.icon-dropdown {
border-radius: 4px;
border: 1px solid #555; /* Darker border for dropdown */
font-size: large;
background-color: #444; /* Dark background for dropdown */
color: #d0d0d0; /* Light gray text */
cursor: pointer;
padding: 5px 10px;
margin: 1px 5px;
}

.icon-dropdown option {
background-color: #333; /* Dark background for dropdown options */
color: #fff; /* White text */
}

button.primary {
border: 1px solid #d32f2f; /* Dark red border */
background-color: #d32f2f; /* Dark red background */
color: #fff; /* White text */
}

button.primary > img {
opacity: 1;
}

button > img {
opacity: 0.8; /* Slightly increased opacity for images */
vertical-align: text-bottom;
}

button:hover > img {
opacity: 1;
}

button:active {
border: 1px solid #888 !important; /* Lighter border on active */
}

button:hover {
box-shadow: 2px 2px 5px #666; /* Lighter shadow on hover */
}

button.disabled:hover > img {
opacity: 0.6;
}

button.disabled {
display: none;
}

button.notext {
font-size: 10%;
}

h1 {
font-weight: normal;
font-size: 140%;
margin-left: 5px;
margin-right: 5px;
color: #fff; /* White text for headings */
}

/* Adds padding around the group of categories and separators. */
.blocklyToolboxContents {
padding: 0.4em;
}
/* Adds space between the categories, rounds the corners and adds space around the label. */
.blocklyTreeRow {
padding: 3px;
margin-bottom: 0.5em;
border-radius: 4px;
background-color: #3a3a3a; /* Darker background for tree rows */
color: #fff; /* White text */
}

/* Separator Styling */
.blocklyTreeSeparator {
border-bottom: solid #3a3a3a 2px;
}

.blocklyMainBackground {
stroke: #0b0b0b;
}
13 changes: 9 additions & 4 deletions public/styles.css
Original file line number Diff line number Diff line change
Expand Up @@ -72,10 +72,15 @@ body {
}

#copyButton {
border: none;
cursor: pointer;
outline: none;
background-color: transparent;
position: absolute;
right: 10px;
bottom: 21px;
background-color: rgb(255, 255, 255) !important;
border: none !important;
outline: none !important;
box-shadow: none !important;
border-radius: 0%;
color: #000000;
}

.icon-button:hover {
Expand Down

0 comments on commit 24a6db1

Please sign in to comment.