Last active
November 26, 2017 19:22
-
-
Save radanovicnikola93/bd5e97043df6cc19d5d91abd9be5a4dd to your computer and use it in GitHub Desktop.
Nikola Radanovic | Fakebook
This file contains hidden or 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> | |
| <head> | |
| <meta charset="utf-8"> | |
| <meta name="description" content="Nikola Radanovic's Fakebook profile"> | |
| <meta name="keywords" content="Fakebook, hobby, about me"> | |
| <meta name="author" content="Nikola Radanović"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>Nikola Radanović | Fakebook</title> | |
| <link rel="stylesheet" type="text/css" href="./style.css"> | |
| </head> | |
| <body> | |
| <h1>Nikola Radanović</h1> | |
| <br /> | |
| <input class="search-field" | |
| type="text" placeholder="Search by name"> | |
| <br /> | |
| <img id="profile-picture" src="66.jpg" | |
| width="280" height="400" alt="Profile picture"> | |
| <br /> | |
| <br /> | |
| <button class="friend-request-button"> | |
| Send friend request</button> | |
| <br /> | |
| <div class="about-me"> | |
| <h3>Hometown</h3> | |
| <p><em>Ankaran</em></p> | |
| <h3>Birthday</h3> | |
| <p><em>19.12.1993</em></p> | |
| <h3>Facebook friends</h3> | |
| <p><em>512</em></p> | |
| <h3>Followers</h3> | |
| <p><em>32</em></p> | |
| </div> | |
| <div class="hobbies"> | |
| <h3>Hobbies</h3> | |
| <ul> | |
| <li class="li"><a href="https://www.flickr.com/photos/146663683@N04/" target="_blank">Hobby Photographer</a></li> | |
| <li class="li"><a href="https://www.smartninja.org/" target="_blank">Learning programming at Smartninja</a></li> | |
| </ul> | |
| </div> | |
| </body> | |
| </html> |
This file contains hidden or 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
| * { | |
| box-sizing: border-box; | |
| } | |
| body { | |
| background-color: rgba(0, 191, 255, 0.6); | |
| text-align: center; | |
| } | |
| h1 { | |
| color: white; | |
| font-family: Helvetica; | |
| font-size: 30px; | |
| font-weight: normal; | |
| border: 2px dotted white; | |
| border-radius: 15px; | |
| padding-top: 2px; | |
| padding-bottom: 2px; | |
| margin: 0px 500px; | |
| } | |
| .search-field:focus { | |
| width: 290px; | |
| } | |
| .search-field { | |
| margin-bottom: 10px; | |
| } | |
| #profile-picture { | |
| display: block; | |
| margin: 0 auto; | |
| -webkit-border-radius: 50%; | |
| } | |
| #profile-picture:hover { | |
| -webkit-border-radius: 0%; | |
| } | |
| .friend-request-button { | |
| width: 295px; | |
| } | |
| .about-me, | |
| .hobbies { | |
| font-family: Helvetica; | |
| font-weight: normal; | |
| color: white; | |
| font-size: 15px; | |
| border: 2px dotted white; | |
| border-radius: 15px; | |
| padding-top: 0px; | |
| padding-bottom: 0px; | |
| margin: 10px 500px; | |
| } | |
| .li { | |
| text-align: left; | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment