From 0bb30385a44296aa9d949d6260cd77390177b41d Mon Sep 17 00:00:00 2001 From: Valentin Hervieu Date: Wed, 21 Feb 2018 20:17:37 +0100 Subject: [PATCH] Improve layout for locations --- template/index.mustache | 10 ++- www/css/style.css | 187 ++++++++++++++++++++++++---------------- www/index.html | 84 +++++++----------- www/past.html | 80 +++++++++++++++-- 4 files changed, 221 insertions(+), 140 deletions(-) diff --git a/template/index.mustache b/template/index.mustache index cf19e75..32a7fc3 100644 --- a/template/index.mustache +++ b/template/index.mustache @@ -37,9 +37,12 @@ {{#pict}} {{/pict}} - {{#location}} - - {{/location}} +
+
{{{ date }}}
+ {{#location}} + + {{/location}} +

{{{ title }}}

@@ -52,7 +55,6 @@ {{/link}} //--> -
{{{ date }}}

{{{ desc }}}

{{#link}} diff --git a/www/css/style.css b/www/css/style.css index c162769..acd0856 100644 --- a/www/css/style.css +++ b/www/css/style.css @@ -1,20 +1,24 @@ section { - padding: 50px 0; } + padding: 50px 0; +} html, body { - overflow-x: hidden; } + overflow-x: hidden; +} body { font-family: 'Roboto'; font-size: 15px; font-weight: 300; - background-color: #dfdfdf; } + background-color: #dfdfdf; +} h1 { font-size: 200%; letter-spacing: 1px; - font-weight: 400; } + font-weight: 400; +} h2 { font-size: 20px; @@ -34,41 +38,52 @@ header p { } .timeline { - position: relative; } - .timeline::before { - content: ''; - background: #c5cae9; - width: 5px; - height: 95%; - position: absolute; - left: 50%; - transform: translateX(-50%); } + position: relative; +} +.timeline::before { + content: ''; + background: #c5cae9; + width: 5px; + height: 95%; + position: absolute; + left: 50%; + transform: translateX(-50%); +} .timeline-item { width: 100%; - margin-bottom: 0px; } - .timeline-item:nth-child(even) .timeline-content { - float: right; } - .timeline-item:nth-child(even) .timeline-content .date { - right: auto; - left: 0; } - .timeline-item:nth-child(even) .timeline-content .logo { - left: initial; - right: 5px; } - .timeline-item:nth-child(even) .timeline-content::after { - content: ''; - position: absolute; - border-style: solid; - width: 0; - height: 0; - top: 30px; - left: -15px; - border-width: 10px 15px 10px 0; - border-color: transparent #f5f5f5 transparent transparent; } - .timeline-item::after { - content: ''; - display: block; - clear: both; } + margin-bottom: 0px; +} +.timeline-item:nth-child(even) .timeline-content { + float: right; +} +.timeline-item:nth-child(even) .secondary-info { + right: auto; + left: 0; +} +.timeline-item:nth-child(even) .date { + order: 0; +} +.timeline-item:nth-child(even) .timeline-content .logo { + left: initial; + right: 5px; +} +.timeline-item:nth-child(even) .timeline-content::after { + content: ''; + position: absolute; + border-style: solid; + width: 0; + height: 0; + top: 30px; + left: -15px; + border-width: 10px 15px 10px 0; + border-color: transparent #f5f5f5 transparent transparent; +} +.timeline-item::after { + content: ''; + display: block; + clear: both; +} .timeline-content { position: relative; @@ -76,17 +91,19 @@ header p { padding: 40px 30px 10px 30px; border-radius: 4px; background: #f5f5f5; - box-shadow: 0 20px 25px -15px rgba(0, 0, 0, 0.3); } - .timeline-content::after { - content: ''; - position: absolute; - border-style: solid; - width: 0; - height: 0; - top: 30px; - right: -15px; - border-width: 10px 0 10px 15px; - border-color: transparent transparent transparent #f5f5f5; } + box-shadow: 0 20px 25px -15px rgba(0, 0, 0, 0.3); +} +.timeline-content::after { + content: ''; + position: absolute; + border-style: solid; + width: 0; + height: 0; + top: 30px; + right: -15px; + border-width: 10px 0 10px 15px; + border-color: transparent transparent transparent #f5f5f5; +} .bnt-more { margin-top: 5px; @@ -98,14 +115,8 @@ header p { top: 0; left: 5px; height: 44px; - width: auto; } - -.logo-location { - position: absolute; - top: 0; - left: 5px; - height: 44px; - width: auto; } + width: auto; +} .timeline-img { width: 20px; @@ -115,7 +126,8 @@ header p { position: absolute; left: 50%; margin-top: 30px; - margin-left: -10px; } + margin-left: -10px; +} a { background: #3f51b5; @@ -130,10 +142,12 @@ a { box-shadow: 0 1px 3px -1px rgba(0, 0, 0, 0.6); } -a:hover, a:active, a:focus { - background: #32408f; - color: #ffffff; - text-decoration: none; +a:hover, +a:active, +a:focus { + background: #32408f; + color: #ffffff; + text-decoration: none; } a.title { @@ -148,45 +162,66 @@ a.title { text-decoration: underline; } -a.title:hover, a.title:active, a.title:focus { +a.title:hover, +a.title:active, +a.title:focus { background: none; color: #3f51b5; text-decoration: underline; } .timeline-card { - padding: 0 !important; } - .timeline-card p { - padding: 0 20px; } - .timeline-card a { - margin-left: 20px; } + padding: 0 !important; +} +.timeline-card p { + padding: 0 20px; +} +.timeline-card a { + margin-left: 20px; +} blockquote { margin-top: 30px; color: #757575; border-left-color: #3f51b5; - padding: 0 20px; } + padding: 0 20px; +} + +.secondary-info { + position: absolute; + top: 0; + right: 0; + display: flex; +} .date { background: #ff4081; display: inline-block; color: #ffffff; padding: 10px; - position: absolute; - top: 0; - right: 0; } + order: 1; +} + +.logo-location { + height: 44px; + width: auto; +} @media screen and (max-width: 768px) { .timeline::before { - left: 50px; } + left: 50px; + } .timeline .timeline-img { - left: 50px; } + left: 50px; + } .timeline .timeline-content { max-width: 100%; width: auto; - margin-left: 70px; } + margin-left: 70px; + } .timeline .timeline-item:nth-child(even) .timeline-content { - float: none; } + float: none; + } .timeline .timeline-item:nth-child(odd) .timeline-content::after { content: ''; position: absolute; @@ -196,7 +231,9 @@ blockquote { top: 30px; left: -15px; border-width: 10px 15px 10px 0; - border-color: transparent #f5f5f5 transparent transparent; } } + border-color: transparent #f5f5f5 transparent transparent; + } +} /* Handle horizontal menu */ diff --git a/www/index.html b/www/index.html index 4b989e9..bb49b45 100644 --- a/www/index.html +++ b/www/index.html @@ -30,51 +30,14 @@
-
-
-
- - -

Tech Workshop Blockchain

- - - -
21 février à 17h30
-

Raed Chamman (Softeam) vous permettra d'approfondir et de mettre en application les smart contracts sur Ethereum lors d'une session Workshop

- - More - -
-
- - -
-
-
- - -

Développement Mobile Côte-d'Azur

- - - -
21 février à 18h30
-

Au programme du #21: Adopter la programmation réactive par Florent Pillet, présentation de Marvel App par Gregory Biondo

- - More - -
-
- -
- +
+
1er mars à 18h
+ +

Google Hash Code @Epitech Nice

@@ -82,7 +45,6 @@ Google Hash Code @Epitech Nice //--> -
1er mars à 18h

Comme tous les ans, Google organise le Hash Code, une compétition de programmation en équipe pour résoudre un problème d’ingénierie de la vie réelle de Google

More @@ -95,7 +57,10 @@
- +
+
1er mars à 18h
+ +

Google Hashcode @Polytech Nice-Sophia

@@ -103,7 +68,6 @@ Google Hashcode @Polytech Nice-Sophia //--> -
1er mars à 18h

Hash Code is a team programming competition organized by Google for students and industry professionals across Europe, the Middle East and Africa. You pick your team and programming language, Google picks an engineering problem for you to solve

More @@ -116,6 +80,9 @@
+
+
15 mars à 12h
+

Programmation fonctionnelle

@@ -123,7 +90,6 @@

Programmation fonctionnelle

//--> -
15 mars à 12h

Introduction à la programmation fonctionnelle par Yann Esposito. Attention, Haskell au programme...

More info soon... @@ -136,6 +102,9 @@
+
+
22 mars à 17h30
+

Celebrate the Docker 5th Birthday

@@ -143,7 +112,6 @@ Celebrate the Docker 5th Birthday //--> -
22 mars à 17h30

Une nouvelle fois, venez célébrer avec nous l'anniversaire de Docker. Au programme: labs, présentations, gateaux, et du fun... :)

More @@ -156,6 +124,9 @@
+
+
28 mars à 18h30
+

Développement Mobile Côte-d'Azur

@@ -163,7 +134,6 @@

Développement Mobile Côte-d'Azur

//--> -
28 mars à 18h30

#22

More info soon... @@ -176,6 +146,9 @@
+
+
12 avril à 12h
+

Intégration continue avec GitLab-CI

@@ -183,7 +156,6 @@

Intégration continue avec GitLab-CI

//--> -
12 avril à 12h

Rémy Coutable de GitLab viendra nous présenter Gitlab-CI

More info soon... @@ -196,6 +168,9 @@
+
+
14 mai à 17h30
+

LadiesAInight - workshop Intelligence Artificielle

@@ -203,7 +178,6 @@

LadiesAInight - workshop Intelligence Artificielle

//--> -
14 mai à 17h30

WHAT06 vous convie à une soirée sur l'AI le 14 mai. Réservé en priorité aux femmes travaillant dans les milieux techniques de la Côte d'Azur, cet évènement sera animé par Julien Simon, Principal Evangelist ML/AI chez Amazon Web Services. Il fera une introduction au Deep Learning sous la forme d'un workshop.

More info soon... @@ -216,6 +190,9 @@
+
+
Du 16 au 18 mai
+

RivieraDev édition 2018

@@ -223,7 +200,6 @@ RivieraDev édition 2018 //--> -
Du 16 au 18 mai

Riviera DEV c'est 3 jours de conférences et d'ateliers sur un large panel de sujets : langages de programmation, Front-end & UX, Mobile & IoT, Big Data & Machine Learning, Containers & DevOps, Performance, Agilité ...

More @@ -236,6 +212,9 @@
+
+
Du 2 au 5 juillet
+

SophiaConf édition 2018

@@ -243,7 +222,6 @@ SophiaConf édition 2018 //--> -
Du 2 au 5 juillet

3 soirées de talks et une journée entièrement dédiée à des workshops techniques. Au programme cette année: AI, DevOps et Cloud, IoT. Les CFPs sont ouverts !

More @@ -256,6 +234,9 @@
+
+
du 7 au 9 novembre
+

SophI.A

@@ -263,7 +244,6 @@ SophI.A //--> -
du 7 au 9 novembre

Sophia accueillera un congrès international sur l’intelligence artificielle

More diff --git a/www/past.html b/www/past.html index 41d243a..60d10ee 100644 --- a/www/past.html +++ b/www/past.html @@ -30,10 +30,57 @@
+
+
+
+ +
+
21 février à 18h30
+
+ +

Développement Mobile Côte-d'Azur

+ + + +

Au programme du #21: Adopter la programmation réactive par Florent Pillet, présentation de Marvel App par Gregory Biondo

+ + More + +
+
+ +
+
+
21 février à 17h30
+
+ +

Tech Workshop Blockchain

+ + + +

Raed Chamman (Softeam) vous permettra d'approfondir et de mettre en application les smart contracts sur Ethereum lors d'une session Workshop

+ + More + +
+
+ + +
+
+
+ +
+
20 février à 12h
+

Gestion d'un projet open source

@@ -41,7 +88,6 @@ Gestion d'un projet open source //--> -
20 février à 12h

Présentation de Open Source Business Diagnostic par Jaime Arredondo (BoldAndOpen.com)

More @@ -54,6 +100,9 @@
+
+
15 février à 18h
+

Soirée blockchain

@@ -61,7 +110,6 @@ Soirée blockchain //--> -
15 février à 18h

Parce que les blockchains sont au coeur de l’actualité et suscitent beaucoup de curiosité, la communauté Open Source vous propose une double soirée TechEvent dédiée à ce thème.

More @@ -74,6 +122,9 @@
+
+
09 février de 14h à 16h
+

Garage IBM Cloud

@@ -81,7 +132,6 @@ Garage IBM Cloud //--> -
09 février de 14h à 16h

Découvrez le Garage IBM Cloud et les concepts UX à Nice Meridia au CEEI

More @@ -94,6 +144,9 @@
+
+
06 février à 18h
+

Présentation de Hazelcast

@@ -101,7 +154,6 @@ Présentation de Hazelcast //--> -
06 février à 18h

Neil Stevenson présentera la base de données Hazelcast

More @@ -114,6 +166,9 @@
+
+
06 février à 12h
+

Sécurité des applications cloud native

@@ -121,7 +176,6 @@ Sécurité des applications cloud native //--> -
06 février à 12h

Cloud, virtualisation, microservices, conteneurs… quelles sont les bonnes pratiques de sécurité ? par Serge HARTMANN de ACP Qualife

More @@ -134,6 +188,9 @@
+
+
29 janvier à 17h30
+

Sophia CNCF #1

@@ -141,7 +198,6 @@ Sophia CNCF #1 //--> -
29 janvier à 17h30

Cédric Lamorinière et David Benque vous présenterons Prometheus une solution de monitoring pour le système et les applications

More @@ -154,6 +210,9 @@
+
+
25 janvier à 12h
+

Kafka par GreenCom Network

@@ -161,7 +220,6 @@ Kafka par GreenCom Network //--> -
25 janvier à 12h

Retour d'expérience sur l'utilisation de Kafka par Sébastien Alegret de GreenCom Network

More @@ -174,6 +232,9 @@
+
+
23 janvier à 18h
+

Hashicorp User Group #2

@@ -181,7 +242,6 @@ Hashicorp User Group #2 //--> -
23 janvier à 18h

Thomas Sarboni fera une introduction à Terraform, David Calvert nous présentera Vault

More @@ -194,6 +254,9 @@
+
+
18 janvier à 18h
+

Meetup Docker / RivieraJug

@@ -201,7 +264,6 @@ Meetup Docker / RivieraJug //--> -
18 janvier à 18h

Anthony Lapenna viendra nous présenter Portainer pour gérez vos environnements Docker en toute simplicité

More