-
Notifications
You must be signed in to change notification settings - Fork 0
/
app.css
2 lines (2 loc) · 5.16 KB
/
app.css
1
2
input[type=checkbox]+label{-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.footer__social-buttons,.generator__fieldset ul,.generator__paragraphs-options{padding:0;margin:0;list-style-type:none}.footer__social-buttons>li,.generator__paragraphs-options>li{display:inline-block}.tgi:after,.tgi:before{position:absolute;top:0;right:0;bottom:0;left:0}*{font-family:Merriweather,Georgia,Times,Times New Roman,serif}*,:after,:before{box-sizing:border-box}html{font-size:62.5%}body{margin:0;font-size:1.4rem;font-weight:300;line-height:2.2rem;-webkit-font-smoothing:subpixel-antialiased}body,html{height:100%}a{text-decoration:none;font-weight:500}a,a:visited{color:#cc3200}button{outline:0}.footer__social-buttons,.github-corner{opacity:.3;transition:opacity .1s ease}.footer__social-buttons:hover,.github-corner:hover{opacity:1}body{background-color:#000;color:#fff}.outer-wrapper{max-width:96rem;margin:auto;height:100%;-ms-flex-direction:column;flex-direction:column;padding:0 2rem;-ms-flex-pack:justify;justify-content:space-between}.outer-wrapper,.tgi{display:-ms-flexbox;display:flex}.tgi{-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:wrap;flex-wrap:wrap;-ms-flex-flow:row wrap;flex-flow:row wrap;min-height:50rem}.tgi:before{content:"";display:block;background:url(michael-corleone-background.jpg) no-repeat top;opacity:0;animation:opening-fadein 3s ease-in 0s normal 1 forwards}.tgi__generator,.tgi__header{position:relative}.tgi__header{padding:4rem 0;-ms-flex-positive:1;flex-grow:1;-ms-flex-preferred-size:0;flex-basis:0;min-width:30rem}.header__logo{height:20rem;width:20rem;opacity:.9;background:url(the-godfather-ipsum-logo.svg) no-repeat 0/contain}.header__quote{padding:.5rem;margin:5rem 0 0;background-color:rgba(0,0,0,.5);opacity:0;animation:opening-fadein 1.5s ease-in 1.5s normal 1 forwards}.quote__text{margin:0;margin-bottom:2rem;line-height:2.5rem;position:relative}.quote__text:before{content:"\201C";opacity:.5;font-size:25rem;font-family:Georgia,Times,Times New Roman,serif;position:absolute;left:-11rem;line-height:20rem}.quote__author{font-size:1.2rem;opacity:.7}.tgi__generator{padding:4rem 0;-ms-flex-positive:2;flex-grow:2;-ms-flex-preferred-size:0;flex-basis:0;text-align:right;min-width:30rem}.generator__fieldset{border:0;font-size:1.2rem;padding:0;margin:0}.generator__fieldset li:not(:first-child){padding:1rem 0}.generator__paragraphs-label{margin-right:.5rem}.generator__paragraphs-options{display:inline-block}.generator__paragraphs-options input{position:absolute;opacity:0}.generator__paragraphs-options input:checked+label{opacity:1;border-color:#cc3200;color:#cc3200}.generator__paragraph-option{position:relative;display:inline-block;cursor:pointer;width:2.5rem;height:2.5rem;border:.1rem solid #fff;margin-left:.3rem;text-align:center;opacity:.7}.generator__paragraph-option:hover{opacity:1}.generator__start-with-godfather-ipsum em{margin-left:.2rem}.generator__generate-button{border:.1rem solid #cc3200;color:#cc3200;background-color:transparent;padding:.5rem 1rem;font-size:1.4rem;cursor:pointer}.generator__generate-button:hover{border-color:#ff3f00;color:#ff3f00}.generator__copy-ipsum-button{background-color:transparent;color:#cc3200;opacity:.7;border-width:0;cursor:pointer;font-size:1.2rem;margin-top:2rem;padding:0}.generator__copy-ipsum-button:hover{color:#ff3f00}.generator__output{margin:0 0 0 6rem;word-wrap:break-word;white-space:pre-wrap;font-size:1.2rem;max-height:35rem;overflow-y:auto;overflow-x:hidden;padding:1rem 0 1rem 1rem;line-height:2.5rem}.generator__output:not(:empty){background:rgba(0,0,0,.5)}.tgi__footer{position:relative;font-size:1.2rem;padding:1rem 0 2rem;-ms-flex-item-align:end;align-self:flex-end;width:100%;opacity:0;animation:opening-fadein 1s ease-in 2.5s normal 1 forwards}.footer__social-buttons{display:block;margin-bottom:1rem}.footer__social-buttons li{vertical-align:top}.footer__social-buttons li:first-child{margin:.2rem 1rem 0 0}.footer__made-with-love{color:gray}.github-corner{position:absolute;top:0;right:0;z-index:2}.github-corner svg{border:0}input[type=checkbox]{position:absolute;opacity:0;pointer-events:none}input[type=checkbox]+label{font-size:1.2rem;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-align:center;align-items:center;cursor:pointer}input[type=checkbox]+label:before{content:"";display:inline-block;width:1.4rem;height:1.4rem;border:.1rem solid #fff;margin:0 1rem 0 auto;opacity:.4;transition:opacity 80ms ease}input[type=checkbox]:checked+label:before{opacity:1;background:url(check.svg) no-repeat 50%/80%}@media only screen and (max-width:1135px){.quote__text:before{display:none}}@media only screen and (max-width:639px){.outer-wrapper{height:auto}.tgi:after{display:block;content:"";background-color:rgba(0,0,0,.5)}.tgi__generator,.tgi__header{z-index:1}.tgi__header{padding:1rem 0 0}.header__quote{display:none}.tgi__generator{padding-top:0}.generator__output{padding-left:1rem}}@media only screen and (max-width:399px){.tgi__generator{min-width:auto}}@keyframes opening-fadein{0%{opacity:0}to{opacity:1}}
/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IiIsImZpbGUiOiJhcHAuY3NzIiwic291cmNlUm9vdCI6IiJ9*/