632 lines
21 KiB
Plaintext
632 lines
21 KiB
Plaintext
@import (reference) '../../customize/src/less2/include/tools.less';
|
|
@import (reference) '../../customize/src/less2/include/avatar.less';
|
|
@import (reference) "../../customize/src/less2/include/framework.less";
|
|
@import (reference) "../../customize/src/less2/include/markdown.less";
|
|
|
|
&.cp-app-poll {
|
|
|
|
.framework_main(
|
|
@bg-color: @colortheme_apps[poll],
|
|
);
|
|
|
|
@poll-fore: #555;
|
|
|
|
@poll-th-bg: @cp_poll-th-bg;
|
|
@poll-th-fg: @cp_poll-th-fg;
|
|
@poll-th-user-bg: darken(@poll-th-bg, 10%);
|
|
@poll-editing: lighten(@poll-th-bg, 10%);
|
|
@poll-winner: darken(@poll-th-bg, 15%);
|
|
@poll-highlighted: lighten(@poll-th-bg, 15%);
|
|
@poll-td-bg: @poll-th-bg;
|
|
@poll-td-fg: @poll-th-fg;
|
|
|
|
@poll-uncommitted-cell: @cp_poll-uncommitted-bg;
|
|
@poll-uncommitted-text: @cp_poll-cell-fg;
|
|
@poll-cover-color: @cp_poll-cell-fg;
|
|
|
|
@poll-border-color: @cp_poll-border-color;
|
|
@poll-option-green: @cp_poll-yes;
|
|
@poll-option-red: @cp_poll-no;
|
|
@poll-option-yellow: @cp_poll-maybe;
|
|
@poll-option-gray: @cp_poll-unset;
|
|
|
|
.bottom-left(@s: 5px) { border-bottom-left-radius: @s; }
|
|
.top-left(@s: 5px) { border-top-left-radius: @s; }
|
|
|
|
display: flex;
|
|
flex-flow: column;
|
|
overflow-x: hidden;
|
|
|
|
#cp-app-poll-content {
|
|
display: flex;
|
|
flex: 1;
|
|
min-height: 0;
|
|
background-color: @cp_app-bg;
|
|
#cp-app-poll-form {
|
|
flex: 1;
|
|
overflow-y: auto;
|
|
&.cp-app-poll-readonly {
|
|
#cp-app-poll-table-scroll {
|
|
max-width: ~"calc(75% - 30px - 100px)";
|
|
}
|
|
table {
|
|
width: 100%;
|
|
}
|
|
table tr td:last-child {
|
|
margin-left: 0; // uncommitted is hidden
|
|
}
|
|
td.cp-app-poll-table-uncommitted {
|
|
display: none;
|
|
}
|
|
}
|
|
&.cp-app-poll-published {
|
|
#cp-app-poll-create-option {
|
|
display: none;
|
|
}
|
|
.cp-app-poll-table-remove[data-rt-id^="y"], .cp-app-poll-table-edit[data-rt-id^="y"] {
|
|
display: none;
|
|
}
|
|
tr.cp-app-poll-table-uncommitted {
|
|
display: none;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
input[type="text"], textarea {
|
|
border: 0;
|
|
}
|
|
|
|
input[type="text"][disabled], textarea[disabled] {
|
|
background-color: transparent;
|
|
border: 0px;
|
|
}
|
|
|
|
// The placeholder color only seems to effect Safari when not set
|
|
|
|
input[type="text"][disabled]::placeholder {
|
|
color: @poll-th-fg;
|
|
opacity: 1;
|
|
}
|
|
|
|
table#cp-app-poll-table {
|
|
margin: 0px;
|
|
overflow: hidden;
|
|
}
|
|
#cp-app-poll-table-container {
|
|
position: relative;
|
|
margin: 20px;
|
|
}
|
|
#cp-app-poll-table-container button {
|
|
border-radius: 0;
|
|
}
|
|
#cp-app-poll-create-user {
|
|
display: inline-flex;
|
|
height: 20px;
|
|
padding: 0 5px;
|
|
margin: 2px auto;
|
|
width: auto;
|
|
overflow: hidden;
|
|
}
|
|
#cp-app-poll-create-option {
|
|
order: 3;
|
|
display: inline-flex;
|
|
width: 46px;
|
|
height: 20px;
|
|
margin: 2px;
|
|
padding: 0;
|
|
}
|
|
#cp-app-poll-table-scroll {
|
|
overflow-y: hidden;
|
|
overflow-x: auto;
|
|
margin-left: 25%;
|
|
max-width: ~"calc(75% - 100px - 100px)";
|
|
width: auto;
|
|
display: inline-block;
|
|
}
|
|
.cp-markdown-toolbar {
|
|
margin: auto;
|
|
min-width: 80%;
|
|
width: 80%;
|
|
}
|
|
#cp-app-poll-description {
|
|
&~ .CodeMirror {
|
|
margin: auto;
|
|
min-width: 80%;
|
|
width: 80%;
|
|
min-height: 200px;
|
|
height: 200px;
|
|
border: 1px solid @cp_forms-border;
|
|
.CodeMirror-placeholder {
|
|
color: #777;
|
|
}
|
|
}
|
|
}
|
|
#cp-app-poll-description-published {
|
|
display: none;
|
|
padding: 15px;
|
|
margin: auto;
|
|
|
|
min-width: 80%;
|
|
width: 80%;
|
|
min-height: 7em;
|
|
color: @poll-uncommitted-text;
|
|
border: 1px solid transparent;
|
|
background-color: @poll-uncommitted-cell;
|
|
font: @colortheme_app-font;
|
|
text-align: left;
|
|
media-tag > * {
|
|
max-width: 100%;
|
|
max-height: 20em;
|
|
}
|
|
}
|
|
div.cp-app-poll-published {
|
|
div.cp-app-poll-realtime {
|
|
#cp-app-poll-description {
|
|
display: none;
|
|
&~ .CodeMirror {
|
|
display: none;
|
|
}
|
|
}
|
|
#cp-app-poll-description-published {
|
|
display: block;
|
|
&:empty {
|
|
display: none;
|
|
}
|
|
}
|
|
#cp-app-poll-nocomments {
|
|
display: none;
|
|
}
|
|
#cp-app-poll-comments {
|
|
display: block;
|
|
color: @cryptpad_text_col;
|
|
}
|
|
}
|
|
}
|
|
|
|
// from cryptpad.less
|
|
|
|
#cp-app-poll-table-container {
|
|
table {
|
|
border-collapse: collapse;
|
|
border-spacing: 0;
|
|
}
|
|
tbody {
|
|
* {
|
|
box-sizing: border-box;
|
|
}
|
|
tr {
|
|
text-align: center;
|
|
}
|
|
|
|
td {
|
|
.tools_unselectable();
|
|
border-right: 1px solid @poll-border-color;
|
|
padding: 12px;
|
|
padding-top: 0px;
|
|
padding-bottom: 0px;
|
|
&:last-child {
|
|
border-right: none;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
div.cp-app-poll-realtime {
|
|
display: block;
|
|
max-height: 100%;
|
|
max-width: 100%;
|
|
|
|
input {
|
|
&[type="text"] {
|
|
height: 1em;
|
|
margin: 0px;
|
|
}
|
|
}
|
|
> textarea {
|
|
width: 50%;
|
|
height: 15vh;
|
|
}
|
|
|
|
padding: 0px;
|
|
margin: 0px;
|
|
|
|
#cp-app-poll-table-container {
|
|
.cp-app-poll-table-scrolled {
|
|
tr td:last-child {
|
|
right: 0;
|
|
}
|
|
tr td:nth-last-child(2) {
|
|
right: 100px;
|
|
}
|
|
}
|
|
|
|
table {
|
|
border-collapse: collapse;
|
|
width: ~"calc(100% - 1px)";
|
|
.cp-app-poll-table-editing {
|
|
background-color: @poll-editing;
|
|
}
|
|
.cp-app-poll-table-uncommitted {
|
|
.cp-app-poll-table-cover {
|
|
background-color: @poll-uncommitted-cell !important;
|
|
}
|
|
div.cp-app-poll-table-text-cell {
|
|
background-color: @poll-uncommitted-cell !important;
|
|
color: @poll-uncommitted-text !important;
|
|
}
|
|
text-align: center;
|
|
background-color: @poll-uncommitted-cell !important;
|
|
color: @poll-uncommitted-text !important;
|
|
}
|
|
tr {
|
|
height: 28px;
|
|
/* Options */
|
|
td:first-child {
|
|
position:absolute;
|
|
left: 0;
|
|
top: auto;
|
|
width: 25%;
|
|
}
|
|
/* Uncommitted column */
|
|
td:nth-last-child(2) {
|
|
position: absolute;
|
|
top: auto;
|
|
width: 100px;
|
|
min-width: unset !important;
|
|
height: auto !important;
|
|
}
|
|
/* Results */
|
|
td:last-child {
|
|
color: @poll-th-fg;
|
|
position:absolute;
|
|
top: auto;
|
|
margin-left: 100px;
|
|
width: 100px;
|
|
min-width: unset !important;
|
|
background-color: @poll-th-bg;
|
|
}
|
|
td {
|
|
padding: 0px;
|
|
margin: 0px;
|
|
|
|
div.cp-app-poll-table-text-cell {
|
|
height: 28px;
|
|
padding: 0px;
|
|
margin: 0px;
|
|
display: flex;
|
|
align-items: center;
|
|
.cp-app-poll-table-remove {
|
|
order: 1;
|
|
}
|
|
.cp-app-poll-table-edit {
|
|
order: 3;
|
|
}
|
|
input {
|
|
min-width: 0;
|
|
order: 2;
|
|
flex: 1;
|
|
height: 24px;
|
|
border: 0px;
|
|
margin: 2px;
|
|
&[disabled] {
|
|
background-color: transparent;
|
|
color: @poll-td-fg;
|
|
//font-weight: bold;
|
|
}
|
|
}
|
|
}
|
|
|
|
&.cp-app-poll-table-checkbox-cell {
|
|
margin: 0px;
|
|
padding: 0px;
|
|
height: 100%;
|
|
min-width: 100px;
|
|
|
|
div.cp-app-poll-table-checkbox-contain {
|
|
display: inline-block;
|
|
height: 100%;
|
|
width: 100%;
|
|
position: relative;
|
|
|
|
label {
|
|
background-color: transparent;
|
|
display: block;
|
|
position: absolute;
|
|
top: 0px;
|
|
left: 0px;
|
|
height: 100%;
|
|
width: 100%;
|
|
}
|
|
|
|
input {
|
|
&[type="number"] {
|
|
&:not(.editable) {
|
|
display: none;
|
|
|
|
~ .cp-app-poll-table-cover {
|
|
line-height: 28px;
|
|
display: block;
|
|
font-weight: bold;
|
|
height: 100%;
|
|
display: block;
|
|
|
|
color: @poll-cover-color;
|
|
|
|
&:after {
|
|
height: 100%;
|
|
}
|
|
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
input[type="number"][value="0"] {
|
|
~ .cp-app-poll-table-cover {
|
|
background-color: @poll-option-red;
|
|
&:after { content: "✖"; }
|
|
}
|
|
}
|
|
input[type="number"][value="1"] {
|
|
~ .cp-app-poll-table-cover {
|
|
background-color: @poll-option-green;
|
|
&:after { content: "✔"; }
|
|
}
|
|
}
|
|
input[type="number"][value="2"] {
|
|
~ .cp-app-poll-table-cover {
|
|
background-color: @poll-option-yellow;
|
|
&:after { content: "~"; }
|
|
}
|
|
}
|
|
input[type="number"][value="3"] {
|
|
~ .cp-app-poll-table-cover {
|
|
background-color: @poll-option-gray;
|
|
&:after { content: "?"; }
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
input {
|
|
&[type="text"] {
|
|
height: auto;
|
|
width: 80%;
|
|
}
|
|
}
|
|
span {
|
|
.tools_unselectable();
|
|
}
|
|
thead {
|
|
height: 52px;
|
|
tr {
|
|
height: 52px;
|
|
}
|
|
td {
|
|
padding: 0px 5px;
|
|
background: @poll-th-bg;
|
|
color: @poll-th-fg;
|
|
&:not(:last-child) {
|
|
border-right: 1px solid rgba(255,255,255,0.2);
|
|
}
|
|
&:last-child {
|
|
height: 52px;
|
|
line-height: 52px;
|
|
text-align: center;
|
|
}
|
|
&:nth-last-child(2) {
|
|
border-right: 1px solid @poll-border-color;
|
|
}
|
|
&.cp-app-poll-table-own {
|
|
background: @poll-th-user-bg;
|
|
.cp-app-poll-table-lock {
|
|
cursor: default;
|
|
}
|
|
}
|
|
.cp-app-poll-table-buttons {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
flex-wrap: wrap;
|
|
align-items: center;
|
|
span {
|
|
cursor: pointer;
|
|
width: 1em;
|
|
text-align: center;
|
|
}
|
|
.cp-app-poll-table-bookmark {
|
|
color: darken(@poll-th-fg, 30%);
|
|
&.cp-app-poll-table-bookmark-full {
|
|
color: @poll-th-fg;
|
|
}
|
|
}
|
|
}
|
|
input {
|
|
&[type="text"] {
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
break-after: always;
|
|
width: ~"calc(100% - 2px)"; // borders...
|
|
box-sizing: border-box;
|
|
padding: 1px 5px;
|
|
margin: 1px;
|
|
margin-bottom: 5px;
|
|
&[disabled] {
|
|
color: @poll-th-fg;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
tbody {
|
|
td:first-child {
|
|
background: @poll-td-bg;
|
|
color: @poll-td-fg;
|
|
}
|
|
td.cp-app-poll-table-winner {
|
|
background-color: @poll-winner;
|
|
&:last-child { font-weight: bold; }
|
|
}
|
|
.cp-app-poll-table-text-cell {
|
|
input[type="text"] {
|
|
width: ~"calc(100% - 50px)";
|
|
padding: 0 0.5em;
|
|
}
|
|
.cp-app-poll-table-edit {
|
|
float:right;
|
|
margin: 2px 10px 0 0;
|
|
}
|
|
.cp-app-poll-table-remove {
|
|
float: left;
|
|
margin: 2px 0 0 10px;
|
|
}
|
|
}
|
|
tr:not(:first-child) {
|
|
td:not(:first-child) {
|
|
label {
|
|
border-top: 1px solid @poll-border-color;
|
|
}
|
|
}
|
|
}
|
|
tr:not(:last-child) {
|
|
&:hover {
|
|
td:first-child {
|
|
background-color: @poll-highlighted;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
.cp-app-poll-table-edit {
|
|
//color: @poll-cover-color;
|
|
cursor: pointer;
|
|
float: left;
|
|
margin-left: 10px;
|
|
}
|
|
|
|
tfoot {
|
|
display: none;
|
|
}
|
|
}
|
|
}
|
|
#cp-app-poll-nocomments {
|
|
color: @cp_poll-hint;
|
|
text-align: center;
|
|
margin: 20px;
|
|
font: @colortheme_app-font;
|
|
}
|
|
#cp-app-poll-comments {
|
|
width: 50%;
|
|
margin: 20px auto;
|
|
min-width: 400px;
|
|
padding-bottom: 5px;
|
|
display: none;
|
|
button {
|
|
border-radius: 0;
|
|
}
|
|
#cp-app-poll-comments-add {
|
|
input, textarea {
|
|
border: 1px solid @cp_forms-border;
|
|
width: 90%;
|
|
margin: 5px 5%;
|
|
}
|
|
input {
|
|
padding: 5px;
|
|
height: 26px;
|
|
&[disabled] {
|
|
background: @poll-uncommitted-cell;
|
|
}
|
|
}
|
|
textarea {
|
|
padding: 5px;
|
|
height: 8em;
|
|
line-height: 1.5em;
|
|
}
|
|
button {
|
|
padding: 10px;
|
|
}
|
|
text-align: center;
|
|
}
|
|
#cp-app-poll-comments-list {
|
|
.cp-app-poll-comments-list-el {
|
|
width: 90%;
|
|
margin: 5px 5%;
|
|
}
|
|
.cp-app-poll-comments-list-msg {
|
|
display: flex;
|
|
background: @poll-uncommitted-cell;
|
|
color: @cryptpad_text_col;
|
|
padding: 5px 10px;
|
|
.cp-app-poll-comments-list-msg-text {
|
|
flex: 1;
|
|
white-space: pre-wrap;
|
|
}
|
|
.cp-app-poll-comments-list-msg-actions {
|
|
button {
|
|
padding: 0;
|
|
width: 25px;
|
|
line-height: 20px;
|
|
}
|
|
}
|
|
}
|
|
.cp-app-poll-comments-list-data {
|
|
background: @poll-option-gray;
|
|
color: @cryptpad_text_col;
|
|
padding: 5px 10px;
|
|
display: flex;
|
|
align-items: center;
|
|
.cp-app-poll-comments-list-data-name {
|
|
color: @cryptpad_color_link;
|
|
margin-left: 10px;
|
|
flex: 1;
|
|
}
|
|
.cp-app-poll-comments-list-data-avatar { .avatar_main(30px); }
|
|
}
|
|
}
|
|
}
|
|
|
|
@media screen and (max-width: 500px) {
|
|
#cp-app-poll-table-scroll {
|
|
max-width: 100%;
|
|
padding: 0;
|
|
margin: 0;
|
|
table {
|
|
tr {
|
|
td {
|
|
&:first-child {
|
|
position: unset;
|
|
min-width: 100px;
|
|
&:hover:not(:empty) {
|
|
position: absolute;
|
|
min-width: 100px;
|
|
width: auto;
|
|
z-index: 100;
|
|
}
|
|
}
|
|
&:nth-last-child(2) {
|
|
position: unset;
|
|
}
|
|
&:last-child {
|
|
position: unset;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
#cp-app-poll-comments {
|
|
min-width: 90%;
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
.btn {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
}
|
|
|
|
}
|