A Pen by Wahyu Irawan on CodePen.
Created
February 8, 2024 03:52
-
-
Save Wirawa24/9c224199d14b99acbd2303179eefb1d2 to your computer and use it in GitHub Desktop.
wvOxVQx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"/> | |
| <meta name="viewport"content="width=device-width,initial-scale=1.0"/> | |
| <title>Personal Portfolio Page</title> | |
| <link rel="stylesheet"href="style.css"> | |
| </head> | |
| <body> | |
| <main> | |
| <nav id="navbar"> | |
| <a class="nav-link"href="#About">About</a>    | |
| <a class="nav-link"href="#Project">Project</a>    | |
| <a class="nav-link"href="#Contact">Contact</a>    | |
| </nav> | |
| <section id="welcome-section"> | |
| <h1>MY PERSONAL PORTFOLIO</h1> | |
| <p><span class="bold name"> <i> Wahyu Irawan</i></p> | |
| <p id="profile-link"><a>See my profile at <a href="https://freecodecamp.org" target="_blank" rel="noreferrer"/>freecodecamp</p> | |
| </section> | |
| <section id="About"> | |
| <header class="dhead"><a name="About">About</a></header> | |
| <p>With this portfolio I am addressing recruiters. I am looking for a job as a software programmer</p> | |
| <p> I am learning coding and I am a expert.</p> | |
| <p> I'll continue learning by doing due course will decide what to do with my learning</p> | |
| <p> Right now, I represent my portfolio to see if I am really on the right track.</p></section> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| html { | |
| box-sizing: border-box; | |
| } | |
| main { | |
| display: grid; | |
| grid-template-columns: 1fr 1fr; | |
| gap: 10px; | |
| } | |
| #navbar { | |
| width: 100vw; | |
| display: grid; | |
| grid-template-columns: repeat (3, 1fr); | |
| grid-column:1/-1; | |
| position: fixed; | |
| text-align: center; | |
| background: grey; | |
| height: 65px; | |
| top: 0; | |
| left: 0; | |
| z-index: 2; | |
| } | |
| .nav-link { | |
| text-decoration: none; | |
| color: cyan; | |
| font-size: 1.2rem; | |
| font-weight: bold; | |
| margin: 15px; | |
| } | |
| #welcome-section { | |
| display: grid; | |
| grid-column: 1/3; | |
| height: 100vh; | |
| text-align: center; | |
| position: relative; | |
| padding: 50% 0; | |
| background: linear-gradient (to bottom, #F5F5DC 0%, #E0FFFF 100%); | |
| } | |
| h1 { | |
| font-size: 2rem; | |
| } | |
| name { | |
| font-size: 2rem; | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Personal Portfolio Webpage
just trial not yet complete