web/cryptpad
2
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Merge branch 'staging' into oo2

Browse Source
This commit is contained in:
yflory
2018-12-13 16:24:11 +01:00
parent 855612e98b bca120a3ee
commit 760f58b74c
139 changed files with 16415 additions and 9509 deletions
Download Patch File Download Diff File Expand all files Collapse all files

32
customize.dist/src/less2/include/app-print.less
View File

@@ -46,6 +46,38 @@
display: block;
}
}
// Code app
body.cp-app-code {
display: block;
* {
visibility: hidden;
height: auto;
max-height: none;
}
#cme_toolbox {
display: none;
}
#cp-app-code-editor {
display: block;
#cp-app-code-container {
display: none;
}
#cp-app-code-preview {
display: block;
#cp-app-code-print {
display: block;
overflow: visible !important;
width: 100%;
visibility: visible;
* { visibility: visible; }
pre { border: none; }
}
#cp-app-code-preview-content {
display: none !important;
}
}
}
}
}
}
}

9
customize.dist/src/less2/include/corner.less
View File

@@ -43,6 +43,10 @@
//transform: scale(0.1);
//transform: scale(1);
h1, h2, h3 {
font-size: 1.5em;
}
.cp-corner-filler {
float: left;
clear: left;
@@ -94,6 +98,8 @@
.cp-corner-footer {
font-style: italic;
font-size: 0.8em;
}
.cp-corner-footer, .cp-corner-text {
a {
color: @corner-link;
&:hover {
@@ -103,10 +109,11 @@
}
button {
color: white;
border: 0px;
padding: 5px;
color: @colortheme_base;
margin-left: 5px;
outline: none;
&.cp-corner-primary {
background-color: @corner-button-ok;
font-weight: bold;

34
customize.dist/src/less2/include/cursor.less Normal file
View File

@@ -0,0 +1,34 @@
.cursor_main() {
// CodeMirror
.cp-codemirror-cursor {
cursor: default;
background-color: red;
background-clip: padding-box;
padding: 0 1px;
border: 2px solid red;
border-right-color: transparent !important;
border-left-color: transparent !important;
}
.cp-codemirror-selection {
background-color: rgba(255,0,0,0.3);
}
// Tippy
.cp-cursor-avatar {
@size: 32px;
display: flex;
align-items: center;
media-tag {
min-height: @size;
max-height: @size;
min-width: @size;
max-width: @size;
margin-right: 10px;
img {
border-radius: 4px;
max-height: 100%;
max-width: 100%;
}
}
}
}

4
customize.dist/src/less2/include/dropdown.less
View File

@@ -64,7 +64,7 @@
&:not(.fa) {
font: @dropdown_font;
}
&.fa {
&.fa, &.cptools {
font-size: 18px;
&::before {
width: 40px;
@@ -76,7 +76,7 @@
}
}
.fa {
.fa, .cptools {
width: 20px;
text-align: center;
margin-right: 5px !important;

6
customize.dist/src/less2/include/fileupload.less
View File

@@ -21,9 +21,11 @@
tr:nth-child(1) {
background-color: darken(@colortheme_modal-bg, 20%);
td {
text-align: center;
font-weight: bold;
padding: 0.25em;
&:nth-child(4), &:nth-child(5) {
text-align: center;
}
}
}
@upload_pad_h: 0.25em;
@@ -38,7 +40,7 @@
}
}
.cp-fileupload-table-progress {
width: 200px;
width: 25%;
position: relative;
text-align: center;
box-sizing: border-box;

4
customize.dist/src/less2/include/framework.less
View File

@@ -12,6 +12,8 @@
@import (reference) './font.less';
@import (reference) "./app-print.less";
@import (reference) "./app-noscroll.less";
@import (reference) "./messenger.less";
@import (reference) "./cursor.less";
.framework_main(@bg-color, @warn-color, @color) {
--LessLoader_require: LessLoader_currentFile();
@@ -36,6 +38,8 @@
.tippy_main();
.checkmark_main(20px);
.password_main();
.messenger_main();
.cursor_main();
.creation_main(
@bg-color: @bg-color,
@color: @color

10
customize.dist/src/less2/include/help.less
View File

@@ -38,7 +38,7 @@
color: @help-text-color;
color: var(--help-text-color);
margin: 0;
padding: 15px;
padding: 5px 15px;
a {
color: @help-link-color;
color: var(--help-link-color);
@@ -52,7 +52,13 @@
h3 {
font-size: 16px;
}
ul, ol, p { margin: 0; }
ul, ol, p, h1, h2, h3 { margin: 0; }
&.cp-help-small {
ul {
display: none;
}
cursor: pointer;
}
}
}
}

2
customize.dist/src/less2/include/icons.less
View File

@@ -28,7 +28,7 @@
background-color: rgba(0,0,0,0.2);
color: #666;
}
.fa {
.fa, .cptools {
display: block;
font-size: 64px;
margin: 18px 0;

2
customize.dist/src/less2/include/leftside-menu.less
View File

@@ -11,7 +11,7 @@
cursor: pointer;
height: @variables_bar-height;
line-height: @variables_bar-height - 10px;
.fa {
.fa, .cptools {
width: 25px;
}
&:hover {

5
customize.dist/src/less2/include/markdown.less
View File

@@ -28,9 +28,12 @@
border-collapse: collapse;
tr {
th {
border: 3px solid @color;
border: 1px solid @color;
padding: 15px;
}
td {
border: 1px solid @color;
}
}
}
}

382
customize.dist/src/less2/include/messenger.less Normal file
View File

@@ -0,0 +1,382 @@
@import (reference) './avatar.less';
@import (reference) "./colortheme-all.less";
.messenger_main() {
--LessLoader_require: LessLoader_currentFile();
};
& {
@keyframes example {
0% {
background: rgba(0,0,0,0.1);
}
50% {
background: rgba(0,0,0,0.3);
}
100% {
background: rgba(0,0,0,0.1);
}
}
@button-border: 2px;
@bg-color: @colortheme_friends-bg;
@color: @colortheme_friends-color;
@room-height: 48px;
#cp-app-contacts-container {
flex: 1;
display: flex;
justify-content: center;
align-items: center;
min-height: 0;
&.ready {
background-size: cover;
background-position: center;
}
}
.cp-app-contacts-spinner {
display: none;
}
.cp-app-contacts-initializing {
.cp-app-contacts-spinner {
color: white;
display: block;
}
.cp-app-contacts-info {
display: none;
}
#cp-app-contacts-friendlist,
#cp-app-contacts-messaging {
display: flex;
justify-content: center;
align-items: center;
}
}
#cp-app-contacts-friendlist {
width: 200px;
height: 100%;
background-color: lighten(@bg-color, 10%);
overflow-y: auto;
display: flex;
flex-flow: column;
.cp-app-contacts-friend {
background: rgba(0,0,0,0.1);
padding: 5px;
margin: 10px;
margin-bottom: 0;
cursor: pointer;
position: relative;
height: @room-height;
.cp-app-contacts-right-col {
margin-left: 5px;
display: flex;
flex-flow: column;
flex: 1;
min-width: 0;
.cp-app-contacts-name {
white-space: nowrap;
}
}
&:hover {
background-color: rgba(0,0,0,0.3);
}
&.cp-app-contacts-notify {
animation: example 2s ease-in-out infinite;
}
}
.cp-app-contacts-remove {
cursor: pointer;
width: 20px;
&:hover {
color: darken(@color, 20%);
}
}
.cp-app-contacts-category {
display: flex;
flex-flow: column;
flex-grow: 0;
flex-shrink: 0;
.cp-app-contacts-category-title {
order: 1;
font-size: 18px;
margin: 0px 5px;
text-align: center;
background: rgba(0,0,0,0.1);
font-weight: bold;
height: 22px;
line-height: 22px;
}
.cp-app-contacts-category-content {
order: 2;
display: flex;
flex-flow: column-reverse;
padding-bottom: 10px;
&:empty {
display: none;
& ~ .cp-app-contacts-category-title {
display: none;
}
}
}
}
}
#cp-app-contacts-container.cp-app-contacts-inapp {
#cp-app-contacts-friendlist {
display: none;
/*
transition: width 0.2s ease-in-out 0.2s;
width: 68px;
.cp-app-contacts-friend {
.cp-app-contacts-right-col {
overflow: hidden;
}
}
.cp-app-contacts-category-title {
transition: font-size 0.2s ease-in-out 0.2s;
margin: 0px 2px;
font-size: 16px;
}
&:hover {
transition-delay: 1.5s;
width: 200px !important;
.cp-app-contacts-category-title {
transition-delay: 1.5s;
font-size: 18px;
}
}
*/
}
}
#cp-app-contacts-friendlist .cp-app-contacts-friend, #cp-app-contacts-messaging .cp-avatar {
.avatar_main(30px);
&.cp-avatar {
display: flex;
}
cursor: pointer;
color: @color;
media-tag {
img {
color: #000;
}
}
media-tag, .cp-avatar-default {
//margin-right: 5px;
flex-shrink: 0;
z-index: 1;
margin: 4px;
}
.cp-app-contacts-status {
//width: 5px;
display: inline-block;
position: absolute;
//right: 0;
//top: 0;
//bottom: 0;
//opacity: 0.7;
//background-color: #777;
/* width: (@room-height - 6px);
top: 3px;
bottom: 3px;
left: 3px;
border-radius: 100%;
*/
width: 10px;
height: 10px;
top: 0;
right: 0;
border-bottom-left-radius: 100%;
&.cp-app-contacts-online {
//background-color: green;
//background-color: white;
background-color: #c5ffa8;
}
&.cp-app-contacts-offline {
display: none;
//background-color: red;
}
}
}
.placeholder (@color: #bbb) {
&::-webkit-input-placeholder { /* WebKit, Blink, Edge */
color: @color;
}
&:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
color: @color;
opacity: 1;
}
&::-moz-placeholder { /* Mozilla Firefox 19+ */
color: @color;
opacity: 1;
}
&:-ms-input-placeholder { /* Internet Explorer 10-11 */
color: @color;
}
&::-ms-input-placeholder { /* Microsoft Edge */
color: @color;
}
}
#cp-app-contacts-messaging {
flex: 1;
height: 100%;
background-color: lighten(@bg-color, 20%);
min-width: 0;
.cp-app-contacts-info {
padding: 20px;
}
.cp-app-contacts-header {
background-color: lighten(@bg-color, 15%);
padding: 0;
display: flex;
justify-content: space-between;
align-items: center;
height: 50px;
.hover () {
height: 100%;
line-height: 30px;
padding: 10px;
&:hover {
background-color: rgba(50,50,50,0.3);
}
}
.cp-avatar,
.cp-app-contacts-right-col {
flex: 1 1 auto;
}
.cp-app-contacts-remove-history {
.hover;
}
.cp-avatar {
margin: 10px;
}
.cp-app-contacts-more-history {
//display: none;
.hover;
&.cp-app-contacts-faded {
color: darken(@bg-color, 5%);
}
}
.cp-app-contacts-header-title {
padding: 10px;
flex: 1;
}
}
.cp-app-contacts-tips {
margin: 1em;
background-color: lighten(@bg-color, 15%);
font-size: 14px;
padding: 10px;
position: relative;
.cp-app-contacts-tips-close {
cursor: pointer;
position: absolute;
top: 2px;
right: 2px;
}
}
.cp-app-contacts-chat {
height: 100%;
display: flex;
flex-flow: column;
.cp-app-contacts-messages {
padding: 0 20px;
margin: 10px 0;
flex: 1;
overflow-x: auto;
.cp-app-contacts-message {
display: flex;
flex-wrap: wrap;
& > div {
padding: 0 10px;
}
.cp-app-contacts-content {
overflow: hidden;
word-wrap: break-word;
&> * {
margin: 0;
}
flex: 1;
min-width: 70%;
position: relative;
}
.cp-app-contacts-date {
display: none;
font-style: italic;
}
.cp-app-contacts-sender {
margin-top: 10px;
font-weight: bold;
background-color: rgba(0,0,0,0.1);
display: flex;
justify-content: space-between;
width: 100%;
}
.cp-app-contacts-time {
display: none;
font-size: 0.8em;
align-items: center;
color: @color;
font-weight: bold;
position: absolute;
right: 0;
top: 0;
bottom: 0;
background: rgba(0,0,0,0.3);
border-top-left-radius: 50%;
border-bottom-left-radius: 50%;
padding: 0 10px;
}
&:hover {
.cp-app-contacts-time {
display: flex;
}
}
}
}
}
.cp-app-contacts-input {
background-color: lighten(@bg-color, 15%);
height: auto;
min-height: 50px;
display: flex;
align-items: center;
justify-content: center;
padding: 0 5%;
textarea {
margin: 5px 0;
padding: 5px 10px;
border: none;
height: 54px; // 2 lines (22px height) + 2 margins (5px)
flex: 1;
background-color: darken(@bg-color, 10%);
color: @color;
resize: none;
overflow-y: auto;
.placeholder(#bbb);
&[disabled="true"] {
.placeholder(#999);
}
}
button {
height: 54px;
border-radius: 0;
border: none;
background-color: darken(@bg-color, 15%);
&:hover {
background-color: darken(@bg-color, 20%);
}
}
}
}
}

87
customize.dist/src/less2/include/toolbar.less
View File

@@ -72,6 +72,18 @@
.modal_main();
};
& {
@keyframes notification {
0% {
background: rgba(0,0,0,0);
}
50% {
background: rgba(0,0,0,0.2);
}
100% {
background: rgba(0,0,0,0);
}
}
.toolbar_vars();
@toolbar_line-height: 32px;
@toolbar_top-height: 64px;
@@ -134,9 +146,39 @@
}
}
.cp-toolbar-userlist-drawer {
.cp-toolbar-chat-drawer {
background-color: @toolbar-bg-color;
background-color: var(--toolbar-bg-color);
font: @colortheme_app-font-size @colortheme_font;
width: 20%;
min-width: 200px;
display: block;
overflow-y: auto;
overflow-x: hidden;
padding: 0;
box-sizing: border-box;
position: relative;
order: -2;
resize: horizontal;
#cp-app-contacts-container {
height: 100%;
}
.cp-toolbar-chat-drawer-close {
color: @toolbar-color;
color: var(--toolbar-color);
position: absolute;
top: 0;
right: 1px;
font-size: 15px;
opacity: 0.5;
cursor: pointer;
text-shadow: unset;
&:hover {
opacity: 1;
}
}
}
.cp-toolbar-userlist-drawer {
font: @colortheme_app-font-size @colortheme_font;
min-width: 175px;
width: 175px;
@@ -145,6 +187,7 @@
overflow-x: hidden;
padding: 10px;
box-sizing: border-box;
order: -3;
.cp-toolbar-userlist-drawer-close {
position: absolute;
margin-top: -10px;
@@ -192,6 +235,7 @@
padding: 5px;
margin: 2px 0;
background: rgba(0,0,0,0.1);
border-right: 3px solid transparent;
.avatar_main(30px);
.cp-avatar-default, media-tag {
margin-right: 5px;
@@ -219,6 +263,14 @@
display: flex;
justify-content: space-between;
align-items: center;
button {
width: 20px;
font-size: 16px;
padding: 0;
border: none;
height: 20px;
cursor: pointer;
}
}
.cp-toolbar-userlist-name-input {
flex: 1;
@@ -235,14 +287,6 @@
min-height: 0;
text-overflow: ellipsis;
}
.cp-toolbar-userlist-name-edit {
width: 20px;
font-size: 16px;
padding: 0;
border: none;
height: 20px;
cursor: pointer;
}
.cp-toolbar-userlist-friend {
padding: 0;
}
@@ -276,11 +320,15 @@
margin: 50px;
}
&> div {
flex: 1;
display: flex;
flex-wrap: wrap;
justify-content: center;
align-content: center;
overflow-y: auto;
}
&> div:last-child {
flex: unset;
margin: 50px 0;
}
}
@@ -299,13 +347,15 @@
margin-left: 5px;
}
@media screen and (max-height: @browser_media-not-big) {
@media screen and (max-height: @browser_media-medium-screen),
screen and (max-width: @browser_media-medium-screen) {
.cp-modal {
& > p {
display: none;
}
& > div {
align-content: unset;
align-items: center;
li {
height: 40px;
width: 200px;
@@ -313,9 +363,11 @@
align-items: center;
.fa {
font-size: 32px;
min-width: 50px;
}
.cp-icons-name {
height: auto;
text-align: left;
}
}
}
@@ -344,7 +396,7 @@
color: @toolbar-color;
color: var(--toolbar-color);
}
.cp-toolbar-userlist-name-edit {
.cp-toolbar-userlist-button {
color: @toolbar-userlist-name-edit;
color: var(--toolbar-userlist-name-edit);
background: transparent;
@@ -902,6 +954,9 @@
width: 100%;
cursor: default;
font-size: 32px;
display: inline-flex;
justify-content: center;
align-items: center;
}
&.cp-avatar {
.avatar_main(48px);
@@ -961,7 +1016,8 @@
height: @toolbar_line-height;
}
#cp-toolbar-userlist-drawer-open { order: 1; }
#cp-toolbar-userlist-drawer-open { order: 0; }
#cp-toolbar-chat-drawer-open { order: 1; }
.cp-toolbar-share-button { order: 2; }
.cp-toolbar-spinner { order: 3; }
@@ -969,6 +1025,11 @@
width: 125px;
text-align: center;
}
#cp-toolbar-chat-drawer-open button {
&.cp-toolbar-notification {
animation: notification 2s ease-in-out infinite;
}
}
.cp-toolbar-share-button {
width: 50px;
text-align: center;

49
customize.dist/src/less2/pages/page-features.less
View File

@@ -19,7 +19,7 @@
color: #fff;
}
}
#cp-features-register {
.cp-features-register {
text-align: center;
padding: 20px;
}
@@ -39,24 +39,51 @@
.card {
box-shadow: 0 5px 15px rgba(69, 145, 196, 0.3);
border: none;
.card-body {
display: flex;
justify-content: center;
align-items: center;
flex-flow: column;
h3 {
margin: 0;
}
}
}
h3 {
color: #fff;
}
.list-group {
li {
&:before {
content: "\f00c";
font-family: "FontAwesome";
font-size: 14px;
color: @cryptpad_color_blue;
padding-right: 10px;
}
display: flex;
padding-left: 0;
padding-right: 5px;
}
div {
display: inline;
&.cp-check {
width: 30px;
display: flex;
align-items: center;
justify-content: center;
&:before {
content: "\f00c";
font-family: "FontAwesome";
font-size: 14px;
color: @cryptpad_color_blue;
}
}
&.cp-content {
flex: 1;
display: flex;
flex-flow: column;
}
&.cp-feature {
font-weight: bold;
}
}
}
div.cp-note {
font-size: 0.8em;
}
a.voted {
opacity: 0.6;
margin-left: 15px;
@@ -70,7 +97,9 @@
}
.cp-anon-user {
.card-body {
background-color: @cryptpad_color_blue;
&:first-of-type {
background-color: @cryptpad_color_blue;
}
}
}
.cp-regis-user {

83
customize.dist/src/less2/pages/page-index.less
View File

@@ -21,6 +21,13 @@
margin-top: 6em;
}
}
& > .cp-container {
flex: 1;
display: flex;
flex-flow: column;
justify-content: space-around;
justify-content: space-evenly;
}
}
body {
font-family: "Open Sans", Helvetica;
@@ -142,22 +149,24 @@
.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;
.bs-callout {
.fa, .cptools {
display: flex;
align-items: center;
font-size: 2.5em;
justify-content: center;
width: 1.3em;
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-kanban .fa { background-color: @colortheme_kanban-bg; }
.cp-callout-whiteboard .fa { background-color: @colortheme_whiteboard-bg; }
.cp-callout-recent .fa { background-color: @colortheme_drive-bg; }
.cp-callout-pad .cptools { background-color: @colortheme_pad-bg; }
.cp-callout-code .cptools { background-color: @colortheme_code-bg; }
.cp-callout-slide .cptools { background-color: @colortheme_slide-bg; }
.cp-callout-poll .cptools { background-color: @colortheme_poll-bg; }
.cp-callout-kanban .cptools { background-color: @colortheme_kanban-bg; }
.cp-callout-whiteboard .cptools { background-color: @colortheme_whiteboard-bg; }
.cp-callout-drive .fa { background-color: @colortheme_drive-bg; }
.cp-hidden { display: none !important; }
.cp-callout-more {
display: inline-block;
@@ -172,7 +181,7 @@
div {
.infopages_link();
color: #fff;
.fa {
.fa, .cptools {
font-size: inherit;
padding: 0;
width: 1em;
@@ -180,6 +189,48 @@
}
}
}
.cp-index-block-help {
button {
outline: none;
background-color: @colortheme_logo-2;
color: @colortheme_base;
border: none;
padding: 10px 20px;
border-radius: 44px;
cursor: pointer;
&:hover {
background-color: lighten(@colortheme_logo-2, 3%);
}
}
}
.cp-index-block {
min-height: 100%;
& > div {
background: rgba(0,0,0,0.5);
margin: 0 5px;
padding: 15px 10px;
height: 100%;
display: flex;
flex-flow: column;
justify-content: space-evenly;
}
.cp-img-container {
display: flex;
}
img, a.img {
margin: auto;
background: white;
&.agpl {
max-height: 50px;
}
&.ngi {
max-height: 100px;
}
}
}
@media (min-width: 576px) and (max-width: 767px) {
.container {
padding-left: 0;