Summary: The gists in the docs have large margins to fit with the front page. This diff specialises that margin setting and sets it to something smaller for other gists. Reviewed By: emilsjolander Differential Revision: D4666016 fbshipit-source-id: 5121849a153e78d523b33e10b96641426e794f8d
105 lines
1.6 KiB
SCSS
105 lines
1.6 KiB
SCSS
.yoga {
|
|
box-sizing: border-box;
|
|
position: relative;
|
|
border: 0 solid black;
|
|
margin: 0;
|
|
padding: 0;
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: stretch;
|
|
justify-content: flex-start;
|
|
flex-shrink: 0;
|
|
}
|
|
|
|
.yoga span {
|
|
display: flex;
|
|
color: white;
|
|
align-self: center;
|
|
justify-content: center;
|
|
flex: 1;
|
|
}
|
|
|
|
.yoga.sample {
|
|
border: 1px solid #ccc;
|
|
border-radius: 3px;
|
|
margin: 50px;
|
|
margin-left: 0px;
|
|
margin-right: 0px;
|
|
max-width: 100%;
|
|
}
|
|
|
|
.gist {
|
|
margin: 5px;
|
|
margin-left: 0px;
|
|
margin-right: 0px;
|
|
}
|
|
|
|
.gistsample > .gist {
|
|
width: 600px;
|
|
margin: 50px;
|
|
margin-left: 0px;
|
|
margin-right: 0px;
|
|
max-width: 100%;
|
|
}
|
|
|
|
.gist .gist-meta {
|
|
display: none;
|
|
}
|
|
|
|
.gist .gist-data {
|
|
border-bottom-width: 0px !important;
|
|
}
|
|
|
|
.gist .gist-file {
|
|
border-color: #ccc !important;
|
|
margin-bottom: 0px !important;
|
|
}
|
|
|
|
.blockContent {
|
|
width: 600px;
|
|
max-width: 100%;
|
|
}
|
|
|
|
.layoutsample {
|
|
align-items: flex-end;
|
|
margin-right: 50px;
|
|
}
|
|
|
|
.gistsample {
|
|
align-items: flex-start;
|
|
margin-left: 50px;
|
|
}
|
|
|
|
.imageAlignSide .blockContent {
|
|
display: flex;
|
|
flex: 1 1;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
}
|
|
|
|
@media only screen and (max-width: 1320px) {
|
|
.imageAlignSide .blockContent {
|
|
flex-direction: row;
|
|
justify-content: center;
|
|
align-items: center;
|
|
}
|
|
|
|
.layoutsample {
|
|
flex-direction: row;
|
|
justify-content: center;
|
|
align-items: center;
|
|
margin-right: 0px;
|
|
}
|
|
|
|
.gistsample {
|
|
margin-left: 0px;
|
|
}
|
|
|
|
.gridBlock .imageAlignSide {
|
|
display: flex;
|
|
flex: 1 1;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
}
|
|
}
|