Skin Chalec
This commit is contained in:
Bastien Lacoste
croax
parent
9d1ccea428
commit
608514486e
|
|
@ -0,0 +1 @@
|
|||
fond_gris.jpg
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 337 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 182 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 270 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 95 KiB |
|
|
@ -0,0 +1,89 @@
|
|||
#button,
|
||||
body,
|
||||
form {
|
||||
border: none
|
||||
}
|
||||
|
||||
body {
|
||||
background: url(images/fond.jpg) center center no-repeat fixed #fff;
|
||||
font-family: Quicksand, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
|
||||
font-size: 16px;
|
||||
line-height: 1.42857143;
|
||||
color: #B11111;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
background-size: cover;
|
||||
}
|
||||
|
||||
#wrapper {
|
||||
border-top: none;
|
||||
margin-top: 0;
|
||||
padding: 0;
|
||||
background: 0 0;
|
||||
box-shadow: none
|
||||
}
|
||||
|
||||
input {
|
||||
color: #B11111;
|
||||
}
|
||||
|
||||
#inner {
|
||||
background: transparent;
|
||||
padding-top: 0;
|
||||
width: 350px;
|
||||
max-width: 350px;
|
||||
text-align: center;
|
||||
color:#B11111;
|
||||
}
|
||||
|
||||
#label {
|
||||
text-shadow: none;
|
||||
color: #b11111;
|
||||
font-weight: normal;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
#button {
|
||||
margin: 0 auto;
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
text-shadow: none;
|
||||
font-weight:bold;
|
||||
font-size: 23px;
|
||||
line-height: 1.8;
|
||||
color: #b11111;
|
||||
background: #00BDFF;
|
||||
border-radius: 7px;
|
||||
box-shadow: none;
|
||||
height: 53px;
|
||||
border: none;
|
||||
display: block;
|
||||
}
|
||||
|
||||
|
||||
button[type=submit] {
|
||||
border-top-right-radius: 3px;
|
||||
border-bottom-right-radius: 3px;
|
||||
left: 305px;
|
||||
color: #B11111;
|
||||
background: #00BDFF;
|
||||
border: none;
|
||||
top: 0;
|
||||
opacity: 1;
|
||||
transition: .2s background;
|
||||
}
|
||||
|
||||
#button:hover,
|
||||
button[type=submit]:hover {
|
||||
cursor: pointer;
|
||||
background: #ecb41a;
|
||||
color: #B11111;
|
||||
}
|
||||
|
||||
#padname {
|
||||
height: 38px;
|
||||
max-width: 350px;
|
||||
padding: 0 12px;
|
||||
position: relative;
|
||||
}
|
||||
|
|
@ -0,0 +1,7 @@
|
|||
'use strict';
|
||||
|
||||
window.customStart = () => {
|
||||
// define your javascript here
|
||||
// jquery is available - except index.js
|
||||
// you can load extra scripts with $.getScript http://api.jquery.com/jQuery.getScript/
|
||||
};
|
||||
|
|
@ -0,0 +1,70 @@
|
|||
@import url("src/general.css");
|
||||
@import url("src/layout.css");
|
||||
@import url("src/pad-editor.css");
|
||||
|
||||
@import url("src/components/scrollbars.css");
|
||||
@import url("src/components/buttons.css");
|
||||
@import url("src/components/popup.css");
|
||||
|
||||
@import url("src/components/chat.css");
|
||||
@import url("src/components/sidediv.css");
|
||||
@import url("src/components/gritter.css");
|
||||
@import url("src/components/table-of-content.css");
|
||||
@import url("src/components/toolbar.css");
|
||||
@import url("src/components/users.css");
|
||||
@import url("src/components/form.css");
|
||||
@import url("src/components/import-export.css");
|
||||
|
||||
@import url("src/plugins/brightcolorpicker.css");
|
||||
@import url("src/plugins/font_color.css");
|
||||
@import url("src/plugins/tables2.css");
|
||||
@import url("src/plugins/set_title_on_pad.css");
|
||||
@import url("src/plugins/author_hover.css");
|
||||
@import url("src/plugins/comments.css");
|
||||
|
||||
@import url("src/pad-variants.css");
|
||||
|
||||
/* -----------------------------------------------------------------
|
||||
* COLORS
|
||||
* If you want to change main colors, please replace following CSS variables
|
||||
* -----------------------------------------------------------------
|
||||
*/
|
||||
|
||||
:root {
|
||||
--super-dark-color: #485365; /*#374256;*/
|
||||
--dark-color: #576273; /*#4d5d77*/
|
||||
|
||||
--primary-color: #64d29b;
|
||||
--middle-color: #d2d2d2; /* kind of grey, use for border for examples */
|
||||
|
||||
--light-color: #f2f3f4; /*#f9f9f9;*/
|
||||
--super-light-color: white;
|
||||
|
||||
--text-color: var(--super-dark-color);
|
||||
--text-soft-color: var(--dark-color);
|
||||
--border-color: var(--middle-color);
|
||||
--bg-soft-color: var(--light-color);
|
||||
--bg-color: var(--super-light-color);
|
||||
|
||||
--toolbar-border: none;
|
||||
|
||||
--main-font-family: Quicksand, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
|
||||
|
||||
/* Those padding like an external padding. Basic padding of 15px is always applied */
|
||||
--editor-horizontal-padding: 40px;
|
||||
--editor-vertical-padding: 25px;
|
||||
}
|
||||
|
||||
@media (max-width:1000px) {
|
||||
:root {
|
||||
--editor-horizontal-padding: 0px;
|
||||
--editor-vertical-padding: 0px;
|
||||
}
|
||||
}
|
||||
|
||||
/* Default scrollbar values */
|
||||
body {
|
||||
--scrollbar-bg: var(--light-color);
|
||||
--scrollbar-track: var(--super-light-color);
|
||||
--scrollbar-thumb: var(--dark-color);
|
||||
}
|
||||
|
|
@ -0,0 +1,7 @@
|
|||
'use strict';
|
||||
|
||||
window.customStart = () => {
|
||||
$('#pad_title').show();
|
||||
$('.buttonicon').mousedown(function () { $(this).parent().addClass('pressed'); });
|
||||
$('.buttonicon').mouseup(function () { $(this).parent().removeClass('pressed'); });
|
||||
};
|
||||
|
|
@ -0,0 +1,25 @@
|
|||
button, .btn
|
||||
{
|
||||
padding: 5px 20px;
|
||||
border-radius: 4px;
|
||||
line-height: 1.5;
|
||||
width: auto;
|
||||
border: none;
|
||||
font-weight: bold;
|
||||
text-transform: uppercase;
|
||||
position: relative;
|
||||
background: none;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.btn-primary
|
||||
{
|
||||
background-color: #64d29b;
|
||||
background-color: var(--primary-color);
|
||||
color: #ffffff;
|
||||
color: var(--bg-color);
|
||||
}
|
||||
.btn-default {
|
||||
color: #485365;
|
||||
color: var(--text-color);
|
||||
}
|
||||
|
|
@ -0,0 +1,91 @@
|
|||
#chatbox {
|
||||
background-color: transparent !important;
|
||||
color: var(--text-color);
|
||||
}
|
||||
.chat-content {
|
||||
background: none;
|
||||
padding: 0;
|
||||
width: 400px;
|
||||
height: 300px;
|
||||
background-color: #f2f3f4;
|
||||
background-color: var(--bg-soft-color);
|
||||
}
|
||||
|
||||
.chat-content, #chaticon {
|
||||
box-shadow: 0 0 0 1px rgba(99, 114, 130, 0.16), 0 8px 16px rgba(27, 39, 51, 0.08);
|
||||
border: none;
|
||||
}
|
||||
|
||||
#chaticon {
|
||||
padding: 10px 20px;
|
||||
background-color: #f2f3f4;
|
||||
background-color: var(--bg-soft-color);
|
||||
color: #485365;
|
||||
color: var(--text-color);
|
||||
right: 30px;
|
||||
}
|
||||
|
||||
#chatbox.stickyChat .chat-content {
|
||||
border: none;
|
||||
box-shadow: none;
|
||||
background-color: #f2f3f4;
|
||||
background-color: var(--bg-soft-color);
|
||||
}
|
||||
|
||||
#titlebar {
|
||||
bottom: 0;
|
||||
line-height: 44px;
|
||||
height: 44px;
|
||||
padding: 0 7px;
|
||||
z-index: 20000;
|
||||
}
|
||||
|
||||
#titlelabel, #chatlabel {
|
||||
text-transform: uppercase;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
#titlebar #titlelabel { font-size: 16px; }
|
||||
#chatlabel { margin-right: 15px; }
|
||||
|
||||
#chattext {
|
||||
padding: 0;
|
||||
border-top: 1px solid #ffffff;
|
||||
border-top: 1px solid var(--bg-color);
|
||||
border-bottom: 1px solid #ffffff;
|
||||
border-bottom: 1px solid var(--bg-color);
|
||||
background-color: inherit;
|
||||
color: inherit;
|
||||
}
|
||||
#chattext p {
|
||||
padding: 4px 10px;
|
||||
}
|
||||
#chattext:not(.authorColors) p:first-child {
|
||||
padding-top: 10px;
|
||||
}
|
||||
#chattext:not(.authorColors) p:last-child {
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
|
||||
#chatinputbox {
|
||||
padding: 8px;
|
||||
}
|
||||
#chatinputbox #chatinput {
|
||||
background-color: #ffffff;
|
||||
background-color: var(--bg-color);
|
||||
}
|
||||
|
||||
@media (prefers-reduced-motion) {
|
||||
.chat-content {
|
||||
transform: scale(1);
|
||||
transition: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 800px) {
|
||||
#chaticon {
|
||||
right: 0;
|
||||
}
|
||||
|
||||
.stick-to-screen-btn { display: none; }
|
||||
}
|
||||
|
|
@ -0,0 +1,117 @@
|
|||
input[type="text"], select, textarea, .nice-select {
|
||||
border-radius: 3px;
|
||||
box-shadow: none;
|
||||
border: none;
|
||||
outline: 0;
|
||||
}
|
||||
|
||||
input[type="text"], textarea {
|
||||
padding: 8px 10px;
|
||||
background-color: #f2f3f4;
|
||||
background-color: var(--bg-soft-color);
|
||||
border: none;
|
||||
color: #485365;
|
||||
color: var(--text-color);
|
||||
}
|
||||
input[type="text"]::placeholder, textarea::placeholder {
|
||||
color: #576273;
|
||||
color: var(--text-soft-color);
|
||||
}
|
||||
select, .nice-select {
|
||||
background-color: #f2f3f4;
|
||||
background-color: var(--bg-soft-color);
|
||||
border: 1px solid var(--bg-soft-color);
|
||||
padding: 4px 10px;
|
||||
padding-right: 25px;
|
||||
font-weight: bold;
|
||||
line-height: inherit;
|
||||
}
|
||||
select:hover, .nice-select:hover {
|
||||
border-color: var(--bg-soft-color)
|
||||
}
|
||||
.nice-select .list {
|
||||
background-color: #f2f3f4;
|
||||
background-color: var(--bg-soft-color);
|
||||
}
|
||||
.nice-select .option:hover,.nice-select .option.focus,.nice-select .option.selected.focus {
|
||||
background-color: #ffffff;
|
||||
background-color: var(--bg-color);
|
||||
}
|
||||
.nice-select .option {
|
||||
padding: 0 15px;
|
||||
}
|
||||
.popup .nice-select .list {
|
||||
right: 0;
|
||||
left: auto;
|
||||
}
|
||||
|
||||
|
||||
/* Checkboxes
|
||||
========================================================================== */
|
||||
/* Remove default checkbox */
|
||||
[type="checkbox"]:not(:checked),
|
||||
[type="checkbox"]:checked {
|
||||
position: absolute;
|
||||
opacity: 0;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
[type="checkbox"] + label {
|
||||
position: relative;
|
||||
padding-left: 2.5rem;
|
||||
cursor: pointer;
|
||||
display: inline-block;
|
||||
height: 1.4rem;
|
||||
line-height: 1.4rem;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
[type="checkbox"] + label:before,
|
||||
[type="checkbox"] + label:after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
margin-top: 4px;
|
||||
transition: all .2s ease-in-out;
|
||||
}
|
||||
|
||||
/* BEFORE, the container*/
|
||||
[type="checkbox"] + label:before {
|
||||
width: 24px;
|
||||
height: 14px;
|
||||
top: 0;
|
||||
left: 0;
|
||||
border-radius: 6px;
|
||||
border: 2px solid #576273;
|
||||
border: 2px solid var(--text-soft-color);
|
||||
background-color: #f2f3f4;
|
||||
background-color: var(--bg-soft-color);
|
||||
opacity: .7;
|
||||
}
|
||||
[type="checkbox"]:checked + label:before {
|
||||
background-color: transparent;
|
||||
border-color: #64d29b;
|
||||
border-color: var(--primary-color);
|
||||
}
|
||||
|
||||
/* AFTER, the circle moving */
|
||||
[type="checkbox"] + label:after {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
border-radius: 50%;
|
||||
background-color: #576273;
|
||||
background-color: var(--text-soft-color);
|
||||
top: -1px;
|
||||
left: -3px;
|
||||
}
|
||||
[type="checkbox"]:checked + label:after {
|
||||
background-color: #64d29b;
|
||||
background-color: var(--primary-color);
|
||||
transform: translateX(14px);
|
||||
}
|
||||
|
||||
[type="checkbox"]:checked:disabled + label,
|
||||
[type="checkbox"]:checked:disabled + label:before,
|
||||
[type="checkbox"]:checked:disabled + label:after {
|
||||
cursor: not-allowed;
|
||||
opacity: .4;
|
||||
}
|
||||
|
|
@ -0,0 +1,82 @@
|
|||
.gritter-item:not(.error) .popup-content{
|
||||
background-color: #64d29b;
|
||||
background-color: var(--primary-color);
|
||||
color: #ffffff;
|
||||
color: var(--super-light-color);
|
||||
}
|
||||
.gritter-item .popup-content {
|
||||
padding: 15px;
|
||||
box-shadow: 0 0 0 1px rgba(99, 114, 130, 0.16), 0 8px 16px rgba(27, 39, 51, 0.08);
|
||||
}
|
||||
#gritter-container.bottom .gritter-item .popup-content {
|
||||
margin-top: 10px;
|
||||
}
|
||||
#gritter-container.top .gritter-item .popup-content {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.gritter-item p {
|
||||
margin: 0 !important;
|
||||
}
|
||||
.gritter-item .gritter-title {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.gritter-item .gritter-close {
|
||||
margin-left: 15px;
|
||||
margin-right: 0px;
|
||||
}
|
||||
.gritter-item:not(.error) .gritter-close .buttonicon {
|
||||
color: #ffffff;
|
||||
color: var(--super-light-color);
|
||||
}
|
||||
|
||||
/* CHAT GRIITER ITEM */
|
||||
.gritter-item.chat-gritter-msg:not(.error) .popup-content {
|
||||
background-color: white;
|
||||
background-color: var(--bg-color);
|
||||
color: #485365;
|
||||
color: var(--text-color);
|
||||
}
|
||||
.gritter-item.chat-gritter-msg .gritter-content {
|
||||
text-align: left;
|
||||
}
|
||||
.gritter-item.chat-gritter-msg .author-name {
|
||||
font-weight: bold;
|
||||
margin-right: 5px;
|
||||
}
|
||||
.gritter-item.chat-gritter-msg:not(.error) .gritter-close .buttonicon {
|
||||
color: #485365;
|
||||
color: var(--text-color);
|
||||
}
|
||||
|
||||
.gritter-item.saved-revision {
|
||||
max-width: 600px;
|
||||
}
|
||||
|
||||
#gritter-container.top .gritter-item.popup > .popup-content {
|
||||
transform: scale(0.8) translateY(-100px);
|
||||
}
|
||||
#gritter-container.bottom .gritter-item.popup > .popup-content {
|
||||
transform: scale(0.8) translateY(0px);
|
||||
}
|
||||
|
||||
.gritter-item.popup.popup-show > .popup-content {
|
||||
transform: scale(1) translateY(0) !important;
|
||||
transition: all 0.4s cubic-bezier(0.74, -0.05, 0.27, 1.75) !important;
|
||||
}
|
||||
@media (prefers-reduced-motion) {
|
||||
#gritter-container.top .gritter-item.popup > .popup-content {
|
||||
transform: scale(1) translateY(0px) !important;
|
||||
}
|
||||
#gritter-container.bottom .gritter-item.popup > .popup-content {
|
||||
transform: scale(1) translateY(0px) !important;
|
||||
}
|
||||
.gritter-item.popup.popup-show > .popup-content {
|
||||
transform: scale(1) translateY(0px) !important;
|
||||
transition: none;
|
||||
}
|
||||
}
|
||||
|
||||
/* for ep_deleted_after_delay */
|
||||
.gritter-item #close_expiration_notif {
|
||||
display: none;
|
||||
}
|
||||
|
|
@ -0,0 +1,17 @@
|
|||
#importmessageabiword {
|
||||
font-style: italic;
|
||||
color: #64d29b;
|
||||
color: var(--primary-color);
|
||||
}
|
||||
#importmessageabiword > a {
|
||||
font-weight: bold;
|
||||
text-decoration: underline;
|
||||
color: #64d29b;
|
||||
color: var(--primary-color);
|
||||
}
|
||||
|
||||
#importmessagefail {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
#importsubmitinput[disabled] { opacity: .6; }
|
||||
|
|
@ -0,0 +1,83 @@
|
|||
.popup-content {
|
||||
border-radius: 5px;
|
||||
padding: 25px;
|
||||
background: none;
|
||||
background-color: #ffffff;
|
||||
background-color: var(--bg-color);
|
||||
color: #576273;
|
||||
color: var(--text-soft-color);
|
||||
border: none;
|
||||
box-shadow: 0 0 0 1px rgba(99, 114, 130, 0.16), 0 8px 16px rgba(27, 39, 51, 0.08);
|
||||
}
|
||||
|
||||
#mycolorpicker, #users {
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.popup h1 {
|
||||
margin-bottom: 20px;
|
||||
font-size: 1.6rem;
|
||||
}
|
||||
|
||||
.popup h2 {
|
||||
margin-bottom: 15px;
|
||||
margin-top: 20px;
|
||||
color: #485365;
|
||||
color: var(--text-color);
|
||||
}
|
||||
|
||||
.popup:not(.comment-modal) p {
|
||||
margin: 10px 0;
|
||||
}
|
||||
|
||||
.popup .dropdowns-container .dropdown-line {
|
||||
margin-top: 15px;
|
||||
}
|
||||
.popup .dropdowns-container label {
|
||||
width: 120px;
|
||||
display: inline-block;
|
||||
}
|
||||
.popup .dropdowns-container .nice-select {
|
||||
min-width: 180px;
|
||||
}
|
||||
|
||||
@media (prefers-reduced-motion) {
|
||||
.popup>.popup-content {
|
||||
transform: scale(1);
|
||||
transition: none;
|
||||
}
|
||||
.nice-select .list {
|
||||
transform: scale(1) translateY(0px);
|
||||
-webkit-transform: scale(1) translateY(0px);
|
||||
-ms-transform: scale(1) translateY(0px);
|
||||
transition: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 800px) {
|
||||
.popup-content {
|
||||
padding: 1rem;
|
||||
box-shadow: 0 0 0 1px rgba(99, 114, 130, 0.16), -1px 1px 16px 3px rgba(27, 39, 51, 0.12);
|
||||
}
|
||||
.popup .dropdowns-container select {
|
||||
min-width: 0;
|
||||
}
|
||||
}
|
||||
|
||||
/* SKIN Variants Popup */
|
||||
#skin-variants {
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: auto;
|
||||
top: auto;
|
||||
}
|
||||
#skin-variants .popup-content > p {
|
||||
margin-top: 25px;
|
||||
}
|
||||
#skin-variants-result{
|
||||
background-color: #f2f3f4;
|
||||
background-color: var(--bg-soft-color);
|
||||
}
|
||||
.skin-variant-container {
|
||||
text-transform: capitalize;
|
||||
}
|
||||
|
|
@ -0,0 +1,41 @@
|
|||
@media (min-width: 721px) {
|
||||
::-webkit-scrollbar-track {
|
||||
background-color: white;
|
||||
background-color: var(--scrollbar-track);
|
||||
border-radius: 10px;
|
||||
border: 7px solid #f2f3f4;
|
||||
border: 7px solid var(--scrollbar-bg);
|
||||
}
|
||||
|
||||
::-webkit-scrollbar {
|
||||
width: 22px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
min-height: 40px;
|
||||
border-radius: 10px;
|
||||
background-color: #576273;
|
||||
background-color: var(--scrollbar-thumb);
|
||||
border: 7px solid #f2f3f4;
|
||||
border: 7px solid var(--scrollbar-bg);
|
||||
}
|
||||
}
|
||||
|
||||
.thin-scrollbar::-webkit-scrollbar-track {
|
||||
background-color: #f2f3f4;
|
||||
background-color: var(--bg-soft-color);
|
||||
border-radius: 0px;
|
||||
border: none;
|
||||
}
|
||||
|
||||
.thin-scrollbar::-webkit-scrollbar {
|
||||
width: 6px;
|
||||
}
|
||||
|
||||
.thin-scrollbar::-webkit-scrollbar-thumb {
|
||||
border-radius: 0px;
|
||||
min-height: 40px;
|
||||
background-color: #d2d2d2;
|
||||
background-color: var(--middle-color);
|
||||
border: none;
|
||||
}
|
||||
|
|
@ -0,0 +1,31 @@
|
|||
#sidediv {
|
||||
background-color: transparent;
|
||||
border: none;
|
||||
opacity: .8;
|
||||
}
|
||||
|
||||
#sidedivinner>div:before {
|
||||
font-family: var(--main-font-family); /* the parent div have font-family monospace (line number) */
|
||||
color: #485365;
|
||||
color: var(--text-color);
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
#sidedivinner>div .line-number {
|
||||
line-height: inherit;
|
||||
font-family: RobotoMono;
|
||||
display: inline-block;
|
||||
color: #576273;
|
||||
color: var(--text-soft-color);
|
||||
height:100%;
|
||||
}
|
||||
|
||||
#sidedivinner>div .line-number:hover {
|
||||
background-color: var(--bg-soft-color);
|
||||
border-radius: 5px 0 0 5px;
|
||||
font-weight: bold;
|
||||
color: var(--text-color);
|
||||
}
|
||||
.plugin-ep_author_neat #sidedivinner>div .line-number:hover {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
|
@ -0,0 +1,21 @@
|
|||
#toc {
|
||||
padding: 20px 20px 10px 10px !important;
|
||||
min-width: 146px !important;
|
||||
background-color: transparent !important;
|
||||
border: none !important;
|
||||
order: -2;
|
||||
}
|
||||
|
||||
#tocItems {
|
||||
line-height: 40px !important;
|
||||
}
|
||||
|
||||
.plugin-ep_resizable_bars #toc {
|
||||
min-width: 186px !important;
|
||||
}
|
||||
|
||||
@media (max-width: 1200px) {
|
||||
#toc {
|
||||
padding-top: 10px !important
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,154 @@
|
|||
.toolbar {
|
||||
border-bottom: none;
|
||||
padding: 0;
|
||||
background-color: #ffffff;
|
||||
background-color: var(--bg-color);
|
||||
color: #576273;
|
||||
color: var(--text-soft-color);
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
#editbar.editor-scrolled {
|
||||
border-bottom: 1px solid #d2d2d2;
|
||||
border-bottom: var(--toolbar-border);
|
||||
}
|
||||
|
||||
.toolbar ul {
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.toolbar ul.menu_left {
|
||||
padding-left: 5px;
|
||||
}
|
||||
|
||||
.toolbar ul li {
|
||||
margin: 7px 1px;
|
||||
}
|
||||
|
||||
.toolbar ul li a, .toolbar .buttonicon {
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.toolbar .buttonicon {
|
||||
background-color: transparent;
|
||||
font-size: 15px;
|
||||
}
|
||||
.buttonicon-insertorderedlist:before,
|
||||
.buttonicon-insertunorderedlist:before,
|
||||
.buttonicon-indent:before,
|
||||
.buttonicon-outdent:before {
|
||||
font-size: 16px !important;
|
||||
}
|
||||
|
||||
.toolbar ul li.separator {
|
||||
visibility: hidden;
|
||||
width: 1px;
|
||||
margin: 0 10px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.toolbar.condensed ul li {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
.toolbar.condensed ul li.separator {
|
||||
margin: 0 5px;
|
||||
}
|
||||
|
||||
.toolbar ul li a {
|
||||
background-color: transparent;
|
||||
background: none;
|
||||
border: none;
|
||||
border-radius: 3px !important;
|
||||
transition: background-color .1s;
|
||||
}
|
||||
|
||||
.toolbar ul li a:hover, .toolbar ul li select:hover {
|
||||
background-color: #f2f3f4;
|
||||
background-color: var(--bg-soft-color);
|
||||
color: #485365;
|
||||
color: var(--text-color);
|
||||
}
|
||||
.toolbar ul li a.selected {
|
||||
background-color: #f2f3f4;
|
||||
background-color: var(--bg-soft-color);
|
||||
}
|
||||
.toolbar ul li a.pressed,
|
||||
.toolbar ul li select:active {
|
||||
color: #64d29b;
|
||||
color: var(--primary-color);
|
||||
}
|
||||
|
||||
.toolbar ul li select:active option {
|
||||
background-color: #ffffff;
|
||||
background-color: var(--bg-color);
|
||||
color: #576273;
|
||||
color: var(--text-soft-color);
|
||||
padding: 5px;
|
||||
}
|
||||
|
||||
.toolbar .menu_right li a.selected {
|
||||
background-color: #576273;
|
||||
background-color: var(--text-soft-color);
|
||||
color: #ffffff;
|
||||
color: var(--bg-color);
|
||||
}
|
||||
|
||||
.toolbar ul li[data-key=showusers] {
|
||||
margin: 0;
|
||||
margin-left: 15px;
|
||||
width: 45px;
|
||||
height: 100%;
|
||||
}
|
||||
.toolbar ul li[data-key=showusers] > a {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 0 !important;
|
||||
}
|
||||
|
||||
.toolbar .menu_right .separator {
|
||||
display: none;
|
||||
}
|
||||
.toolbar .menu_right li {
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
.toolbar.cropped .menu_left {
|
||||
height: 39px;
|
||||
padding-top: 1px;
|
||||
}
|
||||
.toolbar .show-more-icon-btn {
|
||||
font-size: 1.8rem;
|
||||
color: #64d29b;
|
||||
color: var(--primary-color);
|
||||
}
|
||||
|
||||
@media (max-width: 1000px) {
|
||||
.toolbar ul li.separator {
|
||||
margin: 0 5px;
|
||||
background: none;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
.mobile-layout .toolbar ul li {
|
||||
margin: 5px 2px;
|
||||
}
|
||||
.mobile-layout .toolbar ul li.separator {
|
||||
margin: 0 5px;
|
||||
}
|
||||
@media (max-width: 800px) {
|
||||
.mobile-layout .toolbar ul li.separator {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
.mobile-layout .toolbar .menu_right {
|
||||
border-top: 1px solid #d2d2d2;
|
||||
border-top: var(--toolbar-border);
|
||||
background-color: #ffffff;
|
||||
background-color: var(--bg-color);
|
||||
padding: 0;
|
||||
}
|
||||
.mobile-layout .toolbar ul li a:hover {
|
||||
/* background-color: transparent; */
|
||||
}
|
||||
|
|
@ -0,0 +1,52 @@
|
|||
table#otheruserstable {
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.popup#users.chatAndUsers > .popup-content {
|
||||
padding: 20px 10px;
|
||||
height: 250px;
|
||||
border-left: none;
|
||||
transition: none;
|
||||
border-bottom-color: #d2d2d2;
|
||||
border-bottom-color: var(--border-color);
|
||||
}
|
||||
.popup#users.chatAndUsers #mycolorpicker.popup {
|
||||
right: calc(100% + 30px);
|
||||
top: 15px;
|
||||
}
|
||||
|
||||
#otheruserstable .swatch {
|
||||
border: none !important;
|
||||
border-radius: 50%;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
margin: 0;
|
||||
margin-left: 1px;
|
||||
margin-right: 15px;
|
||||
}
|
||||
|
||||
#myusernameform {
|
||||
margin-left: 35px;
|
||||
}
|
||||
|
||||
input#myusernameedit {
|
||||
min-width: 110px;
|
||||
border: none !important;
|
||||
background-color: transparent !important;
|
||||
border-bottom: 1px solid #d2d2d2 !important;
|
||||
border-bottom: 1px solid var(--border-color) !important;
|
||||
border-radius: 0;
|
||||
padding-bottom: 5px;
|
||||
}
|
||||
|
||||
#myswatch {
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
#colorpicker {
|
||||
margin-bottom: 25px;
|
||||
}
|
||||
|
||||
#mycolorpickerpreview {
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
|
@ -0,0 +1,11 @@
|
|||
body {
|
||||
color: #485365;
|
||||
color: var(--text-color);
|
||||
font-family: Quicksand, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
|
||||
font-family: var(--main-font-family);
|
||||
}
|
||||
|
||||
h1 {
|
||||
color: #64d29b;
|
||||
color: var(--primary-color);
|
||||
}
|
||||
|
|
@ -0,0 +1,48 @@
|
|||
#outerdocbody {
|
||||
margin: 0 auto;
|
||||
padding-top: 20px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
#editorcontainerbox {
|
||||
background-color: #f2f3f4;
|
||||
background-color: var(--bg-color);
|
||||
color: var(--text-color);
|
||||
}
|
||||
|
||||
#editorcontainerbox .sticky-container {
|
||||
width: 250px;
|
||||
}
|
||||
|
||||
#outerdocbody iframe, #outerdocbody > #innerdocbody {
|
||||
max-width: 900px;
|
||||
padding: 40px 55px;
|
||||
padding-left: var(--editor-horizontal-padding);
|
||||
padding-right: var(--editor-horizontal-padding);
|
||||
padding-top: var(--editor-vertical-padding);
|
||||
padding-bottom: var(--editor-vertical-padding);
|
||||
box-shadow: none;
|
||||
border: 0;
|
||||
border-radius: 8px 8px 0 0;
|
||||
background-color: #ffffff;
|
||||
background-color: var(--bg-color);
|
||||
color: #485365;
|
||||
color: var(--text-color);
|
||||
}
|
||||
#sidediv {
|
||||
/* Padding must be the same than editor, otherwise it creates problem */
|
||||
padding-top: 40px; /* = #innerdocbody iframe vertical padding */
|
||||
padding-bottom: 40px;
|
||||
padding-top: calc(var(--editor-vertical-padding) + 15px);
|
||||
padding-bottom: calc(var(--editor-vertical-padding) + 15px);
|
||||
}
|
||||
|
||||
@media (max-width:1000px) {
|
||||
#outerdocbody {
|
||||
padding-top: 0;
|
||||
}
|
||||
#outerdocbody iframe, #outerdocbody > #innerdocbody {
|
||||
max-width: none;
|
||||
border-radius: 0;
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,5 @@
|
|||
#innerdocbody {
|
||||
background: transparent;
|
||||
color: #485365;
|
||||
color: var(--text-color);
|
||||
}
|
||||
|
|
@ -0,0 +1,228 @@
|
|||
/* =========================== */
|
||||
/* === Super Light Toolbar === */
|
||||
/* =========================== */
|
||||
.super-light-toolbar .toolbar, .super-light-toolbar .popup-content, .super-light-toolbar #pad_title {
|
||||
--text-color: var(--super-dark-color);
|
||||
--text-soft-color: var(--dark-color);
|
||||
--border-color: #e4e6e9;
|
||||
--bg-soft-color: var(--light-color);
|
||||
--bg-color: var(--super-light-color);
|
||||
}
|
||||
/* ===================== */
|
||||
/* === Light Toolbar === */
|
||||
/* ===================== */
|
||||
.light-toolbar .toolbar, .light-toolbar .popup-content, .light-toolbar #pad_title {
|
||||
--text-color: var(--super-dark-color);
|
||||
--text-soft-color: var(--dark-color);
|
||||
--border-color: var(--middle-color);
|
||||
--bg-soft-color: var(--super-light-color);
|
||||
--bg-color: var(--light-color);
|
||||
}
|
||||
/* ========================== */
|
||||
/* === Super Dark Toolbar === */
|
||||
/* ========================== */
|
||||
.super-dark-toolbar .toolbar, .super-dark-toolbar .popup-content, .super-dark-toolbar #pad_title {
|
||||
--text-color: var(--super-light-color);
|
||||
--text-soft-color: var(--light-color);
|
||||
--border-color: var(--dark-color);
|
||||
--bg-soft-color: var(--dark-color);
|
||||
--bg-color: var(--super-dark-color);
|
||||
}
|
||||
.super-dark-toolbar.super-dark-editor .popup-content {
|
||||
border: 1px solid var(--dark-color);
|
||||
box-shadow: none;
|
||||
}
|
||||
/* ==================== */
|
||||
/* === Dark Toolbar === */
|
||||
/* ==================== */
|
||||
.dark-toolbar .toolbar, .dark-toolbar .popup-content, .dark-toolbar #pad_title {
|
||||
--text-color: var(--super-light-color);
|
||||
--text-soft-color: var(--light-color);
|
||||
--border-color: var(--super-dark-color);
|
||||
--bg-soft-color: var(--super-dark-color);
|
||||
--bg-color: var(--dark-color);
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
/* ============================ */
|
||||
/* == Super Light Background == */
|
||||
/* ============================ */
|
||||
.super-light-background #editorcontainerbox, .super-light-background #sidediv,
|
||||
.super-light-background #chatbox, .super-light-background #outerdocbody, .super-light-background {
|
||||
--text-color: var(--super-dark-color);
|
||||
--text-soft-color: var(--dark-color);
|
||||
--border-color: #e4e6e9;
|
||||
--bg-soft-color: var(--light-color);
|
||||
--bg-color: var(--super-light-color);
|
||||
}
|
||||
.super-light-background body, .full-width-editor.super-light-editor body:not(.comments-active) {
|
||||
--scrollbar-bg: var(--super-light-color);
|
||||
--scrollbar-track: var(--light-color);
|
||||
--scrollbar-thumb: var(--dark-color);
|
||||
}
|
||||
.super-light-background .compact-display-content {
|
||||
background-color: var(--super-light-color);
|
||||
}
|
||||
/* ====================== */
|
||||
/* == Light Background == */
|
||||
/* ====================== */
|
||||
.light-background #editorcontainerbox, .light-background #sidediv,
|
||||
.light-background #chatbox, .light-background #outerdocbody, .light-background {
|
||||
--text-color: var(--super-dark-color);
|
||||
--text-soft-color: var(--dark-color);
|
||||
--border-color: var(--middle-color);
|
||||
--bg-soft-color: var(--super-light-color);
|
||||
--bg-color: var(--light-color);
|
||||
}
|
||||
.light-background body, .full-width-editor.light-editor body:not(.comments-active) {
|
||||
--scrollbar-bg: var(--light-color);
|
||||
--scrollbar-track: var(--super-light-color);
|
||||
--scrollbar-thumb: var(--dark-color);
|
||||
}
|
||||
.light-background .compact-display-content {
|
||||
background-color: var(--light-color);
|
||||
}
|
||||
/* =========================== */
|
||||
/* == Super Dark Background == */
|
||||
/* =========================== */
|
||||
.super-dark-background #editorcontainerbox, .super-dark-background #sidediv,
|
||||
.super-dark-background #chatbox, .super-dark-background #outerdocbody, .super-dark-background {
|
||||
--text-color: var(--super-light-color);
|
||||
--text-soft-color: var(--light-color);
|
||||
--border-color: var(--dark-color);
|
||||
--bg-soft-color: var(--dark-color);
|
||||
--bg-color: var(--super-dark-color);
|
||||
}
|
||||
.super-dark-background body, .full-width-editor.super-dark-editor body:not(.comments-active) {
|
||||
--scrollbar-bg: var(--super-dark-color);
|
||||
--scrollbar-track: var(--dark-color);
|
||||
--scrollbar-thumb: var(--light-color);
|
||||
}
|
||||
.super-dark-background .compact-display-content {
|
||||
background-color: var(--super-dark-color);
|
||||
}
|
||||
/* Special combinaison with toolbar */
|
||||
.super-dark-background.super-dark-toolbar .popup-content {
|
||||
border: 1px solid var(--dark-color);
|
||||
box-shadow: none;
|
||||
}
|
||||
/* ===================== */
|
||||
/* == Dark Background == */
|
||||
/* ===================== */
|
||||
.dark-background #editorcontainerbox, .dark-background #sidediv,
|
||||
.dark-background #chatbox, .dark-background #outerdocbody, .dark-background {
|
||||
--text-color: var(--super-light-color);
|
||||
--text-soft-color: var(--light-color);
|
||||
--border-color: var(--super-dark-color);
|
||||
--bg-soft-color: var(--super-dark-color);
|
||||
--bg-color: var(--dark-color);
|
||||
}
|
||||
.dark-background body, .full-width-editor.dark-editor body:not(.comments-active) {
|
||||
--scrollbar-bg: var(--dark-color);
|
||||
--scrollbar-track: var(--super-dark-color);
|
||||
--scrollbar-thumb: var(--light-color);
|
||||
}
|
||||
.dark-background .compact-display-content {
|
||||
background-color: var(--dark-color);
|
||||
}
|
||||
/* Special combinaison with toolbar */
|
||||
.dark-background.dark-toolbar .popup-content, .dark-editor.dark-toolbar .popup-content {
|
||||
box-shadow: 0 0 14px 0px var(--super-dark-color);
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
/* ======================== */
|
||||
/* == Super Light Editor == */
|
||||
/* ======================== */
|
||||
.super-light-editor #outerdocbody iframe, .super-light-editor #outerdocbody > #innerdocbody {
|
||||
--bg-color: var(--super-light-color);
|
||||
}
|
||||
.super-light-editor #innerdocbody {
|
||||
--text-color: var(--super-dark-color);
|
||||
}
|
||||
/* ================== */
|
||||
/* == Light Editor == */
|
||||
/* ================== */
|
||||
.light-editor #outerdocbody iframe, .light-editor #outerdocbody > #innerdocbody {
|
||||
--bg-color: var(--light-color);
|
||||
}
|
||||
.light-editor #innerdocbody {
|
||||
--text-color: var(--super-dark-color);
|
||||
}
|
||||
/* ======================= */
|
||||
/* == Super Dark Editor == */
|
||||
/* ======================= */
|
||||
.super-dark-editor #outerdocbody iframe, .super-dark-editor #outerdocbody > #innerdocbody {
|
||||
--bg-color: var(--super-dark-color);
|
||||
}
|
||||
.super-dark-editor #innerdocbody {
|
||||
--text-color: var(--super-light-color);
|
||||
}
|
||||
/* ================= */
|
||||
/* == Dark Editor == */
|
||||
/* ================= */
|
||||
.dark-editor #outerdocbody iframe, .dark-editor #outerdocbody > #innerdocbody {
|
||||
--bg-color: var(--dark-color);
|
||||
}
|
||||
.dark-editor #innerdocbody {
|
||||
--text-color: var(--super-light-color);
|
||||
}
|
||||
|
||||
|
||||
/* ======================================== */
|
||||
/* == Combinaison with background/editor == */
|
||||
/* ======================================== */
|
||||
.super-light-editor.super-light-background #outerdocbody,
|
||||
.light-editor.light-background #outerdocbody,
|
||||
.super-dark-editor.super-dark-background #outerdocbody,
|
||||
.dark-editor.dark-background #outerdocbody {
|
||||
padding-top: 0;
|
||||
}
|
||||
@media (min-width: 1001px) {
|
||||
.super-light-editor.super-light-background,
|
||||
.light-editor.light-background,
|
||||
.super-dark-editor.super-dark-background,
|
||||
.dark-editor.dark-background {
|
||||
--editor-horizontal-padding: 20px;
|
||||
--editor-vertical-padding: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
/* ===================================== */
|
||||
/* == Combinaison with toolbar/editor == */
|
||||
/* ===================================== */
|
||||
.super-light-editor.super-light-toolbar .toolbar,
|
||||
.light-editor.light-toolbar .toolbar,
|
||||
.super-dark-editor.super-dark-toolbar .toolbar,
|
||||
.dark-editor.dark-toolbar .toolbar {
|
||||
--toolbar-border: 1px solid var(--border-color);
|
||||
}
|
||||
|
||||
|
||||
/* ======================= */
|
||||
/* == Full Width Editor == */
|
||||
/* ======================= */
|
||||
.full-width-editor #outerdocbody iframe, .full-width-editor #outerdocbody > #innerdocbody {
|
||||
max-width: none !important;
|
||||
border-radius: 0;
|
||||
}
|
||||
.full-width-editor #outerdocbody {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
@media (min-width: 1001px) {
|
||||
.full-width-editor {
|
||||
--editor-horizontal-padding: 20px !important;
|
||||
--editor-vertical-padding: 5px !important;
|
||||
}
|
||||
}
|
||||
.full-width-editor ::-webkit-scrollbar-track,
|
||||
.full-width-editor ::-webkit-scrollbar-thumb {
|
||||
border-radius: 0px;
|
||||
}
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
.authortooltip {
|
||||
opacity: 1!important;
|
||||
border-radius: 2px;
|
||||
padding: 4px 10px 3px!important;
|
||||
text-transform: uppercase;
|
||||
font-size: 13px!important;
|
||||
font-weight: 700;
|
||||
color: #000;
|
||||
background-color: rgba(255, 255, 255, 0.85) !important;
|
||||
}
|
||||
|
|
@ -0,0 +1,14 @@
|
|||
#colorpicker a.brightColorPicker-cancelButton {
|
||||
background: none;
|
||||
padding: 0;
|
||||
padding-top: 10px;
|
||||
font-weight: bold;
|
||||
border: none;
|
||||
}
|
||||
|
||||
.brightColorPicker-colorPanel {
|
||||
background-color: white !important;
|
||||
box-shadow: 0 0 0 1px rgba(99, 114, 130, 0.16), 0 8px 16px rgba(27, 39, 51, 0.08) !important;
|
||||
border-radius: 3px !important;
|
||||
padding: 15px !important;
|
||||
}
|
||||
|
|
@ -0,0 +1,112 @@
|
|||
.sidebar-comment .btn {
|
||||
margin-top: 10px;
|
||||
padding: 3px 8px;
|
||||
font-size: .9rem;
|
||||
margin: 10px 0 5px 0;
|
||||
}
|
||||
.sidebar-comment .btn.btn-primary:not(#comment-create-btn) {
|
||||
background-color: #576273;
|
||||
background-color: var(--text-soft-color);
|
||||
}
|
||||
.sidebar-comment .suggestion-create {
|
||||
margin-top: 10px;
|
||||
}
|
||||
.suggestion-display .from-value, .suggestion-display .to-value {
|
||||
color: #64d29b;
|
||||
color: var(--primary-color);
|
||||
font-weight: bold;
|
||||
opacity: 1;
|
||||
}
|
||||
.suggestion-display .from-value {
|
||||
margin-right: 5px;
|
||||
}
|
||||
.comment-actions-wrapper .buttonicon {
|
||||
opacity: .8;
|
||||
}
|
||||
.comment-actions-wrapper .buttonicon:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
.comment-actions-wrapper .comment-edit {
|
||||
margin-right: 5px;
|
||||
}
|
||||
[type="checkbox"] + label.label-suggestion-checkbox {
|
||||
margin-left: 5px;
|
||||
padding-left: 2.4rem;
|
||||
}
|
||||
.sidebar-comment .full-display-content {
|
||||
margin-left: -10px;
|
||||
box-shadow: none;
|
||||
background-color: #f2f3f4;
|
||||
background-color: var(--bg-soft-color);
|
||||
border: 1px solid #ffffff;
|
||||
border: 1px solid var(--bg-color);
|
||||
}
|
||||
.comment-reply {
|
||||
border-top: 1px solid #ffffff;
|
||||
border-top: 1px solid var(--bg-color);
|
||||
background-color: inherit;
|
||||
}
|
||||
.comment-reply textarea, .comment-reply input[type="text"] {
|
||||
background-color: #ffffff;
|
||||
background-color: var(--bg-color);
|
||||
}
|
||||
.btn.revert-suggestion-btn {
|
||||
padding-left: 0;
|
||||
}
|
||||
.comment-edit-form {
|
||||
margin-top: 15px;
|
||||
}
|
||||
|
||||
/* MODAL */
|
||||
.comment-modal .full-display-content {
|
||||
box-shadow: none;
|
||||
margin: 0 !important;
|
||||
border: none;
|
||||
background-color: #ffffff;
|
||||
background-color: var(--bg-color);
|
||||
}
|
||||
.comment-modal .comment-modal-comment {
|
||||
padding: 0;
|
||||
}
|
||||
.comment-modal .comment-reply textarea, .comment-modal .comment-reply input[type="text"] {
|
||||
background-color: #f2f3f4;
|
||||
background-color: var(--bg-soft-color);
|
||||
}
|
||||
.comment-modal .comment-reply {
|
||||
border-top: 1px solid #f2f3f4;
|
||||
border-top: 1px solid var(--bg-soft-color);
|
||||
}
|
||||
.comment-modal .full-display-content .comment-title-wrapper,
|
||||
.comment-modal .full-display-content .comment-reply {
|
||||
padding: 15px;
|
||||
}
|
||||
|
||||
|
||||
/* NEW COMMENT POPUP */
|
||||
.new-comment-popup textarea {
|
||||
background-color: #f2f3f4;
|
||||
background-color: var(--bg-soft-color);
|
||||
}
|
||||
.new-comment-popup .suggestion {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
|
||||
/* EDITOR COMMENTEED LINE */
|
||||
#innerdocbody .ace-line .comment {
|
||||
background-color: #fffacc;
|
||||
color: var(--super-dark-color);
|
||||
}
|
||||
|
||||
|
||||
@media (min-width: 1200px) {
|
||||
#comments {
|
||||
width: 300px;
|
||||
}
|
||||
.sidebar-comment .full-display-content {
|
||||
margin-left: 10px;
|
||||
}
|
||||
.compact-display-content {
|
||||
padding-left: 20px;
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,41 @@
|
|||
.font-color-icon {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
#font-color {
|
||||
display: list-item !important;
|
||||
}
|
||||
.readonly #font-color {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.color\:black,
|
||||
[data-color=black] {
|
||||
color: #485365;
|
||||
color: var(--text-color);
|
||||
}
|
||||
|
||||
.color\:red,
|
||||
[data-color=red] {
|
||||
color: #F44336;
|
||||
}
|
||||
|
||||
.color\:green,
|
||||
[data-color=green] {
|
||||
color: #66d29c;
|
||||
}
|
||||
|
||||
.color\:blue,
|
||||
[data-color=blue] {
|
||||
color: #2196f3;
|
||||
}
|
||||
|
||||
.color\:yellow,
|
||||
[data-color=yellow] {
|
||||
color: #ffeb3b;
|
||||
}
|
||||
|
||||
.color\:orange,
|
||||
[data-color=orange] {
|
||||
color: #FF9800;
|
||||
}
|
||||
|
|
@ -0,0 +1,7 @@
|
|||
#pad_title {
|
||||
border-bottom: 1px solid var(--border-color) !important;
|
||||
background-color: var(--bg-color) !important;
|
||||
}
|
||||
#edit_title {
|
||||
color: var(--text-soft-color);
|
||||
}
|
||||
|
|
@ -0,0 +1,239 @@
|
|||
/* MENU ICON*/
|
||||
#editbar #tbl_menu_list {
|
||||
width: auto !important;
|
||||
}
|
||||
#tbl-menu {
|
||||
background: none !important;
|
||||
width: 18px !important;
|
||||
padding-left: 2px !important;
|
||||
}
|
||||
#tbl-menu:before {
|
||||
content: "\F0CE";
|
||||
}
|
||||
|
||||
#tbl_menu_list > a {
|
||||
font-size: 16px;
|
||||
margin-top: 8px;
|
||||
padding-left: 0;
|
||||
padding-right: 2px;
|
||||
padding-bottom: 4px;
|
||||
}
|
||||
|
||||
/* DROP DOWN MENU */
|
||||
#tbl_context_menu {
|
||||
margin-left: -24px;
|
||||
border: none;
|
||||
margin-top: 9px;
|
||||
box-shadow: 0 0 0 1px rgba(99, 114, 130, 0.16), 0 8px 16px rgba(27, 39, 51, 0.08);
|
||||
border-radius: 3px;
|
||||
background-color: white;
|
||||
font-size: 100%;
|
||||
line-height: 1.7;
|
||||
}
|
||||
|
||||
#tbl_context_menu > .bd {
|
||||
border: none;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
#tbl_context_menu > .bd > ul {
|
||||
padding: 6px 0;
|
||||
}
|
||||
|
||||
/* TABLE SIZE PICKER */
|
||||
#tbl_insert {
|
||||
background-color: white;
|
||||
box-shadow: 0 0 0 1px rgba(99, 114, 130, 0.16), 0 8px 16px rgba(27, 39, 51, 0.08);
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
#tbl_insert .bd {
|
||||
border: none;
|
||||
text-align: center;
|
||||
background-color: transparent;
|
||||
padding-top: 4px;
|
||||
}
|
||||
|
||||
#tbl_insert .yuimenuitemlabel { text-align: center; }
|
||||
|
||||
#tbl_insert .ft {
|
||||
margin: 0;
|
||||
border: none;
|
||||
background-color: transparent;
|
||||
padding: 6px;
|
||||
padding-top: 0;
|
||||
}
|
||||
|
||||
#matrix_table tr td {
|
||||
border: 1px solid #d7d7d7;
|
||||
height: 1px;
|
||||
padding: 7px;
|
||||
width: 11px;
|
||||
background-color: #fbfbfb;
|
||||
border-radius: 1px;
|
||||
}
|
||||
#matrix_table tr td.selected {
|
||||
border: 1px solid #789dce;
|
||||
background-color: #b3d4ff;
|
||||
}
|
||||
|
||||
/* TABLE SETTINGS POPUP */
|
||||
.yui-skin-sam .yui-panel-container {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
background-color: #fff;
|
||||
box-shadow: 0 0 0 1px rgba(99, 114, 130, 0.16), 0 8px 16px rgba(27, 39, 51, 0.08);
|
||||
border-radius: 5px;
|
||||
padding-bottom: 15px;
|
||||
}
|
||||
|
||||
.yui-skin-sam .yui-panel-container .yui-panel {
|
||||
border: none !important;
|
||||
background: none;
|
||||
box-shadow: none !important;
|
||||
}
|
||||
|
||||
.yui-skin-sam .yui-panel-container .yui-panel .hd {
|
||||
cursor: move;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
background: 0;
|
||||
margin: 0;
|
||||
font-size: 14px;
|
||||
line-height: 40px;
|
||||
text-transform: uppercase;
|
||||
padding: 0 15px;
|
||||
padding-top: 5px;
|
||||
font-weight: bold;
|
||||
border-bottom: 1px solid #d2d2d2;
|
||||
}
|
||||
|
||||
.yui-skin-sam .yui-panel-container .yui-panel .container-close {
|
||||
top: 15px;
|
||||
border: none;
|
||||
background: none;
|
||||
color: white;
|
||||
text-indent: 0;
|
||||
}
|
||||
.yui-skin-sam .yui-panel-container .yui-panel .container-close::before {
|
||||
content: "x";
|
||||
color: #6f757a;
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.yui-skin-sam .yui-panel-container .yui-panel .bd {
|
||||
background: none;
|
||||
border: none;
|
||||
box-shadow: none;
|
||||
padding: 15px;
|
||||
background-color: transparent !important;
|
||||
}
|
||||
|
||||
.yui-panel .underlay, .yui-skin-sam .yui-panel-container.shadow .underlay {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
#div_tbl_btn_close {
|
||||
float: right;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
margin-top: 10px;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
}
|
||||
|
||||
#tbl_btn_close {
|
||||
border: none;
|
||||
color: #ffffff;
|
||||
height: 30px;
|
||||
width: 100%;
|
||||
border-radius: 3px;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
#tbl_btn_close:hover { cursor: pointer; }
|
||||
|
||||
.yui-skin-sam .yui-button {
|
||||
background: none;
|
||||
background-color: white;
|
||||
border: none;
|
||||
height: 24px;
|
||||
margin-bottom: -4px;
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
.yui-skin-sam .yui-button .first-child { margin: 0; border: none; }
|
||||
|
||||
.yui-skin-sam .yui-split-button button {
|
||||
padding: 0;
|
||||
background: none !important;
|
||||
}
|
||||
|
||||
.yui-skin-sam .yui-split-button button em:not(.color-picker-button) {
|
||||
font-style: normal !important;
|
||||
border-bottom: 1px solid #b5b7b7;
|
||||
padding: 0 5px;
|
||||
margin: 0 5px;
|
||||
padding-bottom: 3px;
|
||||
}
|
||||
|
||||
button#yui-gen13-button {
|
||||
margin-left: -5px;
|
||||
}
|
||||
|
||||
button .color-picker-button {
|
||||
border: 1px solid #c1c2c2;
|
||||
border-radius: 50%;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
margin-top: 2px;
|
||||
}
|
||||
|
||||
#even-row-bg-color, #single-row-bg-color {
|
||||
margin-right: 5px;
|
||||
}
|
||||
#single-col-bg-color, #odd-row-bg-color {
|
||||
margin-left: 7px;
|
||||
}
|
||||
|
||||
#yui-tbl-prop-panel .text-input[type=text] {
|
||||
border: 1px solid #d2d2d2;
|
||||
float: right;
|
||||
height: 10px;
|
||||
border-radius: 3px;
|
||||
padding: 8px 10px;
|
||||
}
|
||||
|
||||
#text_input_message {
|
||||
background-color: #64d29b;
|
||||
padding: 0 5px;
|
||||
color: white;
|
||||
font-size: 12px;
|
||||
border-radius: 5px;
|
||||
font-weight: bold;
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* TABLES INSIDE THE PAD */
|
||||
td[name=tData] {
|
||||
/*border: 1px solid grey !important;*/
|
||||
}
|
||||
|
||||
#yui-picker-panel_c
|
||||
{
|
||||
padding-bottom: 40px;
|
||||
}
|
||||
|
||||
div#yui-picker-panel_h {
|
||||
line-height: 1.8em;
|
||||
font-size: 13px;
|
||||
padding: 9px 15px 5px;
|
||||
}
|
||||
|
||||
#yui-picker-panel .ft {
|
||||
position: relative;
|
||||
border: none;
|
||||
width: 100%;
|
||||
padding: 0;
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
|
@ -0,0 +1,98 @@
|
|||
#timeslider-slider #ui-slider-handle {
|
||||
border-radius: 3px;
|
||||
width: 12px;
|
||||
height: 28px;
|
||||
background-color: #64d29b;
|
||||
background-color: var(--primary-color);
|
||||
}
|
||||
|
||||
#timeslider-slider #ui-slider-bar {
|
||||
border-radius: 3px;
|
||||
background-color: #d2d2d2;
|
||||
background-color: var(--border-color);
|
||||
}
|
||||
#slider-btn-container {
|
||||
margin: -18px 15px 0 20px;
|
||||
}
|
||||
#slider-btn-container #playpause_button_icon {
|
||||
color: #ffffff;
|
||||
color: var(--bg-color);
|
||||
background-color: #64d29b;
|
||||
background-color: var(--primary-color);
|
||||
border: none;
|
||||
margin-right: 5px;
|
||||
padding-top: 3px;
|
||||
width: 45px;
|
||||
height: 45px;
|
||||
}
|
||||
#slider-btn-container #playpause_button_icon:not(.pause) {
|
||||
padding-left: 4px;
|
||||
}
|
||||
#slider-btn-container .stepper {
|
||||
border: 2px solid !important;
|
||||
height: 30px;
|
||||
width: 30px;
|
||||
line-height: 28px;
|
||||
margin-left: 5px;
|
||||
font-size: 13px;
|
||||
color: #64d29b;
|
||||
color: var(--primary-color);
|
||||
border-color: #64d29b;
|
||||
border-color: var(--primary-color);
|
||||
}
|
||||
#slider-btn-container .stepper.disabled {
|
||||
opacity: .5;
|
||||
}
|
||||
|
||||
.timeslider #editbar .buttontext {
|
||||
background-color: #576273;
|
||||
background-color: var(--text-soft-color);
|
||||
color: #ffffff;
|
||||
color: var(--bg-color);
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
#editbar {
|
||||
display: block;
|
||||
padding-bottom: 5px;
|
||||
}
|
||||
|
||||
#editbar li > a {
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
#timeslider-slider #timer {
|
||||
opacity: .7;
|
||||
top: -12px;
|
||||
font-size: .8em;
|
||||
}
|
||||
|
||||
.timeslider #authorsList .author {
|
||||
padding: 2px 5px;
|
||||
border-radius: 3px;
|
||||
margin-right: 4px;
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
|
||||
.timeslider-title {
|
||||
font-size: 1.8rem !important;
|
||||
}
|
||||
.timeslider-subtitle {
|
||||
margin-top: 6px;
|
||||
font-size: .9em;
|
||||
}
|
||||
|
||||
@media (max-width: 800px) {
|
||||
|
||||
#slider-btn-container {
|
||||
margin-top: 0;
|
||||
margin-right: 5px;
|
||||
}
|
||||
#slider-btn-container #playpause_button_icon {
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
}
|
||||
#slider-btn-container #playpause_button_icon:before {
|
||||
font-size: 18px;
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,4 @@
|
|||
'use strict';
|
||||
|
||||
window.customStart = () => {
|
||||
};
|
||||
Loading…
Reference in New Issue