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.gh/stable
parent
296bfa23aa
commit
afb593b44e
|
@ -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;
|
||||
|
||||
|
|
Reference in New Issue