From 5180c0c836b603eea07a45f88a0457c5c18088ff Mon Sep 17 00:00:00 2001 From: Weller26 Date: Tue, 7 Apr 2026 17:47:47 +0500 Subject: [PATCH 1/7] 1 --- .idea/.gitignore | 10 ++++++++++ .idea/copilot.data.migration.ask2agent.xml | 6 ++++++ .idea/encodings.xml | 4 ++++ .idea/modules.xml | 8 ++++++++ .idea/positioning.iml | 8 ++++++++ .idea/vcs.xml | 6 ++++++ index.html | 7 ++++++- styles.css | 22 ++++++++++++++++++++++ 8 files changed, 70 insertions(+), 1 deletion(-) create mode 100644 .idea/.gitignore create mode 100644 .idea/copilot.data.migration.ask2agent.xml create mode 100644 .idea/encodings.xml create mode 100644 .idea/modules.xml create mode 100644 .idea/positioning.iml create mode 100644 .idea/vcs.xml diff --git a/.idea/.gitignore b/.idea/.gitignore new file mode 100644 index 0000000..69ab804 --- /dev/null +++ b/.idea/.gitignore @@ -0,0 +1,10 @@ +# Default ignored files +/shelf/ +/workspace.xml +# Ignored default folder with query files +/queries/ +# Datasource local storage ignored files +/dataSources/ +/dataSources.local.xml +# Editor-based HTTP Client requests +/httpRequests/ diff --git a/.idea/copilot.data.migration.ask2agent.xml b/.idea/copilot.data.migration.ask2agent.xml new file mode 100644 index 0000000..1f2ea11 --- /dev/null +++ b/.idea/copilot.data.migration.ask2agent.xml @@ -0,0 +1,6 @@ + + + + + \ No newline at end of file diff --git a/.idea/encodings.xml b/.idea/encodings.xml new file mode 100644 index 0000000..df87cf9 --- /dev/null +++ b/.idea/encodings.xml @@ -0,0 +1,4 @@ + + + + \ No newline at end of file diff --git a/.idea/modules.xml b/.idea/modules.xml new file mode 100644 index 0000000..67fa43d --- /dev/null +++ b/.idea/modules.xml @@ -0,0 +1,8 @@ + + + + + + + + \ No newline at end of file diff --git a/.idea/positioning.iml b/.idea/positioning.iml new file mode 100644 index 0000000..c956989 --- /dev/null +++ b/.idea/positioning.iml @@ -0,0 +1,8 @@ + + + + + + + + \ No newline at end of file diff --git a/.idea/vcs.xml b/.idea/vcs.xml new file mode 100644 index 0000000..35eb1dd --- /dev/null +++ b/.idea/vcs.xml @@ -0,0 +1,6 @@ + + + + + + \ No newline at end of file diff --git a/index.html b/index.html index 846cf93..ca500d3 100644 --- a/index.html +++ b/index.html @@ -6,7 +6,12 @@ - +
+
+ microsoft logo + atom logo +
+
\ No newline at end of file diff --git a/styles.css b/styles.css index e69de29..c3a0fea 100644 --- a/styles.css +++ b/styles.css @@ -0,0 +1,22 @@ +.container { + display: flex; +} + +.logo-container { + width: 200px; + height: 100px; + position: relative; + display: inline-flex; +} + +.logo-microsoft { + width: 100px; + height: 100px; + position: relative; +} + +.logo-atom { + width: 100px; + height: 100px; + position: relative; +} \ No newline at end of file From 88b731934f70172227331e2a62ae5a7e905daf80 Mon Sep 17 00:00:00 2001 From: Weller26 Date: Tue, 7 Apr 2026 18:06:25 +0500 Subject: [PATCH 2/7] base progress bar --- index.html | 7 +++++++ index.js | 2 +- styles.css | 32 +++++++++++++++++++++++++++++++- 3 files changed, 39 insertions(+), 2 deletions(-) diff --git a/index.html b/index.html index ca500d3..11a815b 100644 --- a/index.html +++ b/index.html @@ -11,6 +11,13 @@ microsoft logo atom logo + +
+
+ Loading... +
+
+
diff --git a/index.js b/index.js index dd50919..eaa058f 100644 --- a/index.js +++ b/index.js @@ -4,4 +4,4 @@ const element = document.querySelector('.myElement'); element.style.color = 'red'; element.style.width = '300px'; -*/ \ No newline at end of file +*/ diff --git a/styles.css b/styles.css index c3a0fea..69b91fe 100644 --- a/styles.css +++ b/styles.css @@ -19,4 +19,34 @@ width: 100px; height: 100px; position: relative; -} \ No newline at end of file +} + +.progress-bar { + position: relative; + background-color: lightgray; + width: 300px; + height: 25px; + overflow: hidden; + + display: flex; + align-items: center; + justify-content: center; +} + +.loading { + position: relative; + font-size: 20px; + font-family: sans-serif; + text-align: center; + z-index: 100; +} + +.progress { + position: absolute; + top: 0; + left: 0; + width: 50%; + height: 100%; + background-color: red; + z-index: 0; +} From 8a044a3def198e5f4328d8a963e16cf26bbcfcb1 Mon Sep 17 00:00:00 2001 From: Weller26 Date: Tue, 7 Apr 2026 18:37:03 +0500 Subject: [PATCH 3/7] prog bar --- index.html | 5 ++++- index.js | 22 ++++++++++++++++++++++ styles.css | 10 ++++++++-- 3 files changed, 34 insertions(+), 3 deletions(-) diff --git a/index.html b/index.html index 11a815b..4abd64c 100644 --- a/index.html +++ b/index.html @@ -16,8 +16,11 @@
Loading...
-
+
+ diff --git a/index.js b/index.js index eaa058f..cf043f1 100644 --- a/index.js +++ b/index.js @@ -5,3 +5,25 @@ element.style.color = 'red'; element.style.width = '300px'; */ + +'use strict'; + +let activate = false; +let progress = 0; +function activateProgressBar() { + if (activate) { + alert("Прогресс-бар уже активирован!"); + } else { + activateProgressBarIteration(); + activate = true; + } +} + +function activateProgressBarIteration() { + if (progress < 100) { + const bar = document.getElementById('bar'); + progress += 3.5; + bar.style.width = progress + '%'; + setTimeout(activateProgressBarIteration, 75); + } +} \ No newline at end of file diff --git a/styles.css b/styles.css index 69b91fe..6a28713 100644 --- a/styles.css +++ b/styles.css @@ -41,12 +41,18 @@ z-index: 100; } -.progress { +.bar { position: absolute; top: 0; left: 0; - width: 50%; + width: 0; height: 100%; background-color: red; z-index: 0; } + +.progress-button { + height: 50%; + position: relative; + display: flex; +} \ No newline at end of file From 69ec2b633e208272d01ba7fe79fe49abd2cf5ac4 Mon Sep 17 00:00:00 2001 From: ivolzok Date: Tue, 7 Apr 2026 18:37:12 +0500 Subject: [PATCH 4/7] lightBox --- index.html | 15 +++++++++++++++ index.js | 18 +++++++++++++++++- styles.css | 47 +++++++++++++++++++++++++++++++++++++++++++++++ 3 files changed, 79 insertions(+), 1 deletion(-) diff --git a/index.html b/index.html index 846cf93..7540ccc 100644 --- a/index.html +++ b/index.html @@ -7,6 +7,21 @@ + +
+ \ No newline at end of file diff --git a/index.js b/index.js index dd50919..4d52b72 100644 --- a/index.js +++ b/index.js @@ -4,4 +4,20 @@ const element = document.querySelector('.myElement'); element.style.color = 'red'; element.style.width = '300px'; -*/ \ No newline at end of file +*/ + +function openLightbox(){ + const lightBoxElement = document.getElementById("lightbox"); + lightBoxElement.style.display = 'block'; + + const overlayElement = document.getElementById("lightboxOverlay"); + overlayElement.style.display = 'block'; +} + +function closeLightbox(){ + const overlayElement = document.getElementById("lightboxOverlay"); + overlayElement.style.display = 'none'; + + const lightBoxElement = document.getElementById("lightbox"); + lightBoxElement.style.display = 'none'; +} \ No newline at end of file diff --git a/styles.css b/styles.css index e69de29..a5dfe58 100644 --- a/styles.css +++ b/styles.css @@ -0,0 +1,47 @@ +.overlay{ + position:fixed; + width: 100%; + height: 100%; + top: 0; + left: 0; +} + +#lightboxOverlay{ + background-color: rgba(0, 0, 0, 0.3); + display: none; +} + +.lightbox{ + width: 600px; + position: fixed; + z-index: 1; + border-style: solid; + border-color: black; + border-width: 2px; + background-color: white; +} +#lightbox{ + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + display: none; +} + +.lightboxContent{ + padding: 50px; +} + +#openLightboxButton{ + background-color: orange; + position: fixed; + width: 100px; + bottom: 20px; + right: 10px; +} + +#closeLightboxButton{ + position: absolute; + width: 10px; + top: 10px; + right: 10px; +} \ No newline at end of file From 2e6c24bdfbdc481c760bc4666908327c12c04ef1 Mon Sep 17 00:00:00 2001 From: ivolzok Date: Tue, 7 Apr 2026 18:38:43 +0500 Subject: [PATCH 5/7] idea --- .idea/.gitignore | 10 ++++++++++ .idea/modules.xml | 8 ++++++++ .idea/positioning.iml | 8 ++++++++ .idea/vcs.xml | 6 ++++++ 4 files changed, 32 insertions(+) create mode 100644 .idea/.gitignore create mode 100644 .idea/modules.xml create mode 100644 .idea/positioning.iml create mode 100644 .idea/vcs.xml diff --git a/.idea/.gitignore b/.idea/.gitignore new file mode 100644 index 0000000..ab1f416 --- /dev/null +++ b/.idea/.gitignore @@ -0,0 +1,10 @@ +# Default ignored files +/shelf/ +/workspace.xml +# Ignored default folder with query files +/queries/ +# Datasource local storage ignored files +/dataSources/ +/dataSources.local.xml +# Editor-based HTTP Client requests +/httpRequests/ diff --git a/.idea/modules.xml b/.idea/modules.xml new file mode 100644 index 0000000..67fa43d --- /dev/null +++ b/.idea/modules.xml @@ -0,0 +1,8 @@ + + + + + + + + \ No newline at end of file diff --git a/.idea/positioning.iml b/.idea/positioning.iml new file mode 100644 index 0000000..c956989 --- /dev/null +++ b/.idea/positioning.iml @@ -0,0 +1,8 @@ + + + + + + + + \ No newline at end of file diff --git a/.idea/vcs.xml b/.idea/vcs.xml new file mode 100644 index 0000000..35eb1dd --- /dev/null +++ b/.idea/vcs.xml @@ -0,0 +1,6 @@ + + + + + + \ No newline at end of file From 540ff9afef076bc4259d8f08683e9d7a8991f967 Mon Sep 17 00:00:00 2001 From: ivolzok Date: Tue, 7 Apr 2026 18:44:28 +0500 Subject: [PATCH 6/7] fix z-index --- styles.css | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/styles.css b/styles.css index d41f5f9..d424dcd 100644 --- a/styles.css +++ b/styles.css @@ -9,12 +9,13 @@ #lightboxOverlay{ background-color: rgba(0, 0, 0, 0.3); display: none; + z-index: 2; } .lightbox{ width: 600px; position: fixed; - z-index: 1; + z-index: 3; border-style: solid; border-color: black; border-width: 2px; @@ -85,7 +86,7 @@ font-size: 20px; font-family: sans-serif; text-align: center; - z-index: 100; + z-index: 1; } .bar { From 29236e34eb8ea32336d3bea4413277349bcdc30a Mon Sep 17 00:00:00 2001 From: Weller26 Date: Tue, 7 Apr 2026 19:10:07 +0500 Subject: [PATCH 7/7] pr bar --- index.html | 14 ++++++++++---- index.js | 18 ++++++++++++++++++ styles.css | 55 +++++++++++++++++++++++++++++++++++++++++++++++++++--- 3 files changed, 80 insertions(+), 7 deletions(-) diff --git a/index.html b/index.html index 4abd64c..3a17b52 100644 --- a/index.html +++ b/index.html @@ -8,13 +8,19 @@
- microsoft logo - atom logo +
+
+
+
+
+
+
+
-
- Loading... +
+ Loading...
diff --git a/index.js b/index.js index cf043f1..88714c4 100644 --- a/index.js +++ b/index.js @@ -24,6 +24,24 @@ function activateProgressBarIteration() { const bar = document.getElementById('bar'); progress += 3.5; bar.style.width = progress + '%'; + const loading = document.getElementById('loading'); + const progressBar = document.querySelector('.progress-bar'); + updateLetterColors(loading, progressBar) + setTimeout(activateProgressBarIteration, 75); } +} + +function updateLetterColors(loadingElement, progressBarElement) { + const spans = loadingElement.querySelectorAll('span'); + const progressBarWidth = progressBarElement.offsetWidth; + const currentProgress = progressBarWidth * (progress / 100); + + spans.forEach((span, index) => { + const spanPosition = (progressBarWidth / spans.length) * index + (progressBarWidth / spans.length) / 2; + + if (spanPosition < currentProgress) { + span.style.color = 'white'; + } + }); } \ No newline at end of file diff --git a/styles.css b/styles.css index 6a28713..1a032b6 100644 --- a/styles.css +++ b/styles.css @@ -9,18 +9,61 @@ display: inline-flex; } -.logo-microsoft { +.logo-japan { width: 100px; height: 100px; - position: relative; } -.logo-atom { +.logo-japan .circle { + background-color: red; + width: 100px; + height: 100px; + border-radius: 50%; + transform: scale(0.5); +} + +.logo-4 { width: 100px; height: 100px; position: relative; } +.logo-4 .small-circle { + background-color: red; + width: 100px; + height: 100px; + border-radius: 50%; + transform: translate(-50%, -50%) scale(0.3); + position: absolute; + top: 50%; + left: 50%; + z-index: 4; +} + +.logo-4 .average-circle { + background-color: white; + width: 100px; + height: 100px; + border-radius: 50%; + transform: translate(-50%, -50%) scale(0.5); + position: absolute; + top: 50%; + left: 50%; + z-index: 3; +} + +.logo-4 .big-circle { + background-color: red; + width: 100px; + height: 100px; + border-radius: 50%; + transform: translate(-50%, -50%) scale(0.7); + position: absolute; + top: 50%; + left: 50%; + z-index: 2; +} + .progress-bar { position: relative; background-color: lightgray; @@ -39,6 +82,12 @@ font-family: sans-serif; text-align: center; z-index: 100; + letter-spacing: 2px; +} + +.loading span { + color: black; + transition: color 0.05s ease; } .bar {