From 86fc6c6ca159bee243d709d49a2f7cc4c719f6b5 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Fr=C3=A9d=C3=A9ric=20P=C3=A9ters?= <fpeters@entrouvert.com>
Date: Wed, 15 Aug 2018 16:10:36 +0200
Subject: [PATCH] style appbar links and kebab menu

---
 gadjo/static/css/gadjo.scss | 60 ++++++++++++++++++++++++++-----------
 1 file changed, 42 insertions(+), 18 deletions(-)

diff --git a/gadjo/static/css/gadjo.scss b/gadjo/static/css/gadjo.scss
index c4255ae..1ac08bb 100644
--- a/gadjo/static/css/gadjo.scss
+++ b/gadjo/static/css/gadjo.scss
@@ -1056,67 +1056,91 @@ $colors: "4e7ee2", "ff375e", "6f2b92";
 	}
 	span.actions {
 		position: absolute;
-		bottom: 8px;
+		bottom: 0px;
 		right: 0;
 		a {
 			float: right;
 			margin-left: 2em;
 		}
 	}
+	& > a,
+	span.actions > a {
+		background: white;
+		color: $primary-color;
+		font-weight: bold;
+		border-radius: 3px;
+		border: 1px solid $primary-color;
+		padding: 6px 14px;
+		&:hover {
+			background: $primary-color;
+			color: white;
+		}
+		&.disabled {
+			border-color: #aaa;
+			color: #aaa;
+			background: #eee;
+			pointer-events: none;
+			&:hover {
+				background: #eee;
+				color: #aaa;
+			}
+		}
+	}
 	border-radius: 3px 3px 0 0;
-	.extra-actions-menu-opener {
-		border: none;
+	span.actions a.extra-actions-menu-opener,
+	a.extra-actions-menu-opener {
+		border: 1px solid transparent;
+		color: $primary-color;
 		&::before {
+			border-radius: 3px;
 			cursor: pointer;
 			content: "\f142"; /* ellipsis-v */
 			font-family: FontAwesome;
-			font-size: 140%;
-			padding: 2px 1ex;
-			margin-right: -0.5ex;
-			border: 1px solid transparent;
 			border-bottom: 0;
 			position: relative;
 			z-index: 200;
 			top: 2px;
 		}
-		&.open::before {
-			background: #fafafa;
-			border-color: #d0d0d0;
+		&.open, &.open:hover {
+			background: $primary-color;
+			color: white;
+			border: 1px solid transparent;
+			border-radius: 3px 3px 0 0;
 		}
 	}
 	.extra-actions-menu {
-		background: white;
 		padding: 0px;
 		list-style: none;
 		position: absolute;
-		right: -7px;
-		margin-top: -24px;
-		border: 1px solid #d0d0d0;
-		background: #fafafa;
+		right: 0px;
+		margin-top: -20px;
+		background: $primary-color;
 		box-shadow: 0px 1px 1px 2px rgba(0, 0, 0, 0.04);
 		z-index: 100;
 		display: none;
 		min-width: 12em;
 		&.open {
+			border-radius: 3px 0 3px 3px;
 			display: block;
 		}
 		li {
 			margin: 0;
 			a {
+				color: white;
 				float: none;
 				display: block;
 				margin: 0;
 				padding: 5px 10px;
-				border: none;
+				border: 0;
 				&:hover {
-					background: #ccc;
+					background: lighten($primary-color, 20%);
 				}
 			}
 		}
 	}
 	span.actions {
 		.extra-actions-menu {
-			margin-top: 2px;
+			margin-top: 0px;
 			top: 100%;
 		}
 	}