s-w_proj/tips.html at main · Bitshifter-9/s-w_proj · 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
<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Time Management Tips</title>
  <link rel="stylesheet" href="tips.css">
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.1/css/all.min.css"
    integrity="sha512-5Hs3dF2AEPkpNAR7UiOHba+lRSJNeM2ECkwxUIxC1Q/FLycGTbNapWXB4tP889k5T5Ju8fs4b1P5z/iB4nMfSQ=="
    crossorigin="anonymous" referrerpolicy="no-referrer" />
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.1/css/brands.min.css"
    integrity="sha512-7rXIvd/xj1FnI2zKQjjXzDFxC4twqBByp8yxOgEQJs4C/aNzNyoQsOO7VxH0RgYNhbAYLJLwzqslaP50KTTHIQ==" </head>

<body>

  <header>
    <header class="navbar">
      <div class="logo">TIME MANAGEMENT</div>
      <nav>
        <ul class="nav-links">
          <li><a href="index.html"><i class="fa-solid fa-house"></i> Home</a></li>
          <li><a href="services.html"><i class="fa-regular fa-money-bill"></i> Services</a></li>
          <li><a href="about.html"><i class="fa-regular fa-address-card"></i> About</a></li>
          <li><a href="contact.html"><i class="fa-brands fa-mailchimp"></i> Contact</a></li>
          <li><a href="#Tips" style="margin-left: 500px;color: #379777;outline: 2px solid var(--primary);;"><i
                class="fa-solid fa-lines-leaning"></i> Tips</a></li>
        </ul>
      </nav>

    </header>


    <section id="home" class="hero">
      <h2 class="slide-in">Master Your Time, Master Your Life</h2>
      <p class="fade-in">Unlock the secrets to productivity and success with actionable time management tips.</p>
      <a href="#tips" class="btn scale-up">Get Started</a>
    </section>


    <section id="tips" class="tips">
      <h2>Top Time Management Tips</h2>
      <div class="tip-item fade-in-on-scroll">
        <h3>1. Prioritize Tasks</h3>
        <p>Focus on the most important tasks first using methods like the Eisenhower Matrix.</p>
      </div>
      <div class="tip-item fade-in-on-scroll">
        <h3>2. Use a Calendar</h3>
        <p>Plan your day by blocking time for specific tasks and avoiding multitasking.</p>
      </div>
      <div class="tip-item fade-in-on-scroll">
        <h3>3. Set SMART Goals</h3>
        <p>Make your goals Specific, Measurable, Achievable, Relevant, and Time-bound.</p>
      </div>
    </section>
    <section id="tracker" class="tracker">
      <h2>Your To-Do List</h2>
      <div class="todo-container">
        <input type="text" id="todo-input" placeholder="Add a task..." />
        <button id="add-btn" class="btn slide-in">Add Task</button>
        <ul id="todo-list"></ul>
      </div>
    </section>
    <footer>
      <p>&copy;  2024 Time Management Mastery.All rights reserved.</p>
    </footer>
    <script src="scripts.js"></script>
</body>

</html>