- fix: use code instead of pre tags, - hard copy instead of iframe (github compat), - add A. Quemy tutorial links.
388 lines
6.5 KiB
CSS
388 lines
6.5 KiB
CSS
* {
|
||
padding:0px;
|
||
margin:0px;
|
||
}
|
||
|
||
html {
|
||
}
|
||
|
||
body {
|
||
color: #333333;
|
||
font-family:Arial, sans-serif;
|
||
|
||
background:url("fronde.png");
|
||
background-image:url("eo_logo_fronde.svg");
|
||
background-repeat:no-repeat;
|
||
background-position:bottom right;
|
||
}
|
||
|
||
.logo {
|
||
font-family: 'Comfortaa', cursive;
|
||
font-style:normal;
|
||
font-weight:400;
|
||
}
|
||
|
||
.logo_eo {
|
||
font-family: 'Comfortaa', cursive;
|
||
font-style:normal;
|
||
font-weight:700;
|
||
}
|
||
|
||
pre {
|
||
display:inline;
|
||
/* overflow-wrap:break-word; */
|
||
white-space: pre-wrap;
|
||
}
|
||
|
||
.command {
|
||
background-color:#333;
|
||
color:lightgrey;
|
||
padding:0.3em;
|
||
margin:0.2em;
|
||
}
|
||
|
||
#alt {
|
||
font-size:small;
|
||
float:left;
|
||
width:20%;
|
||
max-width:40ch;
|
||
height:100%;
|
||
text-align:center;
|
||
margin-right:5%;
|
||
background-color:#3771c8;
|
||
color:#aef;
|
||
position:fixed;
|
||
top:0;
|
||
left:0;
|
||
overflow-y:auto;
|
||
}
|
||
|
||
#toc {
|
||
}
|
||
|
||
|
||
#main {
|
||
float:right;
|
||
width:78%;
|
||
}
|
||
|
||
#slogan {
|
||
text-align:center;
|
||
font-size:small;
|
||
font-weight:normal;
|
||
font-style:italic;
|
||
padding:1em;
|
||
}
|
||
|
||
nav {
|
||
text-align:left;
|
||
clear:both;
|
||
}
|
||
|
||
nav p {
|
||
margin-top:2em;
|
||
margin-bottom:0em;
|
||
}
|
||
|
||
nav ul {
|
||
margin-top:0em;
|
||
}
|
||
|
||
nav#menu {
|
||
padding:0.5em;
|
||
/* height:100%; */
|
||
}
|
||
|
||
nav a {
|
||
color: white;
|
||
font-weight: normal;
|
||
text-decoration: none;
|
||
outline:none;
|
||
}
|
||
|
||
nav a:hover {
|
||
color: white;
|
||
font-weight: normal;
|
||
text-decoration: underline;
|
||
}
|
||
|
||
blockquote {
|
||
padding-left:1em;
|
||
border-left: 2px solid blue;
|
||
color:gray;
|
||
}
|
||
|
||
table.examples {
|
||
margin-right:0.5em;
|
||
}
|
||
|
||
ul.publications em {
|
||
font-weight:bold;
|
||
color:#f0f;
|
||
}
|
||
|
||
h1, h2, h3, h4, h5, h6, p, pre, blockquote, label, ul, ol, dl,
|
||
fieldset, address { margin:0.75em 0;}
|
||
|
||
h1 {
|
||
font-size:2em;
|
||
border-bottom:3px solid #3771c8;
|
||
margin-top:2em;
|
||
}
|
||
|
||
h2 {
|
||
font-size:1.39em;
|
||
border-bottom:thin solid #eee;
|
||
}
|
||
|
||
h3 {font-size:1.1em;}
|
||
|
||
h4 {font-size:1em;}
|
||
|
||
li, dd {
|
||
margin-left:2em;
|
||
}
|
||
|
||
table > caption {
|
||
font-weight:bold;
|
||
}
|
||
|
||
table {
|
||
padding:0.5em;
|
||
border:thin solid lightgray;
|
||
border-left:0.2em solid #3366CC;
|
||
}
|
||
|
||
a {
|
||
color: #3366CC;
|
||
/*background-color: #FFFFFF;*/
|
||
font-weight: normal;
|
||
text-decoration: none;
|
||
outline:none;
|
||
}
|
||
|
||
a:hover {
|
||
color: #0033CC;
|
||
/*background-color: #FFFFFF;*/
|
||
font-weight: normal;
|
||
text-decoration: underline;
|
||
}
|
||
|
||
.excerpt {
|
||
font-size: 1.3em;
|
||
background-color:#3771c8;
|
||
color:white;
|
||
padding:1em;
|
||
border: thin solid black;
|
||
display:block;
|
||
margin:1em;
|
||
}
|
||
|
||
.excerpt em {
|
||
font-weight: bold;
|
||
}
|
||
|
||
.excerpt a {
|
||
color:white;
|
||
text-decoration:underline;
|
||
}
|
||
|
||
ul#menu {
|
||
clear:both;
|
||
margin: 0;
|
||
padding: 0;
|
||
list-style: none;
|
||
/*width:650px;*/
|
||
}
|
||
|
||
ul#menu li {
|
||
margin: 0;
|
||
padding:0;
|
||
float: left;
|
||
width:16.5%;
|
||
text-align: center;
|
||
}
|
||
|
||
ul#menu li a {
|
||
display: block;
|
||
font-size: small;
|
||
color: #FFFFFF;
|
||
font-weight: bold;
|
||
text-decoration: none;
|
||
background: #5588CC;
|
||
padding: 2px 0px 2px 0px;
|
||
padding: 0em 1em 0em 1em;
|
||
}
|
||
|
||
ul#menu li a:hover { background: #3366CC; color: #FFFFFF; }
|
||
ul#menu a.selected:link { background: #3366CC; color: #FFFFFF; }
|
||
ul#menu a.selected:visited { background: #3366CC; color: #FFFFFF; }
|
||
|
||
.collapsible {
|
||
background-color: #eee;
|
||
color:#36C;
|
||
cursor: pointer;
|
||
padding: 0.2em;
|
||
/* width: 100%; */
|
||
border: thin solid #ccc;
|
||
text-align: left;
|
||
outline: none;
|
||
font-size: small;
|
||
margin-left:2em;
|
||
}
|
||
|
||
.active, .collapsible:hover {
|
||
background-color: #ddd;
|
||
color:#03C;
|
||
/* text-decoration: underline; */
|
||
}
|
||
|
||
.collapsible:after {
|
||
content: "\002B ";
|
||
font-weight: bold;
|
||
float: left;
|
||
margin-left: 5px;
|
||
}
|
||
|
||
.active:after {
|
||
content: "\2212 ";
|
||
}
|
||
|
||
.details {
|
||
padding: 0 18px;
|
||
max-height: 0;
|
||
overflow: hidden;
|
||
transition: max-height 0.2s ease-out;
|
||
background-color: #f5f5f5;
|
||
border: thin solid #ccc;
|
||
margin-left:2em;
|
||
}
|
||
|
||
figure {
|
||
text-align:center;
|
||
padding:1em;
|
||
border:thin solid lightgray;
|
||
box-shadow: 5px 10px 18px #ddd;
|
||
max-width: 60%;
|
||
margin-left:20%
|
||
}
|
||
|
||
figure img {
|
||
}
|
||
|
||
figcaption {
|
||
font-size: small;
|
||
max-width: 90%;
|
||
margin-left:5%;
|
||
}
|
||
|
||
.code {
|
||
width:95%;
|
||
height:35em;
|
||
resize:vertical;
|
||
overflow-y:scroll;
|
||
box-shadow: 5px 10px 18px #aaa;
|
||
background-color:#2b2b2b;
|
||
color: #d4cfc9;
|
||
border:thin solid black;
|
||
white-space: pre;
|
||
}
|
||
|
||
.vimCodeElement { /* white-space: pre-wrap; */ font-family: monospace; color: #d4cfc9; background-color: #2b2b2b; }
|
||
.String { color: #cc7844; background-color: #272935; padding-bottom: 1px; }
|
||
.Character { color: #da4939; }
|
||
.Number { color: #519f50; }
|
||
.LineNr { color: #6b758f; background-color: #272935; padding-bottom: 1px; }
|
||
.Statement { color: #da4939; font-weight: bold; }
|
||
.Type { color: #6d9cbe; }
|
||
.Repeat { color: #da4939; }
|
||
.Include { color: #6d9cbe; }
|
||
.Exception { color: #da4939; }
|
||
.StorageClass { color: #ffc66d; }
|
||
.cppOperator { color: #b6b3eb; }
|
||
.cppSTL { color: #f4f1ed; }
|
||
.cppBraces { color: #ffc66d; }
|
||
.cppStatement { color: #ffc66d; }
|
||
.cppEndline { color: #6b758f; }
|
||
|
||
.table {
|
||
padding:1em;
|
||
border:thin solid lightgray;
|
||
box-shadow: 5px 10px 18px #ddd;
|
||
width:60%;
|
||
max-width: 40em;
|
||
margin-left:20%
|
||
}
|
||
|
||
figure.table table {
|
||
width:100%;
|
||
}
|
||
|
||
a.comment-indicator:hover + comment { background:#ffd; position:absolute; display:block; border:1px solid black; padding:0.5em; }
|
||
a.comment-indicator { background:red; display:inline-block; border:1px solid black; width:0.5em; height:0.5em; }
|
||
comment { display:none; }
|
||
|
||
@media only screen and (max-width: 800px) {
|
||
#alt {
|
||
clear:left;
|
||
width:100%;
|
||
max-width:100%;
|
||
height:auto;
|
||
text-align:left;
|
||
position:relative;
|
||
}
|
||
|
||
#shortcuts {
|
||
margin-left:30%;
|
||
}
|
||
|
||
#toc_header {
|
||
width:100%;
|
||
display:block;
|
||
}
|
||
|
||
#toc ol {
|
||
counter-reset: LIST-ITEMS 0;
|
||
}
|
||
|
||
.toc_section:before
|
||
{
|
||
float:left;
|
||
content: counter( LIST-ITEMS ) ".";
|
||
counter-increment: LIST-ITEMS;
|
||
}
|
||
.toc_section {
|
||
display:inline-block;
|
||
vertical-align:top;
|
||
*display:list-item;
|
||
}
|
||
|
||
#main {
|
||
clear:left;
|
||
width:95%;
|
||
margin-left:2%;
|
||
margin-right:2%;
|
||
}
|
||
#main > p {
|
||
text-align:justify;
|
||
}
|
||
|
||
pre {
|
||
text-align:left;
|
||
}
|
||
|
||
figure {
|
||
max-width:80%;
|
||
margin-left:5%;
|
||
}
|
||
|
||
iframe.table {
|
||
padding:1em;
|
||
border:thin solid lightgray;
|
||
box-shadow: 5px 10px 18px #ddd;
|
||
width:80%;
|
||
max-width: 30em;
|
||
margin-left:5%
|
||
}
|
||
}
|
||
|