NoLog.cz/etherpad
6
0
Fork 0
Code Issues Pull requests Projects Releases Packages 1 Wiki Activity

fix colibris skin after refactor

Browse source
This commit is contained in:
Sebastian Castro 2020-03-31 19:27:04 +02:00 committed by muxator
parent a482a94fb8
commit e041099d1b
15 changed files with 91 additions and 246 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
src/static/css/pad/chat.css
View file

@ -46,6 +46,7 @@
#titlebar .stick-to-screen-btn, #titlebar .stick-to-screen-btn,
#titlebar .hide-reduce-btn { #titlebar .hide-reduce-btn {
font-size: 25px; font-size: 25px;
color: inherit;
float: right; float: right;
text-align: right; text-align: right;
text-decoration: none; text-decoration: none;

5
src/static/css/pad/popup_users.css
View file

@ -94,14 +94,9 @@ input#myusernameedit:not(.editable) {
#mycolorpicker { #mycolorpicker {
display: none; display: none;
width: 232px;
height: 265px;
position: absolute; position: absolute;
right: calc(100% + 15px); right: calc(100% + 15px);
top: 0;
z-index: 101; z-index: 101;
padding-left: 10px;
padding-top: 10px;
} }
#mycolorpickersave { #mycolorpickersave {
left: 10px; left: 10px;

4
src/static/css/timeslider.css
View file

@ -3,7 +3,9 @@
p.pblort { p.pblort {
height: 100px; height: 100px;
} }
.timeslider-bar #editbar {
display: block;
}
#editorcontainerbox { #editorcontainerbox {
overflow: auto; overflow: auto;
top: 40px; top: 40px;

21
src/static/skins/colibris/pad.css
View file

@ -23,12 +23,6 @@
/* NEUTRAL COLOR */ /* NEUTRAL COLOR */
body, body,
#innerdocbody
#users,
#chattext,
#chatinput,
#chatlabel,
#toc,
#tocItems a, #tocItems a,
.toolbar ul li a:hover .buttonicon, .toolbar ul li a:hover .buttonicon,
.toolbar ul li a, .toolbar ul li a,
@ -37,8 +31,6 @@ body,
.btn-default, .btn-default,
.color\:black, .color\:black,
[data-color=black], [data-color=black],
#chattext.authorColors p, #chattext.authorColors span,
#chattext .time,
#tbl_context_menu ul .yuimenuitemlabel, #tbl_context_menu ul .yuimenuitemlabel,
.yui-skin-sam .yui-split-button button em:not(.color-picker-button), .yui-skin-sam .yui-split-button button em:not(.color-picker-button),
#yui-picker-panel .button-group .yui-button:first-child button, #yui-picker-panel .button-group .yui-button:first-child button,
@ -87,7 +79,7 @@ p[data-l10n-id="ep_comments_page.comment"],
.comment-reply-input-label span, .comment-reply-input-label span,
.stepper, #importmessageabiword, #importmessageabiword > a .stepper, #importmessageabiword, #importmessageabiword > a
{ color: #64d29b; } { color: #64d29b; }
#ui-slider-handle, #playpause_button_icon { #ui-slider-handle, #playpause_button_icon, .gritter-item:not(.error) {
background-color: #64d29b; background-color: #64d29b;
} }
.stepper { .stepper {
@ -101,16 +93,7 @@ p[data-l10n-id="ep_comments_page.comment"],
/* NEUTRAL FONT */ /* NEUTRAL FONT */
body, body
#innerdocbody,
#chatinput,
.toolbar ul li select,
button, input, select, textarea,
td[name=tData],
#comments, #newComments,
#sidediv,
#comments .sidebar-comment,
#timeslider #timer, .exporttype
{ font-family: Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif; } { font-family: Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif; }
/* PRIMARY FONT */ /* PRIMARY FONT */

18
src/static/skins/colibris/src/components/chat.css
View file

@ -10,20 +10,16 @@
} }
#chatbox.stickyChat { #chatbox.stickyChat {
width: 193px !important; border: none;
border: none !important;
} }
#chatbox.stickyChat.chatAndUsersChat{ #chatbox.stickyChat.chatAndUsersChat{
margin-top: 181px;
box-shadow: none; box-shadow: none;
border-top: 1px solid #d2d2d2 !important;
padding: 0!important;
} }
#titlebar { #titlebar {
bottom: 0; bottom: 0;
line-height: 39px; line-height: 44px;
height: 44px; height: 44px;
padding: 0 7px; padding: 0 7px;
z-index: 20000; z-index: 20000;
@ -39,13 +35,8 @@
#chatlabel { margin-right: 15px; } #chatlabel { margin-right: 15px; }
#chattext { #chattext {
top: 45px;
font-size: 13px;
bottom: 52px;
overflow-y: auto;
padding: 0;
border: none;
border-bottom: 1px solid #cccccc; border-bottom: 1px solid #cccccc;
background-color: #fcfcfc;
} }
.plugin-ep_author_neat #chattext { .plugin-ep_author_neat #chattext {
@ -83,7 +74,7 @@
padding: 8px; padding: 8px;
} }
#chatinput { #chatinputbox #chatinput {
width: calc(100% - 20px); width: calc(100% - 20px);
float: right; float: right;
} }
@ -102,7 +93,6 @@
@media (max-width: 720px) { @media (max-width: 720px) {
#chaticon { #chaticon {
right: 0; right: 0;
bottom: 44px;
} }
#chatbox { #chatbox {

37
src/static/skins/colibris/src/components/gritter.css
View file

@ -1,28 +1,13 @@
/* Popups at the bottom of the page to indicate when the pad expires, and others stuff */
.gritter-title {
text-shadow: none;
}
#gritter-container {
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: 3px;
padding: 15px 20px 5px 30px;
bottom: 50px !important;
right: 30px !important;
}
@media (max-width: 1100px) {
#gritter-container {
display: none;
}
}
.gritter-item { .gritter-item {
font-family: Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif !important; margin-bottom: 10px;
color: #4e545b; color: white;
font-size: 12px; box-shadow: 0 0 0 1px rgba(99, 114, 130, 0.16), 0 8px 16px rgba(27, 39, 51, 0.08);
line-height: 20px; }
padding: 0;
.gritter-item .gritter-close {
margin-left: 10px;
margin-right: -5px;
}
.gritter-item .gritter-close .buttonicon {
color: white;
} }

17
src/static/skins/colibris/src/components/import-export.css
View file

@ -1,32 +1,17 @@
#exportColumn {
margin-top: 0;
padding-left: 20px;
width: calc(50% - 20px);
}
#importmessageabiword { #importmessageabiword {
font-style: italic; font-style: italic;
font-size: 13px;
} }
#importmessageabiword > a { #importmessageabiword > a {
font-weight: bold; font-weight: bold;
text-decoration: underline; text-decoration: underline;
} }
.exportlink {
font-size: 14px;
margin: 0;
margin-bottom: 7px;
margin-left: 10px;
}
.exporttype { .exporttype {
margin-left: 5px; margin-left: 5px;
font-size: 14px; margin-bottom: 10px;
} }
#importmessagefail { #importmessagefail {
font-size: 13px;
margin-top: 10px; margin-top: 10px;
} }

17
src/static/skins/colibris/src/components/popup.css
View file

@ -1,7 +1,6 @@
#users, .popup {
#mycolorpicker, top: -2px;
.popup, right: 30px;
.hyperlink-dialog {
border-radius: 3px; border-radius: 3px;
padding: 20px 20px; padding: 20px 20px;
background: none; background: none;
@ -10,7 +9,10 @@
box-shadow: 0 0 0 1px rgba(99, 114, 130, 0.16), 0 8px 16px rgba(27, 39, 51, 0.08); box-shadow: 0 0 0 1px rgba(99, 114, 130, 0.16), 0 8px 16px rgba(27, 39, 51, 0.08);
} }
#users input[type=text], #mycolorpicker, #users {
min-width: 0;
}
.popup input[type=text] { .popup input[type=text] {
border: none !important; border: none !important;
border-bottom: 1px solid #d7d8da !important; border-bottom: 1px solid #d7d8da !important;
@ -28,3 +30,8 @@
margin: 10px 0; margin: 10px 0;
} }
@media (max-width: 720px) {
.popup {
top: auto;
}
}

2
src/static/skins/colibris/src/components/sidediv.css
View file

@ -22,7 +22,7 @@
#sidedivinner>div { #sidedivinner>div {
line-height: 24px; line-height: 24px;
font-size: 10px !important; font-size: 10px !important;
color: #a0a0a0; color: #7b7878;
} }
#sidedivinner.authorColors>div, #sidedivinner.authorColors>div.primary-none, #sidedivinner>div { #sidedivinner.authorColors>div, #sidedivinner.authorColors>div.primary-none, #sidedivinner>div {

103
src/static/skins/colibris/src/components/toolbar.css
View file

@ -1,10 +1,15 @@
.toolbar { .toolbar {
height: 39px !important; background-color: white;
padding-top: 0; border-bottom: 1px solid #d2d2d2;
margin: 0; padding: 0;
background-color: white !important; }
background: none;
border: 1px solid #d2d2d2 .toolbar ul {
align-items: center;
}
.toolbar ul.menu_left {
padding-left: 8px;
} }
.toolbar .buttonicon { .toolbar .buttonicon {
@ -14,12 +19,22 @@
} }
.toolbar ul li.separator { .toolbar ul li.separator {
padding: 0;
visibility: visible; visibility: visible;
width: 1px; width: 1px;
margin: 0 10px; margin: 0 10px;
margin-right: 6px; position: relative;
height: 39px; }
.toolbar ul li {
margin: 5px 1px;
}
.toolbar ul li.separator:after {
content: "";
position: absolute;
top: -20px;
height: 40px;
width: 1px;
background-color: rgba(78, 85, 92, 0.22); background-color: rgba(78, 85, 92, 0.22);
} }
@ -35,23 +50,22 @@
background-color: transparent; background-color: transparent;
background: none; background: none;
border: none; border: none;
margin-top: 6px;
} }
.toolbar ul li a:hover, .toolbar ul li a:hover,
.toolbar ul li a.selected, .toolbar ul li a.selected,
.toolbar ul li a:focus { .toolbar ul li a:focus {
background: none !important; background: none;
border-radius: 0; border-radius: 0;
} }
.toolbar ul li a:hover { .toolbar ul li a:hover {
background:#f7f7f7!important background-color: #f7f7f7;
} }
.toolbar ul li a.selected, .toolbar ul li a.selected,
.toolbar ul li a:focus { .toolbar ul li a:focus {
background: #eaeaea!important; background-color: #eaeaea;
} }
.toolbar ul li select { .toolbar ul li select {
@ -59,85 +73,48 @@
border-bottom: 1px solid #d7d8da; border-bottom: 1px solid #d7d8da;
border-radius: 0; border-radius: 0;
width: 90px; width: 90px;
margin-top: 5px;
} }
.toolbar ul { .toolbar ul li[data-key=showusers] {
height: 39px;
}
.toolbar ul.menu_left {
padding-left: 8px;
}
.toolbar ul.menu_right {
right: 0;
padding: 0;
}
.toolbar ul li[data-key=showusers] a {
margin: 0; margin: 0;
height: 59px;
line-height: 25px;
width: 45px;
margin-left: -10px; margin-left: -10px;
width: 45px;
height: 100%;
}
.toolbar ul li[data-key=showusers] > a {
width: 100%;
height: 100%;
border-radius: 0; border-radius: 0;
} }
@media (max-width: 1000px) { @media (max-width: 1000px) {
.toolbar ul li.separator { .toolbar ul li.separator {
margin: 0 2px; margin: 0 5px;
background: none; background: none;
display: block; display: block;
} }
.toolbar ul li[data-key=showusers] a { .toolbar ul li[data-key=showusers] {
margin-left: 0 !important; margin-left: -5px !important;
} }
} }
@media (max-width: 720px) { @media (max-width: 720px) {
.toolbar ul { .toolbar ul {
height: 39px; height: 37px;
box-sizing: border-box;
background: none; background: none;
background-color: transparent; background-color: transparent;
overflow-x: visible; overflow-x: visible;
} }
.toolbar ul.menu_left {
padding: 2px 0 0 0;
}
.toolbar ul.menu_right { .toolbar ul.menu_right {
left: 0;
padding-left: 8px;
padding-top: 8px;
height: 35px !important;
border-top: 1px solid #d2d2d2; border-top: 1px solid #d2d2d2;
background-color: white; background-color: white;
} }
.toolbar ul li a {
padding: 4px 5px !important;
}
.toolbar ul li[data-key=showusers] {
position: absolute;
right: 0;
top: 0;
}
.toolbar ul li[data-key=showusers] a {
padding-top: 9px !important;
}
.toolbar ul li a:hover { background-color: transparent; } .toolbar ul li a:hover { background-color: transparent; }
#connectivity, #embed, #import_export, #settings { bottom: 42px; } .toolbar ul li.separator { margin: 0; display: none; }
li.superscript,
li.subscript,
li[data-key="undo"],
li[data-key="redo"] {
display: none;
}
.toolbar ul li.separator { margin: 0; }
} }

39
src/static/skins/colibris/src/components/users.css
View file

@ -17,28 +17,13 @@ table#otheruserstable {
} }
#myusernameedit { #myusernameedit {
width: 110px; min-width: 110px;
}
#myswatchbox {
background: none;
float: left;
position: relative;
left: 0;
top: 0;
border: none !important;
} }
#myswatch { #myswatch {
border-radius: 50%; border-radius: 50%;
} }
#mycolorpicker {
width: auto;
height: auto;
left: -280px;
}
#colorpicker { #colorpicker {
margin-bottom: 25px; margin-bottom: 25px;
} }
@ -62,30 +47,8 @@ table#otheruserstable {
} }
@media (max-width: 720px) { @media (max-width: 720px) {
#users {
bottom: 42px;
top: initial !important;
height: auto !important;
}
#mycolorpicker { #mycolorpicker {
width: auto;
height: auto;
right: 0; right: 0;
bottom: 42px;
left: initial; left: initial;
top: initial !important;
} }
}
#users.chatAndUsers {
width: 172px!important;
box-shadow: none;
border: none !important;
padding: 10px;
padding-top: 15px;
}
#users.chatAndUsers #myusernameedit {
width: calc(100% - 10px);
} }

49
src/static/skins/colibris/src/layout.css
View file

@ -1,17 +1,3 @@
#connectivity,
#embed,
#import_export,
#settings,
#users {
top: 38px;
right: 30px;
}
#editorcontainer {
top: 41px !important;
padding-top: 0 !important;
}
#outerdocbody, .timeslider #editorcontainerbox { #outerdocbody, .timeslider #editorcontainerbox {
max-width: 900px; max-width: 900px;
margin: 0 auto; margin: 0 auto;
@ -20,14 +6,12 @@
#outerdocbody { #outerdocbody {
overflow-y: auto; overflow-y: auto;
position: relative;
background-color: transparent;
padding-left: 40px; /* space for side div */
} }
#outerdocbody.plugin-ep_author_neat { #editorcontainerbox .sticky-container {
padding-left: 120px; /* more space for sidediv */ width: 250px;
} }
@media (max-width:600px) { @media (max-width:600px) {
#outerdocbody.plugin-ep_author_neat { padding-left: 0; } #outerdocbody.plugin-ep_author_neat { padding-left: 0; }
#options-linenoscheck { display:none; } #options-linenoscheck { display:none; }
@ -39,32 +23,12 @@
padding-left: 0; /* sidediv hidden */ padding-left: 0; /* sidediv hidden */
} }
#outerdocbody iframe {
display: block;
position: relative;
left: 0 !important;
top: 0;
}
#outerdocbody iframe, .timeslider #editorcontainerbox { #outerdocbody iframe, .timeslider #editorcontainerbox {
padding: 55px; padding: 55px;
box-shadow: 0 0 0 0.5px rgba(209, 209, 209, 0.32), 0 0 7pt 0pt rgba(204, 204, 204, 0.52); box-shadow: 0 0 0 0.5px rgba(209, 209, 209, 0.32), 0 0 7pt 0pt rgba(204, 204, 204, 0.52);
border: 0; border: 0;
border-radius: 5px; border-radius: 5px;
background-color: white; background-color: white;
width: calc(100% - 110px) !important; /* 100% - padding */
}
#sidediv {
position: absolute;
right: calc(100% - 35px);
left: initial;
top: 74px !important;
padding: 0;
}
#outerdocbody.plugin-ep_author_neat #sidediv {
right: calc(100% - 113px);
} }
/* Fixs comments_page & author_hover does not take in account the document padding */ /* Fixs comments_page & author_hover does not take in account the document padding */
@ -92,6 +56,11 @@
#outerdocbody.plugin-ep_comments_page { padding-right: 0px; } #outerdocbody.plugin-ep_comments_page { padding-right: 0px; }
} }
@media (min-width: 999px) {
#outerdocbody {
min-height: calc(100vh - 20px);
}
}
@media (max-width:1000px) { @media (max-width:1000px) {
#outerdocbody { #outerdocbody {
max-width: none; max-width: none;
@ -100,7 +69,6 @@
#outerdocbody iframe, .timeslider #editorcontainerbox { #outerdocbody iframe, .timeslider #editorcontainerbox {
padding: 20px !important; padding: 20px !important;
border-radius: 0; border-radius: 0;
width: calc(100% - 40px) !important; /* 100% - padding */
} }
#sidediv { #sidediv {
top: 20px !important; /* = #outerdocbody iframe padding-top */ top: 20px !important; /* = #outerdocbody iframe padding-top */
@ -124,7 +92,6 @@
} }
#outerdocbody iframe, .timeslider #editorcontainerbox { #outerdocbody iframe, .timeslider #editorcontainerbox {
padding: 15px !important; padding: 15px !important;
width: calc(100% - 30px) !important; /* 100% - padding */
} }
#sidediv { #sidediv {
display: none; display: none;

6
src/static/skins/colibris/src/plugins/brightcolorpicker.css
View file

@ -1,13 +1,7 @@
#colorpicker {
left: -200px !important;
top: 0px !important;
}
#colorpicker a.brightColorPicker-cancelButton { #colorpicker a.brightColorPicker-cancelButton {
background: none; background: none;
padding: 0; padding: 0;
padding-top: 10px; padding-top: 10px;
font-family: Arial, sans-serif;
font-weight: bold; font-weight: bold;
border: none; border: none;
} }

13
src/static/skins/colibris/src/plugins/set_title_on_pad.css
View file

@ -1,13 +1,8 @@
#pad_title { @media (max-width: 720px) {
margin-bottom: 15px !important; #pad_title {
margin-top: 5px !important; display: none !important;
display: none; /* display only when page is loaded via javascript */ }
} }
@media (max-width:720px) {
#pad_title { display: none !important; }
}
#edit_title { #edit_title {
color: white; color: white;
} }

5
src/static/skins/colibris/timeslider.css
View file

@ -34,6 +34,7 @@
border: none; border: none;
background: none !important; background: none !important;
margin-right: 10px; margin-right: 10px;
margin-top: 10px;
} }
.timeslider #padmain { .timeslider #padmain {
@ -104,8 +105,8 @@
margin: 0; margin: 0;
} }
.timeslider #editbar .grouped-right { .timeslider #editbar .grouped-right {
margin: 0; padding: 0; margin: 0;
margin-top: 5px; border-radius: 3px;
margin-left: 5px; margin-left: 5px;
} }