PreciseTools/!template.html at publish · ECASdev/PreciseTools · 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
108
109
110
111
112
113
114
115
116
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Precise Tools</title>
    <link rel="stylesheet" href="yes.css">
    <link rel="icon" type="image/x-icon" href="precisetools.png">
    <!-- Facebook Meta Tags -->
    <meta property="og:title" content="Precise Tools">
    <meta property="og:type" content="website">
    <meta property="og:description" content="Explore mathematical tools for Bee Swarm Simulator">
    <meta property="og:image" content="https://precisetools.netlify.app/precisetools.png"> <!-- Replace with your actual image URL -->
    <!-- Twitter Meta Tags (similar to Open Graph) -->
    <meta name="twitter:title" content="Precise Tools">
    <meta name="twitter:description" content="Precise Mathematical tools for Bee Swarm Simulator">
    <meta name="twitter:image" content="https://precisetools.netlify.app/precisetools.png"> <!-- Replace with your actual image URL -->
    <meta name="twitter:card" content="summary_large_image">
    <!-- Other necessary meta tags -->
    <meta name="description" content="Precise Tools: Mathematical utilities for Bee Swarm Simulator">
</head>
<body>
<div class="container">
  <header>
    <div class="logo">
    <img src="precisetools.png" height="34" width="34" style="margin-right: 20px;margin-bottom: -7px;">Precise Tools</div>
    <nav>
      <ul class="nav">
        <li><a href="." data-hover="Homepage of Precise Tools">Home</a></li>
        <li><a href="Amulet Efficiency Calculator" data-hover="Amulet Efficiency Calculator; Calculate color values against base values for better efficiency">AmuletEC (VERY USEFUL)</a></li>
        <li><a href="Base Capacity Calculator" data-hover="Find out your base capacity before multipliers">Base Capacity Calculator</a></li>
        <li><a href="Critical Chance calculator" data-hover="Find out how much Crit Chance and SuperCrit Chance helps you in pollen">Critical Chance Calculator</a></li>
     <!--   <li><a href="#" data-hover="">Contact</a></li>-->
      </ul>
    </nav>
  </header>
    <main>
      <h1>Modern CSS Page Template</h1>
      <p>This is a modern CSS page template that you can use for your web design projects. It includes some basic HTML elements such as headings, paragraphs, lists, tables, forms, buttons, and images. You can use this template as a starting point for your web design project or customize it according to your needs.</p>
      <h2>Headings</h2>
      <p>Here are some examples of headings:</p>
      <h2>Heading 2</h2>
      <h3>Heading 3</h3>
      <h4>Heading 4</h4>
      <h5>Heading 5</h5>
      <h6>Heading 6</h6>
      <h2>Paragraphs</h2>
      <p>Here are some examples of paragraphs:</p>
      <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed quis lorem eu leo consequat varius. Quisque quis lacus at lorem tincidunt luctus. Morbi id eros vitae nisi sagittis ullamcorper. Fusce auctor, nisl quis feugiat consequat, lacus augue sagittis leo, quis aliquam leo massa id urna.</p>
      <p>Phasellus quis nisl quis eros ultrices malesuada. Sed vitae nunc in massa tincidunt tincidunt. Donec quis nisl quis magna blandit tincidunt. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Curabitur vitae nisl quis leo consequat tincidunt.</p>
      <h2>Lists</h2>
      <p>Here are some examples of lists:</p>
      <ul>
        <li>Unordered list item 1</li>
        <li>Unordered list item 2</li>
        <li>Unordered list item 3</li>
      </ul>
      <ol>
        <li>Ordered list item 1</li>
        <li>Ordered list item 2</li>
        <li>Ordered list item 3</li>
      </ol>
      <h2>Tables</h2>
      <p>Here is an example of a table:</p>
      <table>
        <thead>
          <tr>
            <th>Name</th>
            <th>Email</th>
            <th>Phone</th>
          </tr>
        </thead>
        <tbody>
          <tr>
            <td>John Doe</td>
            <td>john@example.com</td>
            <td>123-456-7890</td>
          </tr>
          <tr>
            <td>Jane Doe</td>
            <td>jane@example.com</td>
            <td>098-765-4321</td>
          </tr>
          <tr>
            <td>Bob Smith</td>
            <td>bob@example.com</td>
            <td>555-555-5555</td>
          </tr>
        </tbody>
      </table>
      <h2>Forms</h2>
      <p>Here is an example of a form:</p>
      <form>
        <label for="name">Name</label>
        <input type="text" id="name" name="name" placeholder="Enter your name">
        <label for="email">Email</label>
        <input type="email" id="email" name="email" placeholder="Enter your email">
        <label for="message">Message</label>
        <textarea id="message" name="message" placeholder="Enter your message"></textarea>
        <input type="submit" value="Send">
      </form>
      <h2>Buttons</h2>
      <p>Here are some examples of buttons:</p>
      <button class="button">Button 1</button>
      <button class="button">Button 2</button>
      <button class="button">Button 3</button>
      <h2>Images</h2>
      <p>Here is an example of an image:</p>
      <img src="https://source.unsplash.com/random/800x600" alt="Random image">
      <script src="homepagehandler.js"></script>
    </main>
  </div>

  <script src="jslib.js"></script>
</body>
</html>