website dark mode

This commit is contained in:
Jorijn van der Graaf 2025-11-12 17:52:46 +01:00
commit d5ab5faaf8

View file

@ -23,37 +23,40 @@ HtmlElementView* head = new HtmlElementView("head", R"(
font-family: Arial, sans-serif;
margin: 0 auto;
padding: 20px;
background-color: #f5f5f5;
background-color: #121212;
color: #e0e0e0;
width: 100vw;
height: 100vh;
display: flex;
justify-content: center; /* Horizontal centering */
align-items: center; /* Vertical centering */
justify-content: center;
align-items: center;
}
.app-container {
background-color: white;
background-color: #1e1e1e;
padding: 20px;
border-radius: 8px;
box-shadow: 0 2px 10px rgba(0,0,0,0.1);
box-shadow: 0 2px 10px rgba(0,0,0,0.5);
width: 50vw;
max-width: 600px;
}
h1 {
color: #333;
color: #ffffff;
text-align: center;
}
.input-section {
margin-bottom: 20px;
padding: 15px;
background-color: #f9f9f9;
background-color: #2d2d2d;
border-radius: 5px;
}
.input-section textarea {
width: 100%;
height: 80px;
border: 1px solid #ddd;
border: 1px solid #444;
border-radius: 4px;
resize: vertical;
background-color: #333;
color: #fff;
}
.input-section button {
background-color: #4CAF50;
@ -68,7 +71,7 @@ HtmlElementView* head = new HtmlElementView("head", R"(
background-color: #45a049;
}
.notes-section h2 {
color: #555;
color: #ffffff;
border-bottom: 2px solid #4CAF50;
padding-bottom: 5px;
}
@ -78,7 +81,7 @@ HtmlElementView* head = new HtmlElementView("head", R"(
.note-item {
padding: 15px;
margin-bottom: 10px;
background-color: #f0f8ff;
background-color: #2d2d2d;
border-left: 4px solid #4CAF50;
border-radius: 4px;
display: flex;
@ -88,6 +91,7 @@ HtmlElementView* head = new HtmlElementView("head", R"(
.note-content {
flex-grow: 1;
word-wrap: break-word;
color: #e0e0e0;
}
.delete-btn {
background-color: #f44336;
@ -107,14 +111,14 @@ HtmlElementView* head = new HtmlElementView("head", R"(
border-radius: 4px;
}
#error {
background-color: #ffebee;
color: #c62828;
border: 1px solid #ffcdd2;
background-color: #780000;
color: #ff9999;
border: 1px solid #ff5555;
}
#loading {
background-color: #e3f2fd;
color: #1565c0;
border: 1px solid #bbdefb;
background-color: #003366;
color: #99ccff;
border: 1px solid #6699cc;
}
</style>
)");