deleted empty lines and comments

This commit is contained in:
Hatvani Tamás
2024-12-01 14:20:06 +01:00
committed by GitHub
parent 0b7e83b8a6
commit 524e2bcdef

View File

@@ -5,7 +5,6 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Arduino Remote Web</title> <title>Arduino Remote Web</title>
<style> <style>
/* Base styles and color scheme */
:root { :root {
--bg-color: #2c3e50; --bg-color: #2c3e50;
--btn-color: #ecf0f1; --btn-color: #ecf0f1;
@@ -15,8 +14,6 @@
--border-radius: 10px; --border-radius: 10px;
--box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.2); --box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.2);
} }
/* Body and basic styling */
body { body {
background-color: var(--bg-color); background-color: var(--bg-color);
font-family: Arial, sans-serif; font-family: Arial, sans-serif;
@@ -28,7 +25,6 @@
justify-content: center; justify-content: center;
min-height: 100vh; min-height: 100vh;
} }
.flex-container { .flex-container {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
@@ -37,15 +33,12 @@
gap: 10px; gap: 10px;
margin-bottom: 20px; margin-bottom: 20px;
} }
.flex-container-column { .flex-container-column {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: center; justify-content: center;
gap: 10px; gap: 10px;
} }
/* Button and div styling */
.flex-container>div, .flex-container>div,
.flex-container-column>div { .flex-container-column>div {
background-color: var(--btn-color); background-color: var(--btn-color);
@@ -59,10 +52,7 @@
transition: transform 0.2s ease, background-color 0.3s ease; transition: transform 0.2s ease, background-color 0.3s ease;
cursor: pointer; cursor: pointer;
flex: 1; flex: 1;
/* Allow buttons to grow and fill available space */
} }
/* Hover and active effects */
.flex-container>div:hover, .flex-container>div:hover,
.flex-container-column>div:hover { .flex-container-column>div:hover {
background-color: var(--btn-hover-color); background-color: var(--btn-hover-color);
@@ -75,54 +65,33 @@
background-color: var(--highlight-color); background-color: var(--highlight-color);
color: #fff; color: #fff;
} }
/* Numpad specific styles */
#numpad { #numpad {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
gap: 5px; gap: 5px;
/* Reduced gap between rows in the numpad */
} }
#numpad div { #numpad div {
display: flex; display: flex;
/* Use flex for rows */
justify-content: center; justify-content: center;
/* Center buttons horizontally */
gap: 10px; gap: 10px;
/* Space between buttons */
flex-wrap: nowrap; flex-wrap: nowrap;
/* Prevent wrapping to keep buttons in one row */
} }
/* Center the number-0 button */
#number-0 { #number-0 {
flex: 1; flex: 1;
/* Allow the button to grow and take full width */
display: flex; display: flex;
justify-content: center; justify-content: center;
/* Center horizontally */
align-items: center; align-items: center;
/* Center vertically */
height: 60px; height: 60px;
/* Increase height for better tap target */
} }
/* Responsive adjustments */
@media (max-width: 768px) { @media (max-width: 768px) {
.flex-container { .flex-container {
flex-direction: column; flex-direction: column;
} }
/* Ensure numpad rows remain horizontal on smaller screens */
#numpad div { #numpad div {
flex-direction: row; flex-direction: row;
/* Set row layout for numpad buttons */
justify-content: space-between; justify-content: space-between;
/* Distribute space between buttons */
} }
} }
@media (max-width: 480px) { @media (max-width: 480px) {
.flex-container>div, .flex-container>div,
@@ -138,7 +107,6 @@
#number-0 { #number-0 {
height: 60px; height: 60px;
/* Keep a consistent height for the number 0 button */
} }
} }
</style> </style>
@@ -147,7 +115,7 @@
fetch('/sendSignal', { fetch('/sendSignal', {
method: 'POST', method: 'POST',
headers: { 'Content-Type': 'application/json' }, headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ code: buttonCode }) // Sending JSON data body: JSON.stringify({ code: buttonCode })
}) })
} }
</script> </script>