Merge branch 'staging' of github.com:xwiki-labs/cryptpad into staging
ansuz
8 years ago
commit
c8c44d3bfc
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 5.2 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 3.0 KiB After Width: | Height: | Size: 8.2 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 349 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 121 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 12 KiB |
Binary file not shown.
Binary file not shown.
|
After Width: | Height: | Size: 865 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 935 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 200 KiB |
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 83 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 284 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 38 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.0 MiB |
Binary file not shown.
|
Before Width: | Height: | Size: 2.8 KiB After Width: | Height: | Size: 8.3 KiB |
@ -0,0 +1,37 @@
|
||||
@colortheme_link-color: #0275D8;
|
||||
@colortheme_link-color-visited: #005999;
|
||||
@colortheme_info-background: #fafafa;
|
||||
|
||||
|
||||
@colortheme_pad-bg: #1c4fa0;
|
||||
@colortheme_pad-color: #fff;
|
||||
|
||||
@colortheme_slide-bg: #e57614;
|
||||
@colortheme_slide-color: #fff;
|
||||
|
||||
@colortheme_code-bg: #ffae00;
|
||||
@colortheme_code-color: #000;
|
||||
|
||||
@colortheme_poll-bg: #006304;
|
||||
@colortheme_poll-color: #fff;
|
||||
|
||||
@colortheme_whiteboard-bg: #800080;
|
||||
@colortheme_whiteboard-color: #fff;
|
||||
|
||||
@colortheme_drive-bg: #0087ff;
|
||||
@colortheme_drive-color: #fff;
|
||||
|
||||
@colortheme_file-bg: #cd2532;
|
||||
@colortheme_file-color: #fff;
|
||||
|
||||
@colortheme_friends-bg: #607B8D;
|
||||
@colortheme_friends-color: #fff;
|
||||
|
||||
@colortheme_default-bg: #ddd;
|
||||
@colortheme_default-color: #000;
|
||||
|
||||
@colortheme_settings-bg: #0087ff;
|
||||
@colortheme_settings-color: #fff;
|
||||
|
||||
@colortheme_profile-bg: #0087ff;
|
||||
@colortheme_profile-color: #fff;
|
||||
@ -0,0 +1,161 @@
|
||||
@import (once) "./colortheme.less";
|
||||
|
||||
@infopages_infobar-height: 64px;
|
||||
@infopages_padding: 32px;
|
||||
|
||||
// Basic setup for info pages, this should be used at the global level
|
||||
.infopages_main () {
|
||||
background-color: @colortheme_info-background;
|
||||
|
||||
a {
|
||||
color: @colortheme_link-color;
|
||||
&:visited { color: @colortheme_link-color-visited; }
|
||||
//opacity: 0.8;
|
||||
//transition: opacity 0.2s;
|
||||
}
|
||||
a:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
border: 0;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
|
||||
font-size: 14px;
|
||||
font-family: 'Open Sans', 'Helvetica Neue', sans-serif;
|
||||
|
||||
.cp-container {
|
||||
font-size: 16px;
|
||||
margin-top: @infopages_infobar-height;
|
||||
padding-top: @infopages_padding;
|
||||
padding-bottom: @infopages_padding;
|
||||
min-height: 75vh;
|
||||
h1 {
|
||||
font-size: 3em;
|
||||
margin-bottom: 0.5em;
|
||||
}
|
||||
h2 {
|
||||
font-size: 2em;
|
||||
margin-top: 1em;
|
||||
margin-bottom: 0.5em;
|
||||
}
|
||||
h3 {
|
||||
font-size: 1.5em;
|
||||
margin-top: 1em;
|
||||
margin-bottom: 0.5em;
|
||||
}
|
||||
|
||||
img {
|
||||
&.left {
|
||||
float: left;
|
||||
}
|
||||
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.form-group {
|
||||
& > * {
|
||||
margin-top: 0.5em;
|
||||
}
|
||||
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
|
||||
.checkbox-container {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
label {
|
||||
margin: 0;
|
||||
}
|
||||
input {
|
||||
margin-right: 0.5em;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
footer {
|
||||
background-color: white;
|
||||
|
||||
.container {
|
||||
.col {
|
||||
margin-top: 1em;
|
||||
}
|
||||
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
margin-bottom: 1em;
|
||||
|
||||
ul.list-unstyled {
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.cp-version-footer {
|
||||
background-color: @colortheme_info-background;
|
||||
color: black;
|
||||
text-align: center;
|
||||
padding: 0.5em;
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
.infopages_link () {
|
||||
text-decoration: none;
|
||||
color: #0275D8;
|
||||
cursor: pointer;
|
||||
display: inline-flex;
|
||||
&:hover {
|
||||
transform: scale(1.05);
|
||||
}
|
||||
}
|
||||
|
||||
// Apply this to the top bar div
|
||||
.infopages_topbar () {
|
||||
.cp-topbar {
|
||||
background: #fff;
|
||||
z-index: 9001;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
|
||||
box-sizing: border-box;
|
||||
width: 100%;
|
||||
height: @infopages_infobar-height;
|
||||
padding-left: 0.5em;
|
||||
padding-right: 0.5em;
|
||||
vertical-align: middle;
|
||||
font-size: 1.25em;
|
||||
line-height: 1.25em;
|
||||
|
||||
cursor: default;
|
||||
user-select: none;
|
||||
-moz-user-select: none;
|
||||
-webkit-user-select: none;
|
||||
-ms-user-select: none;
|
||||
|
||||
.navbar-nav {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
a {
|
||||
font-weight: 500;
|
||||
padding: 0.6em;
|
||||
.infopages_link()
|
||||
}
|
||||
|
||||
.cp-logo {
|
||||
img {
|
||||
height: @infopages_infobar-height / 2;
|
||||
}
|
||||
margin-right: 0.5em;
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,12 @@
|
||||
@font-face {
|
||||
font-family: Neuropolitical;
|
||||
src: url(./customize/fonts/neuropolitical.ttf)
|
||||
}
|
||||
div#cp-main.cp-page-index { @import "./pages/page-index.less"; }
|
||||
div#cp-main.cp-page-contact { @import "./pages/page-contact.less"; }
|
||||
div#cp-main.cp-page-login { @import "./pages/page-login.less"; }
|
||||
div#cp-main.cp-page-register { @import "./pages/page-register.less"; }
|
||||
div#cp-main.cp-page-what-is-cryptpad { @import "./pages/page-what-is-cryptpad.less"; }
|
||||
div#cp-main.cp-page-about { @import "./pages/page-about.less"; }
|
||||
div#cp-main.cp-page-privacy { @import "./pages/page-privacy.less"; }
|
||||
div#cp-main.cp-page-terms { @import "./pages/page-terms.less"; }
|
||||
@ -0,0 +1,12 @@
|
||||
@import (once) "../include/infopages.less";
|
||||
@import (once) "../include/colortheme.less";
|
||||
|
||||
.infopages_main();
|
||||
.infopages_topbar();
|
||||
|
||||
.bio-avatar {
|
||||
border-radius: 50%;
|
||||
margin: 1em 0;
|
||||
max-width: 300px;
|
||||
max-height: 300px;
|
||||
}
|
||||
@ -0,0 +1,9 @@
|
||||
@import (once) "../include/infopages.less";
|
||||
@import (once) "../include/colortheme.less";
|
||||
|
||||
.infopages_main();
|
||||
.infopages_topbar();
|
||||
|
||||
.fa {
|
||||
padding-right: 0.25em;
|
||||
}
|
||||
@ -0,0 +1,229 @@
|
||||
//@import (once) "./variables.less";
|
||||
|
||||
@import (once) "../include/infopages.less";
|
||||
@import (once) "../include/colortheme.less";
|
||||
|
||||
|
||||
.infopages_main();
|
||||
.infopages_topbar();
|
||||
|
||||
@background_lighter: rgba(0,0,0,0.1);
|
||||
@background_darker: rgba(0,0,0,0.4);
|
||||
&#cp-main {
|
||||
color: #FFF;
|
||||
background: linear-gradient( @background_darker, @background_lighter ), url('/customize/bg14.jpg');
|
||||
background-size: cover;
|
||||
min-height: 100vh;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-around;
|
||||
align-items: center;
|
||||
.container {
|
||||
@media only screen and (max-device-width : 576px) {
|
||||
margin-top: 6em;
|
||||
}
|
||||
}
|
||||
}
|
||||
.cp-right {
|
||||
.cp-register-btn {
|
||||
padding: 0.5em 1em 0.7em 1em;
|
||||
border: 2px solid #fff;
|
||||
&:hover {
|
||||
transform: scale(1.05);
|
||||
}
|
||||
}
|
||||
.cp-login-btn {
|
||||
color: #fff;
|
||||
padding: 0.5em 1em 0.7em 1em;
|
||||
&:hover {
|
||||
transform: scale(1.05);
|
||||
}
|
||||
}
|
||||
}
|
||||
.cp-title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
margin-top: 1.5em;
|
||||
img {
|
||||
height: 20vh;
|
||||
margin-bottom: 1.5em;
|
||||
}
|
||||
margin-left: 0;
|
||||
h1 {
|
||||
font-family: "Neuropolitical";
|
||||
//font-family: Garamond, Baskerville, "Baskerville Old Face", "Hoefler Text", "Times New Roman", Times, serif;
|
||||
//font-family: "Raleway";
|
||||
font-size: 45px;
|
||||
}
|
||||
p {
|
||||
//font-family: "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
|
||||
font-size: 20px;
|
||||
//font-style: italic;
|
||||
}
|
||||
}
|
||||
.cp-topbar {
|
||||
//position: absolute;
|
||||
background: transparent;
|
||||
a {
|
||||
color: #fff;
|
||||
padding: 0.5em 0.5em 0.5em 0.5em;
|
||||
}
|
||||
button:focus {
|
||||
outline: none;
|
||||
}
|
||||
.collapse {
|
||||
a {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
.navbar-toggler-left {
|
||||
top: -0.59rem;
|
||||
}
|
||||
.cp-left {
|
||||
.fa-bars {
|
||||
font-size: 1.6rem;
|
||||
}
|
||||
}
|
||||
a.cp-logo {
|
||||
display: none;
|
||||
}
|
||||
img {
|
||||
height: 5vh;
|
||||
margin-top: -4px;
|
||||
}
|
||||
&:hover {
|
||||
img {
|
||||
transform: none;
|
||||
}
|
||||
};
|
||||
a.cp-logo {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
@callout-padding: 15px;
|
||||
a:hover {
|
||||
text-decoration: none
|
||||
}
|
||||
.bs-callout {
|
||||
display: flex;
|
||||
align-items: stretch;
|
||||
margin: 25px 0;
|
||||
background:rgba(255,255,255,0.6);
|
||||
color: black;
|
||||
transition: all .1s ease-in-out;
|
||||
box-sizing: border-box;
|
||||
height: 5em;
|
||||
position: relative;
|
||||
a {
|
||||
color: black;
|
||||
&:hover { text-decoration-line: none; }
|
||||
}
|
||||
div {
|
||||
@media only screen and (min-device-width: 576px) and (max-device-width: 767px) {
|
||||
left: 4.5em !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
h4 {
|
||||
margin: 0;
|
||||
}
|
||||
.cp-callout-more-moremsg,.cp-callout-more-lessmsg {
|
||||
transform: none !important;
|
||||
}
|
||||
.bs-callout div {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
left: 5em;
|
||||
}
|
||||
.bs-callout+.bs-callout {
|
||||
margin-top: -5px;
|
||||
}
|
||||
|
||||
.bs-callout:hover {
|
||||
//color: white;
|
||||
transform: scale(1.05);
|
||||
cursor: pointer;
|
||||
}
|
||||
.bs-callout:hover .fa {
|
||||
//width: 100%;
|
||||
}
|
||||
.bs-callout:hover.cp-callout-more {
|
||||
transform: none !important;
|
||||
}
|
||||
.bs-callout .fa {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 2em;
|
||||
padding-left: 0.57em;
|
||||
width: 2em;
|
||||
transition: width 0.1s;
|
||||
color: #fff;
|
||||
}
|
||||
.cp-callout-pad .fa { background-color: @colortheme_pad-bg; }
|
||||
.cp-callout-code .fa { background-color: @colortheme_code-bg; }
|
||||
.cp-callout-slide .fa { background-color: @colortheme_slide-bg; }
|
||||
.cp-callout-poll .fa { background-color: @colortheme_poll-bg; }
|
||||
.cp-callout-whiteboard .fa { background-color: @colortheme_whiteboard-bg; }
|
||||
.cp-callout-recent .fa { background-color: @colortheme_drive-bg; }
|
||||
.cp-hidden { display: none !important; }
|
||||
.cp-callout-more {
|
||||
width: auto;
|
||||
display: inline-block;
|
||||
align-content: center;
|
||||
height: 2em;
|
||||
border-radius: 1em;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
margin-top: 0;
|
||||
background: none;
|
||||
width: 100%;
|
||||
div {
|
||||
.infopages_link();
|
||||
color: #fff;
|
||||
.fa {
|
||||
font-size: inherit;
|
||||
padding: 0;
|
||||
width: 1em;
|
||||
padding-left: 5px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.navbar-inverse .navbar-toggler {
|
||||
border-color: transparent;
|
||||
margin-top: -12px;
|
||||
padding: 0;
|
||||
}
|
||||
@media (min-width: 576px) and (max-width: 767px) {
|
||||
.container {
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
}
|
||||
div#cp-main.cp-page-index .cp-topbar .navbar-toggler-left {
|
||||
left: 5px;
|
||||
}
|
||||
}
|
||||
@media (max-width: 991px) {
|
||||
#menuCollapse {
|
||||
/*position: absolute;
|
||||
left: -131px;*/
|
||||
margin-top: 0.5em;
|
||||
text-align: right;
|
||||
}
|
||||
#menuCollapse a {
|
||||
width: 100%;
|
||||
text-align: right;
|
||||
}
|
||||
.navbar-nav a {
|
||||
text-align: right !important;
|
||||
}
|
||||
.cp-right .cp-login-btn {
|
||||
padding: 0.5em;
|
||||
}
|
||||
}
|
||||
.collapsing a {
|
||||
text-align: right !important;
|
||||
}
|
||||
@ -0,0 +1,17 @@
|
||||
@import (once) "../include/infopages.less";
|
||||
@import (once) "../include/colortheme.less";
|
||||
|
||||
.infopages_main();
|
||||
.infopages_topbar();
|
||||
|
||||
.form-group {
|
||||
.extra {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
|
||||
width: 100%;
|
||||
.login {
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,5 @@
|
||||
@import (once) "../include/infopages.less";
|
||||
@import (once) "../include/colortheme.less";
|
||||
|
||||
.infopages_main();
|
||||
.infopages_topbar();
|
||||
@ -0,0 +1,23 @@
|
||||
@import (once) "../include/infopages.less";
|
||||
@import (once) "../include/colortheme.less";
|
||||
|
||||
.infopages_main();
|
||||
.infopages_topbar();
|
||||
|
||||
.cp-container {
|
||||
.form-group {
|
||||
.checkbox-container {
|
||||
&:nth-of-type(1) {
|
||||
margin-top: 2em;
|
||||
}
|
||||
&:last-of-type {
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
}
|
||||
#register {
|
||||
margin-top: 16px;
|
||||
font-size: 1.25em;
|
||||
width: 30%;
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,5 @@
|
||||
@import (once) "../include/infopages.less";
|
||||
@import (once) "../include/colortheme.less";
|
||||
|
||||
.infopages_main();
|
||||
.infopages_topbar();
|
||||
@ -0,0 +1,9 @@
|
||||
@import (once) "../include/infopages.less";
|
||||
@import (once) "../include/colortheme.less";
|
||||
|
||||
.infopages_main();
|
||||
.infopages_topbar();
|
||||
|
||||
img#zeroknowledge {
|
||||
width: 100%;
|
||||
}
|
||||
@ -0,0 +1,20 @@
|
||||
# CryptPad Styling
|
||||
|
||||
How it works:
|
||||
* In this example, we use the index page, for each page we will have a corresponding class name and a corresponding less file.
|
||||
* The index page has a main div containing everything `<div id="cp-main" class="cp-page-index">`
|
||||
* There is a corresponding less file called `less2/pages/page-index.less`
|
||||
* Finally there is a corresponding line in main.less which imports that less file: `div#main.cp-page-index { @import "./pages/page-index.less"; }`
|
||||
* cp-page-index class means:
|
||||
* cp -> cryptpad
|
||||
* page -> this is a style for accessing a page's less file
|
||||
* index -> the name of the page and of the less file (page-index.less)
|
||||
* And everything which is standardized across pages is included from `page-index.less` as variables and mixins.
|
||||
|
||||
Rules:
|
||||
* All of our new classes and ids should start with `cp-`.
|
||||
* You may make as many files as you need, for different purposes, but they can only contain mixins and variables.
|
||||
* All mixins and variables must be prefixed with the name of the file where they're defined and and underscore.
|
||||
* e.g. `@colortheme_toolbar-poll-bg: #006304;` defined in `colortheme.less`
|
||||
* All mixin / variable files go in an `/include/` directory.
|
||||
* Document the meaning of your variable or mixin in a comment, consider that your mixin will be used by people other than you and if they do not have a definition of what it means, an update to it's style which seems logical to you might break their usage of it.
|
||||
@ -0,0 +1,16 @@
|
||||
<!DOCTYPE html>
|
||||
<html class="cp">
|
||||
<!-- If this file is not called customize.dist/src/template.html, it is generated -->
|
||||
<head>
|
||||
<title data-localization="main_title">CryptPad: Zero Knowledge, Collaborative Real Time Editing</title>
|
||||
<meta content="text/html; charset=utf-8" http-equiv="content-type"/>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
|
||||
<link rel="icon" type="image/png" href="/customize/main-favicon.png" id="favicon"/>
|
||||
<script async data-bootload="/customize/template.js" data-main="/common/boot.js?ver=1.0" src="/bower_components/requirejs/require.js?ver=2.1.15"></script>
|
||||
</head>
|
||||
<body class="html">
|
||||
<noscript>
|
||||
<p><strong>OOPS</strong> In order to do encryption in your browser, Javascript is really <strong>really</strong> required.</p>
|
||||
<p><strong>OUPS</strong> Afin de pouvoir réaliser le chiffrement dans votre navigateur, Javascript est <strong>vraiment</strong> nécessaire.</p>
|
||||
</noscript>
|
||||
</html>
|
||||
Binary file not shown.
Binary file not shown.
Loading…
Reference in New Issue