Commit ea839117 authored by Guillaume Dollé's avatar Guillaume Dollé
Browse files

Add first website version unrevised

parent f287f6fd
RewriteEngine On
RewriteCond %{ENV:IP2LOCATION_COUNTRY_SHORT} ^FR$
RewriteRule ^(.*)$ index_fr.html [L]
# workshop_website
HTML static page to create (fastly) a website for a workshop.
# Tree
# Install
Just copy all files in the webserver public (default often "~/public_html/") directory.
html, body, h1, form, fieldset, legend, ul, ol, li, header, table, iframe
{
margin: 0;
padding: 0;
}
body
{
/*http://codepen.io/msurguy/pen/sbIio*/
background:
radial-gradient(black 0.1%, transparent 5%) 0 0,
radial-gradient(black 0.1%, transparent 5%) 8px 8px,
radial-gradient(#424242 0.1%, transparent 7%) 0 1px,
radial-gradient(#424242 0.1%, transparent 7%) 8px 9px;
background-color:#FAFAFA;
background-size:16px 16px;
color: #111111;
/*font-family: Georgia, "Times New Roman", Times, serif;*/
/*font-family:sans-serif;*/
font-family: Helvetica,FreeSans,sans-serif;
padding: 0px;
-ms-text-size-adjust:100%;
-webkit-text-size-adjust:100%;
font-size: 16px;
font-weight:400;
font-style:normal;
color:#2E2E2E;
line-height:1;
position:relative;
cursor:auto;
}
input:invalid
{
background-color: #F0DDDD;
border-color: #e88;
-webkit-box-shadow: 0 0 5px rgba(255, 0, 0, .8);
-moz-box-shadow: 0 0 5px rbba(255, 0, 0, .8);
-o-box-shadow: 0 0 5px rbba(255, 0, 0, .8);
-ms-box-shadow: 0 0 5px rbba(255, 0, 0, .8);
box-shadow:0 0 5px rgba(255, 0, 0, .8);
}
input:required
{
border-color: #88a;
-webkit-box-shadow: 0 0 5px rgba(0, 0, 255, .5);
-moz-box-shadow: 0 0 5px rgba(0, 0, 255, .5);
-o-box-shadow: 0 0 5px rgba(0, 0, 255, .5);
-ms-box-shadow: 0 0 5px rgba(0, 0, 255, .5);
box-shadow: 0 0 5px rgba(0, 0, 255, .5);
}
/*****************************************************************************/
/* MAIN BLOCKS */
/*****************************************************************************/
header
{
display: flex;
align-items: center;
background: #0B3861;
text-align: center;
height: 80px;
/*line-height: 15px;*/
width:100%;
overflow:auto;
position: fixed;
top: 0;
margin: 0;
padding: 0;
vertical-align:middle;
/*font-family: 'Poiret One', cursive;*/
/*font-family: 'Gochi Hand', cursive;*/
font-family: 'Orbitron', sans-serif;
/*font-family: 'Tangerine', sans-serif;*/
z-index:+1;
}
#nav
{
font-family: 'Orbitron', sans-serif;
color: #009ce0;
background: #D8D8D8;
padding: 0;
height:35px;
width: 100%;
margin: 80px 0 0 0;
vertical-align:middle;
/*text-transform: uppercase;*/
/*font-family: 'Poiret One', cursive;*/
/*font-family: FreeSans,sans-serif;*/
font-size: 16px;
font-weight: bold;
text-shadow: 0 1px 1px #c0d576;
box-shadow: -1px 0.5px 2px 1px rgba(0, 0, 0, 0.7);
position: fixed;
z-index:+1;
}
#content
{
overflow:auto;
min-height: calc(100vh - 240px);
padding-top:150px;
padding-bottom: 60px; /* same as footer height*/
}
footer
{
margin-top: -60px;
min-height: 60px;
width: 100%;
clear: both;
color: #D8D8D8;
font-size: 12px;
font-style: italic;
background: #333333;
position: relative;
padding: 20px 0 10px 0;
}
/*****************************************************************************/
/* INSIDE MAIN BLOCKS */
/*****************************************************************************/
header h1
{
/*text-transform: uppercase;*/
color: #009ce0;
font-size: 22px;
vertical-align:middle;
text-shadow: 2px 2px #000000;
}
header table
{
border: 0px solid black;
width: 100%;
text-align: center;
vertical-align: center;
}
header img
{
max-height: 40px;
max-width: 150px;
height: auto;
width: auto
}
#nav li
{
list-style-type: none;
padding: 0;
margin: 0;
}
#nav ul li ul
{
background: #D8D8D8;
position: absolute;
display:none;
/*overflow: hidden;*/
}
#nav ul li:hover > ul
{
display: block;
}
/* submenu */
#nav ul li ul li a
{
box-shadow: 1px 1px 1px 0px rgba(0, 0, 0, 0.7);
}
#nav a
{
background: #D8D8D8;
text-shadow: 1px 1px #000000;
display: inline-block;
float: left;
height: 35px; /* Same as nav */
line-height: 35px; /* Same as nav */
padding: 0px 10px 0px 10px;
margin: 0 0 0 0;
vertical-align:middle;
box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1);
position:relative;
z-index:100;
}
#nav a:hover
{
box-shadow: 0px 1px 5px 2px rgba(0, 156, 224, 0.9);
}
#nav a:active
{
color:#922d1d;
opacity: 0.4;
box-shadow: 0px 2px 2px 1px rgba(1, 0, 0, 0.7);
}
#nav img
{
padding-top: 7px;
max-height:25px;
max-width: 30px;
}
/*#nav ul li ul li a:hover
{
box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.7);
}*/
footer li
{
list-style-type: none;
}
footer img
{
max-height:20px;
}
footer .logos
{
display:none;
}
a
{
color: #008fe0;
text-decoration:none;
}
a:hover
{
color: #a40000;
}
a:active
{
color:#922d1d;
}
.page
{
width: 60%;
margin: 0 0 10% 20%;
padding: 40px 20px 50px 20px;
background: #F2F2F2;
box-shadow: -1px 0.5px 5px 1px rgba(0, 0, 0, 0.7);
position: relative;
text-align: justify;
text-justify: inter-word;
}
.page ul
{
padding-left: 20px;
}
form#register
{
background: #E6E6E6;
box-shadow: -1px 2px 5px 1px rgba(0, 0, 0, 0.7);
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
width: 60%;
margin: 0 0 0 20%;
padding: 20px;
display: block;
}
form#register legend {
color: #384313;
font-size: 16px;
font-weight: bold;
padding-bottom: 10px;
text-shadow: 0 1px 1px #c0d576;
}
form#register fieldset
{
border: none;
margin-bottom: 10px;
}
form#register fieldset:last-of-type
{
margin-bottom: 0;
}
form#register label {
float: left;
font-size: 13px;
width: 110px;
}
form#register fieldset fieldset label {
background:none no-repeat left 50%;
line-height: 20px;
padding: 0 0 0 30px;
width: auto;
}
form#register label[for=visa]
{
background-image: url(visa.gif);
}
form#register label[for=amex]
{
background-image: url(amex.gif);
}
form#register label[for=mastercard]
{
background-image: url(mastercard.gif);
}
form#register fieldset fieldset label:hover
{
cursor: pointer;
}
form#register ol li
{
background: #b9cf6a;
background: rgba(255,255,255,.3);
border-color: #e3ebc3;
border-color: rgba(255,255,255,.6);
border-style: solid;
border-width: 2px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
line-height: 30px;
list-style: none;
padding: 5px 10px;
margin-bottom: 2px;
}
form#register ol ol li
{
background: none;
border: none;
float: left;
}
iframe {
display:block;
width:100%;
}
table
{
width:100%;
}
/*table img
{
max-width:100%;
height: auto;
width: 100%;
}*/
#content img
{
max-width: 100%;
}
/* vim:set sw=2: */
@media screen
and ( max-width: 640px )
{
body
{
/*background-color: red;*/
font-size: 20px;
}
#nav
{
font-size: 11px;
}
header h1
{
font-size: 20px;
/*line-height: 15px;*/
}
header img
{
height: auto;
max-height: 10px;
}
header .logos
{
display: none;
}
footer .logos
{
height: auto;
display: inline;
margin: 5px 5px 5px 5px;
}
footer img
{
display: block;
float: left;
padding-left: 20px;
}
#content
{
padding-top:110px;
}
.page
{
width: 94%;
margin: 0 0 0 0px;
padding: 5px 20px 20px 20px;
}
}
@media screen
and ( max-width: 460px )
{
header h1
{
font-size: 16px;
}
#nav
{
font-size: 9px;
}
.page
{
width: 89%;
margin: 0 0 0 0px;
padding: 5px 20px 20px 20px;
}
}
/* vim:set sw=2: */
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
version="1.1"
id="svg2"
viewBox="0 0 4.5 3"
height="600"
width="900"
inkscape:version="0.91 r13725"
sodipodi:docname="flagDE.svg">
<sodipodi:namedview
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1"
objecttolerance="10"
gridtolerance="10"
guidetolerance="10"
inkscape:pageopacity="0"
inkscape:pageshadow="2"
inkscape:window-width="958"
inkscape:window-height="1057"
id="namedview9"
showgrid="false"
fit-margin-top="0"
fit-margin-left="0"
fit-margin-right="0"
fit-margin-bottom="0"
inkscape:zoom="0.39333333"
inkscape:cx="505.08475"
inkscape:cy="300"
inkscape:window-x="0"
inkscape:window-y="21"
inkscape:window-maximized="0"
inkscape:current-layer="svg2" />
<metadata
id="metadata13">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title></dc:title>
</cc:Work>
</rdf:RDF>
</metadata>
<defs
id="defs11" />
<desc
id="desc4">Flag of Germany</desc>
<rect
x="0"
y="0"
height="3"
width="4.5"
id="black_stripe"
style="fill:#000000" />
<rect
x="0"
y="1"
height="2"
width="4.5"
id="red_stripe"
style="fill:#dd0000" />
<rect
x="0"
y="2"
height="1"
width="4.5"
id="gold_stripe"
style="fill:#ffce00" />
</svg>
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
version="1.1"
id="svg2"
height="600"
width="900"
viewBox="0 0 45 30"
inkscape:version="0.91 r13725"
sodipodi:docname="flagEN.svg">
<sodipodi:namedview
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1"
objecttolerance="10"
gridtolerance="10"
guidetolerance="10"
inkscape:pageopacity="0"
inkscape:pageshadow="2"
inkscape:window-width="958"
inkscape:window-height="1057"
id="namedview12"
showgrid="false"
borderlayer="false"
showborder="false"
inkscape:zoom="0.39333333"
inkscape:cx="501.78286"
inkscape:cy="500.78193"
inkscape:window-x="0"
inkscape:window-y="21"
inkscape:window-maximized="0"
inkscape:current-layer="svg2"
fit-margin-top="0"
fit-margin-left="0"
fit-margin-right="0"
fit-margin-bottom="0" />
<metadata
id="metadata21">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title></dc:title>
</cc:Work>
</rdf:RDF>
</metadata>
<defs
id="defs19" />
<clipPath
id="t">
<path
id="path5"
d="m 30,15 30,0 0,15 z m 0,0 0,15 -30,0 z M 30,15 0,15 0,0 Z m 0,0 0,-15 30,0 z"
inkscape:connector-curvature="0" />
</clipPath>
<path
id="path7"
d="M 0,0 0,30 45,30 45,0 Z"
inkscape:connector-curvature="0"
style="fill:#00247d" />
<path
style="color:#000000;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:medium;line-height:normal;font-family:sans-serif;text-indent:0;text-align:start;text-decoration:none;text-decoration-line:none;text-decoration-style:solid;text-decoration-color:#000000;letter-spacing:normal;word-spacing:normal;text-transform:none;direction:ltr;block-progression:tb;writing-mode:lr-tb;baseline-shift:baseline;text-anchor:start;white-space:normal;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:6;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate"
d="M 0,0 0,3.3544922 17.468262,15 0,26.645508 0,30 5.0320313,30 22.5,18.355469 39.967969,30 45,30 45,26.645508 27.531738,15 45,3.3544922 45,0 39.967969,0 22.5,11.644531 5.0320313,0 0,0 Z"
id="path9"
inkscape:connector-curvature="0" />
<path
id="path11"
clip-path="url(#t)"
d="M 0,0 60,30 M 60,0 0,30"
inkscape:connector-curvature="0"
transform="scale(0.75,1)"
style="stroke:#cf142b;stroke-width:4" />
<path
id="path13"
d="m 22.5,0 0,30 M 0,15 45,15"
inkscape:connector-curvature="0"
style="stroke:#ffffff;stroke-width:8.66025448" />
<path
id="path15"
d="m 22.5,0 0,30 M 0,15 45,15"
inkscape:connector-curvature="0"
style="stroke:#cf142b;stroke-width:5.19615221" />
</svg>