Commit 691e0bcd authored by  JosephK's avatar JosephK
Browse files

WIP Bootstrap4

parent 01d3b526
......@@ -34,7 +34,7 @@ a, a:hover, a:focus, a:visited, a h4 {text-decoration: none !important;}
content: " \f08e";
}
.apropos header a[href*="lite"] {
#lite header a[href*="lite"] {
display: none;
}
......@@ -520,13 +520,7 @@ blockquote {
text-align: center;
}
#association {
.dl-horizontal dt {
white-space: normal;
}
}
.w-date, .w-board, .w-piaf, .w-listes, .w-talk,
.w-news, .w-bin, .w-pic, .w-link, .w-my, .w-wiki {
visibility: hidden;
}
}
\ No newline at end of file
......@@ -4,6 +4,9 @@
.btn-soutenir {
white-space: normal;
max-width: 21em;
background-color: #DBA306;
border: 1px solid #DBA306;
color: #fff;
}
section {
......@@ -12,10 +15,8 @@
}
.pfooter {
margin-top: 15px;
margin-bottom: 30px;
padding-left: 15px;
padding-left: 15px;
margin: 15px auto 0 ;
padding-bottom: 30px;
text-align: center;
a {
color: #fff;
......@@ -35,6 +36,16 @@
padding-bottom: 40px;
color: #fff;
.btn-outline-secondary {
background: #fff;
&:hover {
background-color: #616161;
}
}
.show > .btn-outline-secondary.dropdown-toggle {
background-color: #616161;
}
h1, h2 { color: #fff; }
h2 {
......@@ -324,7 +335,7 @@
position: absolute;
top: 50px;
right: 50px;
width: 33%;
width: 40%;
height: auto;
background: rgba(255, 255, 255, 0.9);
padding-bottom: 20px;
......@@ -393,8 +404,8 @@
h4 {
position: absolute;
left: 0.7rem;
top: -1.5rem;
left: 1.5rem;
top: -0.5rem;
width: 6.5rem;
height: 6.5rem;
border-radius: 81% 75% 99% 71%;
......@@ -542,7 +553,7 @@
}
.bigbubble:before {
top: 0px;
top: 15px;
}
}
......
.lite {
margin: 0px;
li {
margin: 15px 0;
}
a.btn-default {
border-color: #fff;
font-size: 16px;
&:hover,
&:focus,
&:active {
background-color: #fafafa;
border-color: #ccc;
i { color: #fff; font-size: 2.5em; }
}
}
i {
display: block;
margin: 10px auto -10px;
......@@ -26,14 +8,6 @@
border-radius: 50%;
color: #616161;
}
.titreFramaTrucs {
margin : 0 0 5px 0;
}
&:last-child {
margin-bottom: 20px;
}
}
#lite {
......@@ -42,50 +16,25 @@
width: 750px;
}
}
#framaheader {
position: relative;
margin: 0;
}
#framaheader .col-md-5 {
clear: left;
width: auto;
}
#framaheader .col-md-3:last-of-type {
position: absolute;
width: auto;
right: 0;
}
.router-link-exact-active,
.navEntities {
display: none;
}
.sitename {
margin-top: 0;
}
.headerSubTitle {
padding: 0.5em 0;
margin-left: -5px;
}
.header {
border-bottom: none;
}
.header div.trait {
margin: 0 15px;
width: calc(100% - 30px);
}
.bleu a {
&:hover,
&:focus,
&:active {
i { background-color: $bleu; }
i {
background-color: $bleu;
color: #fff;
}
}
}
......@@ -93,7 +42,10 @@
&:hover,
&:focus,
&:active {
i { background-color: $rouge; }
i {
background-color: $rouge;
color: #fff;
}
}
}
......@@ -101,7 +53,10 @@
&:hover,
&:focus,
&:active {
i { background-color: $vert; }
i {
background-color: $vert;
color: #fff;
}
}
}
......@@ -109,7 +64,10 @@
&:hover,
&:focus,
&:active {
i { background-color: $jaune; }
i {
background-color: $jaune;
color: #fff;
}
}
}
}
<template>
<div class="container ombre apropos">
<div class="container ombre">
<header class="clearfix header">
<h1
class="pull-left"
......@@ -10,25 +10,25 @@
<main>
<div v-html="$t('asso.prez')"></div>
<div class="row">
<div class="col-sm-10 col-sm-offset-1">
<b-row align-h="center">
<b-col md="10">
<img
class="img-responsive"
class="img-fluid"
alt=""
:title="$t('asso.prez.saveas')"
:title="$t('asso.saveas')"
:src="`${$t('baseurl')}img/${$t('lang')
}/infographie_Le-Monde-de-Framasoft_CC-By-SA-Geoffrey-Dorne-1920px-2019.jpg`"
/>
<p class="text-right">
<span v-html="$t('asso.prez.infography')"></span>
<span v-html="$t('asso.infography')"></span>
<a
href="http://geoffreydorne.com"
v-html="$t('people.dorme')"
></a>,
<span v-html="$t('license.ccbysa4fr')"></span>
</p>
</div>
</div>
</b-col>
</b-row>
<hr />
......@@ -37,12 +37,12 @@
<ul>
<li>
<a :href="`${$t('asso.files')}statuts-Framasoft-2015-v8.pdf`">
<strong v-html="$t('asso.infos.statuts')"></strong>
<strong v-html="$t('asso.statuts')"></strong>
</a>
</li>
<li>
<a :href="`${$t('asso.files')}reglement-interieur-2015-v6c.pdf`">
<strong v-html="$t('asso.infos.ri')"></strong>
<strong v-html="$t('asso.ri')"></strong>
</a>
</li>
</ul>
......@@ -58,49 +58,78 @@
<hr />
<h2 v-html="$t('asso.data.title')"></h2>
<div class="col-sm-10 col-sm-offset-1 well">
<dl class="dl-horizontal">
<dt v-html="$t('asso.data.dt.juridical')"></dt>
<b-card bg-variant="light mx-auto col-md-10">
<dl class="row">
<dt
class="col-md-4 col-lg-3"
v-html="$t('asso.data.dt.juridical')"
></dt>
<dd v-html="$t('asso.data.dd.juridical')"></dd>
</dl>
<dl class="dl-horizontal">
<dt v-html="$t('asso.data.dt.coprez')"></dt>
<dl class="row">
<dt
class="col-md-4 col-lg-3"
v-html="$t('asso.data.dt.coprez')"
></dt>
<dd v-html="$t('legals.editor.coprezName')"></dd>
</dl>
<dl class="dl-horizontal">
<dt v-html="$t('asso.data.dt.dg')"></dt>
<dl class="row">
<dt
class="col-md-4 col-lg-3"
v-html="$t('asso.data.dt.dg')"
></dt>
<dd>Pierre-Yves Gosset</dd>
</dl>
<dl class="dl-horizontal">
<dt v-html="$t('asso.data.dt.registration')"></dt>
<dl class="row">
<dt
class="col-md-4 col-lg-3"
v-html="$t('asso.data.dt.registration')"
></dt>
<dd>
2004
(<a
:href="`${$t('asso.files')}statuts-Framasoft-2015-v8.pdf`"
rel="nofollow"
v-html="$t('asso.infos.statuts')"
v-html="$t('asso.statuts')"
></a>)
(<a
:href="`${$t('asso.files')}reglement-interieur-2015-v6c.pdf`"
rel="nofollow"
v-html="$t('asso.infos.ri')"
v-html="$t('asso.ri')"
></a>)
</dd>
</dl>
<dl class="dl-horizontal">
<dt v-html="$t('asso.data.dt.staff')"></dt>
<dl class="row">
<dt
class="col-md-4 col-lg-3"
v-html="$t('asso.data.dt.staff')"
></dt>
<dd v-html="$t('asso.data.dd.staff')"></dd>
</dl>
<dl class="dl-horizontal">
<dt v-html="$t('asso.data.dt.headquarters')"></dt>
<dl class="row">
<dt
class="col-md-4 col-lg-3"
v-html="$t('asso.data.dt.headquarters')"
></dt>
<dd>Lyon, France</dd>
</dl>
<dl class="dl-horizontal">
<dt v-html="$t('asso.data.dt.org')"></dt>
<dl class="row">
<dt
class="col-md-4 col-lg-3"
v-html="$t('asso.data.dt.org')"
></dt>
<dd v-html="$t('asso.data.dd.org')"></dd>
</dl>
<dl class="dl-horizontal">
<dt v-html="$t('asso.data.dt.id')"></dt>
<dl class="row">
<dt
class="col-md-4 col-lg-3"
v-html="$t('asso.data.dt.id')"
></dt>
<dd>
<a
:href="`${$t('asso.files')}fiche_identification_framasoft.pdf`"
......@@ -109,8 +138,11 @@
></a>
</dd>
</dl>
<dl class="dl-horizontal">
<dt v-html="$t('asso.data.dt.projects')"></dt>
<dl class="row">
<dt
class="col-md-4 col-lg-3"
v-html="$t('asso.data.dt.projects')"
></dt>
<dd>
<a
:href="$t('link.cuo')"
......@@ -122,17 +154,23 @@
></a>
</dd>
</dl>
<dl class="dl-horizontal">
<dt v-html="$t('asso.data.dt.charte')"></dt>
<dl class="row">
<dt
class="col-md-4 col-lg-3"
v-html="$t('asso.data.dt.charte')"
></dt>
<dd>
<a
href="../charte"
v-html="$t('charte.title')"
v-html="$t('asso.data.dd.charte')"
></a>
</dd>
</dl>
<dl class="dl-horizontal">
<dt v-html="$t('asso.data.dt.reports')"></dt>
<dl class="row">
<dt
class="col-md-4 col-lg-3"
v-html="$t('asso.data.dt.reports')"
></dt>
<dd>
<ul>
<li>
......@@ -225,8 +263,11 @@
</ul>
</dd>
</dl>
<dl class="dl-horizontal">
<dt v-html="$t('asso.data.dt.newsletter')"></dt>
<dl class="row">
<dt
class="col-md-4 col-lg-3"
v-html="$t('asso.data.dt.newsletter')"
></dt>
<dd>
<a
:href="$t('link.newsletter')"
......@@ -234,8 +275,11 @@
></a>
</dd>
</dl>
<dl class="dl-horizontal">
<dt v-html="$t('asso.data.dt.press')"></dt>
<dl class="row">
<dt
class="col-md-4 col-lg-3"
v-html="$t('asso.data.dt.press')"
></dt>
<dd>
<a
:href="$t('link.press')"
......@@ -243,32 +287,46 @@
></a>
</dd>
</dl>
<dl class="dl-horizontal">
<dt v-html="$t('asso.data.dt.graphics')"></dt>
<dl class="row">
<dt
class="col-md-4 col-lg-3"
v-html="$t('asso.data.dt.graphics')"
></dt>
<dd>
<a
href="../graphics"
v-html="$t('asso.data.dd.graphics')"
></a> -
<a
href="https://soutenir.framasoft.org/afficher-votre-soutien"
v-html="$t('asso.data.dd.banners')"
></a>
</dd>
</dl>
<dl class="dl-horizontal">
<dl class="row">
<dt
class="col-md-4 col-lg-3"
v-html="$t('asso.data.dt.community')"
></dt>
<dd>
<a
href="https://soutenir.framasoft.org/afficher-votre-soutien"
v-html="$t('asso.data.dd.banners')"
></a> -
<a
href="https://soutenir.framasoft.org/benevolat"
v-html="$t('asso.data.dd.benevalo')"
></a> -
<a
href="https://framasoft.org/moderation"
v-html="$t('asso.data.dd.moderation')"
></a>
</dd>
</dl>
<dl class="dl-horizontal">
<dt v-html="$t('asso.data.dt.founders')"></dt>
<dl class="row">
<dt
class="col-md-4 col-lg-3"
v-html="$t('asso.data.dt.founders')"
></dt>
<dd>{{ $t('people.aka') }}, Paul Lunetta, Georges Silva</dd>
</dl>
</div>
</b-card>
</main>
</div>
</template>
......
<template>
<div class="container ombre apropos">
<div class="container ombre">
<header class="clearfix header">
<h1
class="pull-left"
......@@ -8,26 +8,24 @@
<I18n />
</header>
<main>
<h2 v-html="$t('cgu.intro.title')"></h2>
<p v-html="$t('cgu.intro.text')"></p>
<div v-html="$t('cgu.intro')"></div>
<h2 v-html="$t('cgu.short.title')"></h2>
<p v-html="$t('cgu.short.desc')"></p>
<p><b v-html="$t('cgu.short.sympa.text')"></b></p>
<ul class="list-group">
<ul class="list-group mb-4">
<li
v-for="index in Object.keys($t('cgu.short.sympa.list'))"
:key="index"
class="list-group-item bg-success"
class="list-group-item list-group-item-success"
v-html="$t(`cgu.short.sympa.list[${index}]`)"
></li>
</ul>
<p v-html="$t('cgu.short.terms.text')"></p>
<ul class="list-group">
<ul class="list-group mb-4">
<li
v-for="index in Object.keys($t('cgu.short.terms.list'))"
:key="index"
class="list-group-item bg-warning"
class="list-group-item list-group-item-warning"
v-html="$t(`cgu.short.terms.list[${index}]`)"
></li>
</ul>
......@@ -36,7 +34,7 @@
<div class="signature">
<hr />
<div v-html="$t('cgu.footer')"></div>
<p v-html="$t('cgu.footer')"></p>
</div>
</main>
</div>
......
<template>
<div class="container ombre apropos">
<div class="container ombre">
<header class="clearfix header">
<h1
class="pull-left"
......@@ -8,7 +8,7 @@
<I18n />
</header>
<main>
<div v-html="$t('charte')"></div>
<div v-html="$t('charte.md')"></div>
<div class="signature">
<hr />
......
<template>
<div class="container ombre apropos">
<div class="container ombre">
<header class="clearfix header">
<h1
class="pull-left"
......@@ -10,10 +10,10 @@
<main>
<div v-html="$t('credits.main')"></div>
<div
<b-card
v-if="$t('hash') !== ''"
id="site-credits"
class="well"
bg-variant="light"
>
<section v-show="$t('hash') === 'blog'">
<h1 v-html="$t('html.blog')"></h1>
......@@ -42,36 +42,6 @@
la valeureuse équipe du <a href="http://www.crdp.ac-versailles.fr/">CRDP de Versailles</a>.
</p>
</section>
<section v-show="$t('hash') === 'connard'">
<h1>Bastard, Inc</h1>
<p>
Dessins&nbsp;:
<a
href="http://ptilouk.net"
v-html="$t('people.gee')"
></a><br />
Textes&nbsp;:
<a
href="http://pouhiou.com"
v-html="$t('people.pouhiou')"
></a>
</p>
<p>
Ce blog et ses contenus sont directement élevés par leurs auteurs
dans le
<a href="http://creativecommons.org/publicdomain/zero/1.0/">
Domaine Public Vivant
</a>.
À vous de vous en emparer.
</p>
<p>
Image de couverture et d’entête&nbsp;: versions dérivées de
<a href="https://secure.flickr.com/photos/thomasleuthard/8253943837/">
Business as usual…
</a>
(<span v-html="$t('license.ccby3')"></span> Thomas Leuthard)
</p>
</section>
<section v-show="$t('hash') === 'contact'">
<h1>Site de contact</h1>
<p>Ce site est propulsé par <a href="https://wordpress.org/">WordPress</a>.</p>
......@@ -183,32 +153,32 @@
La <span v-html="$t('html.key')"></span> est réalisée par une équipe
de bénévoles du réseau <span v-html="$t('html.soft')"></span>&nbsp;:
</p>
<dl class="dl-horizontal">
<dl>
<dt>Réalisation</dt>
<dd>
pp (Pascal Parraud) (v1), pyg ({{ $t('people.pyg') }}) (v1),
{{ $t('people.fat115') }} (v2)
</dd>
</dl>
<dl class="dl-horizontal">
<dt>Packaging<br />et mise à jours</dt>
<dl>
<dt>Packaging et mise à jours</dt>
<dd>
pyg ({{ $t('people.pyg') }}), {{ $t('people.fat115') }} (v1.12+),
{{ $t('people.cyrille') }} (v1.12+), {{ $t('people.jo') }} (v1.12+)
</dd>
</dl>
<dl class="dl-horizontal">
<dt>Graphisme<br />et thème</dt>