Contributopia.vue 3.15 KB
Newer Older
 JosephK's avatar
JosephK committed
1
2
3
4
5
6
7
8
<template>
  <section id="cuo" class="clearfix">
    <div class="container-fluid">
      <div class="container">
        <h2 v-html="$t('home.cuo.title')"></h2>
        <h3 v-html="$t('home.cuo.subtitle')"></h3>
      </div>
      <div class="container ombre">
 JosephK's avatar
JosephK committed
9
10
11
12
        <div v-if="is.before('2019/10/15')">
          <div class="col-md-4">
            <h4 class="label label-success" v-html="$t('home.cuo.meet.title')"></h4>
            <button class="bigbubble"
 JosephK's avatar
JosephK committed
13
              :style="`background: url(${$t('/')}img/services-framameet.jpg);`">
 JosephK's avatar
JosephK committed
14
15
16
17
18
19
20
21
22
              <p v-html="$t('home.cuo.meet.text')"></p>
            </button>
            <a href="#!" class="close" aria-hidden="true">
              &times;
            </a>
          </div>
          <div class="col-md-4">
            <h4 class="label label-primary" v-html="$t('home.cuo.petitions.title')"></h4>
            <button class="bigbubble"
 JosephK's avatar
JosephK committed
23
              :style="`background: url(${$t('/')}img/services-framapetitions.jpg);`">
 JosephK's avatar
JosephK committed
24
25
26
27
28
29
30
31
32
              <p v-html="$t('home.cuo.petitions.text')"></p>
            </button>
            <a href="#!" class="close" aria-hidden="true">
              &times;
            </a>
          </div>
          <div class="col-md-4">
            <h4 class="label label-info" v-html="$t('home.cuo.mooc.title')"></h4>
            <button class="bigbubble"
 JosephK's avatar
JosephK committed
33
              :style="`background: url(${$t('/')}img/educ-pop-mooc-chatons.jpg);`">
 JosephK's avatar
JosephK committed
34
35
36
37
38
39
              <p v-html="$t('home.cuo.mooc.text')"></p>
            </button>
            <a href="#!" class="close" aria-hidden="true">
              &times;
            </a>
          </div>
 JosephK's avatar
JosephK committed
40
        </div>
 JosephK's avatar
JosephK committed
41
42
43
44
        <div v-else>
          <div class="col-md-4">
            <h4 class="label label-warning" v-html="$t('home.cuo.peertube.title')"></h4>
            <button class="bigbubble"
 JosephK's avatar
JosephK committed
45
              :style="`background: url(${$t('/')}img/services-peertube.jpg);`">
 JosephK's avatar
JosephK committed
46
47
48
49
50
51
52
53
54
              <p v-html="$t('home.cuo.peertube.text')"></p>
            </button>
            <a href="#!" class="close" aria-hidden="true">
              &times;
            </a>
          </div>
          <div class="col-md-4">
            <h4 class="label label-primary" v-html="$t('home.cuo.mobilizon.title')"></h4>
            <button class="bigbubble"
 JosephK's avatar
JosephK committed
55
              :style="`background: url(${$t('/')}img/services-mobilizon.jpg);`">
 JosephK's avatar
JosephK committed
56
57
58
59
60
61
62
63
64
              <p v-html="$t('home.cuo.mobilizon.text')"></p>
            </button>
            <a href="#!" class="close" aria-hidden="true">
              &times;
            </a>
          </div>
          <div class="col-md-4">
            <h4 class="label label-info" v-html="$t('home.cuo.cloud.title')"></h4>
            <button class="bigbubble"
 JosephK's avatar
JosephK committed
65
              :style="`background: url(${$t('/')}img/services-cloud.jpg);`">
 JosephK's avatar
JosephK committed
66
67
68
69
70
71
              <p v-html="$t('home.cuo.cloud.text')"></p>
            </button>
            <a href="#!" class="close" aria-hidden="true">
              &times;
            </a>
          </div>
 JosephK's avatar
JosephK committed
72
73
74
75
76
77
78
79
80
        </div>
        <p class="col-sm-12 text-center">
          <a href="#soutenir" class="btn btn-lg btn-soutenir" v-html="$t('home.cuo.btn')"></a>
        </p>
      </div>
      <p class="pfooter" v-html="$t('home.cuo.footer')"></p>
    </div>
  </section>
</template>