Skip to content

Instantly share code, notes, and snippets.

@harilee1325

harilee1325/gist:57d91e3dd1c71994eca15d9b10986d81

Created May 21, 2020 14:33
Show Gist options
  • Save harilee1325/57d91e3dd1c71994eca15d9b10986d81 to your computer and use it in GitHub Desktop.
Save harilee1325/57d91e3dd1c71994eca15d9b10986d81 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
gistfile1.txt
<!DOCTYPE html>
<html lang="en">
<title>Blog</title>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
<link rel="stylesheet" href="{{url_for('static', filename='css/style.css')}}">
</head>
<body>
<ul>
<li><a href="{{url_for('album')}}">Album</a></li>
<li><a href="{{url_for('magazine')}}">Magazine</a></li>
<li><a class="active" href="{{url_for('blog')}}">Blog</a></li>
</ul>
<div class="w3-container w3-grey" style="position:relative">
<a class="w3-btn w3-circle w3-xlarge w3-right w3-white"
style="position:absolute;top:126px;right:42px;"><i>+</i></a>
<h1 class="w3-jumbo w3-text-grey" style="text-shadow:1px 1px 0 #444">My Blog</h1>
</div>
<div class="w3-grey w3-animate-zoom" style="padding:20px 50px;background-image:url('pic_boat_portrait.jpg');
background-size:cover;">
<div class="w3-section w3-row-padding">
<div class="w3-twothird">
<div class="w3-card-4">
<div class="w3-display-container">
<img src="{{url_for('static', filename='img/one.jpg')}}" alt="Car" style="width:100%">
<div class="w3-display-bottomleft w3-container w3-xlarge w3-text-black">
<p>Nice Car</p>
</div>
</div>
<div class="w3-container w3-light-grey">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit,
sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
<p>2 Hours Ago</p>
</div>
</div>
</div>
<div class="w3-third w3-container w3-center">
<div class="w3-card-4">
<div class="w3-container">
<p class="w3-jumbo">✉</p>
<p class="w3-large">+ 1 334</p>
</div>
<div class="w3-container w3-white">
<p>2 Hours Ago</p>
</div>
</div>
<div class="w3-card-4 w3-section">
<div class="w3-container w3-white">
<p class="w3-xxlarge">✉</p>
<p class="w3-large">+ 1 555</p>
</div>
<div class="w3-container">
<p>3 Hours Ago</p>
</div>
</div>
</div>
</div>
<div class="w3-section w3-container">
<div class="w3-card-4">
<img src="{{url_for('static', filename='img/two.jpg')}}" alt="Disc" style="width:100%">
<div class="w3-container w3-white">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit,
sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
<p>Today</p>
</div>
</div>
</div>
<div class="w3-section w3-container">
<div class="w3-card-4">
<img src="{{url_for('static', filename='img/three.jpg')}}" alt="Snow" style="width:100%">
<div class="w3-container w3-white">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit,
sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
<p>Today</p>
</div>
</div>
</div>
<div class="w3-section w3-container">
<div class="w3-card-4">
<div class="w3-container w3-padding-16 w3-black w3-xxlarge">
<p>«<i> Make it as simple as possible, but not simpler </i>»</p>
</div>
<div class="w3-container w3-white">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit,
sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
<p>2 Days Ago</p>
</div>
</div>
</div>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment