Fix protruded infomation board section in about/more page (#4415)

* Fix protruded infomation board section

Set "flexwrap: wrap" for sections. Set upper and lower padding for each section, and adjust clearances around sections accordingly. Settings for viewport threshold 500px is no more needed.

* Fix mistake of reducing information-board padding

In according with this fix, additional padding setting  for maximum 840px width is no more needed.
This commit is contained in:
Lynx Kotoura 2017-07-28 20:34:44 +09:00 committed by Eugen Rochko
parent 296bfa23aa
commit afb593b44e

View File

@ -121,7 +121,7 @@
.information-board {
background: darken($ui-base-color, 4%);
padding: 40px 0;
padding: 20px 0;
.panel {
position: absolute;
@ -162,13 +162,14 @@
.information-board-sections {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}
.section {
flex: 1 0 0;
font: 16px/28px 'mastodon-font-sans-serif', sans-serif;
text-align: right;
padding: 0 15px;
padding: 10px 15px;
span,
strong {
@ -190,14 +191,6 @@
color: $primary-text-color;
}
}
@media screen and (max-width: 500px) {
flex-direction: column;
.section {
text-align: left;
}
}
}
.owner {
@ -661,16 +654,12 @@
padding: 0 20px;
}
.information-board {
padding-bottom: 20px;
}
.information-board .container {
padding-right: 20px;
.panel {
position: static;
margin-top: 30px;
margin-top: 20px;
width: 100%;
border-radius: 4px;