From 972d5edb54c0379c7db241035b263faf0b1b6598 Mon Sep 17 00:00:00 2001
From: nek0 <nek0@chelnok.de>
Date: Sun, 12 Jun 2016 13:52:28 +0200
Subject: [PATCH] changed dropdown activation to click

---
 static/css/dropdown.css         | 44 ++++++++++++++++++++++++++++++---
 templates/default-layout.hamlet | 14 ++++++-----
 2 files changed, 48 insertions(+), 10 deletions(-)

diff --git a/static/css/dropdown.css b/static/css/dropdown.css
index b717615..eac7e7b 100644
--- a/static/css/dropdown.css
+++ b/static/css/dropdown.css
@@ -1,14 +1,50 @@
-.nav {
+#user-nav {
 	list-style: none;
 	font-weight: bold;
 	margin-bottom: 10px;
+	position: relative;
 	z-index: 5;
 }
 
-.nav ul {
+#user-nav ul {
 	display: none;
+	position: absolute;
 }
 
-.nav li:hover ul {
-	display: inline-block;
+#user-nav li {
+	margin-right: 20px;
+}
+
+#user-nav li a {
+	padding: 10px 20px 10px;
+	border-radius: 5px;
+	background-color: white;
+}
+
+#user-nav input[type="checkbox"]:checked + ul {
+	display: block;
+	background-color: white;
+	border-radius: 5px;
+}
+
+#user-nav a {
+	display: block;
+	text-decoration: none;
+	color: #d64760;
+}
+
+#user-nav a:hover {
+	color: black;
+	transition-timing-function: linear
+	transition-duration: 0.25s;
+}
+
+#user-nav label {
+	margin: 0;
+}
+
+.vanish {
+	/*position: absolute;
+	left: -9999px;*/
+	display: none;
 }
diff --git a/templates/default-layout.hamlet b/templates/default-layout.hamlet
index aaaaa2b..282e23a 100755
--- a/templates/default-layout.hamlet
+++ b/templates/default-layout.hamlet
@@ -1,25 +1,27 @@
 <nav id="header">
   <div .row>
     <div .col-md-9>
-      <ul #user-nav .nav .nav-pills>
+      <ul #user-nav>
         <li>
           <a href=@{HomeR}>
             Home
         $maybe su <- msu
           <li>
-            <a>
-              #{slug} <span class="caret"></span>
+            <label for="cb1">
+              <a>
+                #{slug}<span class="caret"></span>
+            <input type="checkbox" #cb1 .vanish aria-hidden="true">
             <ul>
               <li>
                 <a href=@{UserR username}>
                   Your Profile
-              <li >
+              <li>
                 <a href=@{NewAlbumR}>
                   Create album
-              <li >
+              <li>
                 <a href=@{UploadR}>
                   Upload images
-              <li >
+              <li>
                 <a href=@{LogoutR}>
                   Logout
         $nothing