UNPKG

grunt-parker

Version:

Grunt plugin for parker, a stylesheet analysis tool.

883 lines (882 loc) 23.2 kB
a { color: #33a; } abbr { border-bottom: 0.1rem dotted #808080; cursor: help; } html { background-image: url("img/old_mathematics.png"); font: normal 62.5%/1.5 "Lato", "Helvetica Neue", Helvetica, Arial, sans-serif; -webkit-font-smoothing: antialiased; -webkit-text-size-adjust: 100%; } @media only screen and (-webkit-min-device-pixel-ratio: 1.3), only screen and (min--moz-device-pixel-ratio: 1.3), only screen and (-o-min-device-pixel-ratio: 1.3/1), only screen and (min-device-pixel-ratio: 1.3), only screen and (min-resolution: 125dpi), only screen and (min-resolution: 1.3dppx) { html { background-image: url("img/old_mathematics_@2X.png"); background-size: 200px 200px; } } body { padding: 1rem; color: #333; } article { position: relative; } header { margin: 0 auto 2rem; padding: 0 0 0.5rem; border-bottom: 0.1rem solid #999; box-shadow: 0 0.1rem 0.1rem #fff; } header:before, header:after { content: " "; display: table; } header:after { clear: both; } header h1 { font: bold 3rem "Lato", "Helvetica Neue", Helvetica, Arial, sans-serif; color: #555; text-align: center; } header h2 { font: 200 2rem "Lato", "Helvetica Neue", Helvetica, Arial, sans-serif; color: #666; text-align: center; } figure { width: 10rem; margin: 1rem auto; padding: 0.75rem 0.75rem 0.25rem; background-image: url("img/ricepaper2.png"); box-shadow: 0 0.5rem 1rem rgba(0,0,0,0.33); } @media only screen and (-webkit-min-device-pixel-ratio: 1.3), only screen and (min--moz-device-pixel-ratio: 1.3), only screen and (-o-min-device-pixel-ratio: 1.3/1), only screen and (min-device-pixel-ratio: 1.3), only screen and (min-resolution: 125dpi), only screen and (min-resolution: 1.3dppx) { figure { background-image: url("img/ricepaper2_@2X.png"); background-size: 485px 485px; } } figure img { display: block; max-width: 100%; margin: 0 auto 0.25rem; } figure figcaption { color: #444; text-align: right; } section { margin: 0 auto 3rem; } section h3 { position: relative; margin: 0 auto 0.75rem; padding: 0 0 0.25rem; border-bottom: 0.1rem solid #999; box-shadow: 0 0.1rem 0.1rem #fff; font: 200 2.5rem "Lato", "Helvetica Neue", Helvetica, Arial, sans-serif; color: #666; text-align: right; } section h3:before { position: absolute; bottom: -0.6rem; left: 0; margin: 0; font: normal 4rem "Entypo"; vertical-align: middle; } section p { margin: 0 auto 1.2rem; font: normal 1.4rem/1.5 "Lato", "Helvetica Neue", Helvetica, Arial, sans-serif; } section h4 { margin: 0 auto 1.5rem; padding: 0 0 0.25rem; border-bottom: 0.1rem dotted #999; box-shadow: 0 0.1rem 0.1rem #fff; font: 200 1.6rem "Lato", "Helvetica Neue", Helvetica, Arial, sans-serif; color: #666; text-align: right; } section dl { margin: 0 auto 1rem; } section dl dt { margin: 0 auto 0.25rem; font: bold 1.3rem "Lato", "Helvetica Neue", Helvetica, Arial, sans-serif; color: #555; } section dl dd { margin: 0 auto 1rem 2.6rem; font: 200 1.3rem/1.5 "Lato", "Helvetica Neue", Helvetica, Arial, sans-serif; color: #555; } section[id="identite"] { margin: 2rem auto 3rem; } section[id="identite"] p { margin: 0 auto 0.75rem; font: normal 1.5rem "Lato", "Helvetica Neue", Helvetica, Arial, sans-serif; } section[id="identite"] address ~ p { margin: 0.5rem 0 1rem; } section[id="identite"] address ~ p strong { display: none; } section[id="identite"] address ~ p a { text-decoration: none; } section[id="identite"] address ~ p a:before { margin: 0 0.5rem 0 0; font: normal 3rem/1.5rem "Entypo"; vertical-align: middle; } section[id="identite"] address ~ p.mail a:before { content: "\2709"; } section[id="identite"] address ~ p.site a:before { content: "\1F517"; } section[id="parcours"] h3:before { content: "\E723"; } section[id="formation"] h3:first-of-type:before { content: "\E728"; } section[id="formation"] h3:last-of-type:before { content: "\1F3C6"; } section[id="parcours"] ol, section[id="formation"] ol { list-style: inside none; } section[id="parcours"] ol li, section[id="formation"] ol li { margin: 0 auto 2rem; padding: 1rem; border: 0.1rem solid #c0c0c0; border-radius: 0.6rem; background-image: url("img/subtle_freckles.png"); } @media only screen and (-webkit-min-device-pixel-ratio: 1.3), only screen and (min--moz-device-pixel-ratio: 1.3), only screen and (-o-min-device-pixel-ratio: 1.3/1), only screen and (min-device-pixel-ratio: 1.3), only screen and (min-resolution: 125dpi), only screen and (min-resolution: 1.3dppx) { section[id="parcours"] ol li, section[id="formation"] ol li { background-image: url("img/subtle_freckles_@2X.png"); background-size: 198px 198px; } } section[id="parcours"] ol li h4:before, section[id="formation"] ol li h4:before, section[id="parcours"] ol li p:before, section[id="formation"] ol li p:before { font: normal 3rem "Entypo"; margin: 0 0.5rem 0 0; vertical-align: middle; } section[id="parcours"] ol li h4, section[id="formation"] ol li h4 { font: bold 1.4rem "Lato", "Helvetica Neue", Helvetica, Arial, sans-serif; margin: 0 auto 0.25rem; color: #444; text-align: left; border-bottom: 0; box-shadow: none; } section[id="parcours"] ol li h4 a, section[id="formation"] ol li h4 a { text-decoration: none; } section[id="parcours"] ol li h4:before, section[id="formation"] ol li h4:before { line-height: 1.6rem; vertical-align: bottom; } section[id="parcours"] ol li p, section[id="formation"] ol li p { font: normal 1.25rem/1.5 "Lato", "Helvetica Neue", Helvetica, Arial, sans-serif; margin: 0 auto 0.5rem; } section[id="parcours"] ol li p strong, section[id="formation"] ol li p strong { font-weight: bold; } section[id="parcours"] ol li p:before, section[id="formation"] ol li p:before { vertical-align: -0.1rem; } section[id="parcours"] ol li .time, section[id="formation"] ol li .time { display: inline-block; margin: 0 1rem 0 0; font: normal 1.25rem/1.5 "Lato", "Helvetica Neue", Helvetica, Arial, sans-serif; } section[id="parcours"] ol li .time:before, section[id="formation"] ol li .time:before { font: normal 3rem "Entypo"; content: "\1F4C5"; vertical-align: -0.25rem; margin: 0 0.25rem 0 0; } section[id="parcours"] ol li .time ~ p, section[id="formation"] ol li .time ~ p { display: inline-block; font: normal 1.25rem/1.5 "Lato", "Helvetica Neue", Helvetica, Arial, sans-serif; margin: 0 auto; } section[id="parcours"] ol li .time ~ p:before, section[id="formation"] ol li .time ~ p:before { font: normal 3rem "Entypo"; content: "\E728"; vertical-align: middle; margin: 0 0.25rem 0 0; } section[id="parcours"] ol:first-of-type li h4:before, section[id="formation"] ol:first-of-type li h4:before { content: "\1F4D6"; } section[id="parcours"] ol:last-of-type li h4:before, section[id="formation"] ol:last-of-type li h4:before { content: "\1F4BC"; } section[id="parcours"] ol:last-of-type li h4 + p:before, section[id="formation"] ol:last-of-type li h4 + p:before { content: "\1F464"; } section[id="competences"] h3:before { content: "\26A1"; } section[id="presentation"] dl, section[id="presentation"] p { margin: 0 auto 3rem; } section[id="presentation"] h3:nth-of-type(1):before { content: "\E720"; } section[id="presentation"] h3:nth-of-type(2):before { content: "\1F342"; } section[id="presentation"] h3:nth-of-type(3):before { content: "\1F50A"; } @media screen and (min-width: 30rem) { header h1 br { display: none; } figure { float: left; margin: 0 2rem 0.5rem 1.5rem; -webkit-transform: rotate(-2deg) translate3d(0, 0, 0); -ms-transform: rotate(-2deg) translate3d(0, 0, 0); transform: rotate(-2deg) translate3d(0, 0, 0); } section[id="identite"] { margin: 3rem auto 3rem; } section[id="identite"]:before, section[id="identite"]:after { content: " "; display: table; } section[id="identite"]:after { clear: both; } section[id="parcours"] ol li h4, section[id="formation"] ol li h4 { margin: 0 auto 0.05rem; font: bold 1.6rem "Lato", "Helvetica Neue", Helvetica, Arial, sans-serif; } } @media screen and (min-width: 40rem) { header h1 { float: left; } header h2 { float: right; margin: 0.25rem 0 0; font: 200 2.25rem "Lato", "Helvetica Neue", Helvetica, Arial, sans-serif; } figure { width: 15rem; margin: -2.5rem 3rem 0.5rem 1.5rem; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; -webkit-transform: rotate(-3deg) translate3d(0, 0, 0); -ms-transform: rotate(-3deg) translate3d(0, 0, 0); transform: rotate(-3deg) translate3d(0, 0, 0); } section h3 { padding-left: 2.75rem; text-align: left; } section h3:before { bottom: -0.35rem; font-size: 4rem; } section h4 { text-align: left; } } @media screen and (min-width: 48rem) { article { -webkit-column-count: 2; -moz-column-count: 2; column-count: 2; -webkit-column-gap: 3%; -moz-column-gap: 3%; column-gap: 3%; -webkit-column-width: 46%; -moz-column-width: 46%; column-width: 46%; } header { -webkit-column-span: all; -moz-column-span: all; column-span: all; } section h4 { text-align: right; } section[id="identite"] { -webkit-column-span: all; -moz-column-span: all; column-span: all; } section[id="competences"] { -moz-break-before: column; -webkit-column-break-before: always; } } @media screen and (min-width: 60rem) { html { background: #110416; background-image: url("img/dark_wood.png"); } article { width: 90%; margin: 3rem auto; padding: 2rem; background: #fff; background-image: url("img/old_mathematics.png"); box-shadow: 0 5px 20px rgba(0,0,0,0.5); } header h2 { margin-right: 17.5rem; } figure { position: absolute; width: 20rem; float: none; top: -0.5rem; right: -1.5rem; margin: 0; z-index: 150; -webkit-transform: rotate(5deg) translate3d(0, 0, 0); -ms-transform: rotate(5deg) translate3d(0, 0, 0); transform: rotate(5deg) translate3d(0, 0, 0); } } @media screen and (min-width: 80rem) { article { max-width: 115rem; margin: 0 auto; -webkit-column-count: auto; -moz-column-count: auto; column-count: auto; -webkit-column-gap: normal; -moz-column-gap: normal; column-gap: normal; -webkit-column-width: auto; -moz-column-width: auto; column-width: auto; background: transparent; box-shadow: none; } article:before, article:after { content: " "; display: table; } article:after { clear: both; } figure { position: absolute; top: 1rem; right: -1.5rem; z-index: 100; -webkit-transform: rotate(-2deg) translate3d(0, 0, 0); -ms-transform: rotate(-2deg) translate3d(0, 0, 0); transform: rotate(-2deg) translate3d(0, 0, 0); -webkit-transition: all 0.15s ease-in-out; transition: all 0.15s ease-in-out; } figure:hover { -webkit-transform: rotate(0deg) translate3d(0, 0, 0); -ms-transform: rotate(0deg) translate3d(0, 0, 0); transform: rotate(0deg) translate3d(0, 0, 0); } header { position: absolute; width: 50rem; top: 1rem; left: 0; margin: 0; z-index: 10; box-shadow: none; border: 0; } header:before, header:after { content: " "; display: table; } header:after { clear: both; } header h1 { float: none; margin: 0 auto; border-bottom: 0.1rem solid #999; font: bold 3.5rem "Lato", "Helvetica Neue", Helvetica, Arial, sans-serif; color: #ddd; text-align: left; } header h2 { float: none; margin-right: 0; font: normal 2.75rem "Lato", "Helvetica Neue", Helvetica, Arial, sans-serif; color: #c0c0c0; text-align: right; } section { position: absolute; border: 0; margin: 0; -webkit-transition: all 0.1s ease-in; transition: all 0.1s ease-in; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; } section:before, section:after { content: " "; display: table; } section:after { clear: both; } section h3 { box-shadow: none; color: #c0c0c0; } section h4 { box-shadow: none; color: #ccc; } section ol li, section dl, section h3 + p { padding: 1rem; background: #fff; background-image: url("img/subtle_freckles.png"); border: 0; border-radius: 0; box-shadow: 0 0 0.5rem rgba(0,0,0,0.5); -webkit-transition: all 0.15s ease-in-out; transition: all 0.15s ease-in-out; } section ol li:nth-of-type(1 ), section dl:nth-of-type(1 ), section h3 + p:nth-of-type(1 ) { -webkit-transform: rotate(2deg) translate3d(0, 0, 0); -ms-transform: rotate(2deg) translate3d(0, 0, 0); transform: rotate(2deg) translate3d(0, 0, 0); } section ol li:nth-of-type(2 ), section dl:nth-of-type(2 ), section h3 + p:nth-of-type(2 ) { -webkit-transform: rotate(-1deg) translate3d(0, 0, 0); -ms-transform: rotate(-1deg) translate3d(0, 0, 0); transform: rotate(-1deg) translate3d(0, 0, 0); } section ol li:nth-of-type(3 ), section dl:nth-of-type(3 ), section h3 + p:nth-of-type(3 ) { -webkit-transform: rotate(1deg) translate3d(0, 0, 0); -ms-transform: rotate(1deg) translate3d(0, 0, 0); transform: rotate(1deg) translate3d(0, 0, 0); } section ol li:nth-of-type(4 ), section dl:nth-of-type(4 ), section h3 + p:nth-of-type(4 ) { -webkit-transform: rotate(-2deg) translate3d(0, 0, 0); -ms-transform: rotate(-2deg) translate3d(0, 0, 0); transform: rotate(-2deg) translate3d(0, 0, 0); } section ol li:nth-of-type(5 ), section dl:nth-of-type(5 ), section h3 + p:nth-of-type(5 ) { -webkit-transform: rotate(3deg) translate3d(0, 0, 0); -ms-transform: rotate(3deg) translate3d(0, 0, 0); transform: rotate(3deg) translate3d(0, 0, 0); } section ol li:nth-of-type(6 ), section dl:nth-of-type(6 ), section h3 + p:nth-of-type(6 ) { -webkit-transform: rotate(-1deg) translate3d(0, 0, 0); -ms-transform: rotate(-1deg) translate3d(0, 0, 0); transform: rotate(-1deg) translate3d(0, 0, 0); } section ol li:nth-of-type(7 ), section dl:nth-of-type(7 ), section h3 + p:nth-of-type(7 ) { -webkit-transform: rotate(2deg) translate3d(0, 0, 0); -ms-transform: rotate(2deg) translate3d(0, 0, 0); transform: rotate(2deg) translate3d(0, 0, 0); } section ol li:nth-of-type(8 ), section dl:nth-of-type(8 ), section h3 + p:nth-of-type(8 ) { -webkit-transform: rotate(-3deg) translate3d(0, 0, 0); -ms-transform: rotate(-3deg) translate3d(0, 0, 0); transform: rotate(-3deg) translate3d(0, 0, 0); } section ol li:nth-of-type(9 ), section dl:nth-of-type(9 ), section h3 + p:nth-of-type(9 ) { -webkit-transform: rotate(1deg) translate3d(0, 0, 0); -ms-transform: rotate(1deg) translate3d(0, 0, 0); transform: rotate(1deg) translate3d(0, 0, 0); } section ol li:hover, section dl:hover, section h3 + p:hover { -webkit-transform: rotate(0deg) translate3d(0, 0, 0); -ms-transform: rotate(0deg) translate3d(0, 0, 0); transform: rotate(0deg) translate3d(0, 0, 0); } section[id="identite"] { width: 50rem; top: 5.5rem; left: 0; z-index: 50; } section[id="identite"] p { color: #c0c0c0; } section[id="identite"] address ~ p { display: inline; } section[id="identite"] address ~ p a { color: #4d4dca; } section[id="identite"] address + p { margin-right: 1.5rem; } section[id="parcours"] ol li, section[id="formation"] ol li { border-radius: 0; } section[id="parcours"] ol li + li, section[id="formation"] ol li + li { margin-top: -2rem; } section[id="formation"] { width: 22%; top: 18rem; left: 0; } section[id="parcours"] { width: 22%; left: 24%; top: 18rem; margin: 0 auto 2.5rem; z-index: 60; } section[id="competences"] { width: 26%; left: 48%; top: 18rem; z-index: 70; } section[id="presentation"] { width: 24%; left: 76%; top: 26rem; z-index: 80; } } @media print { abbr { border-bottom: 0; } html { font: normal 8.5pt/1.25 "Lato", "Helvetica Neue", Helvetica, Arial, sans-serif; } header { margin: 0 auto 0; padding: 0; box-shadow: none; border-bottom: 0; } header h1 { float: none; border-bottom: 0.1rem solid #999; font: bold 3rem/1 "Lato", "Helvetica Neue", Helvetica, Arial, sans-serif; color: #666; text-align: left; } header h1 br { display: none; } header h2 { float: none; margin: 0 0.25rem 0 0; font: 200 2rem/1.25 "Lato", "Helvetica Neue", Helvetica, Arial, sans-serif; color: #666; text-align: right; } figure { display: none; } section { page-break-inside: avoid; margin: 0 auto 2rem; } section h3 { margin: 0.5rem auto 1.5rem; border-bottom: 0.1rem dotted #999; box-shadow: none; font: bold 1.5rem "Lato", "Helvetica Neue", Helvetica, Arial, sans-serif; color: #666; } section h3:before { margin: 0 0.5rem 0 0; font: normal 3rem "Entypo"; vertical-align: middle; } section p { margin: 0 auto 0.6rem; font: normal 1.1rem/1.5 "Lato", "Helvetica Neue", Helvetica, Arial, sans-serif; } section blockquote { position: relative; margin: 0 auto 1.2rem; padding: 2rem; border: 0.1rem dashed #c0c0c0; border-radius: 6px; box-shadow: 0 0 2rem #c0c0c0; background: #fff url("subtle_freckles.png") top left repeat; } section blockquote:before { content: ""; position: absolute; bottom: 1rem; right: 1rem; z-index: 10; font: normal 15rem "Entypo"; color: #ccc; } section blockquote p { position: relative; z-index: 11; } section h4 { margin: 0 auto 1rem; padding: 0; border-bottom: 0; box-shadow: none; font: 200 1.3rem "Lato", "Helvetica Neue", Helvetica, Arial, sans-serif; color: #444; text-align: left; } section dl { margin: 0 auto 1rem; } section dl dt { float: left; margin: 0 0.1rem 0.25rem 0; font: normal 1.1rem "Lato", "Helvetica Neue", Helvetica, Arial, sans-serif; color: #333; } section dl dd { margin: 0 0 1rem; font: normal 1.1rem/1.5 "Lato", "Helvetica Neue", Helvetica, Arial, sans-serif; color: #555; } section dl dd:after { content: ""; display: table; clear: both; } section[id="identite"] { margin: 2rem 0; } section[id="identite"] p { font: normal 1.1rem/1 "Lato", "Helvetica Neue", Helvetica, Arial, sans-serif; margin: 0 auto 0.6rem; } section[id="identite"] address ~ p { display: inline-block; margin: 0.5rem 3rem 0 0; font: normal 1rem/1 "Lato", "Helvetica Neue", Helvetica, Arial, sans-serif; } section[id="identite"] address ~ p strong { display: none; } section[id="identite"] address ~ p a { color: #333; } section[id="identite"] address ~ p a:before { margin: 0 0.3rem 0 0; font: normal 2rem "Entypo"; vertical-align: top; } section[id="identite"] address ~ p.mail a:before { content: "\2709"; } section[id="identite"] address ~ p.site a:before { content: "\2709"; } section[id="parcours"] ol, section[id="formation"] ol { list-style: inside none; } section[id="parcours"] ol li, section[id="formation"] ol li { margin: 0 auto 1rem 1rem; padding: 0; border: 0; border-radius: 0; background: transparent; } section[id="parcours"] ol li h4, section[id="formation"] ol li h4 { margin: 0 auto; border-bottom: 0; box-shadow: none; font: bold 1.4rem/1 "Lato", "Helvetica Neue", Helvetica, Arial, sans-serif; color: #333; text-align: left; } section[id="parcours"] ol li h4 a, section[id="formation"] ol li h4 a { font: bold 1.4rem "Lato", "Helvetica Neue", Helvetica, Arial, sans-serif; color: #444; } section[id="parcours"] ol li p, section[id="formation"] ol li p { display: inline-block; margin: 0 0.5rem 0 0; font: normal 1.2rem/1.25 "Lato", "Helvetica Neue", Helvetica, Arial, sans-serif; color: #666; } section[id="parcours"] ol li p strong, section[id="formation"] ol li p strong { margin: 0 0.5rem 0 0; font-weight: bold; } section[id="parcours"] ol li p br, section[id="formation"] ol li p br { display: none; line-height: 0; } section[id="parcours"] ol li p:first-of-type, section[id="formation"] ol li p:first-of-type { margin-left: 2.5rem; } section[id="parcours"] ol li .time, section[id="formation"] ol li .time { display: inline-block; margin: 0 0.5rem 0 0; font: normal 1.2rem/1.25 "Lato", "Helvetica Neue", Helvetica, Arial, sans-serif; color: #666; } section[id="parcours"] ol li .time:before, section[id="formation"] ol li .time:before { content: "\1F4C5"; margin: 0 0.5rem 0 0; font: normal 2.4rem "Entypo"; vertical-align: baseline; } section[id="parcours"] ol li .time ~ p, section[id="formation"] ol li .time ~ p { display: inline-block; font: normal 1.2rem/1.25 "Lato", "Helvetica Neue", Helvetica, Arial, sans-serif; color: #666; } section[id="parcours"] ol li .time ~ p:before, section[id="formation"] ol li .time ~ p:before { content: "\E728"; margin: 0 0.25rem 0 0; font: normal 2rem "Entypo"; vertical-align: baseline; } section[id="parcours"] ol:first-of-type li h4:before, section[id="formation"] ol:first-of-type li h4:before { content: "\1F4D6"; margin: 0 0.5rem 0 0; font: normal 3.5rem "Entypo"; vertical-align: middle; } section[id="parcours"] ol:last-of-type li h4:before, section[id="formation"] ol:last-of-type li h4:before { content: "\1F4BC"; margin: 0 0.5rem 0 0; font: normal 3.5rem "Entypo"; vertical-align: middle; } section[id="parcours"] ol:last-of-type li h4 + p:before, section[id="formation"] ol:last-of-type li h4 + p:before { content: "\1F464"; margin: 0 0.5rem 0 0; font: normal 2.75rem "Entypo"; vertical-align: -0.25rem; } section[id="parcours"] h3:before { content: "\E723"; } section[id="parcours"] ol li p { display: block; } section[id="parcours"] ol li .time { margin-left: 2.5rem; } section[id="parcours"] ol li:last-of-type p:nth-child(3 ) { display: none; } section[id="formation"] h3:first-of-type:before { content: "\E728"; } section[id="formation"] h3:last-of-type { display: none; } section[id="formation"] ol:first-of-type li:nth-child(2 ) { display: none; } section[id="formation"] ol:last-of-type { display: none; } section[id="competences"] h3:before { content: "\26A1"; } section[id="presentation"] h3 { margin-top: 2rem; } section[id="presentation"] h3:nth-of-type(1 ):before { content: "\E720"; } section[id="presentation"] h3:nth-of-type(2 ):before { content: "\1F342"; } section[id="presentation"] h3:nth-of-type(3 ):before { content: "\1F50A"; } }