ploszukiwacz/StartPage
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions
StartPage/startpage/index.html
ploszukiwacz 66e88f284a
QOL pt. 2 :3
2025-02-03 19:49:23 +01:00

184 lines
10 KiB
HTML
Executable file
Raw Blame History

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="Content-Security-Policy"
content="default-src 'self';
style-src 'self' 'unsafe-inline';
script-src 'self';
font-src 'self';
img-src 'self' data: blob:;
connect-src 'self';">
<title>PlOszukiwacz's Startpage</title>
<link rel="stylesheet" href="styles.css">
<link rel="stylesheet" href="fontawesome/css/all.min.css">
<script type="module" src="js/main.js"></script>
</head>
<body>
<div class="settings-button" id="openSettings">
<i class="fas fa-cog"></i>
</div>
<div class="settings-popup" id="settingsPopup">
<div class="settings-content">
<h3>Settings</h3>
<div class="settings-section">
<h4>Background</h4>
<div class="preset-backgrounds">
<div class="preset-bg-option" data-bg="none" data-title="No Background"></div>
<div class="preset-bg-option" data-bg="backgrounds/blissnight.png" data-title="Bliss Night"></div>
<div class="preset-bg-option" data-bg="backgrounds/bsod.png" title="BSOD"></div>
<div class="preset-bg-option" data-bg="backgrounds/shaded_landscape.png" title="Shaded Landscape"></div>
<div class="preset-bg-option" data-bg="backgrounds/orbit.png" title="Orbit"></div>
<div class="preset-bg-option" data-bg="backgrounds/2kki_adabana_gardens.png" title="2kki"></div>
<div class="preset-bg-option" data-bg="backgrounds/2kki_bridged_swamp_islands.png" title="2kki"></div>
<div class="preset-bg-option" data-bg="backgrounds/2kki_home_within_nowhere.png" title="2kki"></div>
<div class="preset-bg-option" data-bg="backgrounds/2kki_lamplit_stones.png" title="2kki"></div>
<div class="preset-bg-option" data-bg="backgrounds/2kki_pure_white_lands0.png" title="2kki"></div>
<div class="preset-bg-option" data-bg="backgrounds/2kki_pure_white_lands1.png" title="2kki"></div>
<div class="preset-bg-option" data-bg="backgrounds/2kki_pure_white_lands2.png" title="2kki"></div>
<div class="preset-bg-option" data-bg="backgrounds/2kki_rainy_apartments.png" title="2kki"></div>
<div class="preset-bg-option" data-bg="backgrounds/2kki_verdant_promenade.png" title="2kki"></div>
</div>
<p>Or upload your own:</p>
<input type="file" id="bgImage" accept="image/*">
<button id="removeButton" class="settings-btn" data-action="removeBackground">Remove Background</button>
</div>
<div class="settings-section">
<h4>Personalization</h4>
<input type="text" id="nameInput" class="settings-input" placeholder="Enter your name (optional)">
<button id="saveName" class="settings-btn" data-action="saveName">Save Name</button>
</div>
<div class="settings-section">
<h4>Theme</h4>
<select id="themeSelect" class="settings-btn">
<option value="mocha">Catppuccin Mocha</option>
<option value="macchiato">Catppuccin Macchiato</option>
<option value="frappe">Catppuccin Frappé</option>
<option value="latte">Catppuccin Latte</option>
<option value="femboy-pink">Femboy Pink</option>
</select>
</div>
<div class="settings-section">
<h4>Links Management</h4>
<div id="categories-editor">
</div>
<button class="settings-btn" id="addCategory" data-action="addCategory">Add New Category</button>
<button class="settings-btn" id="addLink" data-action="addLink">Add New Link</button>
<button class="settings-btn" id="exportLinks" data-action="exportLinks">Export Links</button>
<input type="file" id="importLinks" accept=".json" style="display: none;">
<button class="settings-btn" id="importLinksBtn" data-action="importLinks">Import Links</button>
</div>
<div class="settings-section">
<h4>Search Engines</h4>
<div id="search-engines">
</div>
<button class="settings-btn" id="addSearchEngine" data-action="addSearchEngine">Add Search Engine</button>
</div>
<div class="settings-section">
<h4>Keyboard Shortcuts</h4>
<div id="shortcuts-editor">
</div>
</div>
<div class="settings-section">
<h4>Layout & Style</h4>
<div class="setting-group">
<label>Transparency:</label>
<input type="range" id="transparencyControl" min="0" max="100" value="15" class="settings-input">
<span id="transparencyValue">15%</span>
<button class="settings-btn small reset-btn" id="resetTransparency">Reset</button>
</div>
<div class="setting-group">
<label>Blur Effect:</label>
<div class="toggle-switch">
<input type="checkbox" id="blurToggle">
<label for="blurToggle"></label>
</div>
<div class="blur-controls">
<input type="range" id="blurControl" min="0" max="20" value="8" class="settings-input">
<span id="blurValue">8px</span>
<button class="settings-btn small reset-btn" id="resetBlur">Reset</button>
</div>
</div>
<div class="setting-group">
<label>Link Size:</label>
<input type="range" id="linkSizeControl" min="12" max="38" value="16" class="settings-input">
<span id="linkSizeValue">16px</span>
<button class="settings-btn small reset-btn" id="resetLinkSize">Reset</button>
</div>
<select id="layoutSelect" class="settings-input">
<option value="grid">Grid Layout</option>
<option value="list">List Layout</option>
</select>
<select id="fontSelect" class="settings-input">
<option value="system-ui">System Default</option>
<option value="MapleMono">Maple Mono</option>
<option value="Arial">Arial</option>
<option value="Roboto">Roboto</option>
<option value="monospace">Monospace</option>
</select>
<div class="css-editor">
<h5>Custom CSS</h5>
<textarea id="customCSS" class="settings-input code" rows="5" spellcheck="false"></textarea>
</div>
</div>
<div class="settings-section">
<h4>Backup & Restore</h4>
<button class="settings-btn" id="exportData">Export All Data</button>
<input type="file" id="importDataFile" accept=".json" style="display: none;">
<button class="settings-btn" id="importData">Import Data</button>
<p class="settings-note">This will backup/restore all your settings, links, shortcuts, icons, and search engines.</p>
</div>
<button class="settings-btn close-settings" data-action="closeSettings">Close</button>
<div class="copyright-section">
<p>Startpage v1.0.0</p>
<p>Made by <a href="https://ploszukiwacz.is-a.dev target="_blank">PlOszukiwacz</a></p>
<p><a href="https://git.hackclub.app/ploszukiwacz/StartPage" target="_blank">Git Repository</a></p>
<p>Licensed under <a href="https://www.gnu.org/licenses/agpl-3.0.html" target="_blank">GNU AGPL v3.0</a></p>
<p class="copyright-footer">© 2025 PlOszukiwacz. All rights reserved.</p>
</div>
</div>
</div>
<div class="container">
<div class="clock-section">
<div id="greeting"></div>
<h2 id="clock"></h2>
</div>
<div class="search-box">
<form id="search-form" action="https://search.ploszukiwacz.pl/search" method="get">
<input type="text" id="search-input" name="q" placeholder="Search with SearXNG... (Press 'S')" autocomplete="off">
</form>
<div id="search-suggestions" class="suggestions"></div>
</div>
<div class="links-container">
<div class="category">
<h2>Development</h2>
<ul>
<li><a href="https://github.com">GitHub</a></li>
<li><a href="https://stackoverflow.com">Stack Overflow</a></li>
<li><a href="https://developer.mozilla.org">MDN</a></li>
</ul>
</div>
<div class="category">
<h2>Social</h2>
<ul>
<li><a href="https://www.reddit.com">Reddit</a></li>
<li><a href="https://www.twitter.com">Twitter</a></li>
<li><a href="https://www.linkedin.com">LinkedIn</a></li>
</ul>
</div>
<div class="category">
<h2>Entertainment</h2>
<ul>
<li><a href="https://www.youtube.com">YouTube</a></li>
<li><a href="https://www.netflix.com">Netflix</a></li>
<li><a href="https://www.spotify.com">Spotify</a></li>
</ul>
</div>
</div>
</div>
</body>
</html>
Reference in a new issue View git blame Copy permalink