Change style of settings submenu

Remove weight of the submenu by not using default button styles
streamlink · Jul 11, 2016 · c0465d4 · c0465d4
1 parent aa40fbb
commit c0465d4
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 2 deletions.
diff --git a/src/styles/routes/Settings.less b/src/styles/routes/Settings.less
@@ -14,16 +14,29 @@
 		display: flex;
 		margin: 0 0 2rem;
 		padding: 0;
+		list-style: none;
 
 		> li {
 			margin-left: .5rem;
+			padding: .2em .5em .4em;
+			border-bottom: transparent .25em solid;
 			font-size: .91em;
+			font-weight: bold;
 			opacity: .5;
-			transition: opacity .25s ease-out;
+			cursor: pointer;
+			transition: opacity .25s ease-out, border-bottom-color .25s ease-out;
+
+			.themed({
+				color: @themed-text-color-alt;
+			});
 
 			&:first-of-type {
 				margin-left: 0;
 			}
+
+			&.active {
+				border-bottom-color: @color-twitch-purple;
+			}
 		}
 
 		&:hover > li,

diff --git a/src/templates/settings/Settings.hbs b/src/templates/settings/Settings.hbs
@@ -14,7 +14,7 @@
 	notifications="Notifications"
 	channels="Channels"
 ) as |subroute name|}}
-	{{#link-to (concat "settings." subroute) tagName="li" classNames="btn" activeClass="btn-primary active" inactiveClass="btn-neutral"}}{{name}}{{/link-to}}
+	{{#link-to (concat "settings." subroute) tagName="li" activeClass="active" inactiveClass="btn-neutral"}}{{name}}{{/link-to}}
 {{/each-in}}
 </ul>
 </header>