Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <!DOCTYPE html>
- <html lang="en">
- <!--header-->
- <head>
- <meta charset="UTF-8">
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
- <meta http-equiv="X-UA-Compatible" content="ie=edge">
- <title> Furniture Shop </title>
- <link href="https://fonts.googleapis.com/css?family=Montserrat:100,100i,200,200i,300,300i,400,400i,500,500i,800" rel="stylesheet">
- <link href="https://fonts.googleapis.com/css?family=Josefin+Sans:100,100i,300,300i,400,400i,600,600i,700" rel="stylesheet">
- <link href="css/style.css" rel="stylesheet">
- <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.5.0/css/brands.css" integrity="sha384-QT2Z8ljl3UupqMtQNmPyhSPO/d5qbrzWmFxJqmY7tqoTuT2YrQLEqzvVOP2cT5XW" crossorigin="anonymous">
- <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.5.0/css/fontawesome.css" integrity="sha384-u5J7JghGz0qUrmEsWzBQkfvc8nK3fUT7DCaQzNQ+q4oEXhGSx+P2OqjWsfIRB8QT" crossorigin="anonymous">
- </head>
- <body>
- <!--navbar-->
- <div class="navbar">
- <input type="checkbox" class="checkbox" id="click" >
- <div class="sidebar">
- <label for="click">
- <div class="menu-icon">
- <div class="line line-1"></div>
- <div class="line line-2"></div>
- <div class="line line-3"></div>
- </label>
- </div>
- .navigation-header {
- position: fixed;
- left: 8rem;
- height: 100%;
- 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;
- width: 40rem;
- background-size: cover;
- display: flex;
- flex-direction: column;
- justify-content: space-between;
- align-items: center;
- transition: all .3s ease-in-out;
- }
- .checkbox:checked ~ .navigation-header{
- left:8rem;
- }
Add Comment
Please, Sign In to add comment