navbar fixed

pull/24/head
Akhil Gupta 4 years ago
parent d2397e7c46
commit 77c49e9c9b

@ -3,7 +3,6 @@
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/skeleton/2.0.4/skeleton.min.css" integrity="sha512-EZLkOqwILORob+p0BXZc+Vm3RgJBOe1Iq/0fiI7r/wJgzOFZMlsqTa29UEl6v6U6gsV4uIpsNZoV32YZqrCRCQ==" crossorigin="anonymous" />
<title>Add Podcast - PodGrab</title> <title>Add Podcast - PodGrab</title>
{{template "commoncss"}} {{template "commoncss"}}
<style> <style>
@ -33,7 +32,8 @@
<hr> <hr>
<div class="row" id="searchContainer"> <div class="row" id="searchContainer">
<h4>Search for your favorite podcast</h4> <h4>Search for your favorite podcast</h4>
<p>Experimental: Uses iTunes API to show search results.</p> <i><small>Experimental: Uses iTunes API to show search results.</small></i>
<br>
<form action="/search" method="post" @submit="search"> <form action="/search" method="post" @submit="search">
<div class="nine columns"> <div class="nine columns">
<input type="search" name="search" id="search" placeholder="Search for your podcast" v-model="query" class="u-full-width"> <input type="search" name="search" id="search" placeholder="Search for your podcast" v-model="query" class="u-full-width">

@ -1,4 +1,7 @@
{{define "commoncss"}} {{define "commoncss"}}
<link rel="stylesheet" href="/webassets/skeleton.min.css" integrity="sha512-EZLkOqwILORob+p0BXZc+Vm3RgJBOe1Iq/0fiI7r/wJgzOFZMlsqTa29UEl6v6U6gsV4uIpsNZoV32YZqrCRCQ==" crossorigin="anonymous" />
<style> <style>
.container { .container {
max-width: 800px; } max-width: 800px; }

@ -3,7 +3,6 @@
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/skeleton/2.0.4/skeleton.min.css" integrity="sha512-EZLkOqwILORob+p0BXZc+Vm3RgJBOe1Iq/0fiI7r/wJgzOFZMlsqTa29UEl6v6U6gsV4uIpsNZoV32YZqrCRCQ==" crossorigin="anonymous" />
<title>PodGrab</title> <title>PodGrab</title>
{{template "commoncss"}} {{template "commoncss"}}
<style> <style>

@ -3,7 +3,6 @@
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/skeleton/2.0.4/skeleton.min.css" integrity="sha512-EZLkOqwILORob+p0BXZc+Vm3RgJBOe1Iq/0fiI7r/wJgzOFZMlsqTa29UEl6v6U6gsV4uIpsNZoV32YZqrCRCQ==" crossorigin="anonymous" />
<title>PodGrab</title> <title>PodGrab</title>
{{template "commoncss"}} {{template "commoncss"}}
<style> <style>

@ -49,7 +49,7 @@
} }
#overlay{ #overlay, .drawer{
display: none; display: none;
} }
@ -67,7 +67,8 @@
padding-top: 20px; padding-top: 20px;
overflow-x: hidden; /* Disable horizontal scroll */ overflow-x: hidden; /* Disable horizontal scroll */
display: block; display: block;
transition: 0.25s; /* 0.5 second transition effect to slide in the sidenav */ transition: 0.25s ease; /* 0.5 second transition effect to slide in the sidenav */
} }
.drawer li{ .drawer li{
@ -107,13 +108,13 @@ div#overlay{
} }
#burger div{ #burger div{
width: 35px; width: 30px;
height: 2px; height: 2px;
background-color: black; background-color: black;
margin: 6px 0; margin: 6px 0;
} }
.bar1, .bar2, .bar3 { .bar1, .bar2, .bar3 {
width: 35px; width: 15px;
height: 2px; height: 2px;
background-color: #333; background-color: #333;
margin: 6px 0; margin: 6px 0;
@ -121,16 +122,16 @@ div#overlay{
#closeDrawer{ #closeDrawer{
display: inline-block; display: inline-block;
position: absolute; position: absolute;
top: 0; top: 5px;
right: 0; right: 5px;
} }
#closeDrawer .bar1{ #closeDrawer .bar1{
-webkit-transform: rotate(-45deg) translate(-9px, 6px) ; -webkit-transform: rotate(-45deg) translate(-7px, 6px) ;
transform: rotate(-45deg) translate(-9px, 6px) ; transform: rotate(-45deg) translate(-7x, 6px) ;
} }
#closeDrawer .bar3{ #closeDrawer .bar3{
-webkit-transform: rotate(45deg) translate(-8px, -8px) ; -webkit-transform: rotate(45deg) translate(1px, 1px) ;
transform: rotate(45deg) translate(-8px, -8px) ; transform: rotate(45deg) translate(1px, 1px) ;
} }
} }

@ -3,7 +3,6 @@
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/skeleton/2.0.4/skeleton.min.css" integrity="sha512-EZLkOqwILORob+p0BXZc+Vm3RgJBOe1Iq/0fiI7r/wJgzOFZMlsqTa29UEl6v6U6gsV4uIpsNZoV32YZqrCRCQ==" crossorigin="anonymous" />
<title>PodGrab</title> <title>PodGrab</title>
{{template "commoncss"}} {{template "commoncss"}}
<style> <style>

File diff suppressed because one or more lines are too long
Loading…
Cancel
Save