HandBrake/HandBrake-docs
1
0
Fork 0
mirror of https://github.com/HandBrake/HandBrake-docs.git synced 2025-12-11 04:35:53 -06:00
Code Issues Packages Projects Releases 1 Wiki Activity

template: Basic responsive layout.

Browse Source
This commit is contained in:
Bradley Sepos 2016-04-05 17:53:39 -04:00
parent 937295250c
commit 50989e4faf
1 changed files with 59 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

69
templates/mark1/style/style.css
View File

@ -56,8 +56,8 @@
article.docs { article.docs {
margin: 0 auto; margin: 0 auto;
padding: 40px 150px; padding: 10px 15px;
max-width: 650px; max-width: 85%;
font-family: 'Open Sans'; font-family: 'Open Sans';
font-size: 15px; font-size: 15px;
line-height: 25px; line-height: 25px;
@ -138,8 +138,41 @@ article.docs footer .contributing {
article.docs figure { article.docs figure {
display: inline-block; display: inline-block;
position: relative; position: relative;
left: -10%; left: -5%;
margin: 1.33333em 0; margin: 1.33333em 0;
}
article.docs figure img {
max-width: 110%;
}
article.docs figcaption {
padding-top: 4px;
border-top: 1px solid rgb(240,240,240);
font-size: 11px;
line-height: 15px;
color: rgb(120,120,120);
}
/* Wider than 390 */
@media (min-width: 390px) {
}
/* Wider than 550 */
@media (min-width: 550px) {
}
/* Wider than 750 */
@media (min-width: 750px) {
article.docs {
padding-left: 40px;
padding-right: 40px;
max-width: 650px;
}
article.docs figure {
max-width: 45%; max-width: 45%;
vertical-align: top; vertical-align: top;
} }
@ -151,11 +184,27 @@ article.docs figure + figure {
article.docs figure img { article.docs figure img {
max-width: 100%; max-width: 100%;
} }
}
article.docs figcaption {
padding-top: 4px; /* Wider than 1000 */
border-top: 1px solid rgb(240,240,240); @media (min-width: 1000px) {
font-size: 11px; article.docs {
line-height: 15px; padding-left: 150px;
color: rgb(120,120,120); padding-right: 150px;
max-width: 650px;
}
article.docs figure {
left: -10%;
}
}
/* @2x */
@media (-webkit-min-device-pixel-ratio: 1.25), (min-resolution: 120dpi) {
}
/* @3x */
@media (-webkit-min-device-pixel-ratio: 2.5), (min-resolution: 240dpi) {
} }