PromineoTech.HTML-CSS.CSS/index.html at master · gheeres/PromineoTech.HTML-CSS.CSS · 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
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <link rel="stylesheet" href="css/site.css">
  <title>My Media Library</title>
</head>
<body>
  <header>
    <!-- <img src="images/icons/server.svg" height="32" /> -->
    <svg height="32" width="32" fill="currentColor" viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg">
      <path fill="currentColor" d="M64 32C28.7 32 0 60.7 0 96v64c0 35.3 28.7 64 64 64H448c35.3 0 64-28.7 64-64V96c0-35.3-28.7-64-64-64H64zm280 72a24 24 0 1 1 0 48 24 24 0 1 1 0-48zm48 24a24 24 0 1 1 48 0 24 24 0 1 1 -48 0zM64 288c-35.3 0-64 28.7-64 64v64c0 35.3 28.7 64 64 64H448c35.3 0 64-28.7 64-64V352c0-35.3-28.7-64-64-64H64zm280 72a24 24 0 1 1 0 48 24 24 0 1 1 0-48zm56 24a24 24 0 1 1 48 0 24 24 0 1 1 -48 0z"/>
    </svg> My Media Library
  </header>
  <div>
    <menu>
      <ul>
        <li><a href="/">
          <!-- <img src="images/icons/home.svg" height="32" alt="Home" /> -->
          <svg height="32" width="32" fill="currentColor" viewBox="0 0 48 48" xmlns="http://www.w3.org/2000/svg">
            <path clip-rule="evenodd" fill="currentColor" fill-rule="evenodd" d="M23.9864 4.00009C24.3242 4.00009 24.6522 4.11294 24.9185 4.32071L45 20V39.636C44.9985 40.4312 44.5623 41.4377 44 42C43.4377 42.5623 42.4311 42.9985 41.6359 43H27V28H21V43H6.5C5.70485 42.9984 4.56226 42.682 4 42.1197C3.43774 41.5575 3.00163 40.7952 3 40V21L23.0544 4.32071C23.3207 4.11294 23.6487 4.00009 23.9864 4.00009ZM30 28V40H42V21.4314L24 7.40726L6 22V40L18 40V28C18.0008 27.2046 18.3171 26.442 18.8796 25.8796C19.442 25.3171 20.2046 25.0008 21 25H27C27.7954 25.0009 28.5579 25.3173 29.1203 25.8797C29.6827 26.4421 29.9991 27.2046 30 28Z"></path>
          </svg>
          Home
        </a></li>
        <li><a href="#">
          <!-- <img src="images/icons/movies.svg" height="32" alt="Movies" /> -->
          <svg height="32" width="32" fill="currentColor" viewBox="0 0 48 48" xmlns="http://www.w3.org/2000/svg">
            <path clip-rule="evenodd" d="M6 3H42C42.7957 3 43.5587 3.31607 44.1213 3.87868C44.6839 4.44129 45 5.20435 45 6V42C45 42.7957 44.6839 43.5587 44.1213 44.1213C43.5587 44.6839 42.7957 45 42 45H6C5.20435 45 4.44129 44.6839 3.87868 44.1213C3.31607 43.5587 3 42.7957 3 42V6C3 5.20435 3.31607 4.44129 3.87868 3.87868C4.44129 3.31607 5.20435 3 6 3ZM6 42H9L9 38H6V42ZM36 42H12V25H36V42ZM39 42H42V38H39V42ZM39 35H42V30H39V35ZM39 27H42V22H39V27ZM39 19H42V14H39V19ZM39 11H42V6H39V11ZM36 6L12 6L12 22H36V6ZM6 6L9 6V11H6L6 6ZM6 14H9V19H6L6 14ZM6 22H9V27H6L6 22ZM6 30H9V35H6L6 30Z" fill="currentColor" fill-rule="evenodd"></path>
          </svg>
          Movies
        </a></li>
        <li><a href="./tv/">
          <!-- <img src="images/icons/tv.svg" height="32" alt="TV" /> -->
          <svg fill="currentColor" height="32" width="32" viewBox="0 0 48 48" xmlns="http://www.w3.org/2000/svg">
            <path clip-rule="evenodd" d="M6 5H42C42.7957 5 43.5587 5.31607 44.1213 5.87868C44.6839 6.44129 45 7.20435 45 8V34C45 34.7957 44.6839 35.5587 44.1213 36.1213C43.5587 36.6839 42.7957 37 42 37H6C5.20435 37 4.44129 36.6839 3.87868 36.1213C3.31607 35.5587 3 34.7957 3 34V8C3 7.20435 3.31607 6.44129 3.87868 5.87868C4.44129 5.31607 5.20435 5 6 5ZM6 34H42V8H6V34Z" fill="currentColor" fill-rule="evenodd"></path>
            <path d="M36 43V40H12V43H36Z" fill="currentColor"></path>
          </svg>
          TV
        </a></li>
        <li><a href="#">
          <!-- <img src="images/icons/music.svg" height="32" alt="Music" /> -->
          <svg fill="currentColor" height="32" width="32" viewBox="0 0 48 48" xmlns="http://www.w3.org/2000/svg">
            <path d="M37.5 6H15C14.2046 6.00079 13.442 6.31712 12.8796 6.87956C12.3171 7.44199 12.0008 8.20459 12 9V30.8344C11.0921 30.2941 10.0565 30.0061 9 30C7.81331 30 6.65328 30.3519 5.66658 31.0112C4.67989 31.6705 3.91085 32.6075 3.45673 33.7039C3.0026 34.8003 2.88378 36.0067 3.11529 37.1705C3.3468 38.3344 3.91825 39.4035 4.75736 40.2426C5.59648 41.0818 6.66557 41.6532 7.82946 41.8847C8.99335 42.1162 10.1997 41.9974 11.2961 41.5433C12.3925 41.0892 13.3295 40.3201 13.9888 39.3334C14.6481 38.3467 15 37.1867 15 36V18H37.5V30.8343C36.5921 30.294 35.5565 30.006 34.5 30C33.3133 30 32.1533 30.3519 31.1666 31.0112C30.1799 31.6705 29.4109 32.6075 28.9567 33.7039C28.5026 34.8003 28.3838 36.0067 28.6153 37.1705C28.8468 38.3344 29.4182 39.4035 30.2574 40.2426C31.0965 41.0818 32.1656 41.6532 33.3295 41.8847C34.4933 42.1162 35.6997 41.9974 36.7961 41.5433C37.8925 41.0892 38.8295 40.3201 39.4888 39.3334C40.1481 38.3467 40.5 37.1867 40.5 36V9C40.4991 8.20463 40.1827 7.4421 39.6203 6.87969C39.0579 6.31728 38.2954 6.00091 37.5 6ZM15 9H37.5V15H15V9Z" fill="currentColor"></path>
          </svg>
          Music
        </a></li>
      </ul>
    </menu>
    <main>
      <h2>Recently Watched</h2>
      <ul class="list tv-list recent">
        <li>
          <a href="tv/ted.lasso.html">
            <img src="tv/images/ted.lasso.jpg" title="Ted Lasso" />
            Ted Lasso
          </a>
          <span>(2020-)</span>
          <span>(3 seasons)</span>
        </li>
        <li>
          <a href="tv/the.marvelous.mrs.maisel.html">
            <img src="tv/images/the.marvelous.mrs.maisel.jpg" title="Ted Lasso" />
            The Marvelous Mrs. Maisel
          </a>
          <span>(2017-2023)</span>
          <span>(5 seasons)</span>
        </li>
      </ul>
    </main>
  </div>
</body>
</html>