zumbiepig/MineXLauncher
zumbiepig/MineXLauncher
1
0
Fork 0
mirror of https://github.com/zumbiepig/MineXLauncher.git synced 2025-06-08 09:24:48 +00:00
Code

pls fix the buttons

Browse Source
This commit is contained in:
zumbiepig 2024-09-02 21:18:03 -07:00
parent 8bf78521ac
commit 0c77f1fd2f
No known key found for this signature in database
GPG Key ID: 17C891BE28B953DE
5 changed files with 36 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
public/mods/mods/index.html
View File

@ -54,13 +54,13 @@
</ul> </ul>
</div> </div>
<div class="main-content"> <div class="main-content">
<div class="mod-list minecraft-scrollbar"></div> <div class="mod-list"></div>
</div>
<div class="installations"> <div class="installations">
<button class="play-button" onclick="game.play('/game/web/clients/eaglerforge/')">Play</button> <button class="play-button" onclick="game.play('/game/web/clients/eaglerforge/')">Play</button>
</div> </div>
</div> </div>
</div> </div>
</div>
<div class="bottom-bar"> <div class="bottom-bar">
<div class="bottom-bar-links"> <div class="bottom-bar-links">
<a href="https://discord.gg/YKgfuFvKhA" class="bottom-bar-left">Join the MineXLauncher Discord</a> <a href="https://discord.gg/YKgfuFvKhA" class="bottom-bar-left">Join the MineXLauncher Discord</a>

2
public/mods/resourcepacks/index.html
View File

@ -54,7 +54,7 @@
</ul> </ul>
</div> </div>
<div class="main-content"> <div class="main-content">
<div class="mod-list minecraft-scrollbar"></div> <div class="mod-list"></div>
</div> </div>
</div> </div>
</div> </div>

30
public/resources/styles/themes/default.css
View File

@ -185,8 +185,7 @@ nav {
flex-direction: column; flex-direction: column;
background-color: #202020; background-color: #202020;
box-sizing: border-box; box-sizing: border-box;
position: relative; overflow-y: auto;
overflow: auto;
scrollbar-width: thin; scrollbar-width: thin;
scrollbar-color: #555 #333; scrollbar-color: #555 #333;
} }
@ -207,13 +206,12 @@ nav {
.installations { .installations {
display: flex; display: flex;
flex: 1;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
width: 100%; width: 100%;
background-color: #292929; background-color: #292929;
box-sizing: border-box; box-sizing: border-box;
position: absolute; position: sticky;
bottom: 0; bottom: 0;
left: 0; left: 0;
padding: 10px 20px; padding: 10px 20px;
@ -452,7 +450,6 @@ nav {
display: grid; display: grid;
grid-template-columns: repeat(3, 1fr); grid-template-columns: repeat(3, 1fr);
gap: 10px; gap: 10px;
max-height: 100%;
padding: 10px; padding: 10px;
text-align: center; text-align: center;
scrollbar-width: thin; scrollbar-width: thin;
@ -465,6 +462,8 @@ nav {
box-shadow: 0 0 10px rgba(0, 0, 0, 0.3); box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
padding: 10px; padding: 10px;
text-align: center; text-align: center;
position: relative;
padding-bottom: 30px;
} }
.mod-item .mod-icon { .mod-item .mod-icon {
@ -506,10 +505,17 @@ nav {
.mod-item .mod-links { .mod-item .mod-links {
display: flex; display: flex;
justify-content: space-around; justify-content: space-around;
margin-top: 10px; position: absolute;
bottom: 10px;
width: 100%;
} }
.mod-item .mod-download { .mod-item .mod-links .mod-download,
.mod-item .mod-links .mod-install {
flex: 1;
}
.mod-item .mod-links .mod-download {
padding: 5px 15px; padding: 5px 15px;
background-color: #555; background-color: #555;
color: #fff; color: #fff;
@ -518,12 +524,12 @@ nav {
transition: background-color 0.3s; transition: background-color 0.3s;
} }
.mod-item .mod-download:hover { .mod-item .mod-links .mod-download:hover {
cursor: pointer; cursor: pointer;
background-color: #777; background-color: #777;
} }
.mod-item .mod-install { .mod-item .mod-links .mod-install {
padding: 5px 15px; padding: 5px 15px;
background-color: #4c4; background-color: #4c4;
color: #fff; color: #fff;
@ -532,16 +538,16 @@ nav {
transition: background-color 0.3s; transition: background-color 0.3s;
} }
.mod-item .mod-install:hover { .mod-item .mod-links .mod-install:hover {
cursor: pointer; cursor: pointer;
background-color: #00b300; background-color: #00b300;
} }
.mod-item .mod-install.installed { .mod-item .mod-links .mod-install.installed {
background-color: #ff0000; background-color: #ff0000;
} }
.mod-item .mod-install.installed:hover { .mod-item .mod-links .mod-install.installed:hover {
background-color: #cc0000; background-color: #cc0000;
} }

4
public/settings/index.html
View File

@ -66,10 +66,10 @@
<label for="offline-checkbox">Enable offline use:</label> <label for="offline-checkbox">Enable offline use:</label>
<input type="checkbox" id="offline-checkbox" /> <input type="checkbox" id="offline-checkbox" />
</div> --> </div> -->
<div class="settings-section"> <!-- <div class="settings-section">
<label for="ads-checkbox">Show ads:</label> <label for="ads-checkbox">Show ads:</label>
<input type="checkbox" id="ads-checkbox" /> <input type="checkbox" id="ads-checkbox" />
</div> </div> -->
</div> </div>
</div> </div>
</div> </div>

16
src/resources/scripts/main.ts
View File

@ -395,7 +395,7 @@ if (window.location.pathname === '/') {
} }
}); });
if (storage.local.get('showAds')) { /* if (storage.local.get('showAds')) {
const googleAdsScript = document.createElement('script'); const googleAdsScript = document.createElement('script');
googleAdsScript.async = true; googleAdsScript.async = true;
googleAdsScript.src = 'https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-1132419379737567'; googleAdsScript.src = 'https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-1132419379737567';
@ -412,7 +412,7 @@ if (window.location.pathname === '/') {
adsContainer.style.display = 'flex'; adsContainer.style.display = 'flex';
}); });
}); });
} } */
} }
if (window.location.pathname === '/settings/') { if (window.location.pathname === '/settings/') {
@ -421,7 +421,7 @@ if (window.location.pathname === '/settings/') {
const usernameInput = document.getElementById('username-input') as HTMLInputElement; const usernameInput = document.getElementById('username-input') as HTMLInputElement;
const themeSelect = document.getElementById('theme-select') as HTMLSelectElement; const themeSelect = document.getElementById('theme-select') as HTMLSelectElement;
// const offlineCheckbox = document.getElementById('offline-checkbox') as HTMLInputElement; // const offlineCheckbox = document.getElementById('offline-checkbox') as HTMLInputElement;
const adsCheckbox = document.getElementById('ads-checkbox') as HTMLInputElement; // const adsCheckbox = document.getElementById('ads-checkbox') as HTMLInputElement;
const themeData: { id: string; name: string }[] = (await (await fetch('/resources/data.json')).json()).themes; const themeData: { id: string; name: string }[] = (await (await fetch('/resources/data.json')).json()).themes;
themeData.forEach((theme: { id: string; name: string }) => { themeData.forEach((theme: { id: string; name: string }) => {
@ -434,7 +434,7 @@ if (window.location.pathname === '/settings/') {
usernameInput.placeholder = storage.local.get('username') ?? ''; usernameInput.placeholder = storage.local.get('username') ?? '';
themeSelect.value = storage.local.get('theme') ?? ''; themeSelect.value = storage.local.get('theme') ?? '';
// offlineCheckbox.checked = storage.local.get('offlineCache') ?? false; // offlineCheckbox.checked = storage.local.get('offlineCache') ?? false;
adsCheckbox.checked = storage.local.get('showAds'); // adsCheckbox.checked = storage.local.get('showAds');
usernameInput.addEventListener('input', () => { usernameInput.addEventListener('input', () => {
let username = usernameInput.value.replace(/[^A-Za-z0-9]/g, '_').substring(0, 16); let username = usernameInput.value.replace(/[^A-Za-z0-9]/g, '_').substring(0, 16);
@ -460,11 +460,11 @@ if (window.location.pathname === '/settings/') {
} }
}); */ }); */
adsCheckbox.addEventListener('change', () => { /* adsCheckbox.addEventListener('change', () => {
storage.local.set('showAds', adsCheckbox.checked); storage.local.set('showAds', adsCheckbox.checked);
const adsContainers = Array.from(document.getElementsByClassName('ads-container')) as HTMLElement[]; const adsContainers = Array.from(document.getElementsByClassName('ads-container')) as HTMLElement[];
adsContainers.forEach((adsContainer) => (adsContainer.style.display = 'none')); adsContainers.forEach((adsContainer) => (adsContainer.style.display = 'none'));
}); }); */
}); });
} else if (window.location.pathname === '/welcome/') { } else if (window.location.pathname === '/welcome/') {
document.addEventListener('DOMContentLoaded', async () => { document.addEventListener('DOMContentLoaded', async () => {
@ -535,16 +535,16 @@ if (window.location.pathname === '/settings/') {
<img loading="lazy" src="/resources/mods/icons/${addon.id}.webp" /> <img loading="lazy" src="/resources/mods/icons/${addon.id}.webp" />
</div> </div>
<div class="mod-details"> <div class="mod-details">
<h3 class="mod-name">${addon.name}</h3> <strong class="mod-name">${addon.name}</strong>
<p class="mod-author">By <a href="${addon.authorLink}" target="_blank">${addon.author}</a></p> <p class="mod-author">By <a href="${addon.authorLink}" target="_blank">${addon.author}</a></p>
<p class="mod-description">${addon.description}</p> <p class="mod-description">${addon.description}</p>
</div>
<div class="mod-links"> <div class="mod-links">
${ ${
addonType === 'mods' addonType === 'mods'
? `<a class="mod-install" id="mod-install-${addon.id}" onclick="mods.toggle('${addon.id}')">Install</a>` ? `<a class="mod-install" id="mod-install-${addon.id}" onclick="mods.toggle('${addon.id}')">Install</a>`
: `<a href="/resources/mods/downloads/${addon.id}.zip" class="mod-download" download>Download</a>` : `<a href="/resources/mods/downloads/${addon.id}.zip" class="mod-download" download>Download</a>`
} }
</div>
</div>`; </div>`;
modList?.appendChild(modItem); modList?.appendChild(modItem);
}); });