HomepageForBrowser/index.html at main · 3mr9/HomepageForBrowser · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <link rel="stylesheet" href="defaultStyle.css" />
    <script src="script.js" defer></script>
    <meta http-equiv="Cache-Control" content="public, max-age=604800" />
    <title>Testing</title>
  </head>
  <body>
    <h1 class="greaterText" id="welcomer">Morning!</h1>
    <div class="sub-greater">
      <h3 id="clockLine">Time now is <a id="clock">--:--</a></h3>
      <h3 id="dateLine">Today is <a id="date">DAY</a></h3>
      <!-- <div style="display: none;" id="weather-result"></div> -->
    </div>

    <div class="search-bar">
      <input type="text" id="search-input" placeholder="Let's Surf The Web!" />
      <div class="search-engines">
        <button class="google-btn" onclick="search('google')">Google</button>
        <button class="duck-btn" onclick="search('duckduckgo')">
          DuckDuckGo
        </button>
        <button class="bing-btn" onclick="search('bing')">Bing</button>
        <button class="yt-btn" onclick="search('youtube')">YouTube</button>
      </div>
    </div>
    <div id="quicklinksDiv">
      <h3 style="text-align: center" class="genText">
        or visit one of these sites!
      </h3>
      <div
        class="link-grid"
        style="display: flex; justify-content: center; align-items: center"
      >
        <a href="https://x.com/" class="link-btn">X</a>
        <a href="https://www.pinterest.com/" class="link-btn">Pinterest</a>
        <a href="https://github.com" class="link-btn">GitHub</a>
        <a href="https://discord.com/channels/@me" class="link-btn">Discord</a>
      </div>
    </div>
    <div id="Footer" class="Footer">
      <button id="next-bg-btn" style="position: absolute; bottom: 0; right: 5vh;">Next Image</button>
      <button id="myBtn" style="position: absolute; bottom: 0; right: 0">
        ⚙
      </button>
    </div>
    <div id="myModal" class="modal">
      <div class="modal-content">
        <span class="close">&times;</span>
        <h5 class="greaterText">Settings</h5>
        <div id="settingsUP" class="bg-controls"> <!-- preffs-->
          <h3>User Preferences</h3>
          <button id="settClock" onclick="handleClockToggle()">Toggle Clock</button>
          <button id="settDate" onclick="handleDateToggle()">Toggle Date</button>
          <button id="settQL" onclick="handleQLToggle()">Toggle Quick Links</button>
        </div>
        <div id="settingsBG" class="bg-controls"> <!-- background-->
          <h3>Background</h3>

          <div class="cycle-controls">
            <h4>Auto-Cycle Options:</h4>
            <div>
              <input type="checkbox" id="random-load" /> Show random background
              when loading the page.
            </div>
            <div>
              <input type="checkbox" id="enable-cycle" /> Cycle backgrounds
              every
              <select id="cycle-time">
                <option value="1">1</option>
                <option value="2">2</option>
                <option value="5" selected>5</option>
                <option value="10">10</option>
                <option value="30">30</option>
              </select>
              minutes
            </div>
          </div>

          <h4>Preset Backgrounds:</h4>
          <div class="preset-btns" id="preset-btns">
            <!-- Images handled by JS -->
          </div>

          <h4>Custom Background:</h4>
          <div>
            <input type="text" id="bg-url" placeholder="Enter image URL" />
            <button id="set-url-btn">Set from URL</button>
          </div>

          <div>
            <input type="file" id="bg-upload" accept="image/*" />
            <button id="set-upload-btn">Upload Image</button>
          </div>

          <div>
            <button id="reset-btn">Reset to Default</button>
          </div>
          <div style="color: #ffffff; opacity: 70%;">© 2025 all rights reserved- <a style="text-decoration: none; color: purple;" href="https://github.com/3mr9" target="_blank">AttackerMR</a></div>
        </div>
      </div>
    </div>
  </body>
</html>