Increase click area for topbar icons

css/glowingbear.css

@@ -93,7 +93,10 @@ input[type=text], input[type=password], #sendMessage, .badge {
 #topbar .brand {
     float: left;
     height: 35px;
-    padding-left: 10px;
+}
+#topbar .brand a {
+    display: block;
+    padding: 0 10px;
 }
 #topbar .brand img {
     height: 32px;
@@ -114,17 +117,20 @@ input[type=text], input[type=password], #sendMessage, .badge {
     margin-left: 5px;
     padding-left: 5px;
     margin-right: 0;
-    padding-right: 10px;
+    padding-right: 5px;
-    padding-top: 2px;
     height: 35px;
     line-height: 35px;
     font-size: 16px;
     position: fixed;
     right: 0;
 }
-
 #topbar .actions > * {
-    padding-left: 5px;
+    padding: 0 5px;
+    display: inline-block;
+}
+#topbar .actions .glyphicon {
+    line-height: 35px;
+    top: 0;
 }
 #topbar .dropdown-menu form {
     padding-left: 6px;

index.html

@@ -226,11 +226,9 @@ $ openssl req -nodes -newkey rsa:4096 -keyout relay.pem -x509 -days 365 -out rel
           <span ng-repeat="part in activeBuffer().title" ng-class="::part.classes" ng-bind-html="::(part.text | linky:'_blank' | DOMfilter:'irclinky')"></span>
         </div>
         <div class="actions pull-right vertical-line-left">
-          <div class="pull-left">
+          <a class="settings-toggle" ng-click="showModal('settingsModal')" title="Options menu">
-            <a class="settings-toggle" ng-click="showModal('settingsModal')" title="Options menu">
+            <i class="glyphicon glyphicon-cog"></i>
-              <i class="glyphicon glyphicon-cog"></i>
+          </a>
-            </a>
-          </div>
           <a ng-click="disconnect()" title="Disconnect from WeeChat">
             <i class="glyphicon glyphicon-off"></i>
           </a>