new html design
This commit is contained in:
+47
-44
@@ -6,7 +6,7 @@
|
||||
<title>Samantha Vero Friis</title>
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com"/>
|
||||
<link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@300;400;500&family=IBM+Plex+Sans:ital,wght@0,300;0,400;0,500;1,300&display=swap" rel="stylesheet"/>
|
||||
<link rel="stylesheet" href="styles2.css" />
|
||||
<link rel="stylesheet" href="/static/styles2.css" />
|
||||
</head>
|
||||
<body>
|
||||
|
||||
@@ -149,56 +149,59 @@
|
||||
<div class="section-head"><h2>Movie/Show Top list</h2></div>
|
||||
|
||||
<div class="toplist-group">
|
||||
<button class="toplist-toggle" onclick="this.closest('.toplist-group').classList.toggle('collapsed')">
|
||||
Top 5 Movies <span class="toplist-toggle-icon">▾</span>
|
||||
</button>
|
||||
<h3>Top 5 Movies</h3>
|
||||
<div class="toplist-body">
|
||||
<ol class="toplist-ranked">
|
||||
<li>
|
||||
Blade Runner 2049
|
||||
<img src="/static/posters/bladerunner2049.jpg">
|
||||
</li>
|
||||
<li>A Cure of Wellness
|
||||
<img src="/static/posters/AcureForWellness.jpg">
|
||||
</li>
|
||||
|
||||
<li>Fight Club
|
||||
<img src="/static/posters/Fightclub.jpg">
|
||||
</li>
|
||||
<li>Dracula: A Love Tale
|
||||
<img src="/static/posters/Dracula.webp">
|
||||
</li>
|
||||
<li>Girl with a Dragon Tattoo
|
||||
<img src="/static/posters/TheGirlwiththeDragonTattoo.webp">
|
||||
</li>
|
||||
</ol>
|
||||
<div class="poster-grid">
|
||||
<div class="poster-item">
|
||||
<img src="/static/posters/bladerunner2049.jpg" alt="Blade Runner 2049">
|
||||
<p>Blade Runner 2049</p>
|
||||
</div>
|
||||
<div class="poster-item">
|
||||
<img src="/static/posters/AcureForWellness.jpg" alt="A Cure of Wellness">
|
||||
<p>A Cure of Wellness</p>
|
||||
</div>
|
||||
<div class="poster-item">
|
||||
<img src="/static/posters/Fightclub.jpg" alt="Fight Club">
|
||||
<p>Fight Club</p>
|
||||
</div>
|
||||
<div class="poster-item">
|
||||
<img src="/static/posters/Dracula.webp" alt="Dracula: A Love Tale">
|
||||
<p>Dracula: A Love Tale</p>
|
||||
</div>
|
||||
<div class="poster-item">
|
||||
<img src="/static/posters/TheGirlwiththeDragonTattoo.webp" alt="Girl with a Dragon Tattoos">
|
||||
<p>Girl with a Dragon Tattoo</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="toplist-group">
|
||||
<button class="toplist-toggle" onclick="this.closest('.toplist-group').classList.toggle('collapsed')">
|
||||
Top 5 Shows <span class="toplist-toggle-icon">▾</span>
|
||||
</button>
|
||||
<div class="toplist-body">
|
||||
<ol class="toplist-ranked">
|
||||
<li>Chernobyl
|
||||
<img src="/static/posters/Chernobyl.webp">
|
||||
</li>
|
||||
<li>Succession
|
||||
<img src="/static/posters/Succession.webp">
|
||||
</li>
|
||||
<li>Breaking Bad
|
||||
<img src="/static/posters/Breaking Bad.webp">
|
||||
</li>
|
||||
<li>Avatar: The Last Airbender
|
||||
<img src="/static/posters/Avatar.webp">
|
||||
</li>
|
||||
<li>Adolescence
|
||||
<img src="/static/posters/Adolescence.webp">
|
||||
</li>
|
||||
</ol>
|
||||
<h3>Top 5 Shows</h3>
|
||||
<div class="toplist-body">
|
||||
<div class="poster-grid">
|
||||
<div class="poster-item">
|
||||
<img src="/static/posters/Chernobyl.webp" alt="Chernobyl">
|
||||
<p>Chernobyl</p>
|
||||
</div>
|
||||
<div class="poster-item">
|
||||
<img src="/static/posters/Succession.webp" alt="Succession">
|
||||
<p>Succession</p>
|
||||
</div>
|
||||
<div class="poster-item">
|
||||
<img src="/static/posters/Breaking Bad.webp" alt="Breaking Bad">
|
||||
<p>Breaking Bad</p>
|
||||
</div>
|
||||
<div class="poster-item">
|
||||
<img src="/static/posters/Avatar.webp" alt="Avatar: The Last Airbender">
|
||||
<p>Avatar: The Last Airbender</p>
|
||||
</div>
|
||||
<div class="poster-item">
|
||||
<img src="/static/posters/Adolescence.webp" alt="Adolescence">
|
||||
<p>Adolescence</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user