rework design of panels and headlines on startpage

1 files changed, 111 insertions, 16 deletions

diff --git a/configs/conferences/33c3/main.less b/configs/conferences/33c3/main.less
index d683b5b..5cca25e 100644
--- a/configs/conferences/33c3/main.less
+++ b/configs/conferences/33c3/main.less
@@ -33,21 +33,6 @@ body {
 	padding: @navbar-height 0
 }
 
-.panel-default {
-	color: @dark-grey;
-	a {
-		color: @dark-grey;
-	}
-}
-.panel-primary {
-	background-color: @light-grey;
-	border-color: @light-grey;
-	color: white;
-	a {
-		color: white;
-	}
-}
-
 h1, h2, body.overview .room a.title, body.overview .panel-primary a, .navbar-brand {
 	font-family: sans-serif;
 }
@@ -62,13 +47,119 @@ h1, h2, body.overview .room a.title, body.overview .panel-primary a, .navbar-bra
 		text-transform: uppercase;
 		font-weight: bold;
 
-		margin: 60px 0 30px 0;
+		margin: 100px 0 30px 0;
 
 		span {
 			background-color: black;
 			padding: 0 15px;
 		}
 	}
+
+	.room {
+		a, a:hover {
+			text-decoration: none;
+			color: white;
+		}
+
+		.panel {
+			background: none;
+			border: none;
+
+			&:hover {
+				text-decoration: none;
+
+				.panel-body {
+					border-top: 1px solid white;
+					border-bottom: 1px solid white;
+				}
+
+				.panel-body .program-schedule .next-talk {
+					border-bottom: 1px solid white;
+				}
+			}
+
+			.panel-title {
+				color: white;
+			}
+
+			.panel-primary {
+				background-color: @light-grey;
+				border-color: @light-grey;
+				color: white;
+				a {
+					color: white;
+				}
+			}
+
+			.panel-heading {
+				background: none;
+				border: none;
+
+				display: block !important;
+
+				text-transform: uppercase;
+				font-weight: bold;
+
+				padding: 8px 15px;
+
+				a {
+					color: white;
+				}
+			}
+
+			.panel-body {
+				padding: 0;
+				border-top: 1px solid @darker-grey;
+				border-bottom: 1px solid @darker-grey;
+
+				position: relative;
+				margin-bottom: 48px + 16px;
+
+				.program-schedule {
+					padding: 15px 10px;
+					overflow: hidden;
+					font-size: 18px;
+
+					.current-talk strong {
+						display: none;
+					}
+					.next-talk {
+						display: block;
+						position: absolute;
+
+						overflow: hidden;
+
+						bottom: -48px;
+						left: 0;
+						right: 0;
+						height: 48px;
+						margin: 0;
+
+						line-height: 48px;
+						padding-left: 16px;
+
+						border-bottom: 1px solid @darker-grey;
+					}
+				}
+			}
+		}
+	}
+
+	.recordings {
+		.panel {
+			background: none;
+			border: 1px solid @dark-grey;
+			border-radius: 0;
+
+			&:hover {
+				border-color: white;
+			}
+
+			a {
+				color: white;
+			}
+		}
+	}
 }
 
 .navbar-brand {
@@ -170,3 +261,7 @@ body.multiview .cell {
 	text-decoration: underline;
 	color: @brand-primary;
 }
+
+.schedule .block.pause {
+	color: black !important;
+}