diff options
Diffstat (limited to 'docs/css/screen.css')
| -rw-r--r-- | docs/css/screen.css | 358 | 
1 files changed, 358 insertions, 0 deletions
| diff --git a/docs/css/screen.css b/docs/css/screen.css new file mode 100644 index 000000000..76d1461c9 --- /dev/null +++ b/docs/css/screen.css @@ -0,0 +1,358 @@ +/* **************************************************** + +  @file         screen.css +  @description  Screen stylesheet +  vim: set noet ts=4 fdm=marker fenc=utf-8: + +***************************************************** */ + +@import url("./reset.css"); + +/* @section Basic {{{ +******************************************************************************/ + +html { +  font-size: 62.5%; +  font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Roboto", sans-serif; +} + +html, body { height: 100%; } + +body { +  font-size: 150%; +  line-height: 1.4; +  color: #F9D094; +  background: #2E2A24; +  position: relative; +  behavior: url("/js/ie6/csshover.htc"); +  padding: 0 30px; +} + +p,ul,ol,dl,table,pre { margin-bottom: 1em; } +ul { margin-left: 20px; } +a { text-decoration: none; cursor: pointer; color: #ba832c; font-weight: bold; } +a:focus { outline: 1px dotted; } +a:visited {  } +a:hover, a:focus { color: #d3a459; text-decoration: none; } +a *, button * { cursor: pointer; } +hr { display: none; } +small { font-size: 90%; } +input, select, button, textarea, option { font-size: 100%; } +button, label, select, option, input[type=submit] { cursor: pointer; } +.group:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } .group {display: inline-block;} +/* Hides from IE-mac \*/ * html .group {height: 1%;} .group {display: block;} /* End hide from IE-mac */ +sup { font-size: 80%; line-height: 1; vertical-align: super; } +button::-moz-focus-inner { border: 0; padding: 1px; } +span.amp { font-weight: normal; font-style: italic; font-size: 1.2em; line-height: 0.8; } +h1,h2,h3,h4,h5,h6 { line-height: 1.1; } + +::selection { background: #745626; } +::-moz-selection { background: #745626; } + +h1, h2, h3 { +  font-size: 420%; +  margin: 0 0 0.1em; +  font-weight: 900; +  text-shadow: 1px 1px 10px rgba(0,0,0,0.25); +} + +h2 { +  font-size: 300%; +  text-align: center; +  font-weight: 800; +  color: #F9D094; +  margin-top: 0.5em; +  margin-bottom: 0.1em; +} + +h3 { +  font-size: 125%; +  text-align: center; +  font-weight: 800; +  color: #F9D094; +  margin-top: 0.5em; +  margin-bottom: 0.1em; +} + +#forkme { +  width: 149px; +  height: 149px; +  position: absolute; +  top: 0; +  right: 0; +  border: 0 +} + +h1 a, +h1 a:hover { +  color: #F9D094; +  font-weight: 900; +  text-decoration: none; +} + +#wrap { +  width: 57em; +  /*width: 760px;*/ +  max-width: 100%; +  margin: 0 auto; +  padding: 15px 0 0; +} + +#header { +  text-align: center; +  margin-bottom: 1em; +} + +#language { +  margin-bottom: 2em; +} + +pre { +  background: rgba(0,0,0,0.3); +  color: #fff; +  padding: 8px 10px; +  border-radius: 0.4em; +  -moz-border-radius: 0.4em; +  -webkit-border-radius: 0.4em; +  overflow-x: auto; +} + +pre code { +  font-family: "Monaco", "Menlo", monospace; +  font-size: 11px; +  line-height: 1.6; +} + +#selectable { +  font-size: 13px; +} + +.avatar { +  border-radius: 0.4em; +  overflow: hidden; +  margin-right: 0.5em; +  vertical-align: middle; +} + +#home, #page, .postcontent { +  font-size: 1.2em; +  min-width: 25em; +  max-width: 35em; +  margin: 0 auto; +  margin-top: 1em; +  padding-top: 1em; +  padding-bottom: 1em; +} + +#home img, #page img, .postcontent img { +  min-width: 25em; +  max-width: 35em; +} + +#home th, #page th, .postcontent th, #home td, #page td, .postcontent td { +  padding: 0.25em 0.5em; +} + +#post, #home, #page, .singlepostcontent, .posts li { +  border-top: 1px solid rgba(255,255,255,0.08); +  box-shadow: 0 -1px 0 rgba(0,0,0,0.5); +} + +#home ul, #page ul, .postcontent ul { +  list-style: inherit; +} + +#home h1, #page h1 { +  font-size: 250%; +  font-weight: 800; +  text-align: center; +  padding-bottom: 0.5em; +} + +#home h2, #page h2 { +  font-size: 175%; +  font-weight: 700; +  text-align: left; +  padding-bottom: 0.3em; +} + +#home h3, #page h3 { +  font-size: 150%; +  font-weight: 700; +  text-align: left; +  padding-bottom: 0.3em; +} + +#home code, #page code { +  font-size: 100%; +} + +#home pre code, #page pre code { +  font-size: 80%; +} + +/*}}}*/ + +/* @section Informations {{{ +******************************************************************************/ + +#informations { +  border-top: 1px solid rgba(0,0,0,0.5); +} + +#informations ul { +  margin: 0; +} + +#informations .row, #border-bottom { +  border-bottom: 1px solid rgba(0,0,0,0.5); +  border-top: 1px solid rgba(255,255,255,0.08); +  padding: 2em 20px 0; +} + +#informations .row .col-1 { +  width: 49%; +  float: left; +  padding: 0 0 1em; +} + +#informations .row .col-2 { +  width: 49%; +  float: right; +  padding: 0 0 1em; +} + +@media screen and (min-width: 700px) { +  #informations .highlight { +    margin-inline-end: 0; +    -moz-margin-end: 0; +    -webkit-margin-end: 0; +  } +} + +.button { +  text-align: center; +  margin: 1em 0 2em; +} + +#informations .button a { +  background: rgba(162,107,20,0.3); +  padding: 8px 10px 6px; +  border-radius: 0.4em; +  -moz-border-radius: 0.4em; +  -webkit-border-radius: 0.4em; +  box-shadow: 0 0 5px rgba(0,0,0,0.4); +  -moz-box-shadow: 0 0 5px rgba(0,0,0,0.4); +  -webkit-box-shadow: 0 0 5px rgba(0,0,0,0.4); +  text-decoration: none; +  font-size: larger; +} + +#informations .button a:hover { +  background: rgba(162,107,20,0.25); +} + +#informations .button-large { +  padding: 2em 0 1em; +  font-size: 120%; +} + +#informations .quote { +  text-align: center; +  color: #816f51; +  padding-bottom: 2em; +} + +#informations .quote blockquote { +  font-size: 140%; +  padding: 0 15%; +} + +#informations .quote blockquote span { +  font-size: 140%; +  line-height: 0.5; +  vertical-align: sub; +} + +#informations .quote cite { +  font-style: normal; +} + +#informations .quote cite a { +  font-weight: normal; +} + +#informations .credits, #border-no-bottom { +  border-bottom: none; +  font-size: 70%; +  text-align: center; +  padding-top: 1.8em; +  opacity: 0.5; +} + +#informations .credits p { +  margin: 0; +  padding: 0 0 0.7em; +} + +/*}}}*/ + +/* @section Mobile {{{ +******************************************************************************/ +@media screen and (max-width: 700px) { +  body { +    padding: 0px; +  } + +  h1 { +    font-size: 350%; +  } + +  h2 { +    font-size: 250%; +  } + +  #forkme { +    width: 100px; +    height: 100px; +  } + +  #informations .row .col-1 { +    width: 100%; +    padding: 0; +    margin: 0; +  } + +  #informations .row .col-2 { +    width: 100%; +    float: left; +  } +  pre code#selectable { +    width: 90%; +    margin: 0 auto; +  } +} +/*}}}*/ + +/* @section RTL {{{ +******************************************************************************/ +[dir="rtl"] ul { margin-left: 0; margin-right: 20px; } + +[dir="rtl"] pre { +  direction: ltr; +  text-align: left; +} + +[dir="rtl"] #informations .row .col-1 { +  float: right; +} + +[dir="rtl"] #informations .row .col-2 { +  float: left; +} + +@media screen and (max-width: 700px) { +  [dir="rtl"] #informations .row .col-2 { +    float: right; +  } +} | 
