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

Make the friends list from the share modal reusable

Browse Source
This commit is contained in:
yflory
2019-08-28 15:29:38 +02:00
parent 28b2341f2c
commit f6762f7c01
8 changed files with 256 additions and 126 deletions
Download Patch File Download Diff File Expand all files Collapse all files

81
customize.dist/src/less2/include/alertify.less
View File

@@ -1,6 +1,8 @@
@import (reference) "./colortheme-all.less";
@import (reference) "./browser.less";
@import (reference) "./variables.less";
@import (reference) "./avatar.less";
@import (reference) "./tools.less";
.alertify_main() {
--LessLoader_require: LessLoader_currentFile();
@@ -195,6 +197,9 @@
}
& > div.alertify-tabs-content-active {
display: block;
&.cp-share-columns {
display: flex;
}
}
}
}
@@ -260,6 +265,10 @@
color: @alertify-btn-fg;
border: 1px solid @colortheme_alertify-cancel-border;
&.no-margin {
margin: 0;
}
&.safe, &.danger {
color: @colortheme_old-base;
white-space: normal;
@@ -413,5 +422,77 @@
}
}
}
div.wide {
.cp-share-columns {
display: flex;
flex-flow: row;
.cp-share-column {
width: 50%;
padding: 0 10px;
}
}
.cp-share-grid, .cp-share-list {
.avatar_main(50px);
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}
.cp-share-list {
margin-bottom: 15px;
}
.cp-share-grid {
max-height: 228px;
overflow-x: auto;
}
.cp-recent-only {
.cp-share-grid, .cp-share-grid-filter {
display: none;
}
}
.cp-share-grid-filter {
display: flex;
input {
flex: 1;
min-width: 0;
margin-bottom: 0 !important;
&::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
color: @colortheme_alertify-primary-text;
opacity: 1; /* Firefox */
}
}
margin-bottom: 15px;
}
.cp-share-friend {
width: 70px;
height: 70px;
display: flex;
flex-flow: column;
justify-content: center;
align-items: center;
padding: 5px;
margin-bottom: 6px;
cursor: default;
transition: order 0.5s, background-color 0.5s;
.tools_unselectable();
&.cp-selected {
background-color: @colortheme_alertify-primary;
color: @colortheme_alertify-primary-text;
order: -1 !important;
}
.cp-share-friend-name {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
width: 100%;
text-align: center;
}
border: 1px solid @colortheme_alertify-primary;
&.cp-fake-friend {
visibility: hidden;
}
}
}
}

86
customize.dist/src/less2/include/share.less
View File

@@ -1,86 +0,0 @@
@import (reference) "./colortheme-all.less";
@import (reference) './modal.less';
@import (reference) './alertify.less';
@import (reference) './avatar.less';
@import (reference) './checkmark.less';
@import (reference) './password-input.less';
@import (reference) "./tools.less";
.share_main () {
.alertify_main();
.checkmark_main(20px);
.password_main();
.modal_main();
.cp-share-columns {
display: flex;
flex-flow: row;
.cp-share-column {
width: 50%;
padding: 0 10px;
}
}
.cp-share-grid, .cp-share-list {
.avatar_main(50px);
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}
.cp-share-list {
margin-bottom: 15px;
}
.cp-share-grid {
max-height: 228px;
overflow-x: auto;
}
.cp-recent-only {
.cp-share-grid, .cp-share-grid-filter {
display: none;
}
}
.cp-share-grid-filter {
display: flex;
input {
flex: 1;
min-width: 0;
margin-bottom: 0 !important;
&::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
color: @colortheme_alertify-primary-text;
opacity: 1; /* Firefox */
}
}
margin-bottom: 15px;
}
.cp-share-friend {
width: 70px;
height: 70px;
display: flex;
flex-flow: column;
justify-content: center;
align-items: center;
padding: 5px;
margin-bottom: 6px;
cursor: default;
transition: order 0.5s, background-color 0.5s;
.tools_unselectable();
&.cp-selected {
background-color: @colortheme_alertify-primary;
color: @colortheme_alertify-primary-text;
order: -1 !important;
}
.cp-share-friend-name {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
width: 100%;
text-align: center;
}
border: 1px solid @colortheme_alertify-primary;
&.cp-fake-friend {
visibility: hidden;
}
}
}