diff --git a/ESPTimeCast_ESP32/ESPTimeCast_ESP32.ino b/ESPTimeCast_ESP32/ESPTimeCast_ESP32.ino index 182f100..197451c 100644 --- a/ESPTimeCast_ESP32/ESPTimeCast_ESP32.ino +++ b/ESPTimeCast_ESP32/ESPTimeCast_ESP32.ino @@ -22,9 +22,9 @@ #define HARDWARE_TYPE MD_MAX72XX::FC16_HW #define MAX_DEVICES 4 -#define CLK_PIN 7 //D5 -#define CS_PIN 11 // D7 -#define DATA_PIN 12 //D8 +#define CLK_PIN 7 +#define CS_PIN 11 +#define DATA_PIN 12 #ifdef ESP8266 WiFiEventHandler mConnectHandler; @@ -1997,7 +1997,7 @@ bool isFiveDigitZip(const char *str) { // Weather Fetching and API settings // ----------------------------------------------------------------------------- String buildWeatherURL() { -#if defined(ESP8266) +#if defined(ESP8266) || defined(CONFIG_IDF_TARGET_ESP32S2) String base = "http://api.openweathermap.org/data/2.5/weather?"; #else String base = "https://api.openweathermap.org/data/2.5/weather?"; @@ -2067,7 +2067,7 @@ void fetchWeather() { HTTPClient http; // Create an HTTPClient object -#if defined(ESP8266) +#if defined(ESP8266) || defined(CONFIG_IDF_TARGET_ESP32S2) // ===== ESP8266 → HTTP ===== WiFiClient client; client.stop(); diff --git a/ESPTimeCast_ESP32/index_html.h b/ESPTimeCast_ESP32/index_html.h index 7d86786..cb3b784 100644 --- a/ESPTimeCast_ESP32/index_html.h +++ b/ESPTimeCast_ESP32/index_html.h @@ -2,1972 +2,2861 @@ // index_html.h const char index_html[] PROGMEM = R"rawliteral( - + - - - - - - -ESPTimeCast Settings - - - + display: flex; + align-items: center; + cursor: pointer; + font-size: 1.1rem; + font-weight: normal; + background: none; + border: none; + color: white; + padding: 0; + margin: 0; + outline: none; + gap: 0.5em; + user-select: none; + margin-top: 6rem; + text-decoration: underline; + } -
- -

WiFi Settings

- -
-
- - - -
-
-
- -
- - -
+ .collapsible-toggle .icon-area { + transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1); + display: flex; + } + .collapsible-toggle.open .icon-area { + transform: rotate(90deg); + } -

Clock Settings

- - + .collapsible-content { + overflow: hidden; + height: 0; + transition: height 0.3s cubic-bezier(0.4, 0, 0.2, 1); + color: #fff; + margin-bottom: 3rem; + } - - + .collapsible-content-inner { + padding: 1em 0; + } -
-
- - - -
-
- - - -
-
+ input[type="range"] { + -webkit-appearance: none; + width: 100%; + height: 6px; + background: transparent; + cursor: pointer; + } + /* Track (Chrome, Safari, Edge) */ + input[type="range"]::-webkit-slider-runnable-track { + height: 6px; + background: rgba(255, 255, 255, 0.2); + border-radius: 6px; + } -

Weather Settings

- - -
Required to fetch weather data. Get your API key here.
+ /* Thumb (Chrome, Safari, Edge) */ + input[type="range"]::-webkit-slider-thumb { + -webkit-appearance: none; + width: 18px; + height: 18px; + border-radius: 50%; + background: var(--accent-color); + border: none; + margin-top: -6px; /* center thumb */ + box-shadow: 0 0 10px var(--accent-color); + transition: transform 0.15s ease; + } - -
- - -
- + input[type="range"]:hover::-webkit-slider-thumb { + transform: scale(1.1); + } -
- Location format examples: City, Country Code - Osaka, JP | ZIP, Country Code - 94040, US | Latitude, Longitude - 34.6937, 135.5023 -
- -
-

Custom Message

- -
Allowed characters: A–Z, 0–9, space, and : ! ' - . ? , _ + % /
-
-
- - -
+ /* Track (Firefox) */ + input[type="range"]::-moz-range-track { + height: 6px; + background: rgba(255, 255, 255, 0.2); + border-radius: 6px; + } - + /* Thumb (Firefox) */ + input[type="range"]::-moz-range-thumb { + width: 18px; + height: 18px; + border-radius: 50%; + background: var(--accent-color); + border: none; + box-shadow: 0 0 10px var(--accent-color); + } - + /* Disabled base */ + input[type="range"]:disabled { + cursor: not-allowed; + opacity: 0.6; + } -