diff options
Diffstat (limited to 'src/index.html')
| -rw-r--r-- | src/index.html | 98 |
1 files changed, 37 insertions, 61 deletions
diff --git a/src/index.html b/src/index.html index 470050f..6af44a2 100644 --- a/src/index.html +++ b/src/index.html @@ -18,7 +18,7 @@ <div class="tagline">Universal Search Engine</div> <!-- Wrap in form for better URL handling --> - <form class="search-container" onsubmit="event.preventDefault(); search(searchInput.value);"> + <form class="search-container" id="search-form"> <div class="search-box"> <div class="search-prefix">→</div> <input @@ -34,18 +34,17 @@ <button class="action-btn" id="clear-btn" title="CLEAR" type="button">×</button> </div> </div> - <!-- Hidden submit button for accessibility --> <button type="submit" style="display: none;">Search</button> </form> <div class="shortcuts"> - <span class="shortcut" onclick="insertBang('!n')">!N NEWS</span> - <span class="shortcut" onclick="searchFor('$TSLA')">$TSLA</span> - <span class="shortcut" onclick="insertBang('!w')">!W WIKI</span> - <span class="shortcut" onclick="insertBang('!g')">!G GITHUB</span> - <span class="shortcut" onclick="insertBang('!r')">!R REDDIT</span> - <span class="shortcut" onclick="toolUUID()">UUID</span> - <span class="shortcut" onclick="toolTimer()">TIMER</span> + <span class="shortcut" data-bang="!n">!N NEWS</span> + <span class="shortcut" data-query="$TSLA">$TSLA</span> + <span class="shortcut" data-bang="!w">!W WIKI</span> + <span class="shortcut" data-bang="!g">!G GITHUB</span> + <span class="shortcut" data-bang="!r">!R REDDIT</span> + <span class="shortcut" data-tool="uuid">UUID</span> + <span class="shortcut" data-tool="timer">TIMER</span> </div> </section> @@ -71,7 +70,7 @@ <aside class="sidebar-left"> <!-- SOURCES --> <div class="widget" id="widget-sources"> - <div class="widget-header" onclick="toggleWidget('widget-sources')"> + <div class="widget-header" data-toggle="widget-sources"> <span class="widget-title">Sources</span> <span class="widget-toggle">+</span> </div> @@ -82,34 +81,34 @@ <!-- TOOLS --> <div class="widget" id="widget-tools"> - <div class="widget-header" onclick="toggleWidget('widget-tools')"> + <div class="widget-header" data-toggle="widget-tools"> <span class="widget-title">Tools</span> <span class="widget-toggle">+</span> </div> <div class="widget-body"> <div class="tools-grid"> - <button class="tool-btn" onclick="toolUUID()"> + <button class="tool-btn" data-tool="uuid"> <span class="icon">◈</span>UUID </button> - <button class="tool-btn" onclick="toolTimer()"> + <button class="tool-btn" data-tool="timer"> <span class="icon">◷</span>TIMER </button> - <button class="tool-btn" onclick="toolBase64()"> + <button class="tool-btn" data-tool="base64"> <span class="icon">◐</span>BASE64 </button> - <button class="tool-btn" onclick="toolJSON()"> + <button class="tool-btn" data-tool="json"> <span class="icon">{ }</span>JSON </button> - <button class="tool-btn" onclick="toolHash()"> + <button class="tool-btn" data-tool="hash"> <span class="icon">#</span>HASH </button> - <button class="tool-btn" onclick="toolColor()"> + <button class="tool-btn" data-tool="color"> <span class="icon">◼</span>COLOR </button> - <button class="tool-btn" onclick="toolPassword()"> + <button class="tool-btn" data-tool="password"> <span class="icon">※</span>PASSWORD </button> - <button class="tool-btn" onclick="toolLoremIpsum()"> + <button class="tool-btn" data-tool="lorem"> <span class="icon">¶</span>LOREM </button> </div> @@ -118,29 +117,29 @@ <!-- BANGS --> <div class="widget" id="widget-bangs"> - <div class="widget-header" onclick="toggleWidget('widget-bangs')"> + <div class="widget-header" data-toggle="widget-bangs"> <span class="widget-title">Bangs</span> <span class="widget-toggle">+</span> </div> <div class="widget-body"> <div class="bangs-grid"> - <span class="bang" onclick="insertBang('!n')">!N NEWS</span> - <span class="bang" onclick="insertBang('!w')">!W WIKI</span> - <span class="bang" onclick="insertBang('!g')">!G GITHUB</span> - <span class="bang" onclick="insertBang('!r')">!R REDDIT</span> - <span class="bang" onclick="insertBang('!hn')">!HN NEWS</span> - <span class="bang" onclick="insertBang('!so')">!SO STACK</span> - <span class="bang" onclick="insertBang('!npm')">!NPM</span> - <span class="bang" onclick="insertBang('!d')">!D DICT</span> - <span class="bang" onclick="insertBang('!b')">!B BOOKS</span> - <span class="bang" onclick="insertBang('$')">$ STOCK</span> + <span class="bang" data-bang="!n">!N NEWS</span> + <span class="bang" data-bang="!w">!W WIKI</span> + <span class="bang" data-bang="!g">!G GITHUB</span> + <span class="bang" data-bang="!r">!R REDDIT</span> + <span class="bang" data-bang="!hn">!HN NEWS</span> + <span class="bang" data-bang="!so">!SO STACK</span> + <span class="bang" data-bang="!npm">!NPM</span> + <span class="bang" data-bang="!d">!D DICT</span> + <span class="bang" data-bang="!b">!B BOOKS</span> + <span class="bang" data-bang="$">$ STOCK</span> </div> </div> </div> <!-- HISTORY --> <div class="widget" id="widget-history"> - <div class="widget-header" onclick="toggleWidget('widget-history')"> + <div class="widget-header" data-toggle="widget-history"> <span class="widget-title">History</span> <span class="widget-toggle">+</span> </div> @@ -165,7 +164,7 @@ <aside class="sidebar-right"> <!-- CALCULATOR --> <div class="widget" id="widget-calc"> - <div class="widget-header" onclick="toggleWidget('widget-calc')"> + <div class="widget-header" data-toggle="widget-calc"> <span class="widget-title">Calculator</span> <span class="widget-toggle">+</span> </div> @@ -174,34 +173,13 @@ <div class="calc-expr" id="calc-expr"></div> <div class="calc-result" id="calc-result">0</div> </div> - <div class="calc-grid"> - <button class="calc-btn" data-v="C">C</button> - <button class="calc-btn" data-v="(">(</button> - <button class="calc-btn" data-v=")">)</button> - <button class="calc-btn op" data-v="/">÷</button> - <button class="calc-btn" data-v="7">7</button> - <button class="calc-btn" data-v="8">8</button> - <button class="calc-btn" data-v="9">9</button> - <button class="calc-btn op" data-v="*">×</button> - <button class="calc-btn" data-v="4">4</button> - <button class="calc-btn" data-v="5">5</button> - <button class="calc-btn" data-v="6">6</button> - <button class="calc-btn op" data-v="-">−</button> - <button class="calc-btn" data-v="1">1</button> - <button class="calc-btn" data-v="2">2</button> - <button class="calc-btn" data-v="3">3</button> - <button class="calc-btn op" data-v="+">+</button> - <button class="calc-btn" data-v="0">0</button> - <button class="calc-btn" data-v=".">.</button> - <button class="calc-btn" data-v="^">^</button> - <button class="calc-btn op" data-v="=">=</button> - </div> + <div class="calc-grid" id="calc-grid"></div> </div> </div> <!-- WORLD CLOCKS --> <div class="widget" id="widget-clocks"> - <div class="widget-header" onclick="toggleWidget('widget-clocks')"> + <div class="widget-header" data-toggle="widget-clocks"> <span class="widget-title">World Time</span> <span class="widget-toggle">+</span> </div> @@ -212,7 +190,7 @@ <!-- STOCKS WATCHLIST (EDITABLE) --> <div class="widget" id="widget-watchlist"> - <div class="widget-header" onclick="toggleWidget('widget-watchlist')"> + <div class="widget-header" data-toggle="widget-watchlist"> <span class="widget-title">Watchlist</span> <span class="widget-toggle">+</span> </div> @@ -221,15 +199,13 @@ <input type="text" id="watchlist-input" placeholder="ADD TICKER..."> <button id="watchlist-add-btn">+</button> </div> - <div class="sources-list" id="watchlist-container"> - <!-- Items rendered via JS --> - </div> + <div class="sources-list" id="watchlist-container"></div> </div> </div> <!-- KEYBOARD --> <div class="widget" id="widget-keyboard"> - <div class="widget-header" onclick="toggleWidget('widget-keyboard')"> + <div class="widget-header" data-toggle="widget-keyboard"> <span class="widget-title">Shortcuts</span> <span class="widget-toggle">+</span> </div> @@ -255,7 +231,7 @@ </main> <footer class="footer"> - <button class="theme-btn" onclick="toggleTheme()">◐ Theme</button> + <button class="theme-btn" id="theme-btn">◐ Theme</button> <span>NO TRACKING</span> <span id="clock">00:00:00</span> </footer> |