Commit 78826d60 authored by JosephK's avatar JosephK
Browse files

Merge branch 'master' into 'master'

Redesign of the home page

See merge request !15
parents fdc38e05 9a0b2510
Pipeline #458384 failed with stages
in 2 minutes and 21 seconds
node_modules/
public/
.zanata-cache/etag-cache.xml
dist/
npm-debug.log
/zanata.xml
pnpm-lock.yaml
tools/backup/
tools/tmp/
app/locales/*/sfs.yml
src/translations/*/sfs.yml
src/translations/*/hos.yml
public/wiki/
public/wiki.json
image: framasoft/vuefs:latest
image: node:12-buster
stages:
- test
- deploy
......@@ -7,14 +7,15 @@ test:
stage: test
script:
- npm install -g yaml-lint
- for f in $(find ./app/ -name "*.yml" -type f);do echo $f; yamllint $f;done;
- for f in $(find ./src/ -name "*.yml" -type f);do echo $f; yamllint $f;done;
pages:
stage: deploy
script:
- npm run commons
- npm run preview
- mv -f public/$(echo $CI_PAGES_URL | cut -d/ -f4-)/* public
- npm run sfs && npm run hos
- npm run prod
- rm -r public/ && mv -f dist/$(echo $CI_PAGES_URL | cut -d/ -f4-)/ public/
- find public -type f -iregex '.*\.\(htm\|html\|txt\|text\|js\|css\)$' -execdir gzip -f --keep {} \;
artifacts:
paths:
......@@ -27,29 +28,30 @@ pages:
- master
except:
variables:
- $DEPLOYEMENT_KEY
- $DEPLOYEMENT_KNOWN_HOSTS
- $DEPLOYEMENT_USER
- $DEPLOYEMENT_HOST
- $DEPLOYMENT_KEY
- $DEPLOYMENT_USER
- $DEPLOYMENT_HOST
production:
stage: deploy
# before_script:
# - apt-get update
# - apt-get --yes --force-yes install rsync
script:
- npm run commons
- npm run prod
- cp ./public/fr/index.html ./public/index.html
- for f in $(find -type l);do cp --remove-destination $(readlink -f $f) $f;done;
- mkdir "${HOME}/.ssh"
- chmod 700 "${HOME}/.ssh"
- echo -e "${DEPLOYEMENT_KNOWN_HOSTS}" > ${HOME}/.ssh/known_hosts;
- npm run sfs && npm run hos
- npm run prod -- --base=abc
- rm -r public/ && mv dist/ public/
- cp ./public/abc/fr/index.html ./public/abc/index.html
- cd public/abc && for f in $(find -type l);do cp --remove-destination $(readlink -f $f) $f;done;
- eval `ssh-agent -s`
- ssh-add <(echo "${DEPLOYEMENT_KEY}" | base64 --decode -i);
- echo "put -r public/* ${DEPLOYEMENT_USER}/" | sftp ${DEPLOYEMENT_USER}@${DEPLOYEMENT_HOST};
- ssh-add <(echo "${DEPLOYMENT_KEY}" | base64 --decode -i);
- echo "put -r ." | sftp -o "VerifyHostKeyDNS yes" ${DEPLOYMENT_USER}@${DEPLOYMENT_HOST}:abc/;
# - rsync -a --rsh='ssh -o "VerifyHostKeyDNS yes"' --delete . ${DEPLOYMENT_USER}@${DEPLOYMENT_HOST}:abc/;
only:
refs:
- master
variables:
- $DEPLOYEMENT_KEY
- $DEPLOYEMENT_KNOWN_HOSTS
- $DEPLOYEMENT_USER
- $DEPLOYEMENT_HOST
- $DEPLOYMENT_KEY
- $DEPLOYMENT_USER
- $DEPLOYMENT_HOST
backup-locales:
mkdir -p tools/backup/
cp -r app/locales/* tools/backup/
restore-locales:
cp -r tools/backup/* app/locales/
clean-locales: backup-locales
cd tools && ./cleanyml.sh
diff-locales:
(meld app/locales/ tools/backup/ &)
preview:
npm run preview
build:
npm run prod
[![](https://upload.wikimedia.org/wikipedia/commons/thumb/1/18/GitLab_Logo.svg/48px-GitLab_Logo.svg.png)](https://framagit.org)
[![](https://framasoft.org/nav/img/icons/ati/sites/git.png)](https://framagit.org)
🇬🇧 English: **Framasoft uses GitLab** for the development of its free softwares. Our Github repositories are only mirrors.
🇬🇧 **Framasoft uses GitLab** for the development of its free softwares. Our Github repositories are only mirrors.
If you want to work with us, **fork us on [framagit.org](https://framagit.org)**. (no registration needed, you can sign in with your Github account)
🇫🇷 Français : **Framasoft utilise GitLab** pour le développement de ses logiciels libres. Nos dépôts Github ne sont que des miroirs.
🇫🇷 **Framasoft utilise GitLab** pour le développement de ses logiciels libres. Nos dépôts Github ne sont que des miroirs.
Si vous souhaitez travailler avec nous, **forkez-nous sur [framagit.org](https://framagit.org)**. (l'inscription n'est pas nécessaire, vous pouvez vous connecter avec votre compte Github)
* * *
......@@ -12,4 +12,4 @@ Framacalc est un tableur collaboratif en ligne que Framasoft propose sur le site
Il repose sur le logiciel [Ethercalc](https://ethercalc.net/) que nous avons à peine retouché : traduction (intégrée officiellement dans ethercalc), page d'accueil et ajout de la [Framanav](https://framagit.org/framasoft/framanav) dans les fichiers `index.html` et `multi/index.html` d’Ethercalc (bien que ce dernier ne soit pas utilisé vu que nous avons désactivé les calcs multi-feuille).
Ce dépôt ne contient pas Ethercalc, juste la page d’accueil.
* * *
\ No newline at end of file
* * *
<template>
<div
id="app"
class="container ombre"
>
<vue-headful
:title="meta.title"
:description="meta.description"
:html="{ body: {id: $route.meta.id } }"
:lang="$route.meta.lang"
:head="{
'link[rel^=shortcut]': {href: meta.favicon},
'link[rel=apple-touch-icon]': {href: meta.appleicon},
'link[rel=canonical]': {href: meta.url},
'meta[property^=og][property$=title]': {content: meta.title},
'meta[property^=og][property$=image]': {content: meta.img},
'meta[property^=og][property$=url]': {content: meta.url},
'meta[property^=og][property$=description]': {content: meta.description},
'meta[name^=twitter][name$=title]': {content: meta.title},
'meta[name^=twitter][name$=image]': {content: meta.img},
'meta[name^=twitter][name$=description]': {content: meta.description},
'meta[name=author]': {content: meta.author},
'link#preload-0': preload[0],
'link#preload-1': preload[1],
'link#preload-2': preload[2],
'link#preload-3': preload[3],
'link#preload-4': preload[4],
'link#preload-5': preload[5],
'link#preload-6': preload[6],
'link#preload-7': preload[7],
'link#preload-8': preload[8],
'link#preload-9': preload[9],
}"
/>
<header-component />
<router-view />
</div>
</template>
<script>
import HeaderComponent from './components/partials/Header.vue';
export default {
name: 'App',
components: {
HeaderComponent,
},
data() {
/* Title */
let title = this.$t('meta.title', '-t'); // Main title
if (this.$te(`${this.$route.meta.id}.title`)) {
// Main title - Page title
title = `${title} - ${this.$t(`${this.$route.meta.id}.title`, '-t')}`;
}
/* Description */
const description = this.$te(`meta.${this.$route.meta.id}.description`)
? this.$t(`meta.${this.$route.meta.id}.description`)
: this.$t('meta.description', '-t');
/* Preload */
const preload = []; /* array of { href: '', as: '' } */
const nodes = 10; /* link[rel="preload"] in index.html */
let preloadList = []; /* main and route files to preload */
const mainList = this.$te('meta.preload') ? this.$t('meta.preload') : [];
const routeList = this.$te(`meta.${this.$route.meta.id}.preload`)
? this.$t(`meta.${this.$route.meta.id}.preload`)
: [];
/* merge main (in first) and route (in priority) list */
preloadList = mainList.slice(0, (nodes - routeList.length)).concat(routeList);
/* Fill with empty string */
while (preloadList.length < nodes) {
preloadList.push('');
}
for (let i = 0; i < preloadList.length; i += 1) {
let type = '';
if (/\.(png|jpg|gif|webp)$/.test(preloadList[i])) { type = 'image'; }
if (/\.(ttf|eot|woff|woff2)$/.test(preloadList[i])) { type = 'font'; }
if (/\.(webm|mp4)$/.test(preloadList[i])) { type = 'video'; }
preload[i] = {
href: preloadList[i].replace(/^\//, this.$t('baseurl')),
as: type,
};
}
return {
meta: {
title,
description,
author: this.$te('meta.author') ? this.$t('meta.author') : '',
img: `${this.$t('baseurl')}img/opengraph/${this.$route.meta.id}.jpg`,
url: `${this.$t('meta.canonical')}${this.$route.path}`,
favicon: `${this.$t('baseurl')}img/icons/favicon.png`,
appleicon: `${this.$t('baseurl')}img/icons/apple-touch-icon.png`,
},
i18n: process.env.NODE_ENV !== 'prod' ? this.$i18n.messages : '',
preload,
};
},
created() {
if (this.$route.meta.lang !== undefined
&& this.$i18n.locale !== this.$route.meta.lang) {
this.$i18n.locale = this.$route.meta.lang;
}
},
};
</script>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 512"><path d="M537.6 226.6c4.1-10.7 6.4-22.4 6.4-34.6 0-53-43-96-96-96-19.7 0-38.1 6-53.3 16.2C367 64.2 315.3 32 256 32c-88.4 0-160 71.6-160 160 0 2.7.1 5.4.2 8.1C40.2 219.8 0 273.2 0 336c0 79.5 64.5 144 144 144h368c70.7 0 128-57.3 128-128 0-61.9-44-113.6-102.4-125.4z"/></svg>
\ No newline at end of file
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 384 512"><path d="M192 0C86 0 0 214 0 320s86 192 192 192 192-86 192-192S298 0 192 0z"/></svg>
\ No newline at end of file
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 512"><path d="M152.1 236.2c-3.5-12.1-7.8-33.2-7.8-33.2h-.5s-4.3 21.1-7.8 33.2l-11.1 37.5H163zM616 96H336v320h280c13.3 0 24-10.7 24-24V120c0-13.3-10.7-24-24-24zm-24 120c0 6.6-5.4 12-12 12h-11.4c-6.9 23.6-21.7 47.4-42.7 69.9 8.4 6.4 17.1 12.5 26.1 18 5.5 3.4 7.3 10.5 4.1 16.2l-7.9 13.9c-3.4 5.9-10.9 7.8-16.7 4.3-12.6-7.8-24.5-16.1-35.4-24.9-10.9 8.7-22.7 17.1-35.4 24.9-5.8 3.5-13.3 1.6-16.7-4.3l-7.9-13.9c-3.2-5.6-1.4-12.8 4.2-16.2 9.3-5.7 18-11.7 26.1-18-7.9-8.4-14.9-17-21-25.7-4-5.7-2.2-13.6 3.7-17.1l6.5-3.9 7.3-4.3c5.4-3.2 12.4-1.7 16 3.4 5 7 10.8 14 17.4 20.9 13.5-14.2 23.8-28.9 30-43.2H412c-6.6 0-12-5.4-12-12v-16c0-6.6 5.4-12 12-12h64v-16c0-6.6 5.4-12 12-12h16c6.6 0 12 5.4 12 12v16h64c6.6 0 12 5.4 12 12zM0 120v272c0 13.3 10.7 24 24 24h280V96H24c-13.3 0-24 10.7-24 24zm58.9 216.1L116.4 167c1.7-4.9 6.2-8.1 11.4-8.1h32.5c5.1 0 9.7 3.3 11.4 8.1l57.5 169.1c2.6 7.8-3.1 15.9-11.4 15.9h-22.9a12 12 0 0 1-11.5-8.6l-9.4-31.9h-60.2l-9.1 31.8c-1.5 5.1-6.2 8.7-11.5 8.7H70.3c-8.2 0-14-8.1-11.4-15.9z"/></svg>
\ No newline at end of file
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512"><path d="M546.2 9.7c-5.6-12.5-21.6-13-28.3-1.2C486.9 62.4 431.4 96 368 96h-80C182 96 96 182 96 288c0 7 .8 13.7 1.5 20.5C161.3 262.8 253.4 224 384 224c8.8 0 16 7.2 16 16s-7.2 16-16 16C132.6 256 26 410.1 2.4 468c-6.6 16.3 1.2 34.9 17.5 41.6 16.4 6.8 35-1.1 41.8-17.3 1.5-3.6 20.9-47.9 71.9-90.6 32.4 43.9 94 85.8 174.9 77.2C465.5 467.5 576 326.7 576 154.3c0-50.2-10.8-102.2-29.8-144.6z"/></svg>
\ No newline at end of file
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path d="M416 208H272V64c0-17.67-14.33-32-32-32h-32c-17.67 0-32 14.33-32 32v144H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h144v144c0 17.67 14.33 32 32 32h32c17.67 0 32-14.33 32-32V304h144c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z"/></svg>
\ No newline at end of file
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M504 256c0 136.997-111.043 248-248 248S8 392.997 8 256C8 119.083 119.043 8 256 8s248 111.083 248 248zM262.655 90c-54.497 0-89.255 22.957-116.549 63.758-3.536 5.286-2.353 12.415 2.715 16.258l34.699 26.31c5.205 3.947 12.621 3.008 16.665-2.122 17.864-22.658 30.113-35.797 57.303-35.797 20.429 0 45.698 13.148 45.698 32.958 0 14.976-12.363 22.667-32.534 33.976C247.128 238.528 216 254.941 216 296v4c0 6.627 5.373 12 12 12h56c6.627 0 12-5.373 12-12v-1.333c0-28.462 83.186-29.647 83.186-106.667 0-58.002-60.165-102-116.531-102zM256 338c-25.365 0-46 20.635-46 46 0 25.364 20.635 46 46 46s46-20.636 46-46c0-25.365-20.635-46-46-46z"/></svg>
\ No newline at end of file
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M149.333 56v80c0 13.255-10.745 24-24 24H24c-13.255 0-24-10.745-24-24V56c0-13.255 10.745-24 24-24h101.333c13.255 0 24 10.745 24 24zm181.334 240v-80c0-13.255-10.745-24-24-24H205.333c-13.255 0-24 10.745-24 24v80c0 13.255 10.745 24 24 24h101.333c13.256 0 24.001-10.745 24.001-24zm32-240v80c0 13.255 10.745 24 24 24H488c13.255 0 24-10.745 24-24V56c0-13.255-10.745-24-24-24H386.667c-13.255 0-24 10.745-24 24zm-32 80V56c0-13.255-10.745-24-24-24H205.333c-13.255 0-24 10.745-24 24v80c0 13.255 10.745 24 24 24h101.333c13.256 0 24.001-10.745 24.001-24zm-205.334 56H24c-13.255 0-24 10.745-24 24v80c0 13.255 10.745 24 24 24h101.333c13.255 0 24-10.745 24-24v-80c0-13.255-10.745-24-24-24zM0 376v80c0 13.255 10.745 24 24 24h101.333c13.255 0 24-10.745 24-24v-80c0-13.255-10.745-24-24-24H24c-13.255 0-24 10.745-24 24zm386.667-56H488c13.255 0 24-10.745 24-24v-80c0-13.255-10.745-24-24-24H386.667c-13.255 0-24 10.745-24 24v80c0 13.255 10.745 24 24 24zm0 160H488c13.255 0 24-10.745 24-24v-80c0-13.255-10.745-24-24-24H386.667c-13.255 0-24 10.745-24 24v80c0 13.255 10.745 24 24 24zM181.333 376v80c0 13.255 10.745 24 24 24h101.333c13.255 0 24-10.745 24-24v-80c0-13.255-10.745-24-24-24H205.333c-13.255 0-24 10.745-24 24z"/></svg>
\ No newline at end of file
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 352 512"><path d="M242.72 256l100.07-100.07c12.28-12.28 12.28-32.19 0-44.48l-22.24-22.24c-12.28-12.28-32.19-12.28-44.48 0L176 189.28 75.93 89.21c-12.28-12.28-32.19-12.28-44.48 0L9.21 111.45c-12.28 12.28-12.28 32.19 0 44.48L109.28 256 9.21 356.07c-12.28 12.28-12.28 32.19 0 44.48l22.24 22.24c12.28 12.28 32.2 12.28 44.48 0L176 322.72l100.07 100.07c12.28 12.28 32.2 12.28 44.48 0l22.24-22.24c12.28-12.28 12.28-32.19 0-44.48L242.72 256z"/></svg>
\ No newline at end of file
@import '~fork-awesome/scss/variables';
@import '~fork-awesome/scss/mixins';
@import '~fork-awesome/scss/functions';
@font-face {
font-family: 'ForkAwesome';
src: url('~fork-awesome/fonts/forkawesome-webfont.woff2') format('woff2'),
url('~fork-awesome/fonts/forkawesome-webfont.woff') format('woff');
font-weight: normal;
font-style: normal;
}
@import '~fork-awesome/scss/core';
@import '~fork-awesome/scss/larger';
@import '~fork-awesome/scss/fixed-width';
@import '~fork-awesome/scss/list';
@import '~fork-awesome/scss/bordered-pulled';
@import '~fork-awesome/scss/animated';
@import '~fork-awesome/scss/rotated-flipped';
@import '~fork-awesome/scss/stacked';
@import '~fork-awesome/scss/icons';
@import '~fork-awesome/scss/screen-reader';
\ No newline at end of file
@import '~vue-fs-commons/app/assets/scss/frama/bootstrap4/alert';
@import '~vue-fs-commons/app/assets/scss/frama/bootstrap4/badge';
@import '~vue-fs-commons/app/assets/scss/frama/bootstrap4/buttons';
@import '~vue-fs-commons/app/assets/scss/frama/bootstrap4/links';
@import '~vue-fs-commons/app/assets/scss/frama/bootstrap4/type&code';
@import '~vue-fs-commons/app/assets/scss/frama/bootstrap4/carousel';
#f-i18n {
button {
color: $secondary;
fill: $secondary;
border: none;
&:hover {
color: $light;
fill: $light;
}
}
&.show button{
color: $light;
fill: $light;
}
li a {
background: transparent;
&:hover, &focus {
background-color: $light;
}
}
}
@import '~vue-fs-commons/app/assets/scss/frama/colors';
/* Variables */
/* Brown variant
$bsColor: (('f', 7), ('m', 7), ('m', 8), ('m', 2), ('b', 7), ('v', 6), ('o', 7), ('r', 8), ('d', 7));
$bgcolor: c(m, 3);
$secondary: bs(c, 2);
$dark: bs(c, 3);
$light: bs(c, 4);
*/
$ombre: 0px 3px 4px rgba(50, 50, 50, 0.2);
$img-ombre: 0px 2px 6px rgba(50, 50, 50, 0.4);
$carousel-ombre: 0px 3px 3px rgba(50, 50, 50, 0.5);
$button-ombre: 0px 1px 1px rgba(50, 50, 50, 0.5);
/* Frameworks */
@import 'frameworks/bootstrap4';
/* Fonts */
@import 'fonts/dejavu-sans';
@import 'fonts/roboto';
/* Frama */
@import 'frama/bootstrap4';
@import '~vue-fs-commons/app/assets/scss/frama/common';
<template>
<main>
<div class="row mt-4">
<div class="col-lg-8">
<p class="text-center">
<img
:src="`${$t('/')}img/${$t('lang')}/screenshot.png`"
alt=""
class="ombre"
/>
</p>
<div class="mx-5 pt-3">
<b-card bg-variant="light">
<b-card-text>
<b-form>
<fieldset>
<legend v-html="$t('public.title')"></legend>
<b-form-group
label-cols-sm="4"
label-cols-lg="3"
:label="$t('public.name')"
label-for="name"
>
<b-form-input
id="name"
v-model="name"
type="text"
maxlength="50"
@focusout="name = $t(` ${name}`, '-L@').replace(/[.]/g, '')"
/>
</b-form-group>
<div class="text-center col-sm-12">
<b-button
type="submit"
size="lg"
variant="primary"
@click="create"
>
<svg-icon
:label="$t('public.create')"
name="th"
/>
</b-button>
</div>
<p
class="small text-muted mb-0 mt-3"
v-html="$t('public.help')"
></p>
</fieldset>
</b-form>
</b-card-text>
</b-card>
</div>
</div>
<div class="col-lg-4">
<h2 v-html="$t('what.title')"></h2>
<div v-html="$t('what.md')"></div>
<div v-html="$t('how', { link: `https://lite.framacalc.org/CalcDeTest` })"></div>
</div>
</div>
<div class="row mt-4">
<!-- Help -->
<div class="col-md-4">
<h2 v-html="$t('help.title')"></h2>
<svg-icon
name="question-circle"
size="3x"
variant="fc-g6 d-block text-center mb-3"
/>
<div v-html="$t('help.md', { link: 'https://contact.framasoft.org/faq/#framacalc' })"></div>
</div>
<!-- About software -->
<div class="col-md-4">
<h2 v-html="$t('software.title')"></h2>
<svg-icon
name="cloud"
size="3x"
variant="fc-g6 d-block text-center mb-3"
/>
<div v-html="$t('software.md')">
</div>
</div>
<!-- Garden -->
<div class="col-md-4">
<h2 v-html="$t('garden.title')"></h2>
<svg-icon
name="leaf"
size="3x"
variant="fc-g6 d-block text-center mb-3"
/>
<div v-html="$t('garden.md')"></div>
</div>
</div>
</main>
</template>
<script>
export default {
data() {
/* Random alphanumeric name with 10 chars */
const name = [...Array(10)].map(() => Math.random().toString(36)[3]).join('')
.replace(/(.|$)/g, c => c[!Math.round(Math.random()) ? 'toString' : 'toLowerCase']());
return {
modal: {
open: false,
},
prefix: Math.trunc(new Date().getTime() / 3600000).toString(36),
name,
};
},
methods: {
create(event) {
event.preventDefault();
window.location = `https://lite.framacalc.org/${this.prefix}-${this.name}`;
},
},
};
</script>
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment