Add a footer to the html pages

pull/1/head
yflory 8 years ago
parent 02439e0f61
commit 9c4c378d6a

@ -75,6 +75,48 @@
</div> </div>
<footer>
<div class="container">
<div class="row">
<div class="col">
<ul class="list-unstyled">
<li>CryptPad<li>
<li><a href="/about" data-localization="about"></a></li>
<li><a href="/terms" data-localization="terms"></a></li>
<li><a href="/privacy" data-localization="privacy"></a></li>
</ul>
</div>
<div class="col">
<ul class="list-unstyled">
<li data-localization="footer_applications"><li>
<li><a href="/pad/" data-localization="main_richText"></a></li>
<li><a href="#" data-localization="main_code"></a></li>
<li><a href="#" data-localization="main_slide"></a></li>
<li><a href="#" data-localization="main_poll"></a></li>
<li><a href="#" data-localization="main_drive"></a></li>
</ul>
</div>
<div class="col">
<ul class="list-unstyled">
<li data-localization="footer_aboutUs"><li>
<li><a href="https://labs.xwiki.com" target="_blank" rel="noopener noreferrer">XWiki Labs</a></li>
<li><a href="http://www.xwiki.com" target="_blank" rel="noopener noreferrer">XWiki SAS</a></li>
<li><a href="https://www.openpass.fr/" target="_blank" rel="noopener noreferrer">OpenPaSS</a></li>
</ul>
</div>
<div class="col">
<ul class="list-unstyled">
<li data-localization="footer_contact"><li>
<li><a href="http://webchat.freenode.net?channels=%23cryptpad&uio=MT1mYWxzZSY5PXRydWUmMTE9Mjg3JjE1PXRydWUe7" target="_blank" rel="noopener noreferrer">IRC</a></li>
<li><a href="https://twitter.com/cryptpad" target="_blank" rel="noopener noreferrer">Twitter</a></li>
<li><a href="https://github.com/xwiki-labs/cryptpad" target="_blank" rel="noopener noreferrer">GitHub</a></li>
<li><a href="/contact">Email</a></li>
</ul>
</div>
</div>
</div>
</footer>
</body> </body>
</html> </html>

@ -72,6 +72,48 @@
</div> </div>
<footer>
<div class="container">
<div class="row">
<div class="col">
<ul class="list-unstyled">
<li>CryptPad<li>
<li><a href="/about" data-localization="about"></a></li>
<li><a href="/terms" data-localization="terms"></a></li>
<li><a href="/privacy" data-localization="privacy"></a></li>
</ul>
</div>
<div class="col">
<ul class="list-unstyled">
<li data-localization="footer_applications"><li>
<li><a href="/pad/" data-localization="main_richText"></a></li>
<li><a href="#" data-localization="main_code"></a></li>
<li><a href="#" data-localization="main_slide"></a></li>
<li><a href="#" data-localization="main_poll"></a></li>
<li><a href="#" data-localization="main_drive"></a></li>
</ul>
</div>
<div class="col">
<ul class="list-unstyled">
<li data-localization="footer_aboutUs"><li>
<li><a href="https://labs.xwiki.com" target="_blank" rel="noopener noreferrer">XWiki Labs</a></li>
<li><a href="http://www.xwiki.com" target="_blank" rel="noopener noreferrer">XWiki SAS</a></li>
<li><a href="https://www.openpass.fr/" target="_blank" rel="noopener noreferrer">OpenPaSS</a></li>
</ul>
</div>
<div class="col">
<ul class="list-unstyled">
<li data-localization="footer_contact"><li>
<li><a href="http://webchat.freenode.net?channels=%23cryptpad&uio=MT1mYWxzZSY5PXRydWUmMTE9Mjg3JjE1PXRydWUe7" target="_blank" rel="noopener noreferrer">IRC</a></li>
<li><a href="https://twitter.com/cryptpad" target="_blank" rel="noopener noreferrer">Twitter</a></li>
<li><a href="https://github.com/xwiki-labs/cryptpad" target="_blank" rel="noopener noreferrer">GitHub</a></li>
<li><a href="/contact">Email</a></li>
</ul>
</div>
</div>
</div>
</footer>
</body> </body>
</html> </html>

@ -198,6 +198,48 @@
</div> </div>
</div> </div>
<footer>
<div class="container">
<div class="row">
<div class="col">
<ul class="list-unstyled">
<li>CryptPad<li>
<li><a href="/about" data-localization="about"></a></li>
<li><a href="/terms" data-localization="terms"></a></li>
<li><a href="/privacy" data-localization="privacy"></a></li>
</ul>
</div>
<div class="col">
<ul class="list-unstyled">
<li data-localization="footer_applications"><li>
<li><a href="/pad/" data-localization="main_richText"></a></li>
<li><a href="#" data-localization="main_code"></a></li>
<li><a href="#" data-localization="main_slide"></a></li>
<li><a href="#" data-localization="main_poll"></a></li>
<li><a href="#" data-localization="main_drive"></a></li>
</ul>
</div>
<div class="col">
<ul class="list-unstyled">
<li data-localization="footer_aboutUs"><li>
<li><a href="https://labs.xwiki.com" target="_blank" rel="noopener noreferrer">XWiki Labs</a></li>
<li><a href="http://www.xwiki.com" target="_blank" rel="noopener noreferrer">XWiki SAS</a></li>
<li><a href="https://www.openpass.fr/" target="_blank" rel="noopener noreferrer">OpenPaSS</a></li>
</ul>
</div>
<div class="col">
<ul class="list-unstyled">
<li data-localization="footer_contact"><li>
<li><a href="http://webchat.freenode.net?channels=%23cryptpad&uio=MT1mYWxzZSY5PXRydWUmMTE9Mjg3JjE1PXRydWUe7" target="_blank" rel="noopener noreferrer">IRC</a></li>
<li><a href="https://twitter.com/cryptpad" target="_blank" rel="noopener noreferrer">Twitter</a></li>
<li><a href="https://github.com/xwiki-labs/cryptpad" target="_blank" rel="noopener noreferrer">GitHub</a></li>
<li><a href="/contact">Email</a></li>
</ul>
</div>
</div>
</div>
</footer>
</body> </body>
</html> </html>

@ -455,6 +455,11 @@
#cryptpadTopBar .right a:hover { #cryptpadTopBar .right a:hover {
text-decoration: underline; text-decoration: underline;
} }
footer {
background: #cccccc;
font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
padding-top: 1em;
}
html.cp, html.cp,
.cp body { .cp body {
font-size: .875em; font-size: .875em;
@ -568,6 +573,10 @@ html.cp,
font-family: lato, Helvetica, sans-serif; font-family: lato, Helvetica, sans-serif;
font-size: 1.02em; font-size: 1.02em;
} }
.cp body.html {
display: flex;
flex-flow: column;
}
.cp .page { .cp .page {
width: 100%; width: 100%;
margin-left: auto; margin-left: auto;
@ -710,6 +719,8 @@ html.cp,
background-size: cover; background-size: cover;
background-attachment: fixed; background-attachment: fixed;
background-position: center; background-position: center;
height: calc(100vh - 115px);
min-height: 450px;
} }
.cp #main .hidden { .cp #main .hidden {
display: none !important; display: none !important;
@ -721,13 +732,14 @@ html.cp,
.cp .category { .cp .category {
margin-top: 5px; margin-top: 5px;
} }
.cp #mainBlock {
flex: 1;
}
.cp #main, .cp #main,
.cp #main_other { .cp #main_other {
position: relative; position: relative;
left: 0; left: 0;
right: 0; right: 0;
height: calc(100vh - 115px);
min-height: 450px;
margin: auto; margin: auto;
z-index: 1; z-index: 1;
font-size: medium; font-size: medium;

@ -94,6 +94,48 @@
</div> </div>
<footer>
<div class="container">
<div class="row">
<div class="col">
<ul class="list-unstyled">
<li>CryptPad<li>
<li><a href="/about" data-localization="about"></a></li>
<li><a href="/terms" data-localization="terms"></a></li>
<li><a href="/privacy" data-localization="privacy"></a></li>
</ul>
</div>
<div class="col">
<ul class="list-unstyled">
<li data-localization="footer_applications"><li>
<li><a href="/pad/" data-localization="main_richText"></a></li>
<li><a href="#" data-localization="main_code"></a></li>
<li><a href="#" data-localization="main_slide"></a></li>
<li><a href="#" data-localization="main_poll"></a></li>
<li><a href="#" data-localization="main_drive"></a></li>
</ul>
</div>
<div class="col">
<ul class="list-unstyled">
<li data-localization="footer_aboutUs"><li>
<li><a href="https://labs.xwiki.com" target="_blank" rel="noopener noreferrer">XWiki Labs</a></li>
<li><a href="http://www.xwiki.com" target="_blank" rel="noopener noreferrer">XWiki SAS</a></li>
<li><a href="https://www.openpass.fr/" target="_blank" rel="noopener noreferrer">OpenPaSS</a></li>
</ul>
</div>
<div class="col">
<ul class="list-unstyled">
<li data-localization="footer_contact"><li>
<li><a href="http://webchat.freenode.net?channels=%23cryptpad&uio=MT1mYWxzZSY5PXRydWUmMTE9Mjg3JjE1PXRydWUe7" target="_blank" rel="noopener noreferrer">IRC</a></li>
<li><a href="https://twitter.com/cryptpad" target="_blank" rel="noopener noreferrer">Twitter</a></li>
<li><a href="https://github.com/xwiki-labs/cryptpad" target="_blank" rel="noopener noreferrer">GitHub</a></li>
<li><a href="/contact">Email</a></li>
</ul>
</div>
</div>
</div>
</footer>
</body> </body>
</html> </html>

@ -31,12 +31,13 @@ var fragments = {};
'contact', 'contact',
'logo', 'logo',
'noscript', 'noscript',
'footer'
].forEach(function (name) { ].forEach(function (name) {
fragments[name] = read('./fragments/' + name + '.html'); fragments[name] = read('./fragments/' + name + '.html');
}); });
// build static pages // build static pages
['index', 'privacy', 'terms', 'about', 'contact',].forEach(function (page) { ['index', 'privacy', 'terms', 'about', 'contact'].forEach(function (page) {
var source = swap(template, { var source = swap(template, {
topbar: fragments.topbar, topbar: fragments.topbar,
fork: fragments.fork, fork: fragments.fork,
@ -45,9 +46,11 @@ var fragments = {};
fork: fragments.fork, fork: fragments.fork,
logo: fragments.logo, logo: fragments.logo,
noscript: fragments.noscript, noscript: fragments.noscript,
footer: fragments.footer,
}), }),
logo: fragments.logo, logo: fragments.logo,
noscript: fragments.noscript, noscript: fragments.noscript,
footer: fragments.footer,
}); });
write('../' + page + '.html', source); write('../' + page + '.html', source);
}); });

@ -0,0 +1,41 @@
<footer>
<div class="container">
<div class="row">
<div class="col">
<ul class="list-unstyled">
<li>CryptPad<li>
<li><a href="/about" data-localization="about"></a></li>
<li><a href="/terms" data-localization="terms"></a></li>
<li><a href="/privacy" data-localization="privacy"></a></li>
</ul>
</div>
<div class="col">
<ul class="list-unstyled">
<li data-localization="footer_applications"><li>
<li><a href="/pad/" data-localization="main_richText"></a></li>
<li><a href="#" data-localization="main_code"></a></li>
<li><a href="#" data-localization="main_slide"></a></li>
<li><a href="#" data-localization="main_poll"></a></li>
<li><a href="#" data-localization="main_drive"></a></li>
</ul>
</div>
<div class="col">
<ul class="list-unstyled">
<li data-localization="footer_aboutUs"><li>
<li><a href="https://labs.xwiki.com" target="_blank" rel="noopener noreferrer">XWiki Labs</a></li>
<li><a href="http://www.xwiki.com" target="_blank" rel="noopener noreferrer">XWiki SAS</a></li>
<li><a href="https://www.openpass.fr/" target="_blank" rel="noopener noreferrer">OpenPaSS</a></li>
</ul>
</div>
<div class="col">
<ul class="list-unstyled">
<li data-localization="footer_contact"><li>
<li><a href="http://webchat.freenode.net?channels=%23cryptpad&uio=MT1mYWxzZSY5PXRydWUmMTE9Mjg3JjE1PXRydWUe7" target="_blank" rel="noopener noreferrer">IRC</a></li>
<li><a href="https://twitter.com/cryptpad" target="_blank" rel="noopener noreferrer">Twitter</a></li>
<li><a href="https://github.com/xwiki-labs/cryptpad" target="_blank" rel="noopener noreferrer">GitHub</a></li>
<li><a href="/contact">Email</a></li>
</ul>
</div>
</div>
</div>
</footer>

@ -6,6 +6,7 @@
@import "./loading.less"; @import "./loading.less";
@import "./dropdown.less"; @import "./dropdown.less";
@import "./topbar.less"; @import "./topbar.less";
@import "./footer.less";
html.cp, .cp body { html.cp, .cp body {
font-size: .875em; font-size: .875em;
@ -127,6 +128,8 @@ p, pre, td, a, table, tr {
} }
body.html { body.html {
display:flex;
flex-flow: column;
} }
// Main page // Main page
@ -282,6 +285,8 @@ body.html {
background-size: cover; background-size: cover;
background-attachment: fixed; background-attachment: fixed;
background-position: center; background-position: center;
height: ~"calc(100vh - 115px)";
min-height: 450px;
.hidden { .hidden {
display: none !important; display: none !important;
} }
@ -295,12 +300,14 @@ body.html {
margin-top: 5px; margin-top: 5px;
} }
#mainBlock {
flex: 1;
}
#main, #main_other { #main, #main_other {
position: relative; position: relative;
left: 0; left: 0;
right: 0; right: 0;
height: ~"calc(100vh - 115px)";
min-height: 450px;
margin: auto; margin: auto;
z-index: 1; z-index: 1;

@ -0,0 +1,7 @@
@import "./variables.less";
footer {
background: @dark-base;
font-family: -apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
padding-top: 1em;
}

@ -26,6 +26,8 @@
<div id="mainBlock" class="hidden"> <div id="mainBlock" class="hidden">
{{main}} {{main}}
</div> </div>
{{footer}}
</body> </body>
</html> </html>

@ -76,6 +76,48 @@
</div> </div>
<footer>
<div class="container">
<div class="row">
<div class="col">
<ul class="list-unstyled">
<li>CryptPad<li>
<li><a href="/about" data-localization="about"></a></li>
<li><a href="/terms" data-localization="terms"></a></li>
<li><a href="/privacy" data-localization="privacy"></a></li>
</ul>
</div>
<div class="col">
<ul class="list-unstyled">
<li data-localization="footer_applications"><li>
<li><a href="/pad/" data-localization="main_richText"></a></li>
<li><a href="#" data-localization="main_code"></a></li>
<li><a href="#" data-localization="main_slide"></a></li>
<li><a href="#" data-localization="main_poll"></a></li>
<li><a href="#" data-localization="main_drive"></a></li>
</ul>
</div>
<div class="col">
<ul class="list-unstyled">
<li data-localization="footer_aboutUs"><li>
<li><a href="https://labs.xwiki.com" target="_blank" rel="noopener noreferrer">XWiki Labs</a></li>
<li><a href="http://www.xwiki.com" target="_blank" rel="noopener noreferrer">XWiki SAS</a></li>
<li><a href="https://www.openpass.fr/" target="_blank" rel="noopener noreferrer">OpenPaSS</a></li>
</ul>
</div>
<div class="col">
<ul class="list-unstyled">
<li data-localization="footer_contact"><li>
<li><a href="http://webchat.freenode.net?channels=%23cryptpad&uio=MT1mYWxzZSY5PXRydWUmMTE9Mjg3JjE1PXRydWUe7" target="_blank" rel="noopener noreferrer">IRC</a></li>
<li><a href="https://twitter.com/cryptpad" target="_blank" rel="noopener noreferrer">Twitter</a></li>
<li><a href="https://github.com/xwiki-labs/cryptpad" target="_blank" rel="noopener noreferrer">GitHub</a></li>
<li><a href="/contact">Email</a></li>
</ul>
</div>
</div>
</div>
</footer>
</body> </body>
</html> </html>

@ -308,7 +308,10 @@ define(function () {
out.main_slide_p = 'Créez vos présentations en syntaxe Markdown collaborativement de manière sécurisée et affichez les dans votre navigateur.'; out.main_slide_p = 'Créez vos présentations en syntaxe Markdown collaborativement de manière sécurisée et affichez les dans votre navigateur.';
out.main_poll = 'Sondages'; out.main_poll = 'Sondages';
out.main_poll_p = 'Plannifiez vos réunions ou évènements, ou votez pour la meilleure solution concernant votre problème.'; out.main_poll_p = 'Plannifiez vos réunions ou évènements, ou votez pour la meilleure solution concernant votre problème.';
out.main_drive = 'CryptDrive';
out.footer_applications = "Applications";
out.footer_contact = "Contact";
out.footer_aboutUs = "À propos de nous";
out.table_type = 'Type'; out.table_type = 'Type';
out.table_link = 'Lien'; out.table_link = 'Lien';
out.table_created = 'Créé le'; out.table_created = 'Créé le';

@ -312,7 +312,10 @@ define(function () {
out.main_slide_p = 'Create your presentations using the Markdown syntax, and display them in your browser.'; out.main_slide_p = 'Create your presentations using the Markdown syntax, and display them in your browser.';
out.main_poll = 'Polls'; out.main_poll = 'Polls';
out.main_poll_p = 'Plan your meeting or your event, or vote for the best solution regarding your problem.'; out.main_poll_p = 'Plan your meeting or your event, or vote for the best solution regarding your problem.';
out.main_drive = 'CryptDrive';
out.footer_applications = "Applications";
out.footer_contact = "Contact";
out.footer_aboutUs = "About us";
out.table_type = 'Type'; out.table_type = 'Type';
out.table_link = 'Link'; out.table_link = 'Link';
out.table_created = 'Created'; out.table_created = 'Created';

Loading…
Cancel
Save