Fix width of <pre> blocks on narrow devices (getting started and customizer) (Closes #536)

master
Nicolas Garnier 2015-06-29 17:29:17 +02:00 committed by Addy Osmani
parent c4079b6c2a
commit a4771df45a
2 changed files with 20 additions and 7 deletions

View File

@ -61,6 +61,7 @@
} }
.mdl-gen > .mdl-grid { .mdl-gen > .mdl-grid {
max-width: 1280px; max-width: 1280px;
padding: 0;
} }
.mdl-gen__preview { .mdl-gen__preview {
position: relative; position: relative;

View File

@ -901,6 +901,7 @@ code[class*=language-], pre[class*=language-] {
padding: 15px 40px; padding: 15px 40px;
box-sizing: content-box; box-sizing: content-box;
display: block; display: block;
max-width: none;
} }
.started .caption { .started .caption {
margin-left: -40px; margin-left: -40px;
@ -909,13 +910,6 @@ code[class*=language-], pre[class*=language-] {
box-sizing: content-box; box-sizing: content-box;
padding: 15px 40px; padding: 15px 40px;
} }
.started .code-with-text {
width: 100%;
margin-left: -40px;
margin-right: -40px;
padding: 15px 40px;
display: block;
}
.started .mdl-tabs__tab-bar { .started .mdl-tabs__tab-bar {
margin-left: -40px; margin-left: -40px;
margin-right: -40px; margin-right: -40px;
@ -1119,6 +1113,24 @@ code[class*=language-], pre[class*=language-] {
padding-left: 40px; padding-left: 40px;
padding-right: 40px; padding-right: 40px;
} }
.started .docs-layout .docs-text-styling pre[class*=language-markup] {
max-width: none;
}
.docs-layout .code-with-text {
width: 100%;
margin-left: -40px;
margin-right: -40px;
padding: 15px 40px;
display: block;
box-sizing: content-box;
}
.docs-layout .code-with-text pre {
width: auto;
padding-left: 40px;
padding-right: 40px;
margin-left: -40px;
margin-right: -40px;
}
} }
@media (-webkit-min-device-pixel-ratio: 2), /* Webkit-based browsers */ @media (-webkit-min-device-pixel-ratio: 2), /* Webkit-based browsers */
(min--moz-device-pixel-ratio: 2), /* Older Firefox browsers (prior to Firefox 16) */ (min--moz-device-pixel-ratio: 2), /* Older Firefox browsers (prior to Firefox 16) */