From 8ffdcf6e80cfa923972fd094935e033e0ae38a80 Mon Sep 17 00:00:00 2001
From: Ruud <ruud@crashdummy.nl>
Date: Wed, 26 Aug 2015 20:54:03 +0200
Subject: [PATCH] Collapse hint on next line when needed

---
 couchpotato/static/style/settings.scss | 74 +++++++++++++++++++++++++++++++++-
 1 file changed, 72 insertions(+), 2 deletions(-)

diff --git a/couchpotato/static/style/settings.scss b/couchpotato/static/style/settings.scss
index d45ff7e..47dd370 100644
--- a/couchpotato/static/style/settings.scss
+++ b/couchpotato/static/style/settings.scss
@@ -73,6 +73,7 @@
 
 		h2 {
 			display: flex;
+			flex-flow: row wrap;
 			align-items: baseline;
 			padding: 0 0 0 $padding;
 
@@ -90,9 +91,12 @@
 				}
 			}
 
+			.group_label {
+				margin-right: $padding/2;
+			}
+
 			.hint {
 				flex: 1;
-				margin-left: $padding/2;
 				font-size: 1rem;
 
 				@include media-phablet {
@@ -106,6 +110,45 @@
 					text-decoration: underline;
 					display: inline;
 				}
+
+				&.more_hint {
+					position: relative;
+
+					.tooltip {
+						display: inline;
+						padding: $padding/2;
+
+						.icon-info {
+							vertical-align: middle;
+							display: inline-block;
+							text-align: center;
+							border: 1px solid $primary_color;
+							border-radius: 50%;
+							width: 18px;
+							height: 18px;
+							line-height: 16px;
+							font-size: .8em;
+							text-decoration: none;
+						}
+
+						.tip {
+							left: 0;
+							right: 0;
+							position: absolute;
+							background: $theme_off;
+							z-index: 2;
+							display: none;
+							padding: $padding/2;
+							margin-left: -$padding/2;
+						}
+
+						&:hover {
+							.tip {
+								display: block;
+							}
+						}
+					}
+				}
 			}
 		}
 
@@ -125,6 +168,10 @@
 				border-bottom: 0;
 			}
 
+			&:nth-child(2) {
+				margin-top: $padding/2;
+			}
+
 			label {
 				display: inline-block;
 				min-width: 150px;
@@ -241,8 +288,12 @@
 				}
 			}
 
+			> :nth-child(2){
+				margin-top: 0;
+			}
+
 			> :nth-child(3){
-				margin-top: $padding;
+				margin-top: $padding/2;
 			}
 
 		}
@@ -310,6 +361,7 @@
 	/** Options list **/
 	.option_list {
 		background: #FFF;
+		margin-top: $padding/2;
 
 		fieldset {
 			position: relative;
@@ -504,6 +556,24 @@
 		}
 	}
 
+	.multi_directory {
+
+		.delete {
+			color: $primary_color;
+			padding: 0 $padding/2;
+			opacity: .6;
+			font-size: 1.5em;
+
+			&:hover {
+				opacity: 1;
+			}
+		}
+
+		&.is_empty .delete {
+			display: none;
+		}
+	}
+
 	.choice {
 		.select_wrapper {
 			margin-left: $padding;