SelectDine-Assignment/index.html at master · amitShindeGit/SelectDine-Assignment · 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
120
121
<!DOCTYPE html>
<html>
<head>
       <title>WEBPAGE</title>
       <link rel="stylesheet" type="text/css" href="css/style.css">
</head>
<body>
    <header>   <!--I included everything under one header,mistake! -->
      <nav>
          <div class="circle">   <!--I have made div for every section of my webpage-->
                <p>NS</p>
            </div>
        <div class="main">
            <h4><p style="margin-left: 35px;">Nick Schadov</p></h4>
        </div>
        <p id = "username" style="margin-left: 35px; color: gray;">KUji Podcasts</p>
        <div class ="menu">
            <ul>
                <li><a href="#">Inbox</a></li>
                <li><a href="#">Alerts</a></li>
                <li><a href="#">Overview</a></li>
                <h5><p style="color:gray">Podcasts</p></h5>
                <li><a href="#">Episode</a></li>
                <li><a href="#">Media</a></li>
                <li><a href="#">Materials</a></li>
                <li><a href="#">Contacts</a></li>
                <h5><p style="color:gray">Analytics</p></h5>
                <li><a href="#">Subsciber</a></li>
                <li><a href="#">Channel</a></li>
                <li><a href="#">Reports</a></li>
            </ul>
       </div>
       </nav>
      <div class="upperside">
        <main id="boxes">
           <div id="newsubsciber" >
               <ul>
                   <h6><p style="color:gray">New Subscribers</p></h6>
                   <h1>5096</h1>
                   <h3><p style="color: green;">+33.45%</p></h3>
               </ul>
           </div>
           <div id="streams" >
             <h6><p style="color:gray">Streams</p></h6>
             <h1>47403</h1>
             <h3><p style="color: red;">-112.45%</p></h3>
           </div>
           <div id="engagement" >
            <h6><p style="color:gray">Engagement Rate</p></h6>
            <h1>25.81</h1>
            <h3><p style="color: green;">+62.52%</p></h3>
          </div>
          <div id="averagetime" >
            <h6><p style="color:gray">Engagement Rate</p></h6>
            <h1>45.4 min</h1>
            <h3><p style="color: green;">+4.46%</p></h3>
          </div>
        </main>
      </div>

      <div class="middle">
        <div id="audience">
           <h5><p style="color:gray">Audience</p></h5>
           <h2>301.097</h2>
           <div class="diffcolors">
               <p>
                   <span class="green">+58.31%</span> <span class="grey">for last 7 days</span>
               </p>
           </div>
        </div>
      </div>
      <div class="graph">
        <img src = "Graph.png" width="500px" height="200px">
      </div>

      <div class="rightuppercorner">
        <div class="satisfaction">
            <p>
                <pre class="tab">Audience Satisfaction             <a href="#" class="url">...</a></pre>
            </p>
        </div>
      </div>
      <div class="meter">
        <img src = "Audience.png" width="300px" height="135px">
      </div>

      <div class="rightlowercorner">
          <div class="adinfo">
            <p>
                <pre class="tab2">Webinars             <a href="#" class="url2">...</a></pre>
            </p>
            <div class="brief">
                <p><h1>Learn how you <br/>
                    can earn more than <br/>
                    20% each month! </h1></html>
                    <p>Join our webinar and learn how <br/>
                       to increase more than 20% <br/>
                       your monthly income.
                    </p>
                    <p><a href="Resume.pdf" class="url3">Learn more(About me)</a></p>
                </p>
              </div>
          </div>
      </div>

      <div class="middlelower">
          <div class="popuepisods">
            <p>
                <pre class="tab4">Popular Episods                                             <a href="#" class="url4">See all</a></pre>
            </p>
            <p>
                <ol>
                <li><h3> <pre class="others"> Kuji Podcasts 33:Live                    <a style="color: grey;"> 199m </a><a style="color: green;">Live</a></pre></h3></li>
                <h6><p style="color: gray; margin-top: -25px;margin-left: 8px;">Guest:Nurlan Subarav</p></h6>
                </ol>
            </p>
          </div>
      </div>

    </header>
</body>