[mod] regenerate example build

This commit is contained in:
Laurent Peuch 2016-02-09 06:08:22 +01:00
parent b890b103ea
commit c202cbbca6
4 changed files with 73 additions and 42 deletions

View File

@ -3,13 +3,14 @@
<head> <head>
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta charset="UTF-8"> <meta charset="UTF-8">
<link type="text/css" rel="stylesheet" href="../static/css/fonts.css" media="screen,projection"/>
<link type="text/css" rel="stylesheet" href="../static/css/style-page.css" media="screen,projection"/> <link type="text/css" rel="stylesheet" href="../static/css/style-page.css" media="screen,projection"/>
<link type="text/css" rel="stylesheet" href="../static/css/baguetteBox.min.css" media="screen,projection"/> <link type="text/css" rel="stylesheet" href="../static/css/baguetteBox.min.css" media="screen,projection"/>
<link type="text/css" rel="stylesheet" href="../static/css/panorama_viewer.css" media="screen,projection"/> <link type="text/css" rel="stylesheet" href="../static/css/panorama_viewer.css" media="screen,projection"/>
<!--Let browser know website is optimized for mobile--> <!--Let browser know website is optimized for mobile-->
<meta name="viewport" content="width=device-width, initial-scale=1.0"/> <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<title>my first gallery | Example gallery</title> <title>my first gallery · Example gallery</title>
</head> </head>
<body> <body>
@ -115,17 +116,19 @@
<script type="text/javascript" src="../static/js/baguetteBox.min.js" charset="utf-8"></script> <script type="text/javascript" src="../static/js/baguetteBox.min.js" charset="utf-8"></script>
<script type="text/javascript" src="../static/js/jquery.panorama_viewer.min.js" charset="utf-8"></script> <script type="text/javascript" src="../static/js/jquery.panorama_viewer.min.js" charset="utf-8"></script>
<script type="text/javascript" charset="utf-8"> <script type="text/javascript" charset="utf-8">
baguetteBox.run(".baguette", {}); $(function() {
$(".panorama").panorama_viewer({ baguetteBox.run(".baguette", {});
repeat: true, $(".panorama").panorama_viewer({
direction: "horizontal", repeat: true,
animationTime: 250, direction: "horizontal",
easing: "ease-out", animationTime: 150,
overlay: true easing: "linear",
}); overlay: true
});
});
</script> </script>
<footer> <footer>
<p>Generate using <a href="https://github.com/psycojoker/prosopopee">Prosopopée</a> · content under <a href="https://creativecommons.org/licenses/by-sa/3.0/">CC-BY-SA</a> · atom logo by <a href="https://thenounproject.com/jjjon/">Jonathan Li</a> under <a href="https://creativecommons.org/licenses/by/3.0/">CC-BY</a></p> <p>Generated using <a href="https://github.com/psycojoker/prosopopee">Prosopopée</a> · content under <a href="https://creativecommons.org/licenses/by-sa/3.0/">CC-BY-SA</a> · atom logo by <a href="https://thenounproject.com/jjjon/">Jonathan Li</a> under <a href="https://creativecommons.org/licenses/by/3.0/">CC-BY</a></p>
</footer> </footer>
</body> </body>
</html> </html>

View File

@ -2,6 +2,7 @@
<html> <html>
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<link type="text/css" rel="stylesheet" href="static/css/fonts.css" media="screen,projection"/>
<link type="text/css" rel="stylesheet" href="static/css/style.css" media="screen,projection"/> <link type="text/css" rel="stylesheet" href="static/css/style.css" media="screen,projection"/>
<!--Let browser know website is optimized for mobile--> <!--Let browser know website is optimized for mobile-->
@ -40,7 +41,7 @@
<p style="visibility: hidden">.</p> <p style="visibility: hidden">.</p>
<footer> <footer>
<p>Generate using <a href="https://github.com/psycojoker/prosopopee">Prosopopée</a> · content under <a href="https://creativecommons.org/licenses/by-sa/3.0/">CC-BY-SA</a> · atom logo by <a href="https://thenounproject.com/jjjon/">Jonathan Li</a> under <a href="https://creativecommons.org/licenses/by/3.0/">CC-BY</a></p> <p>Generated using <a href="https://github.com/psycojoker/prosopopee">Prosopopée</a> · content under <a href="https://creativecommons.org/licenses/by-sa/3.0/">CC-BY-SA</a> · atom logo by <a href="https://thenounproject.com/jjjon/">Jonathan Li</a> under <a href="https://creativecommons.org/licenses/by/3.0/">CC-BY</a></p>
</footer> </footer>
</body> </body>
</html> </html>

View File

@ -12,7 +12,7 @@ body {
} }
section { section {
margin-bottom: 64px; margin-bottom: 80px;
} }
a { a {
@ -51,7 +51,7 @@ a {
text-transform: uppercase; text-transform: uppercase;
font-size: 5.5vw; font-size: 5.5vw;
letter-spacing: 4px; letter-spacing: 4px;
font-family: sans-serif; font-family: 'montserrat', sans-serif;
margin-left: 10%; margin-left: 10%;
margin-right: 10%; margin-right: 10%;
margin-bottom: 1px; margin-bottom: 1px;
@ -61,30 +61,30 @@ a {
font-weight: normal; font-weight: normal;
font-style: italic; font-style: italic;
font-size: 2.2vw; font-size: 2.2vw;
font-family: serif; font-family: 'crimson', serif;
margin-top: 1px; margin-top: 1px;
} }
.full-picture .datetime { .full-picture .datetime {
text-transform: uppercase; text-transform: uppercase;
font-family: serif; font-family: 'crimson', serif;
letter-spacing: 2px; letter-spacing: 2px;
} }
.bordered-picture img { .bordered-picture img {
height: 80%; height: 77%;
width: 80%; width: 77%;
margin-left: 10%; margin-left: 11.5%;
margin-right: 10%; margin-right: 11.5%;
} }
.pictures-line { .pictures-line {
min-width: 80%; min-width: 77%;
width: 80%; width: 77%;
margin-left: 10%; margin-left: 11.5%;
margin-right: 10%; margin-right: 11.5%;
display: flex; display: flex;
margin-bottom: 15px; margin-bottom: 0.5em;
} }
.pictures-line .picture img { .pictures-line .picture img {
@ -93,22 +93,47 @@ a {
} }
.pictures-line .separator { .pictures-line .separator {
min-width: 15px; min-width: 0.5em;
} }
.text { .text {
text-align: center; text-align: center;
font-size: 25px; font-family: 'crimson', serif;
margin-left: 15%; font-size: 1.6em;
margin-right: 15%; line-height: 1.8em;
margin-left: 21%;
margin-right: 21%;
color: black;
}
.paragraph {
text-align: left;
font-family: 'crimson', serif;
font-size: 1em;
margin-left: 21%;
margin-right: 21%;
color: #333; color: #333;
} }
.paragraph h2 {
font-family: 'montserrat', sans-serif;
font-weight: normal;
font-size: 2.5em;
text-transform: uppercase;
color: black;
line-height: 1.4em;
}
.paragraph p {
line-height: 2em;
}
footer { footer {
margin-top: 7em; margin-top: 6em;
text-align: center; text-align: center;
position: relative; position: relative;
font-family: serif; font-family: 'crimson', serif;
font-size: 11px; font-size: 11px;
color: #555; color: #555;
background-color: #EEE; background-color: #EEE;
@ -154,7 +179,8 @@ footer {
justify-content: center; justify-content: center;
text-align: center; text-align: center;
text-transform: uppercase; text-transform: uppercase;
font-family: sans-serif; font-family: 'montserrat', sans-serif;
font-weight: bold;
} }
footer p { footer p {
@ -164,6 +190,6 @@ footer p {
footer a { footer a {
text-decoration: none; text-decoration: none;
font-weight: 600; font-weight: 600;
font-family: sans-serif; font-family: 'montserrat', sans-serif;
color: #111; color: #111;
} }

View File

@ -1,6 +1,6 @@
body { body {
color: #222; color: #222;
font-family: sans-serif; font-family: 'montserrat', sans-serif;
background-color: #FBFBFB; background-color: #FBFBFB;
margin: 0; margin: 0;
} }
@ -17,10 +17,11 @@ body {
.galleries-line { .galleries-line {
width: 100%; width: 100%;
height: 100%; height: 100%;
margin-bottom: -4px; /* YOLO */
} }
.covers-1 .gallery-square { .covers-1 .gallery-square {
width: 47%; width: 100%;
height: 100%; height: 100%;
margin: auto; margin: auto;
padding-bottom: 47%; padding-bottom: 47%;
@ -28,12 +29,12 @@ body {
} }
.covers-2 .gallery-square { .covers-2 .gallery-square {
width: 47%; width: 50%;
height: 100%; height: 100%;
float: left; margin: 0 0 0;
margin: 0 1.5% 3%;
padding-bottom: 47%; padding-bottom: 47%;
position: relative; position: relative;
display: inline-block;
} }
.covers-3 .gallery-square { .covers-3 .gallery-square {
@ -110,7 +111,7 @@ body {
color: #444; color: #444;
font-style: italic; font-style: italic;
font-weight: normal; font-weight: normal;
font-family: serif; font-family: 'crimson', serif;
margin-top: .5em; margin-top: .5em;
} }
@ -131,13 +132,13 @@ body {
font-style: italic; font-style: italic;
margin-top: 0; margin-top: 0;
margin-bottom: .7em; margin-bottom: .7em;
font-family: serif; font-family: 'crimson', serif;
font-weight: normal; font-weight: normal;
} }
.gallery-datetime { .gallery-datetime {
margin-bottom: 1em; margin-bottom: 1em;
font-family: serif; font-family: 'crimson', serif;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 2px; letter-spacing: 2px;
font-size: 11px; font-size: 11px;
@ -147,7 +148,7 @@ footer {
margin-top: 7em; margin-top: 7em;
text-align: center; text-align: center;
position: relative; position: relative;
font-family: serif; font-family: 'crimson', serif;
font-size: 11px; font-size: 11px;
color: #555; color: #555;
background-color: #EEE; background-color: #EEE;
@ -163,6 +164,6 @@ footer p {
footer a { footer a {
text-decoration: none; text-decoration: none;
font-weight: 600; font-weight: 600;
font-family: sans-serif; font-family: 'montserrat', sans-serif;
color: #111; color: #111;
} }