beta #4
@ -18,7 +18,8 @@
|
||||
width: 22em;
|
||||
}
|
||||
|
||||
.slot_info {
|
||||
.slot_info,
|
||||
.slot_info_buttons {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-content: flex-start;
|
||||
@ -54,7 +55,8 @@
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.metadata > .slot_info > .button {
|
||||
.metadata > .slot_info_buttons > .button,
|
||||
.metadata > .slot_info_buttons > .slot_info > .button {
|
||||
font-size: 1em;
|
||||
margin-right: 0.3em;
|
||||
}
|
||||
@ -71,42 +73,47 @@
|
||||
margin-bottom: 0.2em;
|
||||
}
|
||||
|
||||
.speaker_details {
|
||||
.speaker {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.speaker_details .details {
|
||||
.speaker .details {
|
||||
visibility: hidden;
|
||||
background-color: var(--main-color);
|
||||
color: var(--alt-main-color);
|
||||
text-align: center;
|
||||
text-align: left;
|
||||
padding: 1em;
|
||||
border-radius: 6px;
|
||||
padding: 5px 0;
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
opacity: 0;
|
||||
transform: translateX(-50%) translateY(102%);
|
||||
transition: opacity 1s;
|
||||
transform: translateX(-2em) translateY(102%);
|
||||
max-width: 30em;
|
||||
overflow-y: auto;
|
||||
border-style: solid;
|
||||
border-color: var(--alt-main-color);
|
||||
border-width: 1px;
|
||||
}
|
||||
|
||||
.speaker_details .details::after {
|
||||
.speaker .details::after {
|
||||
content: "";
|
||||
position: relative;
|
||||
margin-left: -5px;
|
||||
border-width: 5px;
|
||||
}
|
||||
|
||||
.speaker_details:hover .details {
|
||||
.speaker:hover .details {
|
||||
visibility: visible;
|
||||
opacity: 1;
|
||||
font-size: 0.7em;
|
||||
padding: 0.2em;
|
||||
}
|
||||
|
||||
.speaker_details > .details > img,
|
||||
.speaker > .details > img,
|
||||
.abstract > img {
|
||||
max-width: 200px;
|
||||
max-height: 200px;
|
||||
@ -114,7 +121,64 @@
|
||||
margin: 0 0.5em 0.5em 0;
|
||||
}
|
||||
|
||||
.speaker_details > .details > p {
|
||||
.speaker > .details > p {
|
||||
text-align: justify;
|
||||
font-size: 0.5em;
|
||||
}
|
||||
|
||||
.slot_info {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.slot_info .details {
|
||||
visibility: hidden;
|
||||
background-color: var(--main-color);
|
||||
color: var(--alt-main-color);
|
||||
text-align: left;
|
||||
padding: 1em;
|
||||
border-radius: 6px;
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
opacity: 0;
|
||||
transition: opacity 1s;
|
||||
transform: translateX(-2em) translateY(102%);
|
||||
max-width: 30em;
|
||||
overflow-y: auto;
|
||||
border-style: solid;
|
||||
border-color: var(--alt-main-color);
|
||||
border-width: 1px;
|
||||
}
|
||||
|
||||
.slot_info .details > .description {
|
||||
margin-top: 1em;
|
||||
}
|
||||
|
||||
.slot_info .details::after {
|
||||
content: "";
|
||||
position: relative;
|
||||
margin-left: -5px;
|
||||
border-width: 5px;
|
||||
}
|
||||
|
||||
.slot_info:hover .details {
|
||||
visibility: visible;
|
||||
opacity: 1;
|
||||
font-size: 0.7em;
|
||||
padding: 0.2em;
|
||||
}
|
||||
|
||||
.slot_info > .details > img,
|
||||
.abstract > img {
|
||||
max-width: 200px;
|
||||
max-height: 200px;
|
||||
float: left;
|
||||
margin: 0 0.5em 0.5em 0;
|
||||
}
|
||||
|
||||
.slot_info > .details > p {
|
||||
text-align: justify;
|
||||
font-size: 0.5em;
|
||||
}
|
||||
|
@ -1,5 +1,4 @@
|
||||
.tooltip,
|
||||
.planning_tooltip,
|
||||
.slot_tooltip {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
@ -21,7 +20,7 @@
|
||||
transition: opacity 1s;
|
||||
}
|
||||
|
||||
.planning_tooltip .planning_tooltiptext {
|
||||
.slot_tooltip .slot_tooltiptext {
|
||||
visibility: hidden;
|
||||
background-color: var(--main-color);
|
||||
color: var(--alt-main-color);
|
||||
@ -37,33 +36,7 @@
|
||||
transition: opacity 1s;
|
||||
}
|
||||
|
||||
.slot_tooltip .slot_tooltiptext {
|
||||
visibility: hidden;
|
||||
background-color: var(--main-color);
|
||||
color: var(--alt-main-color);
|
||||
text-align: center;
|
||||
border-radius: 6px;
|
||||
padding: 5px 0;
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
opacity: 0;
|
||||
transform: translateX(2em) translateY(50%);
|
||||
transition: opacity 1s;
|
||||
}
|
||||
|
||||
.slot_tooltip .slot_tooltiptext {
|
||||
font-size: 1em;
|
||||
width: 26em;
|
||||
padding: 1em;
|
||||
border-style: solid;
|
||||
border-color: var(--alt-main-color);
|
||||
border-width: 1px;
|
||||
}
|
||||
|
||||
.tooltip .tooltiptext::after,
|
||||
.planning_tooltip .planning_tooltiptext::after,
|
||||
.slot_tooltip .slot_tooltiptext::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
@ -74,7 +47,6 @@
|
||||
}
|
||||
|
||||
.tooltip:hover .tooltiptext,
|
||||
.planning_tooltip:hover .planning_tooltiptext,
|
||||
.slot_tooltip:hover .slot_tooltiptext {
|
||||
visibility: visible;
|
||||
opacity: 1;
|
||||
|
@ -2,8 +2,8 @@
|
||||
<html lang='zxx'>
|
||||
<head>
|
||||
<title>THSF 2023: S/Extraire</title>
|
||||
<meta name="viewport" content="initial-scale=1.0" />
|
||||
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
|
||||
<meta name="viewport" content="initial-scale=1.0">
|
||||
<meta http-equiv="content-type" content="text/html; charset=utf-8">
|
||||
<link rel="stylesheet"
|
||||
href="{{ url_for('static', filename='css/style.css') }}">
|
||||
<link rel="stylesheet"
|
||||
@ -12,7 +12,7 @@
|
||||
href="{{ url_for('static', filename='css/planning.css') }}">
|
||||
<link rel="icon"
|
||||
type="image/png"
|
||||
href="{{ url_for('static', filename='images/favicon.png') }}" />
|
||||
href="{{ url_for('static', filename='images/favicon.png') }}">
|
||||
<link rel="stylesheet"
|
||||
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
|
||||
{% block headers %}
|
||||
|
@ -4,7 +4,7 @@
|
||||
<img class="logo"
|
||||
src="{{ url_for('static', filename='images/logo.svg') }}"
|
||||
alt="THSF 2023 - S/Extraire"
|
||||
title="THSF 2023 - S/Extraire"/>
|
||||
title="THSF 2023 - S/Extraire">
|
||||
</div>
|
||||
<div id="blah">
|
||||
<h2>Le T.H.S.F est enfin de retour !</h2>
|
||||
|
@ -1,8 +1,8 @@
|
||||
<div id="navbar_wrapper">
|
||||
{% for item in navbar %}
|
||||
<i class="button tooltip black {{ item.classes }}"
|
||||
onclick="document.location='{{item.url}}'">
|
||||
<span class="tooltiptext thin">{{item.name}}</span>
|
||||
</i>
|
||||
<i class="button tooltip black {{ item.classes }}"
|
||||
onclick="document.location='{{item.url}}'">
|
||||
<span class="tooltiptext thin">{{item.name}}</span>
|
||||
</i>
|
||||
{% endfor %}
|
||||
</div>
|
||||
|
@ -1,8 +1,8 @@
|
||||
{% extends "base.html" %}
|
||||
{% block content %}
|
||||
<div id="schedule">
|
||||
{% for slot in slots %}
|
||||
{% include "slot.html" %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
<div id="schedule">
|
||||
{% for slot in slots %}
|
||||
{% include "slot.html" %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% endblock %}
|
||||
|
@ -2,38 +2,40 @@
|
||||
<div class="metadata">
|
||||
<div class="speakers">
|
||||
{% for speaker in slot.speakers %}
|
||||
{{speaker.name | title}}
|
||||
<i class="speaker_details fa-solid fa-user">
|
||||
<div class="speaker">
|
||||
{{speaker.name | title}}
|
||||
<i class="speaker_details fa-solid fa-user"></i>
|
||||
{% if speaker.avatar or speaker.biography %}
|
||||
<div class="details">
|
||||
{% if speaker.avatar %}
|
||||
<img src="{{speaker.avatar}}" />
|
||||
<img src="{{speaker.avatar}}">
|
||||
{% endif %}
|
||||
{% if speaker['biography'] %}
|
||||
<p class="thin">{{speaker.biography}}</p>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% endif %}
|
||||
</i><br/>
|
||||
</div><br>
|
||||
{% endfor %}
|
||||
</div>
|
||||
<div class="slot_info">
|
||||
<i class="button planning_tooltip black {{slot.submission_type.fr | toicon }}">
|
||||
<span class="planning_tooltiptext thin">
|
||||
<div class="slot_info_buttons">
|
||||
<i class="button slot_tooltip black {{slot.submission_type.fr | toicon }}">
|
||||
<span class="slot_tooltiptext thin">
|
||||
{{slot.submission_type.fr}}
|
||||
</span>
|
||||
</i>
|
||||
<i class="button slot_tooltip black fa-solid fa-circle-info">
|
||||
<div class="slot_tooltiptext thin">
|
||||
<div class="abstract">
|
||||
{% if slot['image'] %}
|
||||
<img class="data_img" src="{{slot.image}}"/>
|
||||
{% endif %}
|
||||
<p>{{slot.abstract}}</p>
|
||||
</div>
|
||||
<div class="description">{{slot.description}}</div>
|
||||
</div>
|
||||
</i>
|
||||
</i>
|
||||
<div class="slot_info">
|
||||
<i class="button slot_info_details black fa-solid fa-circle-info"></i>
|
||||
<div class="details thin">
|
||||
<div class="abstract">
|
||||
{% if slot['image'] %}
|
||||
<img class="data_img" src="{{slot.image}}">
|
||||
{% endif %}
|
||||
<p>{{slot.abstract}}</p>
|
||||
</div>
|
||||
<div class="description">{{slot.description}}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="data">
|
||||
|
@ -18,7 +18,8 @@
|
||||
width: 22em;
|
||||
}
|
||||
|
||||
.slot_info {
|
||||
.slot_info,
|
||||
.slot_info_buttons {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-content: flex-start;
|
||||
@ -54,7 +55,8 @@
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.metadata > .slot_info > .button {
|
||||
.metadata > .slot_info_buttons > .button,
|
||||
.metadata > .slot_info_buttons > .slot_info > .button {
|
||||
font-size: 1em;
|
||||
margin-right: 0.3em;
|
||||
}
|
||||
@ -71,42 +73,47 @@
|
||||
margin-bottom: 0.2em;
|
||||
}
|
||||
|
||||
.speaker_details {
|
||||
.speaker {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.speaker_details .details {
|
||||
.speaker .details {
|
||||
visibility: hidden;
|
||||
background-color: var(--main-color);
|
||||
color: var(--alt-main-color);
|
||||
text-align: center;
|
||||
text-align: left;
|
||||
padding: 1em;
|
||||
border-radius: 6px;
|
||||
padding: 5px 0;
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
opacity: 0;
|
||||
transform: translateX(-50%) translateY(102%);
|
||||
transition: opacity 1s;
|
||||
transform: translateX(-2em) translateY(102%);
|
||||
max-width: 30em;
|
||||
overflow-y: auto;
|
||||
border-style: solid;
|
||||
border-color: var(--alt-main-color);
|
||||
border-width: 1px;
|
||||
}
|
||||
|
||||
.speaker_details .details::after {
|
||||
.speaker .details::after {
|
||||
content: "";
|
||||
position: relative;
|
||||
margin-left: -5px;
|
||||
border-width: 5px;
|
||||
}
|
||||
|
||||
.speaker_details:hover .details {
|
||||
.speaker:hover .details {
|
||||
visibility: visible;
|
||||
opacity: 1;
|
||||
font-size: 0.7em;
|
||||
padding: 0.2em;
|
||||
}
|
||||
|
||||
.speaker_details > .details > img,
|
||||
.speaker > .details > img,
|
||||
.abstract > img {
|
||||
max-width: 200px;
|
||||
max-height: 200px;
|
||||
@ -114,7 +121,64 @@
|
||||
margin: 0 0.5em 0.5em 0;
|
||||
}
|
||||
|
||||
.speaker_details > .details > p {
|
||||
.speaker > .details > p {
|
||||
text-align: justify;
|
||||
font-size: 0.5em;
|
||||
}
|
||||
|
||||
.slot_info {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.slot_info .details {
|
||||
visibility: hidden;
|
||||
background-color: var(--main-color);
|
||||
color: var(--alt-main-color);
|
||||
text-align: left;
|
||||
padding: 1em;
|
||||
border-radius: 6px;
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
opacity: 0;
|
||||
transition: opacity 1s;
|
||||
transform: translateX(-2em) translateY(102%);
|
||||
max-width: 30em;
|
||||
overflow-y: auto;
|
||||
border-style: solid;
|
||||
border-color: var(--alt-main-color);
|
||||
border-width: 1px;
|
||||
}
|
||||
|
||||
.slot_info .details > .description {
|
||||
margin-top: 1em;
|
||||
}
|
||||
|
||||
.slot_info .details::after {
|
||||
content: "";
|
||||
position: relative;
|
||||
margin-left: -5px;
|
||||
border-width: 5px;
|
||||
}
|
||||
|
||||
.slot_info:hover .details {
|
||||
visibility: visible;
|
||||
opacity: 1;
|
||||
font-size: 0.7em;
|
||||
padding: 0.2em;
|
||||
}
|
||||
|
||||
.slot_info > .details > img,
|
||||
.abstract > img {
|
||||
max-width: 200px;
|
||||
max-height: 200px;
|
||||
float: left;
|
||||
margin: 0 0.5em 0.5em 0;
|
||||
}
|
||||
|
||||
.slot_info > .details > p {
|
||||
text-align: justify;
|
||||
font-size: 0.5em;
|
||||
}
|
||||
|
@ -1,5 +1,4 @@
|
||||
.tooltip,
|
||||
.planning_tooltip,
|
||||
.slot_tooltip {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
@ -21,7 +20,7 @@
|
||||
transition: opacity 1s;
|
||||
}
|
||||
|
||||
.planning_tooltip .planning_tooltiptext {
|
||||
.slot_tooltip .slot_tooltiptext {
|
||||
visibility: hidden;
|
||||
background-color: var(--main-color);
|
||||
color: var(--alt-main-color);
|
||||
@ -37,33 +36,7 @@
|
||||
transition: opacity 1s;
|
||||
}
|
||||
|
||||
.slot_tooltip .slot_tooltiptext {
|
||||
visibility: hidden;
|
||||
background-color: var(--main-color);
|
||||
color: var(--alt-main-color);
|
||||
text-align: center;
|
||||
border-radius: 6px;
|
||||
padding: 5px 0;
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
opacity: 0;
|
||||
transform: translateX(2em) translateY(50%);
|
||||
transition: opacity 1s;
|
||||
}
|
||||
|
||||
.slot_tooltip .slot_tooltiptext {
|
||||
font-size: 1em;
|
||||
width: 26em;
|
||||
padding: 1em;
|
||||
border-style: solid;
|
||||
border-color: var(--alt-main-color);
|
||||
border-width: 1px;
|
||||
}
|
||||
|
||||
.tooltip .tooltiptext::after,
|
||||
.planning_tooltip .planning_tooltiptext::after,
|
||||
.slot_tooltip .slot_tooltiptext::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
@ -74,7 +47,6 @@
|
||||
}
|
||||
|
||||
.tooltip:hover .tooltiptext,
|
||||
.planning_tooltip:hover .planning_tooltiptext,
|
||||
.slot_tooltip:hover .slot_tooltiptext {
|
||||
visibility: visible;
|
||||
opacity: 1;
|
||||
|
@ -2,8 +2,8 @@
|
||||
<html lang='zxx'>
|
||||
<head>
|
||||
<title>THSF 2023: S/Extraire</title>
|
||||
<meta name="viewport" content="initial-scale=1.0" />
|
||||
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
|
||||
<meta name="viewport" content="initial-scale=1.0">
|
||||
<meta http-equiv="content-type" content="text/html; charset=utf-8">
|
||||
<link rel="stylesheet"
|
||||
href="{{ url_for('static', filename='css/style.css') }}">
|
||||
<link rel="stylesheet"
|
||||
@ -12,7 +12,7 @@
|
||||
href="{{ url_for('static', filename='css/planning.css') }}">
|
||||
<link rel="icon"
|
||||
type="image/png"
|
||||
href="{{ url_for('static', filename='images/favicon.png') }}" />
|
||||
href="{{ url_for('static', filename='images/favicon.png') }}">
|
||||
<link rel="stylesheet"
|
||||
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
|
||||
{% block headers %}
|
||||
|
@ -4,7 +4,7 @@
|
||||
<img class="logo"
|
||||
src="{{ url_for('static', filename='images/logo.svg') }}"
|
||||
alt="THSF 2023 - S/Extraire"
|
||||
title="THSF 2023 - S/Extraire"/>
|
||||
title="THSF 2023 - S/Extraire">
|
||||
</div>
|
||||
<div id="blah">
|
||||
<h2>Le T.H.S.F est enfin de retour !</h2>
|
||||
|
@ -1,8 +1,8 @@
|
||||
<div id="navbar_wrapper">
|
||||
{% for item in navbar %}
|
||||
<i class="button tooltip black {{ item.classes }}"
|
||||
onclick="document.location='{{item.url}}'">
|
||||
<span class="tooltiptext thin">{{item.name}}</span>
|
||||
</i>
|
||||
<i class="button tooltip black {{ item.classes }}"
|
||||
onclick="document.location='{{item.url}}'">
|
||||
<span class="tooltiptext thin">{{item.name}}</span>
|
||||
</i>
|
||||
{% endfor %}
|
||||
</div>
|
||||
|
@ -1,8 +1,8 @@
|
||||
{% extends "base.html" %}
|
||||
{% block content %}
|
||||
<div id="schedule">
|
||||
{% for slot in slots %}
|
||||
{% include "slot.html" %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
<div id="schedule">
|
||||
{% for slot in slots %}
|
||||
{% include "slot.html" %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% endblock %}
|
||||
|
@ -2,38 +2,40 @@
|
||||
<div class="metadata">
|
||||
<div class="speakers">
|
||||
{% for speaker in slot.speakers %}
|
||||
{{speaker.name | title}}
|
||||
<i class="speaker_details fa-solid fa-user">
|
||||
<div class="speaker">
|
||||
{{speaker.name | title}}
|
||||
<i class="speaker_details fa-solid fa-user"></i>
|
||||
{% if speaker.avatar or speaker.biography %}
|
||||
<div class="details">
|
||||
{% if speaker.avatar %}
|
||||
<img src="{{speaker.avatar}}" />
|
||||
<img src="{{speaker.avatar}}">
|
||||
{% endif %}
|
||||
{% if speaker['biography'] %}
|
||||
<p class="thin">{{speaker.biography}}</p>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% endif %}
|
||||
</i><br/>
|
||||
</div><br>
|
||||
{% endfor %}
|
||||
</div>
|
||||
<div class="slot_info">
|
||||
<i class="button planning_tooltip black {{slot.submission_type.fr | toicon }}">
|
||||
<span class="planning_tooltiptext thin">
|
||||
<div class="slot_info_buttons">
|
||||
<i class="button slot_tooltip black {{slot.submission_type.fr | toicon }}">
|
||||
<span class="slot_tooltiptext thin">
|
||||
{{slot.submission_type.fr}}
|
||||
</span>
|
||||
</i>
|
||||
<i class="button slot_tooltip black fa-solid fa-circle-info">
|
||||
<div class="slot_tooltiptext thin">
|
||||
<div class="abstract">
|
||||
{% if slot['image'] %}
|
||||
<img class="data_img" src="{{slot.image}}"/>
|
||||
{% endif %}
|
||||
<p>{{slot.abstract}}</p>
|
||||
</div>
|
||||
<div class="description">{{slot.description}}</div>
|
||||
</div>
|
||||
</i>
|
||||
</i>
|
||||
<div class="slot_info">
|
||||
<i class="button slot_info_details black fa-solid fa-circle-info"></i>
|
||||
<div class="details thin">
|
||||
<div class="abstract">
|
||||
{% if slot['image'] %}
|
||||
<img class="data_img" src="{{slot.image}}">
|
||||
{% endif %}
|
||||
<p>{{slot.abstract}}</p>
|
||||
</div>
|
||||
<div class="description">{{slot.description}}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="data">
|
||||
|
Loading…
Reference in New Issue
Block a user