night save
This commit is contained in:
parent
f19a1288c9
commit
14652ea4b6
36
app.js
36
app.js
|
|
@ -1,8 +1,9 @@
|
|||
const app = require('express')(),
|
||||
async = require('async'),
|
||||
r = require('rethinkdb'),
|
||||
cors = require("cors"),
|
||||
log = require("color-logs")(true, true, "Dryusdan.fr");
|
||||
const express = require('express'),
|
||||
async = require('async'),
|
||||
r = require('rethinkdb'),
|
||||
cors = require("cors"),
|
||||
app = express(),
|
||||
log = require("color-logs")(true, true, "Dryusdan.fr");
|
||||
|
||||
log.info("Application started and now preparing");
|
||||
|
||||
|
|
@ -14,23 +15,31 @@ var corsOptions = {
|
|||
};
|
||||
|
||||
const config = require("./config.json");
|
||||
var Template = require("./classes/Template.class");
|
||||
|
||||
class App {
|
||||
constructor(rootPath, port, rtdbConn){
|
||||
|
||||
this.rdbConn = rtdbConn;
|
||||
app.listen(port);
|
||||
log.info("HTTP server listening on port", port);
|
||||
log.info("Application ready");
|
||||
var template = new Template(r, this.rdbConn);
|
||||
|
||||
|
||||
app.get("/", function(req, res){
|
||||
res.setHeader("Content-type", "text/plain");
|
||||
res.end("Hello world");
|
||||
})
|
||||
.get("/article/:slug", function(req, res){
|
||||
res.setHeader("Content-type", "text/plain");
|
||||
res.end("Slug : "+req.params.slug);
|
||||
})
|
||||
res.setHeader("Content-type", "text/html");
|
||||
|
||||
res.end(template.returnHTML("", "", "Accueil"));
|
||||
});
|
||||
app.get("/article/:slug", function(req, res){
|
||||
/*res.setHeader("Content-type", "text/plain");
|
||||
|
||||
res.end("Slug : "+req.params.slug);*/
|
||||
});
|
||||
app.use(express.static("./public"));
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
async.waterfall([
|
||||
|
|
@ -55,8 +64,7 @@ async.waterfall([
|
|||
process.exit(1);
|
||||
return;
|
||||
}
|
||||
|
||||
log.info("Application connected to database");
|
||||
|
||||
new App("/", config.appPort, connection)
|
||||
new App("/", config.appPort, connection);
|
||||
});
|
||||
|
|
@ -0,0 +1,19 @@
|
|||
const log = require('color-logs')(true, true, "Articles.class.js"),
|
||||
fs = require("fs");
|
||||
|
||||
|
||||
class Articles {
|
||||
constructor(r, rdbConn){
|
||||
|
||||
}
|
||||
|
||||
listHome(){
|
||||
|
||||
}
|
||||
|
||||
list(ctg){
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
module.exports = Articles;
|
||||
|
|
@ -0,0 +1,22 @@
|
|||
const log = require('color-logs')(true, true, "Categories.class.js"),
|
||||
fs = require("fs");
|
||||
|
||||
|
||||
class Categories {
|
||||
constructor(r, rtdbConn){
|
||||
this.rdbConn = rtdbConn;
|
||||
this.db = r;
|
||||
}
|
||||
|
||||
list() {
|
||||
this.db.table('categories').run(this.rdbConn, function(err, cursor){
|
||||
if(err) throw err;
|
||||
cursor.toArray(function(err, result){
|
||||
if(err) throw err;
|
||||
return result;
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
module.exports = Categories;
|
||||
|
|
@ -0,0 +1,30 @@
|
|||
const log = require('color-logs')(true, true, "Template.class.js"),
|
||||
fs = require("fs"),
|
||||
Handlebars = require('handlebars'),
|
||||
config = require('../config.json');
|
||||
|
||||
var Categories = require('../classes/Categories.class.js');
|
||||
class Template {
|
||||
constructor(r, rtdbConn){
|
||||
this.rdbConn = rtdbConn;
|
||||
this.db = r;
|
||||
}
|
||||
|
||||
returnHTML(source, data, title){
|
||||
var categories = new Categories(this.db, this.rdbConn);
|
||||
var result = categories.list(); //cette methode n'est pas appelé
|
||||
console.log(result); //Impossible de récupérer les valeurs de result;
|
||||
var tplSource = fs.readFileSync("./view/template.hbs", "utf8");
|
||||
/*var tplSource = require('../view/template.hbs');*/
|
||||
var template = Handlebars.compile(tplSource);
|
||||
var tplData = {
|
||||
"blogName": config.blogName,
|
||||
"title": title
|
||||
};
|
||||
|
||||
return template(tplData);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
module.exports = Template;
|
||||
|
|
@ -1,5 +1,6 @@
|
|||
{
|
||||
"appPort": "8888",
|
||||
"rtdbHost": "172.17.0.2",
|
||||
"rtdbPort": "28015"
|
||||
"rtdbPort": "28015",
|
||||
"blogName": "Dryusdan.fr"
|
||||
}
|
||||
|
|
|
|||
|
|
@ -0,0 +1,3 @@
|
|||
|
||||
|
||||
/*# sourceMappingURL=article.css.map */
|
||||
|
|
@ -0,0 +1,7 @@
|
|||
{
|
||||
"version": 3,
|
||||
"mappings": "",
|
||||
"sources": [],
|
||||
"names": [],
|
||||
"file": "article.css"
|
||||
}
|
||||
|
|
@ -0,0 +1,85 @@
|
|||
section {
|
||||
nav {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
.separator {
|
||||
width: 200px;
|
||||
}
|
||||
button{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: black;
|
||||
font-family: Roboto;
|
||||
font-size: 15pt;
|
||||
font-style: italic;
|
||||
font-weight: 300;
|
||||
padding: 10px;
|
||||
border-radius: 5px;
|
||||
transition: background 0.2s, color 0.2s;
|
||||
img{
|
||||
height: 25px;
|
||||
filter: brightness(0);
|
||||
transition: filter 0.2s;
|
||||
}
|
||||
}
|
||||
button.prev{
|
||||
img{
|
||||
margin-right: 10px;
|
||||
}
|
||||
}
|
||||
button.next{
|
||||
img{
|
||||
margin-left: 10px;
|
||||
}
|
||||
}
|
||||
button:hover{
|
||||
background: #111;
|
||||
color: white;
|
||||
img{
|
||||
filter: brightness(1);
|
||||
}
|
||||
}
|
||||
button:active{
|
||||
outline: none;
|
||||
}
|
||||
}
|
||||
article {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
margin-top: 40px;
|
||||
.articleTitle{
|
||||
width: 80%;
|
||||
h1 {
|
||||
font-size: 35pt;
|
||||
font-family: Roboto;
|
||||
font-weight: bold;
|
||||
margin: 0;
|
||||
word-wrap: break-word;
|
||||
hyphens: auto;
|
||||
}
|
||||
.author {
|
||||
font-style: italic;
|
||||
margin-top: 10px;
|
||||
font-size: 17pt;
|
||||
}
|
||||
}
|
||||
|
||||
.content {
|
||||
max-width: 80%;
|
||||
p {
|
||||
font-family: "Century Schoolbook L";
|
||||
font-weight: normal;
|
||||
line-height: 30pt;
|
||||
font-size: 16pt;
|
||||
word-wrap: break-word;
|
||||
hyphens: auto;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,4 @@
|
|||
.comment {
|
||||
background: #eaeaea; }
|
||||
|
||||
/*# sourceMappingURL=comments.css.map */
|
||||
|
|
@ -0,0 +1,7 @@
|
|||
{
|
||||
"version": 3,
|
||||
"mappings": "AAAA,QAAQ;EACN,UAAU,EAAE,OAAO",
|
||||
"sources": ["comments.scss"],
|
||||
"names": [],
|
||||
"file": "comments.css"
|
||||
}
|
||||
|
|
@ -0,0 +1,45 @@
|
|||
#comments{
|
||||
margin-top: 50px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
|
||||
width: 80%;
|
||||
#commentsCounter{
|
||||
font-size: 20pt;
|
||||
margin-bottom: 20px;
|
||||
margin-left: 20px;
|
||||
align-self: left;
|
||||
}
|
||||
.comment{
|
||||
background: #eaeaea;
|
||||
padding: 20px;
|
||||
border-radius: 5px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
.infos{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.userAvatar{
|
||||
padding: 10px;
|
||||
background: #ff7500;
|
||||
color: white;
|
||||
border-radius: 50%;
|
||||
margin-right: 10px;
|
||||
}
|
||||
.author{
|
||||
font-size: 15pt;
|
||||
}
|
||||
.date{
|
||||
font-size: 10pt;
|
||||
font-style: italic;
|
||||
margin-left: 10px;
|
||||
}
|
||||
}
|
||||
p{
|
||||
font-family:"Century Schoolbook L";
|
||||
font-weight: lighter;
|
||||
letter-spacing: -0.5px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,32 @@
|
|||
#disclaimer {
|
||||
margin-top: 100px;
|
||||
color: white;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center; }
|
||||
#disclaimer .titleLegend {
|
||||
font-size: 14pt;
|
||||
font-style: italic; }
|
||||
#disclaimer .separator {
|
||||
margin-top: 5px;
|
||||
width: 180px; }
|
||||
#disclaimer h2 {
|
||||
margin-top: 0;
|
||||
font-size: 30pt;
|
||||
font-family: "Century Schoolbook L";
|
||||
font-weight: normal;
|
||||
width: 700px;
|
||||
text-align: center; }
|
||||
#disclaimer button {
|
||||
background-color: transparent;
|
||||
border: 1px solid white;
|
||||
padding: 10px 30px 10px 30px;
|
||||
border-radius: 5px;
|
||||
font-family: Roboto, sans-serif;
|
||||
color: white; }
|
||||
#disclaimer button:hover {
|
||||
background: white;
|
||||
color: #203443;
|
||||
transition: color 0.2s, background 0.2s; }
|
||||
|
||||
/*# sourceMappingURL=disclaimer.css.map */
|
||||
|
|
@ -0,0 +1,7 @@
|
|||
{
|
||||
"version": 3,
|
||||
"mappings": "AAAA,WAAW;EACT,UAAU,EAAE,KAAK;EACjB,KAAK,EAAE,KAAK;EACZ,OAAO,EAAE,IAAI;EACb,cAAc,EAAE,MAAM;EACtB,WAAW,EAAE,MAAM;EAEnB,wBAAY;IACV,SAAS,EAAE,IAAI;IACf,UAAU,EAAE,MAAM;EAEpB,sBAAU;IACR,UAAU,EAAE,GAAG;IACf,KAAK,EAAE,KAAK;EAEd,cAAE;IACA,UAAU,EAAE,CAAC;IACb,SAAS,EAAE,IAAI;IACf,WAAW,EAAE,sBAAsB;IACnC,WAAW,EAAC,MAAM;IAClB,KAAK,EAAE,KAAK;IACZ,UAAU,EAAE,MAAM;EAEpB,kBAAM;IACJ,gBAAgB,EAAE,WAAW;IAC7B,MAAM,EAAE,eAAe;IACvB,OAAO,EAAE,mBAAmB;IAC5B,aAAa,EAAE,GAAG;IAClB,WAAW,EAAE,kBAAkB;IAC/B,KAAK,EAAE,KAAK;EAEd,wBAAY;IACV,UAAU,EAAE,KAAK;IACjB,KAAK,EAAE,OAAO;IAEd,UAAU,EAAE,2BAA2B",
|
||||
"sources": ["disclaimer.scss"],
|
||||
"names": [],
|
||||
"file": "disclaimer.css"
|
||||
}
|
||||
|
|
@ -0,0 +1,88 @@
|
|||
#disclaimer {
|
||||
margin-top: 100px;
|
||||
color: white;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
|
||||
.titleLegend {
|
||||
font-size: 14pt;
|
||||
font-style: italic;
|
||||
}
|
||||
.separator {
|
||||
margin-top: 5px;
|
||||
width: 180px;
|
||||
}
|
||||
h2 {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
font-size: 30pt;
|
||||
font-family: "Century Schoolbook L";
|
||||
font-weight: normal;
|
||||
width: 700px;
|
||||
text-align: center;
|
||||
}
|
||||
button {
|
||||
position: relative;
|
||||
background-color: transparent;
|
||||
border: 1px solid white;
|
||||
padding: 10px 30px 10px 30px;
|
||||
border-radius: 5px;
|
||||
font-family: Roboto, sans-serif;
|
||||
color: white;
|
||||
overflow: hidden;
|
||||
transition: color 0.3s;
|
||||
cursor: pointer;
|
||||
margin-top: 50px;
|
||||
}
|
||||
button:hover {
|
||||
color: #203443;
|
||||
|
||||
}
|
||||
button:after {
|
||||
content: "";
|
||||
background: #203443;
|
||||
position: absolute;
|
||||
width: 0px;
|
||||
height: 0px;
|
||||
top: 0;
|
||||
left: -3px;
|
||||
bottom: 0;
|
||||
right: -3px;
|
||||
margin: auto;
|
||||
transition: width 0s, height 0s, background 0s, opacity 0s;
|
||||
border-radius: 50%;
|
||||
overflow: hidden;
|
||||
opacity: 1;
|
||||
}
|
||||
button:active:after {
|
||||
width: 400px;
|
||||
height: 400px;
|
||||
background: white;
|
||||
opacity: 0;
|
||||
transition: width 0.5s, height 0.5s, background 0.5s, opacity 0.5s;
|
||||
}
|
||||
button:before {
|
||||
content: "";
|
||||
background: transparent;
|
||||
position: absolute;
|
||||
width: 0px;
|
||||
height: 0px;
|
||||
top: 0;
|
||||
left: -3px;
|
||||
bottom: 0;
|
||||
right: -3px;
|
||||
margin: auto;
|
||||
transition: width 0.1s, height 0.1s, background 0.5s;
|
||||
border-radius: 50%;
|
||||
overflow: hidden;
|
||||
opacity: 1;
|
||||
z-index: -1;
|
||||
}
|
||||
button:hover:before {
|
||||
width: 300px;
|
||||
height: 300px;
|
||||
background: #fff;
|
||||
transition: width 0.5s, height 0.5s, background 0.5s ;
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,8 @@
|
|||
.flexgrid {
|
||||
display: flex;
|
||||
flex-direction: column; }
|
||||
.flexgrid .row {
|
||||
display: flex;
|
||||
flex-direction: row; }
|
||||
|
||||
/*# sourceMappingURL=flexgrid.css.map */
|
||||
|
|
@ -0,0 +1,7 @@
|
|||
{
|
||||
"version": 3,
|
||||
"mappings": "AAAA,SAAS;EACP,OAAO,EAAE,IAAI;EACb,cAAc,EAAE,MAAM;EACtB,cAAI;IACF,OAAO,EAAE,IAAI;IACb,cAAc,EAAE,GAAG",
|
||||
"sources": ["flexgrid.scss"],
|
||||
"names": [],
|
||||
"file": "flexgrid.css"
|
||||
}
|
||||
|
|
@ -0,0 +1,18 @@
|
|||
.flexgrid{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: stretch;
|
||||
width: 100%;
|
||||
.row{
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: stretch;
|
||||
.cell {
|
||||
margin: 5px;
|
||||
flex-shrink: 1.958;
|
||||
}
|
||||
.cell.merged-2{
|
||||
flex-shrink: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,11 @@
|
|||
form {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: column; }
|
||||
form .inputGrp {
|
||||
display: flex;
|
||||
flex-direction: row; }
|
||||
form .inputGrp input, form .inputGrp textarea {
|
||||
flex-grow: 1; }
|
||||
|
||||
/*# sourceMappingURL=forms.css.map */
|
||||
|
|
@ -0,0 +1,7 @@
|
|||
{
|
||||
"version": 3,
|
||||
"mappings": "AAAA,IAAI;EACF,KAAK,EAAE,IAAI;EACX,OAAO,EAAE,IAAI;EACb,cAAc,EAAE,MAAM;EACtB,cAAS;IACP,OAAO,EAAE,IAAI;IACb,cAAc,EAAE,GAAG;IACnB,6CAAe;MACb,SAAS,EAAE,CAAC",
|
||||
"sources": ["forms.scss"],
|
||||
"names": [],
|
||||
"file": "forms.css"
|
||||
}
|
||||
|
|
@ -0,0 +1,74 @@
|
|||
form{
|
||||
width: 100%;
|
||||
margin-top: 50px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
.inputGrp{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
position: relative;
|
||||
padding-top: 10px;
|
||||
label{
|
||||
position: absolute;
|
||||
bottom: 23px;
|
||||
left: 1px;
|
||||
font-size: 14pt;
|
||||
font-weight: 300;
|
||||
transition: bottom 0.2s, font-size 0.2s;
|
||||
}
|
||||
input.focus + label{
|
||||
font-size: 11pt;
|
||||
bottom: 46px;
|
||||
}
|
||||
textarea + label{
|
||||
bottom: 58px;
|
||||
}
|
||||
textarea.focus + label{
|
||||
font-size: 11pt;
|
||||
bottom: 80px;
|
||||
}
|
||||
input, textarea{
|
||||
width: 100%;
|
||||
border: none;
|
||||
border-bottom: 3px solid #203443;
|
||||
padding-top: 5px;
|
||||
padding-bottom: 5px;
|
||||
font-size: 14pt;
|
||||
margin-bottom: 15px;
|
||||
font-family: Roboto;
|
||||
font-weight: 300;
|
||||
color: black;
|
||||
}
|
||||
button{
|
||||
width: inherit;
|
||||
align-self: right;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: black;
|
||||
font-family: Roboto;
|
||||
font-size: 15pt;
|
||||
font-style: italic;
|
||||
font-weight: 300;
|
||||
padding: 10px;
|
||||
border-radius: 5px;
|
||||
transition: background 0.2s, color 0.2s;
|
||||
img{
|
||||
height: 25px;
|
||||
filter: brightness(0);
|
||||
transition: filter 0.2s;
|
||||
margin-left: 10px;
|
||||
}
|
||||
}
|
||||
button:hover{
|
||||
background: #111;
|
||||
color: white;
|
||||
img{
|
||||
filter: brightness(1);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
|
||||
|
||||
/*# sourceMappingURL=galerie.css.map */
|
||||
|
|
@ -0,0 +1,7 @@
|
|||
{
|
||||
"version": 3,
|
||||
"mappings": "",
|
||||
"sources": [],
|
||||
"names": [],
|
||||
"file": "galerie.css"
|
||||
}
|
||||
|
|
@ -0,0 +1,53 @@
|
|||
#galerie {
|
||||
.work{
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
cursor: pointer;
|
||||
user-select: none;
|
||||
}
|
||||
.colorCover{
|
||||
width: 100%;
|
||||
height: 300px;
|
||||
overflow: hidden;
|
||||
background: #299ddc;
|
||||
}
|
||||
.workLegend {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-direction: row;
|
||||
background: rgba(0,0,0,0.5);
|
||||
padding: 10px;
|
||||
.content {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
h2{
|
||||
font-size: 20pt;
|
||||
margin: 0;
|
||||
color: white;
|
||||
}
|
||||
.tagZone{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
.tag{
|
||||
background: white;
|
||||
border-radius: 3px;
|
||||
padding: 5px;
|
||||
margin: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,503 @@
|
|||
body {
|
||||
background: black url("../img/fairyland-canyon-1632749.jpg") no-repeat top center;
|
||||
-webkit-background-size: 100%;
|
||||
background-size: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
font-family: Roboto, sans-serif;
|
||||
font-weight: 300;
|
||||
font-size: 13pt;
|
||||
margin: 0; }
|
||||
body a {
|
||||
color: inherit;
|
||||
text-decoration: none; }
|
||||
body header {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-around;
|
||||
align-items: center;
|
||||
margin-top: 50px; }
|
||||
body header #logo {
|
||||
color: #fff;
|
||||
font-family: "Century Schoolbook L";
|
||||
font-size: 23pt; }
|
||||
body header nav {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-around;
|
||||
align-items: center;
|
||||
flex-grow: 0.2; }
|
||||
body header nav .navIcon {
|
||||
width: 25px;
|
||||
filter: brightness(0.6);
|
||||
transition: filter 0.5s; }
|
||||
body header nav .navIcon:hover {
|
||||
filter: brightness(1); }
|
||||
body header nav .navItem {
|
||||
cursor: pointer;
|
||||
position: relative;
|
||||
color: #B3B3B3;
|
||||
transition: color 0.2s; }
|
||||
body header nav .navItem:hover {
|
||||
color: white; }
|
||||
body header nav .navItem.focus {
|
||||
color: white; }
|
||||
body header nav .navItem.focus .navIcon {
|
||||
filter: brightness(1); }
|
||||
|
||||
.search {
|
||||
position: absolute;
|
||||
top: -141px;
|
||||
opacity: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
width: 100%;
|
||||
height: 141px;
|
||||
background: white;
|
||||
transition: top 0.5s cubic-bezier(0.19, 1, 0.22, 1), opacity 0.5s cubic-bezier(0.19, 1, 0.22, 1); }
|
||||
.search .inputContainer {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-direction: row;
|
||||
width: 80%;
|
||||
height: 100%; }
|
||||
.search .inputContainer input {
|
||||
flex-grow: 1;
|
||||
height: 50px;
|
||||
background: transparent;
|
||||
border: none;
|
||||
font-size: 20pt;
|
||||
font-family: Roboto, sans-serif;
|
||||
font-weight: 300; }
|
||||
.search .inputContainer button {
|
||||
position: relative;
|
||||
border: none;
|
||||
padding: 40px;
|
||||
background: transparent url(../img/close.svg) no-repeat center center;
|
||||
background-size: 20px 20px;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
border-radius: 50%;
|
||||
font-family: Roboto, sans-serif;
|
||||
color: white;
|
||||
overflow: hidden;
|
||||
transition: color 0.3s;
|
||||
cursor: pointer; }
|
||||
.search .inputContainer button:after {
|
||||
content: "";
|
||||
background: #6d6d6d;
|
||||
position: absolute;
|
||||
width: 0px;
|
||||
height: 0px;
|
||||
top: 0;
|
||||
left: -3px;
|
||||
bottom: 0;
|
||||
right: -3px;
|
||||
margin: auto;
|
||||
transition: width 0s, height 0s, background 0s, opacity 0s;
|
||||
border-radius: 50%;
|
||||
overflow: hidden;
|
||||
opacity: 1; }
|
||||
.search .inputContainer button:active:after {
|
||||
width: 150px;
|
||||
height: 150px;
|
||||
background: white;
|
||||
opacity: 0;
|
||||
transition: width 0.2s, height 0.2s, background 0.2s, opacity 0.2s; }
|
||||
.search .inputContainer button:before {
|
||||
content: "";
|
||||
background: transparent;
|
||||
position: absolute;
|
||||
width: 0px;
|
||||
height: 0px;
|
||||
top: 0;
|
||||
left: -3px;
|
||||
bottom: 0;
|
||||
right: -3px;
|
||||
margin: auto;
|
||||
transition: width 0.1s, height 0.1s, background 0.5s;
|
||||
border-radius: 50%;
|
||||
overflow: hidden;
|
||||
opacity: 1;
|
||||
z-index: -1; }
|
||||
.search .inputContainer button:hover:before {
|
||||
width: 300px;
|
||||
height: 300px;
|
||||
background: #fff;
|
||||
transition: width 0.5s, height 0.5s, background 0.5s; }
|
||||
|
||||
.blackAsset {
|
||||
filter: brightness(0); }
|
||||
|
||||
.flexgrid {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: stretch;
|
||||
width: 100%; }
|
||||
.flexgrid .row {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: stretch; }
|
||||
.flexgrid .row .cell {
|
||||
margin: 5px;
|
||||
flex-shrink: 1.958; }
|
||||
.flexgrid .row .cell.merged-2 {
|
||||
flex-shrink: 1; }
|
||||
|
||||
.tile {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
background: white;
|
||||
width: 100%;
|
||||
border-radius: 3px;
|
||||
color: black;
|
||||
overflow: hidden;
|
||||
cursor: pointer;
|
||||
user-select: none;
|
||||
transition: transform 0.2s cubic-bezier(0.07, 0.7, 0.6, 0.96); }
|
||||
.tile a {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center; }
|
||||
.tile .tileCover {
|
||||
height: 200px;
|
||||
overflow: hidden;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-direction: row; }
|
||||
.tile .tileCover img {
|
||||
max-width: 100%;
|
||||
min-height: 100%; }
|
||||
.tile .tileLegend {
|
||||
margin-top: 20px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-grow: 1;
|
||||
flex-direction: row; }
|
||||
.tile .tileLegend .content {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center; }
|
||||
.tile .tileLegend .content .titleLegend {
|
||||
font-size: 12pt;
|
||||
font-style: italic; }
|
||||
.tile .tileLegend .content .separator {
|
||||
margin-top: 5px;
|
||||
width: 100px; }
|
||||
.tile .tileLegend .content h2 {
|
||||
margin-top: 0;
|
||||
font-size: 19pt;
|
||||
padding: 0 10px 0px 10px;
|
||||
font-family: "Century Schoolbook L";
|
||||
font-weight: normal;
|
||||
text-align: center; }
|
||||
|
||||
.tile:active {
|
||||
transform: scale3d(0.96, 0.96, 0.96); }
|
||||
|
||||
#disclaimer {
|
||||
margin-top: 100px;
|
||||
color: white;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center; }
|
||||
#disclaimer .titleLegend {
|
||||
font-size: 14pt;
|
||||
font-style: italic; }
|
||||
#disclaimer .separator {
|
||||
margin-top: 5px;
|
||||
width: 180px; }
|
||||
#disclaimer h2 {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
font-size: 30pt;
|
||||
font-family: "Century Schoolbook L";
|
||||
font-weight: normal;
|
||||
width: 700px;
|
||||
text-align: center; }
|
||||
#disclaimer button {
|
||||
position: relative;
|
||||
background-color: transparent;
|
||||
border: 1px solid white;
|
||||
padding: 10px 30px 10px 30px;
|
||||
border-radius: 5px;
|
||||
font-family: Roboto, sans-serif;
|
||||
color: white;
|
||||
overflow: hidden;
|
||||
transition: color 0.3s;
|
||||
cursor: pointer;
|
||||
margin-top: 50px; }
|
||||
#disclaimer button:hover {
|
||||
color: #203443; }
|
||||
#disclaimer button:after {
|
||||
content: "";
|
||||
background: #203443;
|
||||
position: absolute;
|
||||
width: 0px;
|
||||
height: 0px;
|
||||
top: 0;
|
||||
left: -3px;
|
||||
bottom: 0;
|
||||
right: -3px;
|
||||
margin: auto;
|
||||
transition: width 0s, height 0s, background 0s, opacity 0s;
|
||||
border-radius: 50%;
|
||||
overflow: hidden;
|
||||
opacity: 1; }
|
||||
#disclaimer button:active:after {
|
||||
width: 400px;
|
||||
height: 400px;
|
||||
background: white;
|
||||
opacity: 0;
|
||||
transition: width 0.5s, height 0.5s, background 0.5s, opacity 0.5s; }
|
||||
#disclaimer button:before {
|
||||
content: "";
|
||||
background: transparent;
|
||||
position: absolute;
|
||||
width: 0px;
|
||||
height: 0px;
|
||||
top: 0;
|
||||
left: -3px;
|
||||
bottom: 0;
|
||||
right: -3px;
|
||||
margin: auto;
|
||||
transition: width 0.1s, height 0.1s, background 0.5s;
|
||||
border-radius: 50%;
|
||||
overflow: hidden;
|
||||
opacity: 1;
|
||||
z-index: -1; }
|
||||
#disclaimer button:hover:before {
|
||||
width: 300px;
|
||||
height: 300px;
|
||||
background: #fff;
|
||||
transition: width 0.5s, height 0.5s, background 0.5s; }
|
||||
|
||||
main {
|
||||
background: white;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
margin-top: 50px;
|
||||
padding-top: 50px;
|
||||
padding-bottom: 50px; }
|
||||
main section {
|
||||
width: 100%;
|
||||
max-width: 900px; }
|
||||
|
||||
main.transparent {
|
||||
background: transparent;
|
||||
color: white; }
|
||||
|
||||
section nav {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: space-between; }
|
||||
section nav .separator {
|
||||
width: 200px; }
|
||||
section nav button {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: black;
|
||||
font-family: Roboto;
|
||||
font-size: 15pt;
|
||||
font-style: italic;
|
||||
font-weight: 300;
|
||||
padding: 10px;
|
||||
border-radius: 5px;
|
||||
transition: background 0.2s, color 0.2s; }
|
||||
section nav button img {
|
||||
height: 25px;
|
||||
filter: brightness(0);
|
||||
transition: filter 0.2s; }
|
||||
section nav button.prev img {
|
||||
margin-right: 10px; }
|
||||
section nav button.next img {
|
||||
margin-left: 10px; }
|
||||
section nav button:hover {
|
||||
background: #111;
|
||||
color: white; }
|
||||
section nav button:hover img {
|
||||
filter: brightness(1); }
|
||||
section nav button:active {
|
||||
outline: none; }
|
||||
section article {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
margin-top: 40px; }
|
||||
section article .articleTitle {
|
||||
width: 80%; }
|
||||
section article .articleTitle h1 {
|
||||
font-size: 35pt;
|
||||
font-family: Roboto;
|
||||
font-weight: bold;
|
||||
margin: 0;
|
||||
word-wrap: break-word;
|
||||
hyphens: auto; }
|
||||
section article .articleTitle .author {
|
||||
font-style: italic;
|
||||
margin-top: 10px;
|
||||
font-size: 17pt; }
|
||||
section article .content {
|
||||
max-width: 80%; }
|
||||
section article .content p {
|
||||
font-family: "Century Schoolbook L";
|
||||
font-weight: normal;
|
||||
line-height: 30pt;
|
||||
font-size: 16pt;
|
||||
word-wrap: break-word;
|
||||
hyphens: auto; }
|
||||
|
||||
#comments {
|
||||
margin-top: 50px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
width: 80%; }
|
||||
#comments #commentsCounter {
|
||||
font-size: 20pt;
|
||||
margin-bottom: 20px;
|
||||
margin-left: 20px;
|
||||
align-self: left; }
|
||||
#comments .comment {
|
||||
background: #eaeaea;
|
||||
padding: 20px;
|
||||
border-radius: 5px;
|
||||
display: flex;
|
||||
flex-direction: column; }
|
||||
#comments .comment .infos {
|
||||
display: flex;
|
||||
align-items: center; }
|
||||
#comments .comment .infos .userAvatar {
|
||||
padding: 10px;
|
||||
background: #ff7500;
|
||||
color: white;
|
||||
border-radius: 50%;
|
||||
margin-right: 10px; }
|
||||
#comments .comment .infos .author {
|
||||
font-size: 15pt; }
|
||||
#comments .comment .infos .date {
|
||||
font-size: 10pt;
|
||||
font-style: italic;
|
||||
margin-left: 10px; }
|
||||
#comments .comment p {
|
||||
font-family: "Century Schoolbook L";
|
||||
font-weight: lighter;
|
||||
letter-spacing: -0.5px; }
|
||||
|
||||
form {
|
||||
width: 100%;
|
||||
margin-top: 50px;
|
||||
display: flex;
|
||||
flex-direction: column; }
|
||||
form .inputGrp {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
position: relative;
|
||||
padding-top: 10px; }
|
||||
form .inputGrp label {
|
||||
position: absolute;
|
||||
bottom: 23px;
|
||||
left: 1px;
|
||||
font-size: 14pt;
|
||||
font-weight: 300;
|
||||
transition: bottom 0.2s, font-size 0.2s; }
|
||||
form .inputGrp input.focus + label {
|
||||
font-size: 11pt;
|
||||
bottom: 46px; }
|
||||
form .inputGrp textarea + label {
|
||||
bottom: 58px; }
|
||||
form .inputGrp textarea.focus + label {
|
||||
font-size: 11pt;
|
||||
bottom: 80px; }
|
||||
form .inputGrp input, form .inputGrp textarea {
|
||||
width: 100%;
|
||||
border: none;
|
||||
border-bottom: 3px solid #203443;
|
||||
padding-top: 5px;
|
||||
padding-bottom: 5px;
|
||||
font-size: 14pt;
|
||||
margin-bottom: 15px;
|
||||
font-family: Roboto;
|
||||
font-weight: 300;
|
||||
color: black; }
|
||||
form .inputGrp button {
|
||||
width: inherit;
|
||||
align-self: right;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: black;
|
||||
font-family: Roboto;
|
||||
font-size: 15pt;
|
||||
font-style: italic;
|
||||
font-weight: 300;
|
||||
padding: 10px;
|
||||
border-radius: 5px;
|
||||
transition: background 0.2s, color 0.2s; }
|
||||
form .inputGrp button img {
|
||||
height: 25px;
|
||||
filter: brightness(0);
|
||||
transition: filter 0.2s;
|
||||
margin-left: 10px; }
|
||||
form .inputGrp button:hover {
|
||||
background: #111;
|
||||
color: white; }
|
||||
form .inputGrp button:hover img {
|
||||
filter: brightness(1); }
|
||||
|
||||
#galerie .work {
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
cursor: pointer;
|
||||
user-select: none; }
|
||||
#galerie .colorCover {
|
||||
width: 100%;
|
||||
height: 300px;
|
||||
overflow: hidden;
|
||||
background: #299ddc; }
|
||||
#galerie .workLegend {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-direction: row;
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
padding: 10px; }
|
||||
#galerie .workLegend .content {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center; }
|
||||
#galerie .workLegend .content h2 {
|
||||
font-size: 20pt;
|
||||
margin: 0;
|
||||
color: white; }
|
||||
#galerie .workLegend .content .tagZone {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap; }
|
||||
#galerie .workLegend .content .tagZone .tag {
|
||||
background: white;
|
||||
border-radius: 3px;
|
||||
padding: 5px;
|
||||
margin: 5px; }
|
||||
|
||||
/*# sourceMappingURL=global.css.map */
|
||||
File diff suppressed because one or more lines are too long
|
|
@ -0,0 +1,159 @@
|
|||
body {
|
||||
background: black url("../img/fairyland-canyon-1632749.jpg") no-repeat top center;
|
||||
-webkit-background-size: 100%;
|
||||
background-size: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
font-family: Roboto, sans-serif;
|
||||
font-weight: 300;
|
||||
font-size: 13pt;
|
||||
margin: 0;
|
||||
a{
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
header {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-around;
|
||||
align-items: center;
|
||||
margin-top: 50px;
|
||||
#logo{
|
||||
color: #fff;
|
||||
font-family: "Century Schoolbook L";
|
||||
font-size: 23pt ;
|
||||
|
||||
}
|
||||
nav {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-around;
|
||||
align-items: center;
|
||||
flex-grow: 0.2;
|
||||
.navIcon{
|
||||
width: 25px;
|
||||
filter: brightness(0.6);
|
||||
transition: filter 0.5s;
|
||||
}
|
||||
.navIcon:hover{
|
||||
filter: brightness(1);
|
||||
}
|
||||
.navItem{
|
||||
cursor: pointer;
|
||||
position: relative;
|
||||
color: #B3B3B3;
|
||||
transition: color 0.2s;
|
||||
}
|
||||
.navItem:hover{
|
||||
color: white;
|
||||
}
|
||||
.navItem.focus{
|
||||
color: white;
|
||||
}
|
||||
.navItem.focus .navIcon{
|
||||
filter: brightness(1);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.search{
|
||||
position: absolute;
|
||||
top: -141px;
|
||||
opacity: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
width: 100%;
|
||||
height: 141px;
|
||||
background: white;
|
||||
transition: top 0.5s cubic-bezier(.19,1,.22,1), opacity 0.5s cubic-bezier(.19,1,.22,1);
|
||||
.inputContainer{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-direction: row;
|
||||
width: 80%;
|
||||
height: 100%;
|
||||
input{
|
||||
flex-grow: 1;
|
||||
height: 50px;
|
||||
background: transparent;
|
||||
border: none;
|
||||
font-size: 20pt;
|
||||
font-family: Roboto, sans-serif;
|
||||
font-weight: 300;
|
||||
}
|
||||
button{
|
||||
position: relative;
|
||||
border: none;
|
||||
padding: 40px;
|
||||
background: transparent url(../img/close.svg) no-repeat center center;
|
||||
background-size: 20px 20px;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
border-radius: 50%;
|
||||
font-family: Roboto, sans-serif;
|
||||
color: white;
|
||||
overflow: hidden;
|
||||
transition: color 0.3s;
|
||||
cursor: pointer;
|
||||
}
|
||||
button:after {
|
||||
content: "";
|
||||
background: #6d6d6d;
|
||||
position: absolute;
|
||||
width: 0px;
|
||||
height: 0px;
|
||||
top: 0;
|
||||
left: -3px;
|
||||
bottom: 0;
|
||||
right: -3px;
|
||||
margin: auto;
|
||||
transition: width 0s, height 0s, background 0s, opacity 0s;
|
||||
border-radius: 50%;
|
||||
overflow: hidden;
|
||||
opacity: 1;
|
||||
}
|
||||
button:active:after {
|
||||
width: 150px;
|
||||
height: 150px;
|
||||
background: white;
|
||||
opacity: 0;
|
||||
transition: width 0.2s, height 0.2s, background 0.2s, opacity 0.2s;
|
||||
}
|
||||
button:before {
|
||||
content: "";
|
||||
background: transparent;
|
||||
position: absolute;
|
||||
width: 0px;
|
||||
height: 0px;
|
||||
top: 0;
|
||||
left: -3px;
|
||||
bottom: 0;
|
||||
right: -3px;
|
||||
margin: auto;
|
||||
transition: width 0.1s, height 0.1s, background 0.5s;
|
||||
border-radius: 50%;
|
||||
overflow: hidden;
|
||||
opacity: 1;
|
||||
z-index: -1;
|
||||
}
|
||||
button:hover:before {
|
||||
width: 300px;
|
||||
height: 300px;
|
||||
background: #fff;
|
||||
transition: width 0.5s, height 0.5s, background 0.5s ;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
.blackAsset{
|
||||
filter: brightness(0);
|
||||
}
|
||||
@import "flexgrid";
|
||||
@import "tiles";
|
||||
@import "disclaimer";
|
||||
@import "main";
|
||||
@import "article";
|
||||
@import "comments";
|
||||
@import "forms";
|
||||
@import "galerie";
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
|
||||
|
||||
/*# sourceMappingURL=main.css.map */
|
||||
|
|
@ -0,0 +1,7 @@
|
|||
{
|
||||
"version": 3,
|
||||
"mappings": "",
|
||||
"sources": [],
|
||||
"names": [],
|
||||
"file": "main.css"
|
||||
}
|
||||
|
|
@ -0,0 +1,17 @@
|
|||
main{
|
||||
background: white;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
margin-top: 50px;
|
||||
padding-top: 50px;
|
||||
padding-bottom: 50px;
|
||||
section{
|
||||
width: 100%;
|
||||
max-width: 900px;
|
||||
}
|
||||
}
|
||||
main.transparent{
|
||||
background: transparent;
|
||||
color: white;
|
||||
}
|
||||
|
|
@ -0,0 +1,8 @@
|
|||
.tile {
|
||||
display: block;
|
||||
background: white;
|
||||
width: 150px;
|
||||
height: 200px;
|
||||
border-radius: 5px; }
|
||||
|
||||
/*# sourceMappingURL=tiles.css.map */
|
||||
|
|
@ -0,0 +1,7 @@
|
|||
{
|
||||
"version": 3,
|
||||
"mappings": "AAAA,KAAK;EACH,OAAO,EAAE,KAAK;EACd,UAAU,EAAE,KAAK;EACjB,KAAK,EAAE,KAAK;EACZ,MAAM,EAAE,KAAK;EACb,aAAa,EAAE,GAAG",
|
||||
"sources": ["tiles.scss"],
|
||||
"names": [],
|
||||
"file": "tiles.css"
|
||||
}
|
||||
|
|
@ -0,0 +1,65 @@
|
|||
.tile{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
background: white;
|
||||
width: 100%;
|
||||
border-radius: 3px;
|
||||
color: black;
|
||||
overflow: hidden;
|
||||
cursor: pointer;
|
||||
user-select: none;
|
||||
a{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
.tileCover{
|
||||
height: 200px;
|
||||
overflow: hidden;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-direction: row;
|
||||
img{
|
||||
max-width: 100%;
|
||||
min-height: 100%;
|
||||
}
|
||||
}
|
||||
.tileLegend{
|
||||
margin-top: 20px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-grow: 1;
|
||||
flex-direction: row;
|
||||
.content{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
.titleLegend{
|
||||
font-size: 12pt;
|
||||
font-style: italic;
|
||||
}
|
||||
.separator{
|
||||
margin-top: 5px;
|
||||
width: 100px;
|
||||
}
|
||||
h2{
|
||||
margin-top: 0;
|
||||
font-size: 19pt;
|
||||
padding: 0 10px 0px 10px;
|
||||
font-family: "Century Schoolbook L";
|
||||
font-weight:normal;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
transition: transform 0.2s cubic-bezier(.07, .7, .6, .96);
|
||||
}
|
||||
|
||||
.tile:active{
|
||||
transform: scale3d(0.96, 0.96, 0.96);
|
||||
}
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 458 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 4.0 MiB |
|
|
@ -0,0 +1,98 @@
|
|||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<!-- Created with Inkscape (http://www.inkscape.org/) -->
|
||||
|
||||
<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"
|
||||
width="21"
|
||||
height="21"
|
||||
id="svg2"
|
||||
version="1.1"
|
||||
inkscape:version="0.91 r13725"
|
||||
inkscape:export-filename="C:\Users\Rémi\Documents\GitHub\PayPoint\PayPoint\data\images\menu.png"
|
||||
inkscape:export-xdpi="5.5263319"
|
||||
inkscape:export-ydpi="5.5263319"
|
||||
sodipodi:docname="close.svg">
|
||||
<defs
|
||||
id="defs4" />
|
||||
<sodipodi:namedview
|
||||
id="base"
|
||||
pagecolor="#ffffff"
|
||||
bordercolor="#666666"
|
||||
borderopacity="1.0"
|
||||
inkscape:pageopacity="0"
|
||||
inkscape:pageshadow="2"
|
||||
inkscape:zoom="23.235413"
|
||||
inkscape:cx="7.8424347"
|
||||
inkscape:cy="10.885816"
|
||||
inkscape:document-units="px"
|
||||
inkscape:current-layer="g4155"
|
||||
showgrid="true"
|
||||
fit-margin-top="0"
|
||||
fit-margin-left="0"
|
||||
fit-margin-right="0"
|
||||
fit-margin-bottom="0"
|
||||
showguides="false"
|
||||
inkscape:guide-bbox="true"
|
||||
inkscape:window-width="1301"
|
||||
inkscape:window-height="744"
|
||||
inkscape:window-x="65"
|
||||
inkscape:window-y="24"
|
||||
inkscape:window-maximized="1"
|
||||
inkscape:snap-bbox="true"
|
||||
inkscape:bbox-paths="true"
|
||||
inkscape:bbox-nodes="true"
|
||||
inkscape:snap-bbox-edge-midpoints="true"
|
||||
inkscape:snap-bbox-midpoints="true"
|
||||
inkscape:object-paths="true"
|
||||
inkscape:snap-intersection-paths="true"
|
||||
inkscape:object-nodes="true"
|
||||
inkscape:snap-smooth-nodes="true"
|
||||
inkscape:snap-midpoints="true"
|
||||
inkscape:snap-object-midpoints="true"
|
||||
inkscape:snap-center="false"
|
||||
inkscape:snap-text-baseline="false"
|
||||
inkscape:snap-page="true"
|
||||
inkscape:snap-global="true"
|
||||
inkscape:snap-grids="true" />
|
||||
<metadata
|
||||
id="metadata7">
|
||||
<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>
|
||||
<g
|
||||
inkscape:label="Calque 1"
|
||||
inkscape:groupmode="layer"
|
||||
id="layer1"
|
||||
transform="translate(-126.57143,-692.79073)">
|
||||
<g
|
||||
id="g4155"
|
||||
transform="translate(3.6621094e-6,3.3628887)"
|
||||
style="stroke-width:27;stroke-miterlimit:4;stroke-dasharray:none">
|
||||
<path
|
||||
sodipodi:nodetypes="cc"
|
||||
style="fill:none;fill-rule:evenodd;stroke:#000000;stroke-width:1.0770483;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
|
||||
d="m 126.57143,689.42784 21,21"
|
||||
id="path3338"
|
||||
inkscape:connector-curvature="0" />
|
||||
<path
|
||||
inkscape:connector-curvature="0"
|
||||
id="path3348"
|
||||
d="m 147.57143,689.42784 -21,21"
|
||||
style="fill:none;fill-rule:evenodd;stroke:#000000;stroke-width:1.0770483;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
|
||||
sodipodi:nodetypes="cc" />
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 3.3 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 8.4 MiB |
Binary file not shown.
|
After Width: | Height: | Size: 362 B |
Binary file not shown.
|
After Width: | Height: | Size: 369 B |
Binary file not shown.
|
After Width: | Height: | Size: 1.1 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 733 B |
|
|
@ -0,0 +1,29 @@
|
|||
var app = angular.module('galerie', []);
|
||||
var tags=["Programmation", "Graphisme", "Webdesign", "UX Design"]
|
||||
|
||||
app.controller('galerie', function($scope) {
|
||||
$scope.selectedTag = -1;
|
||||
$scope.tags = tags;
|
||||
$scope.works = [
|
||||
{
|
||||
name: "Monster of the Sea",
|
||||
color: "#2d84f9",
|
||||
tags: [1]
|
||||
},
|
||||
{
|
||||
name: "Lifify",
|
||||
color: "#f92874",
|
||||
tags: [0, 2]
|
||||
},
|
||||
{
|
||||
name: "Subtitle Manager",
|
||||
color: "#f95a23",
|
||||
tags: [0, 3]
|
||||
}/*,
|
||||
{
|
||||
name: "#4",
|
||||
color: "#00f960",
|
||||
tags: [5, 6]
|
||||
}*/
|
||||
];
|
||||
});
|
||||
|
|
@ -0,0 +1,17 @@
|
|||
$(function(){
|
||||
$("input, textarea").focus(function(){
|
||||
$(this).addClass("focus");
|
||||
});
|
||||
$("input, textarea").blur(function(){
|
||||
if($(this).val() == ""){
|
||||
$(this).removeClass("focus");
|
||||
}
|
||||
});
|
||||
$("input, textarea").each(function(){
|
||||
if($(this).val() != ""){
|
||||
$(this).addClass("focus");
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
});
|
||||
File diff suppressed because one or more lines are too long
|
|
@ -0,0 +1,10 @@
|
|||
$(function () {
|
||||
$(document).on('scroll', function (e) {
|
||||
$(".search").css("opacity", 0);
|
||||
$(".search").css("top", "-141px");
|
||||
$("#openSearchTool").removeClass("focus");
|
||||
$('body').css({
|
||||
'background-position': 'top ' + parseInt(e.originalEvent.pageY * 0.5) + 'px center'
|
||||
});
|
||||
});
|
||||
});
|
||||
|
|
@ -0,0 +1,38 @@
|
|||
$(function(){
|
||||
$(window).click(function() {
|
||||
$(".search").css("opacity", 0);
|
||||
$(".search").css("top", "-141px");
|
||||
$("#openSearchTool").removeClass("focus");
|
||||
});
|
||||
$("#openSearchTool").click(function(e){
|
||||
e.stopPropagation();
|
||||
$(this).toggleClass("focus");
|
||||
if($(this).hasClass("focus")){
|
||||
$('html, body').animate({
|
||||
scrollTop: 0
|
||||
}, 500, function(){
|
||||
$(".search").css("top", 0);
|
||||
$(".search").css("opacity", 1);
|
||||
});
|
||||
|
||||
}else{
|
||||
$(".search").css("opacity", 0);
|
||||
$(".search").css("top", "-141px");
|
||||
}
|
||||
});
|
||||
$(".search button").click(function () {
|
||||
$(".search").css("opacity", 0);
|
||||
$(".search").css("top", "-141px");
|
||||
$("#openSearchTool").removeClass("focus");
|
||||
});
|
||||
$(".search").click(function(e) {
|
||||
e.stopPropagation();
|
||||
});
|
||||
|
||||
/*$(document).click(function (e) {
|
||||
console.log(!($(e.target).hasClass("search")) && ($(e.target).attr("type") != "search") && ($(e.target).attr("id") != "openSearchTool"));
|
||||
if(!($(e.target).hasClass("search")) && ($(e.target).attr("type") != "search") && ($(e.target).attr("id") != "openSearchTool")){
|
||||
|
||||
}
|
||||
});*/
|
||||
});
|
||||
|
|
@ -0,0 +1,35 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="fr">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>{{title}} - {{blogName}}</title>
|
||||
<link rel="stylesheet" href="/assets/css/global.css">
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
<div id="logo"><a href="/">{{blogName}}</a></div>
|
||||
<nav>
|
||||
{{nav}}
|
||||
<!--<div class="navItem"><a href="index.html">Accueil</a></div>
|
||||
<div class="navItem"><a href="portfolio.html">Portfolio</a></div>
|
||||
<div class="navItem">Contact</div>-->
|
||||
<div class="navItem" id="openSearchTool">
|
||||
<img class="navIcon" src="assets/img/search.png">
|
||||
</div>
|
||||
</nav>
|
||||
</header>
|
||||
<div class="search">
|
||||
<div class="inputContainer">
|
||||
<input type="search" placeholder="Rechercher...">
|
||||
<button> </button>
|
||||
</div>
|
||||
</div>
|
||||
{{content}}
|
||||
<footer>
|
||||
|
||||
</footer>
|
||||
<script src="/assets/js/jquery-2.2.0.min.js"></script>
|
||||
<script src="/assets/js/parallax.js"></script>
|
||||
<script src="/assets/js/searchInput.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue