Guest User

Untitled

a guest
Nov 22nd, 2018
103
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 1.71 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <!--header-->
  4. <head>
  5. <meta charset="UTF-8">
  6. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  7. <meta http-equiv="X-UA-Compatible" content="ie=edge">
  8. <title> Furniture Shop </title>
  9. <link href="https://fonts.googleapis.com/css?family=Montserrat:100,100i,200,200i,300,300i,400,400i,500,500i,800" rel="stylesheet">
  10. <link href="https://fonts.googleapis.com/css?family=Josefin+Sans:100,100i,300,300i,400,400i,600,600i,700" rel="stylesheet">
  11. <link href="css/style.css" rel="stylesheet">
  12. <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.5.0/css/brands.css" integrity="sha384-QT2Z8ljl3UupqMtQNmPyhSPO/d5qbrzWmFxJqmY7tqoTuT2YrQLEqzvVOP2cT5XW" crossorigin="anonymous">
  13. <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.5.0/css/fontawesome.css" integrity="sha384-u5J7JghGz0qUrmEsWzBQkfvc8nK3fUT7DCaQzNQ+q4oEXhGSx+P2OqjWsfIRB8QT" crossorigin="anonymous">
  14. </head>
  15.  
  16. <body>
  17. <!--navbar-->
  18. <div class="navbar">
  19. <input type="checkbox" class="checkbox" id="click" >
  20. <div class="sidebar">
  21.  
  22. <label for="click">
  23. <div class="menu-icon">
  24. <div class="line line-1"></div>
  25. <div class="line line-2"></div>
  26. <div class="line line-3"></div>
  27. </label>
  28. </div>
  29.  
  30. .navigation-header {
  31. position: fixed;
  32. left: 8rem;
  33. height: 100%;
  34. background: linear-gradient(to top, rgba(170, 170, 161, 0.8), rgba(166, 166, 166, 0.8)), url(../img/nav-bg.jpeg) center no-repeat;
  35. width: 40rem;
  36. background-size: cover;
  37. display: flex;
  38. flex-direction: column;
  39. justify-content: space-between;
  40. align-items: center;
  41. transition: all .3s ease-in-out;
  42. }
  43.  
  44. .checkbox:checked ~ .navigation-header{
  45. left:8rem;
  46. }
Add Comment
Please, Sign In to add comment