[www-doc] [Git][VideoLAN.org/websites][master] vdd17: update design
Jean-Baptiste Kempf
gitlab at videolan.org
Thu Sep 7 18:25:37 CEST 2017
Jean-Baptiste Kempf pushed to branch master at VideoLAN organization / websites
Commits:
2130e1f0 by David Loiret at 2017-09-07T18:25:27+02:00
vdd17: update design
Signed-off-by: Jean-Baptiste Kempf <jb at videolan.org>
- - - - -
2 changed files:
- www.videolan.org/videolan/events/vdd17/index.php
- www.videolan.org/videolan/events/vdd17/style.css
Changes:
=====================================
www.videolan.org/videolan/events/vdd17/index.php
=====================================
--- a/www.videolan.org/videolan/events/vdd17/index.php
+++ b/www.videolan.org/videolan/events/vdd17/index.php
@@ -34,6 +34,7 @@
<div class="row">
<div class="col-lg-10 col-lg-offset-1 text-center">
<h2 class="uppercase">About VideoLAN Dev Days 2017</h2>
+ <hr class="spacer">
<p>The <a href="/videolan/">VideoLAN non-profit organisation</a> is happy to
invite you to the multimedia open-source event of the summer!</p>
<p>For its <b>ninth edition</b>, people from the VideoLAN and open source multimedia communities will meet in <strong>Paris</strong>
@@ -61,203 +62,170 @@
<div class="row">
<div class="text-center">
<h2 class="uppercase">Schedule</h2>
+ <hr class="spacer">
</div>
<div class="col-lg-10 col-lg-offset-1">
<!-- Nav tabs -->
<ul class="nav nav-tabs" role="tablist">
- <li role="presentation" class="active"><a href="#friday" aria-controls="friday" role="tab" data-toggle="tab">Friday 22</a></li>
- <li role="presentation"><a href="#saturday" aria-controls="saturday" role="tab" data-toggle="tab">Saturday 23</a></li>
+ <li role="presentation"><a href="#friday" aria-controls="friday" role="tab" data-toggle="tab">Friday 22</a></li>
+ <li role="presentation" class="active"><a href="#saturday" aria-controls="saturday" role="tab" data-toggle="tab">Saturday 23</a></li>
<li role="presentation"><a href="#sunday" aria-controls="sunday" role="tab" data-toggle="tab">Sunday 24</a></li>
</ul>
<!-- Tab panes -->
<div class="tab-content">
- <div role="tabpanel" class="tab-pane active fade in" id="friday">
+ <div role="tabpanel" class="tab-pane fade" id="friday">
<div class="event">
- <div class="event-inner">
- <div class="event-time">
- 09:30 - 18:30
- </div>
- <div class="event-description">
- <h3>Community Bonding Day</h3>
- <p>This year we'll do a <b>tbd...</b>!<br/>
- The VideoLAN organization will pay for the entrance tickets, or whatever costs associated with the event.<br/></p>
- </div>
+ <h4 class="event-time">09:30 - 18:30</h4>
+ <div class="event-description">
+ <h3>Community Bonding Day</h3>
+ <p>This year we'll do a <b>tbd...</b>!<br/>
+ The VideoLAN organization will pay for the entrance tickets, or whatever costs associated with the event.<br/></p>
</div>
</div>
<div class="event">
- <div class="event-inner">
- <div class="event-time">
- 19:00
- </div>
- <div class="event-description">
- <h3>Evening reception</h3>
- <p>On <strong>Friday at 19h00</strong>, people are welcome to come and
- share a few good drinks, with all attendees, somewhere near the Hotel.</p>
- </div>
+ <h4 class="event-time">19:00</h4>
+ <div class="event-description">
+ <h3>Evening reception</h3>
+ <p>On <strong>Friday at 19h00</strong>, people are welcome to come and
+ share a few good drinks, with all attendees, somewhere near the Hotel.</p>
</div>
</div>
</div>
- <div role="tabpanel" class="tab-pane fade" id="saturday">
- <div class="event">
- <div class="event-inner">
- <div class="event-time">
- 08:45 - 09:15
- </div>
- <div class="event-description">
- <h3>Welcome & Breakfast</h3>
- </div>
+ <div role="tabpanel" class="tab-pane fade active in" id="saturday">
+ <div class="event event-bg">
+ <h4 class="event-time">
+ 08:45 - 09:15
+ </h4>
+ <div class="event-description">
+ <h3>Welcome & Breakfast</h3>
</div>
</div>
<div class="event">
- <div class="event-inner">
- <div class="event-time">
- 09:15 - 09:45
- </div>
- <div class="event-description">
- <h3>VLC 3.0</h3>
- <p>Jean-Baptiste Kempf, VideoLAN</p>
- </div>
+ <h4 class="event-time">
+ 09:15 - 09:45
+ </h4>
+ <p class="event-author">Jean-Baptiste Kempf, VideoLAN</p>
+ <div class="event-description">
+ <h3>VLC 3.0</h3>
</div>
</div>
<div class="event">
- <div class="event-inner">
- <div class="event-time">
- 09:45 - 10:20
- </div>
- <div class="event-description">
- <h3>A new Opus Encoder</h3>
- <p>Rostislav Pehlivanov, FFmpeg</p>
- </div>
+ <h4 class="event-time">
+ 09:45 - 10:20
+ </h4>
+ <p class="event-author">Rostislav Pehlivanov, FFmpeg</p>
+ <div class="event-description">
+ <h3>A new Opus Encoder</h3>
</div>
</div>
<div class="event">
- <div class="event-inner">
- <div class="event-time">
- 10:40 - 11:15
- </div>
- <div class="event-description">
- <h3>MKV IETF Update</h3>
- <p>Steve Lhomme, Matroska</p>
- </div>
+ <h4 class="event-time">
+ 10:40 - 11:15
+ </h4>
+ <p class="event-author">Steve Lhomme, Matroska</p>
+ <div class="event-description">
+ <h3>MKV IETF Update</h3>
</div>
</div>
<div class="event">
- <div class="event-inner">
- <div class="event-time">
- 11:15 - 11:45
- </div>
- <div class="event-description">
- <h3>AV1 Update</h3>
- <p>Timothy B. Terriberry, Mozilla</p>
- </div>
+ <h4 class="event-time">
+ 11:15 - 11:45
+ </h4>
+ <p class="event-author">Timothy B. Terriberry, Mozilla</p>
+ <div class="event-description">
+ <h3>AV1 Update</h3>
</div>
</div>
<div class="event">
- <div class="event-inner">
- <div class="event-time">
- 11:45 - 12:15
- </div>
- <div class="event-description">
- <h3>Spatial audio formats</h3>
- <p>Damien Kelly, Youtube</p>
- </div>
+ <h4 class="event-time">
+ 11:45 - 12:15
+ </h4>
+ <p class="event-author">Damien Kelly, Youtube</p>
+ <div class="event-description">
+ <h3>Spatial audio formats</h3>
</div>
</div>
- <div class="event">
- <div class="event-inner">
- <div class="event-time">
- 12:15 - 14:00
- </div>
- <div class="event-description">
- <h3>Lunch Break</h3>
- </div>
+ <div class="event event-bg">
+ <h4 class="event-time">
+ 12:15 - 14:00
+ </h4>
+ <div class="event-description">
+ <h3>Lunch Break</h3>
</div>
</div>
<div class="event">
- <div class="event-inner">
- <div class="event-time">
- 14:00 - 16:00
+ <h4 class="event-time">
+ 14:00 - 16:00
+ </h4>
+ <div class="event-description event-row">
+ <div class="event-col">
+ <div class="header">
+ Salle 1
+ </div>
+ <div class="body">
+ <h3>AV1 Technical Meeting</h3>
+ </div>
</div>
- <div class="event-description event-row">
- <div class="event-col">
- <div class="header">
- Salle 1
- </div>
- <div class="body">
- <h3>AV1 Technical Meeting</h3>
- </div>
+ <div class="event-col">
+ <div class="header">
+ Salle 2
</div>
- <div class="event-col">
- <div class="header">
- Salle 2
- </div>
- <div class="body">
- <h3>libav Technical Meeting</h3>
- </div>
+ <div class="body">
+ <h3>libav Technical Meeting</h3>
</div>
- <div class="event-col">
- <div class="header">
- Salle 3
- </div>
- <div class="body">
- <h3>VLC Technical Meeting</h3>
- </div>
+ </div>
+ <div class="event-col">
+ <div class="header">
+ Salle 3
+ </div>
+ <div class="body">
+ <h3>VLC Technical Meeting</h3>
</div>
</div>
</div>
</div>
<div class="event">
- <div class="event-inner">
- <div class="event-time">
- 16:00 - 18:00
- </div>
- <div class="event-description">
- <h3>VideoLAN asso meeting</h3>
- <h5>For non-profit members only</h5>
- </div>
+ <h4 class="event-time">
+ 16:00 - 18:00
+ </h4>
+ <div class="event-description">
+ <h3>VideoLAN asso meeting</h3>
+ <h5>For non-profit members only</h5>
</div>
</div>
</div>
<div role="tabpanel" class="tab-pane fade" id="sunday">
- <div class="event">
- <div class="event-inner">
- <div class="event-time">
- 09:00 - 09:30
- </div>
- <div class="event-description">
- <h3>Breakfast</h3>
- </div>
+ <div class="event event-bg">
+ <h4 class="event-time">
+ 09:00 - 09:30
+ </h4>
+ <div class="event-description">
+ <h3>Breakfast</h3>
</div>
</div>
<div class="event">
- <div class="event-inner">
- <div class="event-time">
- 09:30 - 12:00
- </div>
- <div class="event-description">
- <h3>Lightning talks</h3>
- </div>
+ <h4 class="event-time">
+ 09:30 - 12:00
+ </h4>
+ <div class="event-description">
+ <h3>Lightning talks</h3>
</div>
</div>
- <div class="event">
- <div class="event-inner">
- <div class="event-time">
- 12:00 - 14:00
- </div>
- <div class="event-description">
- <h3>Lunch</h3>
- </div>
+ <div class="event event-bg">
+ <h4 class="event-time">
+ 12:00 - 14:00
+ </h4>
+ <div class="event-description">
+ <h3>Lunch</h3>
</div>
</div>
<div class="event">
- <div class="event-inner">
- <div class="event-time">
- 14:00 - 18:00
- </div>
- <div class="event-description">
- <h3>Unconferences</h3>
- </div>
+ <h4 class="event-time">
+ 14:00 - 18:00
+ </h4>
+ <div class="event-description">
+ <h3>Unconferences</h3>
</div>
</div>
<div class="event">
@@ -282,9 +250,10 @@
<p><strong>Anyone</strong> who cares about open source multimedia technologies and development. Remember that it targets a technical crowd!</p>
<p>If you are representing a <b>company</b> caring about open-source multimedia software, we would be <b>very interested</b> if you could co-sponsor the event.</p>
</div>
- <div class="col-md-6 ">
+ <div class="col-md-6 ">
<h2 class="uppercase">Register!</h2>
- <p><b><a href="https://goo.gl/forms/YJ0IakCQ7WLyUYgr1">Register <strong>now!</strong></a></b></p>
+ <p><b>Registration are closed.</b></p>
+ <p>If you are a member of the community and forgot to register, please email <a href="mailto:hugo at videolan.org">hugo at videolan.org</a></p>
</div>
</div>
</div>
=====================================
www.videolan.org/videolan/events/vdd17/style.css
=====================================
--- a/www.videolan.org/videolan/events/vdd17/style.css
+++ b/www.videolan.org/videolan/events/vdd17/style.css
@@ -62,45 +62,21 @@ h2 {
border: 1px solid #fff;
}
-.event-inner {
- display: table-row;
-}
-
.tab-content {
margin-left: 1px;
}
.event {
color: #4d4d4d;
- margin-top: 10px;
- display: table;
- width: 100%;
- /*height: 110px;*/
+ margin-top: 6px;
+ border-radius: 6px;
+ padding: 1.8em 1.6em;
+ box-shadow: 0 1px 3px 0 rgba(0, 0, 0, .2), 0 1px 1px 0 rgba(0, 0, 0, .14), 0 2px 1px -1px rgba(0, 0, 0, .12);
}
.event h3 {
color: #4d4d4d;
-}
-
-.event-time, .event-description {
- display: table-cell;
- vertical-align: middle;
- box-shadow: 0 1px 3px 0 rgba(0, 0, 0, .2), 0 1px 1px 0 rgba(0, 0, 0, .14), 0 2px 1px -1px rgba(0, 0, 0, .12);
-}
-
-.event-time {
- min-width: 100px;
font-weight: bold;
- text-transform: uppercase;
- background-color: #f7f7f7;
- width: 16%;
- padding: 5px;
- text-align: center;
-}
-
-.event-description {
- background-color: #fff;
- padding: 15px;
}
#sponsors {
@@ -143,3 +119,84 @@ h2 {
.event-col .header {
font-weight: bold;
}
+
+.event-time {
+ color: #39b549;
+ display: inline-block;
+}
+
+.event-author {
+ float: right;
+ font-style: italic;
+}
+
+.spacer {
+ width: 200px;
+ border-top: 3px solid #e7e7e7;
+ margin: 24px auto;
+}
+
+.nav-tabs > li {
+ float:none;
+ display:inline-block;
+ zoom:1;
+}
+
+.nav-tabs {
+ text-align:center;
+}
+
+.nav-tabs {
+ border-bottom: none !important;
+}
+
+.nav-tabs {
+ border-bottom: 2px solid #DDD;
+}
+
+.nav-tabs > li.active > a, .nav-tabs > li.active > a:focus, .nav-tabs > li.active > a:hover {
+ border-width: 0;
+}
+
+.nav-tabs > li > a {
+ border: none;
+ color: #666;
+}
+
+.nav-tabs > li.active > a, .nav-tabs > li > a:hover {
+ border: none;
+ color: #39b549 !important;
+ background: transparent;
+}
+
+.nav-tabs > li > a::after {
+ content: "";
+ background: #39b549;
+ height: 2px;
+ position: absolute;
+ width: 100%;
+ left: 0px;
+ bottom: -1px;
+ transition: all 250ms ease 0s;
+ transform: scale(0);
+}
+
+.nav-tabs > li.active > a::after, .nav-tabs > li:hover > a::after {
+ transform: scale(1);
+}
+
+.tab-nav > li > a::after {
+ background: #21527d none repeat scroll 0% 0%; color: #fff;
+}
+
+.tab-pane {
+ padding: 15px 0;
+}
+
+.tab-content {
+ padding:20px
+}
+
+.event-bg {
+ background-color: #fbfbfb;
+}
\ No newline at end of file
View it on GitLab: https://code.videolan.org/VideoLAN.org/websites/commit/2130e1f02b5c725d0a797bb16287adbce113ff9a
---
View it on GitLab: https://code.videolan.org/VideoLAN.org/websites/commit/2130e1f02b5c725d0a797bb16287adbce113ff9a
You're receiving this email because of your account on code.videolan.org.
More information about the www-doc
mailing list