Mercurial > kallithea
changeset 7207:4749158e7d1c
less: bootstrap grid system for settings like pages
author | domruf <dominikruf@gmail.com> |
---|---|
date | Sun, 29 Oct 2017 23:22:18 +0100 |
parents | f460139aa6d6 |
children | 18a19c7d5145 |
files | kallithea/public/less/style.less kallithea/templates/pullrequests/pullrequest_show.html |
diffstat | 2 files changed, 73 insertions(+), 29 deletions(-) [+] |
line wrap: on
line diff
--- a/kallithea/public/less/style.less Sun Mar 11 12:20:29 2018 +0100 +++ b/kallithea/public/less/style.less Sun Oct 29 23:22:18 2017 +0100 @@ -195,9 +195,6 @@ padding-right: 0.3em; } -.form-group > label { - float: left; -} .dt_repo_pending { opacity: 0.5; } @@ -415,22 +412,9 @@ div.gravatar img { border-radius: 2px; } -.panel-body.settings > ul.nav-stacked { - float: left; - width: 150px; - padding-right: 35px; - color: #393939; - font-weight: 700; -} .panel-body.settings .nav-pills > :not(.active) > a { color: inherit; } -.panel-body.settings > div, -.panel-body.settings > form { - float: left; - width: 750px; - margin: 0; -} .panel-body.no-padding { padding: 0; } @@ -504,9 +488,7 @@ #content div.panel ol.decimal { margin: 10px 24px 10px 44px; } -#content div.panel div.form div.form-group > div { - margin: 0 0 10px 200px; -} + div.form div.form-group div.button input, #content div.panel div.form div.buttons input, div.form div.buttons input, @@ -519,11 +501,6 @@ #content div.panel div.form div.buttons div.highlight { display: inline; } -#content div.panel div.form div.buttons, -div.form div.buttons { - margin: 10px 10px 0 200px; - padding: 0; -} #content div.panel table td.user, #content div.panel table td.address { width: 10%; @@ -647,10 +624,6 @@ border: 1px solid #d9e8f8; line-height: 1.5em; } -.panel-body .pr-box { - max-width: 978px; - margin-right: 15px; -} #s2id_org_ref, #s2id_other_ref, #s2id_org_repo, @@ -743,6 +716,77 @@ .make-xs-column(11); } +/* use columns and form-horizontal for settings pages ... on wide screens */ +@media (min-width: @screen-sm-min) { + .settings { + max-width: @container-md; + > ul.nav-stacked { + .make-sm-column(2); + max-width: (@container-md/12)*2; + } + > div { + .make-sm-column(10); + max-width: (@container-md/12)*10; + } + .form { + .form-horizontal; + } + .form-group { + .clearfix; + > label { + .make-xs-column(3); + input { + width: 100%; + } + } + > div { + .make-xs-column(9); + } + .buttons { + .make-xs-column-offset(3); + } + } + } +} + +/* use columns and form-horizontal for summary page */ +#summary { + max-width: @container-md; + .form-horizontal; + .make-sm-column(10); + .form-group > label { + .make-sm-column(2); + } + .form-group > div { + .make-sm-column(10); + } +} +#summary-menu-stats { + .make-sm-column(2); +} + +/* use columns and form-horizontal for pull request page */ +.pr-box { + .make-sm-column(9); + #pr-summary { + max-width: @container-md; + .form-horizontal; + .form-group > label { + .make-sm-column(3); + } + .form-group > div { + .make-sm-column(9); + } + .form-group > .buttons { + .make-sm-column-offset(3); + .make-sm-column(9); + } + } +} +.pr-reviewers-box { + .make-sm-column(3); +} + /* repo table icons */ #repos_list_wrap_wrapper { /* make icon-folder and repotag the same width */
--- a/kallithea/templates/pullrequests/pullrequest_show.html Sun Mar 11 12:20:29 2018 +0100 +++ b/kallithea/templates/pullrequests/pullrequest_show.html Sun Oct 29 23:22:18 2017 +0100 @@ -193,7 +193,7 @@ </div> </div> ## REVIEWERS - <div class="pull-left"> + <div class="pr-reviewers-box pull-left"> <h4 class="pr-details-title">${_('Reviewers')}</h4> <div id="reviewers"> ## members goes here !