Skip to content

Instantly share code, notes, and snippets.

@oktavianto
Created September 26, 2021 15:15
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save oktavianto/7ceee2f339affdb10db0eee99f975f42 to your computer and use it in GitHub Desktop.
Save oktavianto/7ceee2f339affdb10db0eee99f975f42 to your computer and use it in GitHub Desktop.
Forum Posting Web Programming
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Home</title>
<style type="text/css">
body,h2,p {
font-family: sans-serif;
padding: 0;margin: 0;
}
.gradient {
width: 100%;height: 100%;position: absolute;
background-image:#ff0000;background-image:
radial-gradient(at 40% 20%, hsla(28,100%,74%,1) 0, transparent 50%),
radial-gradient(at 80% 0%, hsla(189,100%,56%,1) 0, transparent 50%),
radial-gradient(at 0% 50%, hsla(355,85%,93%,1) 0, transparent 50%),
radial-gradient(at 80% 50%, hsla(340,100%,76%,1) 0, transparent 50%),
radial-gradient(at 0% 100%, hsla(22,100%,77%,1) 0, transparent 50%),
radial-gradient(at 80% 100%, hsla(242,100%,70%,1) 0, transparent 50%),
radial-gradient(at 0% 0%, hsla(343,100%,76%,1) 0, transparent 50%);
}
.card {
display: flex;
background: #fff;
width: 50%;
margin: 30px auto;
padding: 20px;
overflow: hidden;
border-radius: 10px;
}
.avatar {
width: 100px;
height: 100px;
margin-right: 10px;
border-radius: 100%;
}
</style>
</head>
<body>
<div class="gradient">
<div class="card">
<img src="https://ui-avatars.com/api/?name=Excel+Dwi+Oktavianto&color=FFFFFF&background=2563EB" alt="Avatar" title="avatar" class="avatar">
<div>
<h2 style="margin-bottom: 5px;">Hallo 👋, nama saya Excel Dwi Oktavianto</h2>
<p style="color: #888;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque consectetur enim non metus vestibulum, at imperdiet lacus aliquam. Curabitur ultricies dolor nunc, tempus malesuada turpis finibus eget. Proin mollis, ligula eget ornare efficitur, nulla elit egestas est, sed gravida justo sapien in turpis. Mauris sodales massa ut bibendum dapibus.</p>
<a href="{{ route('home') }}">⬅ Back to home</a>
</div>
</div>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment