Weekly/weekly.html at main · AmmarMohammed01/Weekly · 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
117
118
119
<!DOCTYPE html>
<html>
  <head>
    <title>Weekly</title>

    <link rel="stylesheet" href="Weekly.css">
    <link rel="stylesheet" href="navbar.css">

    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Raleway:wght@400;700&display=swap" rel="stylesheet">
  </head>
  <body>
    <div class="top-navigation-bar">
      <div class="page-title"><h2>Weekly App</h2></div>
      <div> <a href="./index.html"> <button class="top-buttons">Home</button> </a> </div>
      <div> <a href="./weekly.html"> <button class="top-buttons">Weekly</button> </a> </div>
      <div> <a href="./goals.html"> <button class="top-buttons">Goals</button> </a> </div>
    </div>

    <!--I need to add dark mode button back
    <button onclick="webpageView();"
        class="js-button-view button-view">Dark Mode</button>
    -->

    <div class="week-info">
      <div style="
      display: flex;
      flex-direction: row;
      ">

        <div class="js-change-info css-change-info" style="flex:1;"></div>
        <div style="place-self: center;">
          <button class="button-change-info"
        onclick="changeInfo()">Edit</button>
        </div>

      </div>

    </div>

    <!--Perhaps use ReactJS to make a <task/> prop, that can be stored in array?-->

    <div class="week-container">
      <div class="day-container">
        <div class="day-menu-bar">
          <div style="flex: 1; text-align: left; margin: 2px 10px;">Sunday</div>
          <button class="button-day" onclick="addTodo(0)">+</button>
          <button class="button-day" onclick="clearDay(0)">-</button>
        </div>
        <div class="js-output1"></div>
      </div>
      <div class="day-container">
        <div class="day-menu-bar">
          <div style="flex: 1; text-align: left; margin: 2px 10px;">Monday</div>
          <button class="button-day" onclick="addTodo(1)">+</button>
          <button class="button-day" onclick="clearDay(1)">-</button>
        </div>
        <div class="js-output2"></div>
      </div>
      <div class="day-container">
        <div class="day-menu-bar">
          <div style="flex: 1; text-align: left; margin: 2px 10px;">Tuesday</div>
          <button class="button-day" onclick="addTodo(2)">+</button>
          <button class="button-day" onclick="clearDay(2)">-</button>
        </div>
        <div class="js-output3"></div>
      </div>
      <div class="day-container">
        <div class="day-menu-bar">
          <div style="flex: 1; text-align: left; margin: 2px 10px;">Wednesday</div>
          <button class="button-day" onclick="addTodo(3)">+</button>
          <button class="button-day" onclick="clearDay(3)">-</button>
        </div>
        <div class="js-output4"></div>
      </div>
      <div class="day-container">
        <div class="day-menu-bar">
          <div style="flex: 1; text-align: left; margin: 2px 10px;">Thursday</div>
          <button class="button-day" onclick="addTodo(4)">+</button>
          <button class="button-day" onclick="clearDay(4)">-</button>
        </div>
        <div class="js-output5"></div>
      </div>
      <div class="day-container">
        <div class="day-menu-bar">
          <div style="flex: 1; text-align: left; margin: 2px 10px;">Friday</div>
          <button class="button-day" onclick="addTodo(5)">+</button>
          <button class="button-day" onclick="clearDay(5)">-</button>
        </div>
        <div class="js-output6"></div>
      </div>
      <div class="day-container">
        <div class="day-menu-bar">
          <div style="flex: 1; text-align: left; margin: 2px 10px;">Saturday</div>
          <button class="button-day" onclick="addTodo(6)">+</button>
          <button class="button-day" onclick="clearDay(6)">-</button>
        </div>
        <div class="js-output7"></div>
      </div>
    </div>

    <div class="input-menu">
      <div></div>
      <div><input placeholder="Your task here..." class="css1-input js-input-name"></div>
      <div class="js-remove-a-task">
        <button onclick="removeView();" class="button-clear-tasks" >Remove A Task</button>
      </div>

      <div><button onclick="clearAll();"
      class="button-clear-tasks"
      >Clear All</button></div>
      <div></div>
    </div>

    <script src="Weekly.js"></script>
    <script src="DarkLight.js"></script>
  </body>
</html>