FIX: site settings page layout at smaller widths

This commit is contained in:
Neil Lalonde 2013-11-16 14:14:34 -05:00
parent 482b752046
commit 6eb5f1aec2
7 changed files with 190 additions and 168 deletions

View file

@ -31,6 +31,7 @@
</ul>
</div>
<div class="admin-container">
{{#if view.headerActive}}
{{aceEditor content=header mode="html"}}
{{/if}}
@ -43,6 +44,7 @@
{{#if view.mobileStylesheetActive}}
{{aceEditor content=mobile_stylesheet mode="scss"}}
{{/if}}
</div>
{{/with}}
<br>
<div class='status-actions'>

View file

@ -8,4 +8,6 @@
</div>
</div>
<div class="admin-container">
{{outlet}}
</div>

View file

@ -7,6 +7,7 @@
</div>
</div>
<div class="admin-container">
{{#if model.loading}}
<div class='admin-loading'>{{i18n loading}}</div>
{{else}}
@ -99,3 +100,4 @@
<p>{{i18n admin.flags.no_results}}</p>
{{/if}}
{{/if}}
</div>

View file

@ -9,4 +9,6 @@
</div>
</div>
<div class="admin-container">
{{outlet}}
</div>

View file

@ -1,4 +1 @@
<h2>{{name}}</h2>
<hr/>
{{collection contentBinding="filteredContent" classNames="form-horizontal settings" itemViewClass="Discourse.SiteSettingView"}}

View file

@ -17,6 +17,7 @@
</div>
</div>
<div class="admin-container">
{{#if hasSelection}}
<div id='selected-controls'>
<button {{action approveUsers}} class='btn'>{{countI18n admin.users.approved_selected countBinding="selectedCount"}}</button>
@ -93,3 +94,4 @@
<p>{{i18n search.no_results}}</p>
{{/if}}
{{/if}}
</div>

View file

@ -78,12 +78,15 @@ td {border-bottom: 1px solid #ddd; border-top: 1px solid #ddd;}
};
}
.admin-container {
margin-top: 20px;
}
.admin-controls {
@include border-radius-all(5px);
background-color: darken($white, 5%);
border: 1px solid darken($white, 10%);
padding: 10px 10px 3px 0px;
margin-bottom: 20px;
height: 35px;
.nav.nav-pills {
li.active {
@ -145,7 +148,10 @@ td {border-bottom: 1px solid #ddd; border-top: 1px solid #ddd;}
.site-settings-nav {
width: 200px;
margin-top: 33px;
margin-top: 40px;
.nav-stacked {
border-right: none;
}
li a.active {
color: $white;
background-color: $nav-stacked-background-color-active;
@ -154,7 +160,11 @@ td {border-bottom: 1px solid #ddd; border-top: 1px solid #ddd;}
.site-settings-detail {
width: 850px;
margin-left: 30px;
@include medium-width { width: 740px; }
@include small-width { width: 700px; }
margin-left: 0;
border-left: solid 1px lighten($nav-stacked-border-color, 5%);
padding: 30px 0 30px 30px;
}
.settings {
@ -164,16 +174,25 @@ td {border-bottom: 1px solid #ddd; border-top: 1px solid #ddd;}
.setting-label {
float: left;
width: 196px;
@include medium-width { width: 176px; }
@include small-width { width: 166px; }
margin-right: 12px;
}
.setting-value {
float: left;
width: 450px;
@include medium-width { width: 360px; }
@include small-width { width: 330px; }
}
.setting-controls {
float: left;
width: 144px;
}
.input-setting-string {
width: 404px;
@include medium-width { width: 314px; }
@include small-width { width: 284px; }
}
.desc {
padding-top: 3px;
@ -195,10 +214,6 @@ td {border-bottom: 1px solid #ddd; border-top: 1px solid #ddd;}
color: darken($yellow, 20%);
}
}
.input-setting-string {
width: 404px;
}
}
section.details {