Fix button layout on mobile site

This commit is contained in:
JonnyWong16 2018-02-19 08:39:27 -08:00
parent f0aa793262
commit 36ff1fb674
3 changed files with 87 additions and 40 deletions

View file

@ -2395,6 +2395,9 @@ a .library-user-instance-box:hover {
margin-top: 9px;
width: 175px;
}
.home-padded-header .button-bar {
float: left;
}
.home-platforms {
}
.home-platforms ul,
@ -3315,6 +3318,44 @@ pre::-webkit-scrollbar-thumb {
.dashboard-stats-instance {
width: 100%;
}
.header-bar {
display: block;
float: none !important;
}
.button-bar {
float: left !important;
clear: both;
margin-top: 15px;
}
.button-bar > div,
.button-bar > button,
.button-bar > span {
float: left !important;
clear: both !important;
margin-bottom: 10px;
}
.button-bar > div > button.btn {
float: left !important;
clear: both !important;
}
.home-padded-header .button-bar {
margin-top: 10px;
margin-bottom: 15px;
}
}
@media only screen
and (min-device-width: 800px)
and (max-device-width: 1024px) {
.button-bar {
float: right !important;
}
.button-bar > div > button.btn {
float: left !important;
clear: both !important;
}
.home-padded-header .button-bar {
float: left !important;
}
}
#search_form {
width: 300px;

View file

@ -11,7 +11,7 @@
<div class="header-bar">
<span><i class="fa fa-bar-chart"></i> Graphs</span>
</div>
<div class="button-bar hidden-xs">
<div class="button-bar">
<div class="btn-group" id="user-selection">
<label>
<select name="graph-user" id="graph-user" class="btn" style="color: inherit;">

View file

@ -31,6 +31,7 @@
<div class="col-md-12">
<div class="home-padded-header padded-header">
<h3 class="pull-left">Watch Statistics</h3>
<div class="button-bar">
<div class="btn-group pull-left" data-toggle="buttons" id="watch-stats-toggles" style="margin-right: 3px">
% if config['home_stats_type'] == 0:
<label class="btn btn-dark active">
@ -56,6 +57,7 @@
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-12">
<div id="home-stats" class="home-platforms">
@ -69,10 +71,12 @@
<div class="col-md-12">
<div class="home-padded-header padded-header" id="library-statistics-header">
<h3 class="pull-left">Library Statistics</h3>
<div class="button-bar">
<span class="btn btn-dark active" style="cursor: default">${config['pms_name']}</span>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-12">
<div id="library-stats" class="library-platforms">
@ -94,6 +98,7 @@
<a href="#" id="recently-added-page-right" class="paginate btn-gray disabled" data-id="-1"><i class="fa fa-lg fa-chevron-right"></i></a>
</li>
</ul>
<div class="button-bar">
<div class="btn-group pull-left" data-toggle="buttons" id="recently-added-toggles" style="margin-right: 3px">
<label class="btn btn-dark active" id="recently-added-label-all">
<input type="radio" name="recently-added-toggle" id="recently-added-toggle-all" value="" autocomplete="off"> All
@ -115,6 +120,7 @@
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-12">
<div id="recentlyAdded" style="margin-right: -15px;">