Quellcode durchsuchen

Made header type on station pages always display in exact center.

KrisVos130 vor 9 Jahren
Ursprung
Commit
3b1519040e
2 geänderte Dateien mit 23 neuen und 11 gelöschten Zeilen
  1. 12 3
      app/app.css
  2. 11 8
      app/templates/room.html

+ 12 - 3
app/app.css

@@ -474,9 +474,6 @@ form button:hover {
 
 
 /* Tablet view fix */
 /* Tablet view fix */
 @media (max-width: 768px){
 @media (max-width: 768px){
-    #station-main nav h3{
-        margin-left: 20% !important;
-    }
     .bg-bubbles li:nth-child(10) {
     .bg-bubbles li:nth-child(10) {
         display: none;
         display: none;
     }
     }
@@ -1101,4 +1098,16 @@ footer .fa {
     font-weight: 300;
     font-weight: 300;
     background-color: rgba(255, 255, 255, 0.2);
     background-color: rgba(255, 255, 255, 0.2);
     resize: vertical;
     resize: vertical;
+}
+#room-header {
+    position: absolute;
+    left: 0;
+    right: 0;
+    margin-left: auto;
+    margin-right: auto;
+    width: 100px;
+}
+#room-icons {
+    margin-top: 11px;
+    float: left;
 }
 }

+ 11 - 8
app/templates/room.html

@@ -4,17 +4,20 @@
             <div class="row">
             <div class="row">
                 <div class="col-md-9" id="station-main">
                 <div class="col-md-9" id="station-main">
                     <nav>
                     <nav>
-                        <a class="back" href="/"><i class="fa fa-chevron-left"></i></a>
-                        {{#if isAdmin}}
+                        <div id="room-icons">
+                            <a class="back" href="/"><i class="fa fa-chevron-left"></i></a>
+                            {{#if isAdmin}}
                             {{#if paused}}
                             {{#if paused}}
-                                <i class="fa fa-play fa-1" id="play"></i>
+                            <i class="fa fa-play fa-1" id="play"></i>
                             {{else}}
                             {{else}}
-                                <i class="fa fa-pause fa-1" id="pause"></i>
+                            <i class="fa fa-pause fa-1" id="pause"></i>
                             {{/if}}
                             {{/if}}
-                        <i class="fa fa-step-forward fa-1" id="skip"></i>
-                        <i class="fa fa-random fa-1" id="shuffle"></i>
-                        {{/if}}
-                        <h3>
+                            <i class="fa fa-step-forward fa-1" id="skip"></i>
+                            <i class="fa fa-random fa-1" id="shuffle"></i>
+                            {{/if}}
+                        </div>
+
+                        <h3 id="room-header">
                             {{{type}}}
                             {{{type}}}
                         </h3>
                         </h3>
                         <div id="volume-container">
                         <div id="volume-container">