Footer redesign: Two lines

First line for "About" links and copyright.
Second line for logos (Powered by, etc).

Added PLoS logo and link to "Recommended by" section.

Changed the page height to accommodate the new footer height.

public/css/gogs.css

@@ -65,7 +65,7 @@ code.wrap {
 }
 .full.height {
   padding: 0;
-  margin: 0 0 -80px 0;
+  margin: 0 0 -200px 0;
   min-height: 100%;
 }
 .following.bar {
@@ -295,7 +295,7 @@ code.wrap {
   border-top: none;
   line-height: 1em;
   color: rgba(0, 0, 0, 0.8);
-  padding: .71428571em 1.14285714em !important;
+  padding: 0.71428571em 1.14285714em !important;
   font-size: 1rem;
   text-transform: none;
   font-weight: 400;
@@ -314,8 +314,8 @@ code.wrap {
   font-weight: 700 !important;
 }
 footer {
-  margin-top: 54px !important;
-  height: 40px;
+  margin-top: 114px !important;
+  height: 100px;
   background-color: white;
   border-top: 1px solid #d6d6d6;
   clear: both;
@@ -864,7 +864,7 @@ footer .ui.language .menu {
   border-top: 0;
 }
 .home {
-  padding-bottom: 80px;
+  padding-bottom: 200px;
 }
 .home .logo {
   margin-bottom: 20px;
@@ -895,11 +895,11 @@ footer .ui.language .menu {
 }
 .signup {
   padding-top: 15px;
-  padding-bottom: 80px;
+  padding-bottom: 200px;
 }
 .install {
   padding-top: 45px;
-  padding-bottom: 80px;
+  padding-bottom: 200px;
 }
 .install form label {
   text-align: right;
@@ -929,8 +929,8 @@ footer .ui.language .menu {
 }
 .form .help {
   color: #999999;
-  padding-top: .6em;
-  padding-bottom: .6em;
+  padding-top: 0.6em;
+  padding-bottom: 0.6em;
   display: inline-block;
   word-break: break-word;
 }
@@ -1123,7 +1123,7 @@ footer .ui.language .menu {
 }
 .repository {
   padding-top: 15px;
-  padding-bottom: 80px;
+  padding-bottom: 200px;
 }
 .repository .head .column {
   padding-top: 5px !important;
@@ -1241,7 +1241,7 @@ footer .ui.language .menu {
   padding: 0 5px;
 }
 .repository #clone-panel .clone.button:first-child {
-  border-radius: .28571429rem 0 0 .28571429rem;
+  border-radius: 0.28571429rem 0 0 0.28571429rem;
 }
 .repository #clone-panel .icon.button {
   padding: 0 10px;
@@ -1409,7 +1409,7 @@ footer .ui.language .menu {
   background-color: #f5f2f0;
   font-family: Consolas, Monaco, 'Andale Mono', monospace;
   padding: 1em;
-  margin: .5em 0;
+  margin: 0.5em 0;
 }
 .repository.file.list #file-content #ipython-notebook .nb-input:before,
 .repository.file.list #file-content #ipython-notebook .nb-output:before {
@@ -2148,7 +2148,7 @@ footer .ui.language .menu {
 }
 .repository .diff-file-box .code-diff tbody tr.tag-code td {
   background-color: #F0F0F0 !important;
-  border-color: #D2CECE!important;
+  border-color: #D2CECE !important;
   padding-top: 4px;
   padding-bottom: 4px;
 }
@@ -2208,7 +2208,7 @@ footer .ui.language .menu {
   font-weight: normal;
 }
 .repository.quickstart .guide .clone.button:first-child {
-  border-radius: .28571429rem 0 0 .28571429rem;
+  border-radius: 0.28571429rem 0 0 0.28571429rem;
 }
 .repository.quickstart .guide .ui.action.small.input {
   width: 100%;
@@ -2486,10 +2486,10 @@ footer .ui.language .menu {
 }
 .issue.list > .item .desc a.milestone {
   padding-left: 5px;
-  color: #999!important;
+  color: #999 !important;
 }
 .issue.list > .item .desc a.milestone:hover {
-  color: #000!important;
+  color: #000 !important;
 }
 .issue.list > .item .desc .assignee {
   margin-top: -5px;
@@ -2732,7 +2732,7 @@ footer .ui.language .menu {
 }
 .organization {
   padding-top: 15px;
-  padding-bottom: 80px;
+  padding-bottom: 200px;
 }
 .organization .head .ui.header .text {
   vertical-align: middle;
@@ -2857,7 +2857,7 @@ footer .ui.language .menu {
 }
 .user:not(.icon) {
   padding-top: 15px;
-  padding-bottom: 80px;
+  padding-bottom: 200px;
 }
 .user.settings .list .item.ui.grid {
   margin-top: 15px;
@@ -2940,7 +2940,7 @@ footer .ui.language .menu {
 }
 .dashboard {
   padding-top: 15px;
-  padding-bottom: 80px;
+  padding-bottom: 200px;
 }
 .dashboard.feeds .context.user.menu,
 .dashboard.issues .context.user.menu {
@@ -3076,7 +3076,7 @@ footer .ui.language .menu {
 }
 .admin {
   padding-top: 15px;
-  padding-bottom: 80px;
+  padding-bottom: 200px;
 }
 .admin .table.segment {
   padding: 0;
@@ -3130,7 +3130,7 @@ footer .ui.language .menu {
 }
 .explore {
   padding-top: 15px;
-  padding-bottom: 80px;
+  padding-bottom: 200px;
 }
 .explore .navbar .octicon {
   width: 16px;
@@ -3189,20 +3189,13 @@ footer .ui.language .menu {
   font-family: "Kaushan Script", "Helvetica Neue", Helvetica, Arial, cursive;
   font-size: 16px;
 }
-.bmbf {
-  width: 80px;
-}
 .supersmall {
   padding-left: 10px;
   font-size: 0.8em;
   text-align: left;
 }
 .leftspace {
-  padding-left: 40px;
-}
-.gogssmall {
-  height: 40px;
-  align-content: center;
+  padding-left: 20px;
 }
 figure {
   float: right;
@@ -3233,11 +3226,6 @@ figure figcaption {
   font-family: "Kaushan Script", "Helvetica Neue", Helvetica, Arial, cursive;
   font-size: 16px;
 }
-.bmbf {
-  width: 50px;
-  margin-left: auto;
-  margin-right: auto;
-}
 .supersmall {
   padding-left: 10px;
   font-size: 0.8em;
@@ -3246,12 +3234,6 @@ figure figcaption {
 .leftspace {
   padding-left: 40px;
 }
-.gogssmall {
-  height: 30px;
-  align-content: center;
-  margin-left: auto;
-  margin-right: auto;
-}
 figure {
   float: right;
   max-width: 600px;
@@ -3284,17 +3266,17 @@ figure figcaption {
   float: left;
   background-color: #5b5b5b;
   color: white;
-  border-top-left-radius: .28571429rem;
-  border-bottom-left-radius: .28571429rem;
-  padding: .833em 1em;
+  border-top-left-radius: 0.28571429rem;
+  border-bottom-left-radius: 0.28571429rem;
+  padding: 0.833em 1em;
 }
 .gin.doinr {
   background-color: #2185D0;
   float: right;
   color: white;
-  border-top-right-radius: .28571429rem;
-  border-bottom-right-radius: .28571429rem;
-  padding: .833em 1em;
+  border-top-right-radius: 0.28571429rem;
+  border-bottom-right-radius: 0.28571429rem;
+  padding: 0.833em 1em;
 }
 .ui.image.label.nobg {
   background: none;
@@ -3321,7 +3303,7 @@ textarea#description {
   border-radius: 500rem;
   border-color: #767676 transparent transparent;
   border-style: solid;
-  border-width: .2em;
+  border-width: 0.2em;
   box-shadow: 0 0 0 1px transparent;
 }
 /*--------------
@@ -3408,14 +3390,19 @@ textarea#description {
   text-align: center;
 }
 #file-buttons > a:first-child {
-  border-top-left-radius: .28571429rem;
-  border-bottom-left-radius: .28571429rem;
+  border-top-left-radius: 0.28571429rem;
+  border-bottom-left-radius: 0.28571429rem;
   border-top-right-radius: 0;
   border-bottom-right-radius: 0;
 }
 .textnode.focusable.whitespace {
   display: none !important;
 }
+.footericon {
+  height: 40px;
+  vertical-align: middle;
+}
 .footertext {
-  font-size: 0.5rem;
+  font-size: 1rem;
+  vertical-align: middle;
 }

public/less/_base.less

@@ -1,4 +1,4 @@
-@footer-margin: 40px;
+@footer-margin: 100px;
 
 body:not(.full-width) {
 	font-family: "PingFang SC", "Helvetica Neue", "Microsoft YaHei", Arial, Helvetica, sans-serif !important;

public/less/_gin.less

@@ -3,10 +3,6 @@
   font-size: 16px;
 }
 
-.bmbf {
-  width: 80px;
-}
-
 .supersmall {
   padding-left: 10px;
   font-size: 0.8em;
@@ -14,13 +10,9 @@
 }
 
 .leftspace {
-  padding-left: 40px;
+  padding-left: 20px;
 }
 
-.gogssmall {
-  height: 40px;
-  align-content: center;
-}
 
 figure {
   float: right;
@@ -57,12 +49,6 @@ figure figcaption {
   font-size: 16px;
 }
 
-.bmbf {
-  width: 50px;
-    margin-left: auto;
-    margin-right: auto;
-}
-
 .supersmall {
   padding-left: 10px;
   font-size: 0.8em;
@@ -73,13 +59,6 @@ figure figcaption {
   padding-left: 40px;
 }
 
-.gogssmall {
-  height: 30px;
-  align-content: center;
-  margin-left: auto;
-  margin-right: auto;
-}
-
 figure {
   float: right;
   max-width: 600px;
@@ -276,8 +255,12 @@ textarea#description {
     display: none !important;
 }
 
-.footertext{
-    font-size:.5rem
+.footericon {
+  height: 40px;
+  vertical-align: middle;
 }
 
-
+.footertext{
+    font-size: 1rem;
+    vertical-align: middle;
+}

templates/base/footer.tmpl

@@ -1,79 +1,49 @@
 {{/*
 <html>
 <body>
-<div>
-	*/}}
-</div>
-<footer>
-	<div class="following bar light">
-	<div class="ui container">
-	<div class="ui grid">
-		<div class="column">
-			<div class="ui top secondary menu center">
-				<a class="item brand footertext" href="http://www.g-node.org">
-					<img class="ui mini image"
-							 src="https://projects.g-node.org/assets/gnode-bootstrap-theme/1.2.0-snapshot/img/gnode-icon-50x50-transparent.png"/>
-					© G-Node, 2016-2018
-				</a>
-				<a class="item brand footertext" href="/G-Node/Info/wiki/about">About</a>
-				<a class="item brand footertext" href="/G-Node/Info/wiki/imprint">Imprint</a>
-				<a class="item brand footertext" href="/G-Node/Info/wiki/contact">Contact</a>
-				<a class="item brand footertext" href="/G-Node/Info/wiki/Terms+of+Use">Terms of Use</a>
-				<a class="item brand footertext " href="/G-Node/Info/wiki/Datenschutz">Datenschutz</a>
-
-
-				<div class="ui supersmall leftspace">
-					Powered by:
-					<a href="https://github.com/gogits/gogs">
-						<img class="ui gogssmall image" src="{{AppSubURL}}/img/gogs.svg"/>
-					</a>
-				</div>
-				<div class="ui supersmall">
-					Hosted by:
-					<a href="http://neuro.bio.lmu.de">
-					<img class="ui bmbf image" src="{{AppSubURL}}/img/lmu.png"/>
-					</a>
-				</div>
-				<div class="ui supersmall">
-					Funded by:
-					<a href="http://www.bmbf.de">
-					<img class="ui bmbf image" src="{{AppSubURL}}/img/bmbf.png"/>
-					</a>
-				</div>
-				<div class="ui supersmall">
-					Registered with:
-					<a href="http://doi.org/10.17616/R3SX9N">
-						<img class="ui bmbf image" src="{{AppSubURL}}/img/re3.png"/>
-					</a>
-				</div>
-				<div class="ui supersmall">
-					Recommended by:
-					<a href="https://www.nature.com/sdata/policies/repositories#neurosci">
-						<img class="ui gogssmall image" src="{{AppSubURL}}/img/sdatarecbadge.jpg"/>
-					</a>
-				</div>
+	<div>
+*/}}
+	</div>
+	<footer>
+		<div class="ui container">
+			<div class="ui center links item brand footertext">
+				<a href="http://www.g-node.org"><img class="ui mini footericon" src="https://projects.g-node.org/assets/gnode-bootstrap-theme/1.2.0-snapshot/img/gnode-icon-50x50-transparent.png"/>© G-Node, 2016-2018</a>
+				<a href="/G-Node/Info/wiki/about">About</a>
+				<a href="/G-Node/Info/wiki/imprint">Imprint</a>
+				<a href="/G-Node/Info/wiki/contact">Contact</a>
+				<a href="/G-Node/Info/wiki/Terms+of+Use">Terms of Use</a>
+				<a href="/G-Node/Info/wiki/Datenschutz">Datenschutz</a>
+			</div>
+			<div class="ui center links item brand footertext">
+				<span>Powered by:      <a href="https://github.com/gogits/gogs"><img class="ui mini footericon" src="{{AppSubURL}}/img/gogs.svg"/></a>         </span>
+				<span>Hosted by:       <a href="http://neuro.bio.lmu.de"><img class="ui mini footericon" src="{{AppSubURL}}/img/lmu.png"/></a>          </span>
+				<span>Funded by:       <a href="http://www.bmbf.de"><img class="ui mini footericon" src="{{AppSubURL}}/img/bmbf.png"/></a>         </span>
+				<span>Registered with: <a href="http://doi.org/10.17616/R3SX9N"><img class="ui mini footericon" src="{{AppSubURL}}/img/re3.png"/></a>          </span>
+				<span>Recommended by:  <a href="https://www.nature.com/sdata/policies/repositories#neurosci"><img class="ui mini footericon" src="{{AppSubURL}}/img/sdatarecbadge.jpg"/><a href="https://journals.plos.org/plosone/s/data-availability#loc-neuroscience"><img class="ui mini footericon" src="{{AppSubURL}}/img/sm_bug-for-trademark-page.png"/></a></span>
 			</div>
 		</div>
-	</div>
-</footer>
+	</footer>
 </body>
 
 <!-- Third-party libraries -->
 {{if .RequireHighlightJS}}
-<link rel="stylesheet" href="{{AppSubURL}}/plugins/highlight-9.6.0/github.css">
-<script src="{{AppSubURL}}/plugins/highlight-9.6.0/highlight.pack.js"></script>
+	<link rel="stylesheet" href="{{AppSubURL}}/plugins/highlight-9.6.0/github.css">
+	<script src="{{AppSubURL}}/plugins/highlight-9.6.0/highlight.pack.js"></script>
 {{end}}
 {{if .RequireMinicolors}}
-<link rel="stylesheet" href="{{AppSubURL}}/plugins/jquery.minicolors-2.2.3/jquery.minicolors.css">
-<script src="{{AppSubURL}}/plugins/jquery.minicolors-2.2.3/jquery.minicolors.min.js"></script>
+	<link rel="stylesheet" href="{{AppSubURL}}/plugins/jquery.minicolors-2.2.3/jquery.minicolors.css">
+	<script src="{{AppSubURL}}/plugins/jquery.minicolors-2.2.3/jquery.minicolors.min.js"></script>
 {{end}}
 {{if .RequireDatetimepicker}}
-<link rel="stylesheet" href="{{AppSubURL}}/plugins/jquery.datetimepicker-2.4.5/jquery.datetimepicker.css">
-<script src="{{AppSubURL}}/plugins/jquery.datetimepicker-2.4.5/jquery.datetimepicker.js"></script>
+	<link rel="stylesheet" href="{{AppSubURL}}/plugins/jquery.datetimepicker-2.4.5/jquery.datetimepicker.css">
+	<script src="{{AppSubURL}}/plugins/jquery.datetimepicker-2.4.5/jquery.datetimepicker.js"></script>
 {{end}}
 {{if .RequireDropzone}}
-<link rel="stylesheet" href="{{AppSubURL}}/plugins/dropzone-4.2.0/dropzone.css">
-<script src="{{AppSubURL}}/plugins/dropzone-4.2.0/dropzone.js"></script>
+	<link rel="stylesheet" href="{{AppSubURL}}/plugins/dropzone-4.2.0/dropzone.css">
+	<script src="{{AppSubURL}}/plugins/dropzone-4.2.0/dropzone.js"></script>
+{{end}}
+{{if .RequireAutosize}}
+	<script src="{{AppSubURL}}/plugins/autosize-4.0.2/autosize.min.js"></script>
 {{end}}
 <script src="{{AppSubURL}}/js/libs/emojify-1.1.0.min.js"></script>
 <script src="{{AppSubURL}}/js/libs/clipboard-1.5.9.min.js"></script>