feat: update index page

This commit is contained in:
2026-06-25 12:43:38 +05:00
parent b1c8ee08ff
commit 2edba57952
7 changed files with 61 additions and 10 deletions
+1 -1
View File
@@ -1,3 +1,3 @@
# TODO # TODO
- [ ] Переделать процесс работы с инпутами — прятать локальные, если не используется - [ ] Переделать процесс работы с инпутами — прятать локальные, если не используется, прятать чат, если не используется
+1 -1
View File
@@ -19,7 +19,7 @@
<div id="input-display"> <div id="input-display">
<div id="input-local"> <div id="input-local">
<div id="typed-text">ты можешь набирать слова прямо тут</div> <div id="typed-text">просто пиши !play и другие слова</div>
</div> </div>
<div id="input-chat" class="hidden"> <div id="input-chat" class="hidden">
<div id="chat-text"></div> <div id="chat-text"></div>
+1
View File
@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor"><path d="M12 0C5.37 0 0 5.37 0 12c0 5.31 3.435 9.795 8.205 11.385.6.105.825-.255.825-.57 0-.285-.015-1.23-.015-2.235-3.015.555-3.795-.735-4.035-1.41-.135-.345-.72-1.41-1.23-1.695-.42-.225-1.02-.78-.015-.795.945-.015 1.62.87 1.845 1.23 1.08 1.815 2.805 1.305 3.495.99.105-.78.42-1.305.765-1.605-2.67-.3-5.46-1.335-5.46-5.925 0-1.305.465-2.385 1.23-3.225-.12-.3-.54-1.53.12-3.18 0 0 1.005-.315 3.3 1.23.96-.27 1.98-.405 3-.405s2.04.135 3 .405c2.295-1.56 3.3-1.23 3.3-1.23.66 1.65.24 2.88.12 3.18.765.84 1.23 1.905 1.23 3.225 0 4.605-2.805 5.625-5.475 5.925.435.375.81 1.095.81 2.22 0 1.605-.015 2.895-.015 3.3 0 .315.225.69.825.57A12.02 12.02 0 0024 12c0-6.63-5.37-12-12-12z"/></svg>

After

Width:  |  Height:  |  Size: 762 B

+1
View File
@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor"><path d="M11.571 4.714h1.715v5.143H11.57zm4.715 0H18v5.143h-1.714zM6 0L1.714 4.286v15.428h5.143V24l4.286-4.286h3.428L22.286 12V0zm14.571 11.143l-3.428 3.428h-3.429l-3 3v-3H6.857V1.714h13.714z"/></svg>

After

Width:  |  Height:  |  Size: 281 B

+14
View File
@@ -21,6 +21,20 @@
Вставь ссылку в OBS как источник браузера<br /> Вставь ссылку в OBS как источник браузера<br />
Желательно высоту побольше Желательно высоту побольше
</div> </div>
<div class="links-row">
<a href="https://github.com/Ku6epXBOCTuK/shooting-word-html" target="_blank" class="page-link">
<svg class="link-icon" viewBox="0 0 24 24" fill="currentColor"><path d="M12 0C5.37 0 0 5.37 0 12c0 5.31 3.435 9.795 8.205 11.385.6.105.825-.255.825-.57 0-.285-.015-1.23-.015-2.235-3.015.555-3.795-.735-4.035-1.41-.135-.345-.72-1.41-1.23-1.695-.42-.225-1.02-.78-.015-.795.945-.015 1.62.87 1.845 1.23 1.08 1.815 2.805 1.305 3.495.99.105-.78.42-1.305.765-1.605-2.67-.3-5.46-1.335-5.46-5.925 0-1.305.465-2.385 1.23-3.225-.12-.3-.54-1.53.12-3.18 0 0 1.005-.315 3.3 1.23.96-.27 1.98-.405 3-.405s2.04.135 3 .405c2.295-1.56 3.3-1.23 3.3-1.23.66 1.65.24 2.88.12 3.18.765.84 1.23 1.905 1.23 3.225 0 4.605-2.805 5.625-5.475 5.925.435.375.81 1.095.81 2.22 0 1.605-.015 2.895-.015 3.3 0 .315.225.69.825.57A12.02 12.02 0 0024 12c0-6.63-5.37-12-12-12z"/></svg>
GitHub
</a>
<a href="https://github.com/Ku6epXBOCTuK/shooting-word-html/issues" target="_blank" class="page-link">
<svg class="link-icon" viewBox="0 0 24 24" fill="currentColor"><path d="M12 0C5.37 0 0 5.37 0 12c0 5.31 3.435 9.795 8.205 11.385.6.105.825-.255.825-.57 0-.285-.015-1.23-.015-2.235-3.015.555-3.795-.735-4.035-1.41-.135-.345-.72-1.41-1.23-1.695-.42-.225-1.02-.78-.015-.795.945-.015 1.62.87 1.845 1.23 1.08 1.815 2.805 1.305 3.495.99.105-.78.42-1.305.765-1.605-2.67-.3-5.46-1.335-5.46-5.925 0-1.305.465-2.385 1.23-3.225-.12-.3-.54-1.53.12-3.18 0 0 1.005-.315 3.3 1.23.96-.27 1.98-.405 3-.405s2.04.135 3 .405c2.295-1.56 3.3-1.23 3.3-1.23.66 1.65.24 2.88.12 3.18.765.84 1.23 1.905 1.23 3.225 0 4.605-2.805 5.625-5.475 5.925.435.375.81 1.095.81 2.22 0 1.605-.015 2.895-.015 3.3 0 .315.225.69.825.57A12.02 12.02 0 0024 12c0-6.63-5.37-12-12-12z"/></svg>
Увидели ошибку? Пиши сюда
</a>
<a href="https://www.twitch.tv/ku6ep_xboctuk" target="_blank" class="page-link">
<svg class="link-icon" viewBox="0 0 24 24" fill="currentColor"><path d="M11.571 4.714h1.715v5.143H11.57zm4.715 0H18v5.143h-1.714zM6 0L1.714 4.286v15.428h5.143V24l4.286-4.286h3.428L22.286 12V0zm14.571 11.143l-3.428 3.428h-3.429l-3 3v-3H6.857V1.714h13.714z"/></svg>
Twitch
</a>
</div>
</div> </div>
</div> </div>
<script src="js/index.js"></script> <script src="js/index.js"></script>
+1 -1
View File
@@ -36,7 +36,7 @@ const CONFIG = {
fastEnemyCrossTimeCap: 10, fastEnemyCrossTimeCap: 10,
fastEnemyCrossTimeCapWave: 50, fastEnemyCrossTimeCapWave: 50,
bossCrossTime: 60, bossCrossTime: 60,
projectileCrossTime: 1.3, projectileCrossTime: 0.43,
gridSpeed: 0.5, gridSpeed: 0.5,
}, },
visual: { visual: {
+42 -7
View File
@@ -254,7 +254,7 @@ body {
opacity: 1; opacity: 1;
margin-bottom: 8px; margin-bottom: 8px;
} }
#channel-form input { #channel-form input[type="text"] {
background: transparent; background: transparent;
border: 2px solid #00ff41; border: 2px solid #00ff41;
color: #00ff41; color: #00ff41;
@@ -266,7 +266,15 @@ body {
text-shadow: 0 0 12px #00ff41; text-shadow: 0 0 12px #00ff41;
box-shadow: 0 0 20px rgba(0, 255, 65, 0.2); box-shadow: 0 0 20px rgba(0, 255, 65, 0.2);
} }
#channel-form input:focus { #channel-form input[type="text"]:focus {
box-shadow: 0 0 30px rgba(0, 255, 65, 0.4);
}
#channel-form input[type="checkbox"] {
border: none;
box-shadow: none;
padding: 0;
}
#channel-form input:not([type="checkbox"]):focus {
box-shadow: 0 0 30px rgba(0, 255, 65, 0.4); box-shadow: 0 0 30px rgba(0, 255, 65, 0.4);
} }
#settings-panel { #settings-panel {
@@ -277,7 +285,7 @@ body {
} }
.settings-label { .settings-label {
color: #00cc33; color: #00cc33;
font-size: 14px; font-size: 28px;
cursor: pointer; cursor: pointer;
display: flex; display: flex;
align-items: center; align-items: center;
@@ -289,10 +297,11 @@ body {
opacity: 1; opacity: 1;
} }
.settings-label input[type="checkbox"] { .settings-label input[type="checkbox"] {
width: 16px; width: 28px;
height: 16px; height: 28px;
accent-color: #00ff41; accent-color: #00ff41;
cursor: pointer; cursor: pointer;
margin-right: 12px;
} }
#channel-form button { #channel-form button {
background: transparent; background: transparent;
@@ -322,10 +331,36 @@ body {
text-shadow: 0 0 12px #00ff41; text-shadow: 0 0 12px #00ff41;
} }
#channel-form .obs-note { #channel-form .obs-note {
margin-top: 24px; margin-top: 32px;
color: #00ff41; color: #00ff41;
font-size: 16px; font-size: 28px;
opacity: 0.8; opacity: 0.8;
line-height: 1.6; line-height: 1.6;
text-shadow: 0 0 6px #00ff41; text-shadow: 0 0 6px #00ff41;
} }
.links-row {
display: flex;
gap: 40px;
margin-top: 16px;
}
.page-link {
display: inline-flex;
align-items: center;
gap: 8px;
color: #00ff41;
font-size: 22px;
text-decoration: none;
text-shadow: 0 0 10px #00ff41;
opacity: 0.85;
transition: opacity 0.15s;
}
.link-icon {
width: 24px;
height: 24px;
flex-shrink: 0;
color: #00ff41;
}
.page-link:hover {
opacity: 1;
text-shadow: 0 0 16px #00ff41;
}