css: minor improvements

This commit is contained in:
Sebastian Castro 2020-04-06 14:31:07 +02:00 committed by muxator
parent a5164dad43
commit 51b857ad1a
15 changed files with 73 additions and 40 deletions

View file

@ -92,7 +92,7 @@ body.doesWrap:not(.noprewrap) > div {
} }
#sidedivinner { #sidedivinner {
text-align: right; text-align: right;
opacity: .7; opacity: .9;
} }
#sidediv:not(.sidedivdelayed) { /* before sidediv get initialized, hide text */ #sidediv:not(.sidedivdelayed) { /* before sidediv get initialized, hide text */
color: transparent; color: transparent;
@ -132,7 +132,7 @@ body.doesWrap:not(.noprewrap) > div {
::-moz-selection { ::-moz-selection {
background: #acf; background: #acf;
} }
a { #innerdocbody a {
cursor: pointer !important; cursor: pointer !important;
white-space:pre-wrap; white-space:pre-wrap;
} }

View file

@ -14,10 +14,15 @@
html { html {
font-size: 14px; font-size: 14px;
font-family: Cantarell, Roboto, "Open Sans", "Helvetica Neue", Arial, sans-serif;
line-height: 20px; line-height: 20px;
color: #3e3e3e; color: #3e3e3e;
} }
html,
#sidedivinner > div:before {
font-family: Cantarell, Roboto, "Open Sans", "Helvetica Neue", Arial, sans-serif;
}
.clear { .clear {
clear: both clear: both
} }

View file

@ -42,6 +42,7 @@
} }
#titlebar #titlelabel { #titlebar #titlelabel {
margin: 4px 0 0 4px; margin: 4px 0 0 4px;
display: inline;
} }
#titlebar .stick-to-screen-btn, #titlebar .stick-to-screen-btn,
#titlebar .hide-reduce-btn { #titlebar .hide-reduce-btn {
@ -106,6 +107,7 @@
#chaticon #chatcounter { #chaticon #chatcounter {
font-size: .8rem; font-size: .8rem;
vertical-align: middle; vertical-align: middle;
margin-left: 5px;
} }
/* -- LOAD MESSAGES -- */ /* -- LOAD MESSAGES -- */

View file

@ -115,7 +115,9 @@ input#myusernameedit:not(.editable) {
/* ------------------- */ /* ------------------- */
/* --- OTHER USERS --- */ /* --- OTHER USERS --- */
/* ------------------- */ /* ------------------- */
#otheruserstable {
display: none;
}
#otheruserstable td { #otheruserstable td {
height: 26px; height: 26px;
padding: 0 2px; padding: 0 2px;

View file

@ -71,7 +71,7 @@
#timeslider-slider .star { #timeslider-slider .star {
cursor: pointer; cursor: pointer;
position: absolute; position: absolute;
top: -6px top: -8px
} }
#timeslider-slider .star:before{ #timeslider-slider .star:before{
font-family: fontawesome-etherpad; font-family: fontawesome-etherpad;

View file

@ -1,4 +1,5 @@
// Farbtastic 2.0 alpha // Farbtastic 2.0 alpha
// edited by Sebastian Castro <sebastian.castro@protonmail.com> on 2020-04-06
(function ($) { (function ($) {
var __debug = false; var __debug = false;
@ -304,19 +305,17 @@ $._farbtastic = function (container, options) {
*/ */
fb.drawMarkers = function () { fb.drawMarkers = function () {
// Determine marker dimensions // Determine marker dimensions
var sz = options.width, lw = Math.ceil(fb.markerSize / 4), r = fb.markerSize - lw + 1; var sz = options.width;
var angle = fb.hsl[0] * 6.28, var angle = fb.hsl[0] * 6.28,
x1 = Math.sin(angle) * fb.radius, x1 = Math.sin(angle) * fb.radius,
y1 = -Math.cos(angle) * fb.radius, y1 = -Math.cos(angle) * fb.radius,
x2 = 2 * fb.square * (.5 - fb.hsl[1]), x2 = 2 * fb.square * (.5 - fb.hsl[1]),
y2 = 2 * fb.square * (.5 - fb.hsl[2]), y2 = 2 * fb.square * (.5 - fb.hsl[2]);
c1 = fb.invert ? '#fff' : '#000',
c2 = fb.invert ? '#000' : '#fff';
var circles = [ var circles = [
{ x: x1, y: y1, r: r, c: '#000', lw: lw + 1 }, { x: x1, y: y1, r: fb.markerSize + 1, c: 'rgb(0,0,0,.4)', lw: 2 },
{ x: x1, y: y1, r: fb.markerSize, c: '#fff', lw: lw }, { x: x1, y: y1, r: fb.markerSize, c: '#fff', lw: 2 },
{ x: x2, y: y2, r: r, c: c2, lw: lw + 1 }, { x: x2, y: y2, r: fb.markerSize + 1, c: 'rgb(0,0,0,.4)', lw: 2 },
{ x: x2, y: y2, r: fb.markerSize, c: c1, lw: lw }, { x: x2, y: y2, r: fb.markerSize, c: '#fff', lw: 2 },
]; ];
// Update the overlay canvas. // Update the overlay canvas.

View file

@ -207,6 +207,7 @@ var paduserlist = (function()
tr = $(getRowHtml(domId, getEmptyRowHtml(getAnimationHeight(ANIMATION_START)), authorId)); tr = $(getRowHtml(domId, getEmptyRowHtml(getAnimationHeight(ANIMATION_START)), authorId));
} }
handleRowNode(tr, data); handleRowNode(tr, data);
$("table#otheruserstable").show();
if (position == 0) if (position == 0)
{ {
$("table#otheruserstable").prepend(tr); $("table#otheruserstable").prepend(tr);
@ -263,6 +264,9 @@ var paduserlist = (function()
scheduleAnimation(); scheduleAnimation();
} }
} }
if (rowsPresent.length === 0) {
$("table#otheruserstable").hide();
}
} }
// newPosition is position after the row has been removed // newPosition is position after the row has been removed

View file

@ -78,16 +78,20 @@ p[data-l10n-id="ep_comments_page.comment"],
#slider-btn-container button { #slider-btn-container button {
border-color: #64d29b; border-color: #64d29b;
} }
h2 {
opacity: .9 !important; /* make it a bit less agressive */
}
/* PRIMARY-COLOR VARIANT */ /* PRIMARY-COLOR VARIANT */
.toolbar ul li a.selected, .toolbar ul li a.selected,
.toolbar ul li a.pressed, .toolbar ul li a.pressed,
.toolbar ul li select:active { .toolbar ul li select:active {
background-color: #f0faf6 !important; background-color: #f0faf6 !important; /* primary light */
} }
.toolbar ul li a.selected .buttonicon, .toolbar ul li a.selected .buttonicon,
.toolbar ul li a.pressed .buttonicon, .toolbar ul li a.pressed .buttonicon,
.toolbar ul li select:active { .toolbar ul li select:active {
color: #5abb89; color: #5abb89; /* primary a bit darker */
} }
/* BACKGROUND COLOR */ /* BACKGROUND COLOR */
@ -96,4 +100,6 @@ p[data-l10n-id="ep_comments_page.comment"],
} }
/* FONT */ /* FONT */
body { font-family: Quicksand, Cantarell, "Open Sans", "Helvetica Neue", sans-serif; } body,
#sidedivinner > div:before
{ font-family: Quicksand, Cantarell, "Open Sans", "Helvetica Neue", sans-serif; }

View file

@ -1,11 +1,14 @@
.gritter-item {
margin-bottom: 10px;
}
.gritter-item .popup-content { .gritter-item .popup-content {
color: white; color: white;
margin-bottom: 10px;
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);
} }
.gritter-item p {
margin: 0;
}
.gritter-item .gritter-title {
margin-bottom: 20px;
}
.gritter-item .gritter-close { .gritter-item .gritter-close {
margin-left: 10px; margin-left: 10px;
margin-right: -5px; margin-right: -5px;

View file

@ -12,11 +12,13 @@
} }
.popup h1 { .popup h1 {
margin-bottom: 15px; margin-bottom: 20px;
font-size: 1.6rem;
} }
.popup h2 { .popup h2 {
margin-bottom: 15px; margin-bottom: 15px;
margin-top: 20px;
} }
.popup p { .popup p {

View file

@ -6,7 +6,7 @@
#sidedivinner>div:before { #sidedivinner>div:before {
font-size: 13px; font-size: 13px;
padding-right: 18px !important; padding-right: 18px !important;
color: #6a6a6b; color: #818188;
text-transform: uppercase; text-transform: uppercase;
font-size: 11px !important; font-size: 11px !important;
font-weight: bold; font-weight: bold;
@ -22,7 +22,7 @@
#sidedivinner>div { #sidedivinner>div {
line-height: 24px; line-height: 24px;
font-size: 10px !important; font-size: 10px !important;
color: #7b7878; color: #b2aaaa;
} }
#sidedivinner.authorColors>div, #sidedivinner.authorColors>div.primary-none, #sidedivinner>div { #sidedivinner.authorColors>div, #sidedivinner.authorColors>div.primary-none, #sidedivinner>div {

View file

@ -2,6 +2,7 @@
background-color: white; background-color: white;
border-bottom: 1px solid #d2d2d2; border-bottom: 1px solid #d2d2d2;
padding: 0; padding: 0;
color: #5f6368;
} }
.toolbar ul { .toolbar ul {
@ -15,16 +16,18 @@
.toolbar ul li { .toolbar ul li {
margin: 5px 1px; margin: 5px 1px;
} }
.toolbar ul li a, .toolbar .buttonicon {
color: inherit;
}
.toolbar .buttonicon { .toolbar .buttonicon {
background-color: transparent; background-color: transparent;
font-size: 15px; font-size: 15px;
color: #5f6368;
} }
.buttonicon-insertorderedlist, .buttonicon-insertorderedlist:before,
.buttonicon-insertunorderedlist, .buttonicon-insertunorderedlist:before,
.buttonicon-indent, .buttonicon-indent:before,
.buttonicon-outdent { .buttonicon-outdent:before {
font-size: 16px !important; font-size: 16px !important;
} }
@ -75,7 +78,6 @@
border-radius: 3px; border-radius: 3px;
width: auto; width: auto;
font-weight: bold; font-weight: bold;
color: #6d7075;
font-size: 14px; font-size: 14px;
} }
@ -96,6 +98,7 @@
} }
.toolbar .menu_right li { .toolbar .menu_right li {
margin-left: 8px; margin-left: 8px;
opacity: .9;
} }
.toolbar.cropped .menu_left { .toolbar.cropped .menu_left {
@ -114,10 +117,6 @@
background: none; background: none;
display: block; display: block;
} }
.toolbar ul li[data-key=showusers] {
margin-left: -5px !important;
}
} }
@media (max-width: 720px) { @media (max-width: 720px) {

View file

@ -1,5 +1,5 @@
table#otheruserstable { table#otheruserstable {
margin-top: 10px !important; margin-top: 20px;
} }
#otheruserstable .swatch { #otheruserstable .swatch {
@ -16,8 +16,12 @@ table#otheruserstable {
margin-left: 35px; margin-left: 35px;
} }
#myusernameedit { input#myusernameedit {
min-width: 110px; min-width: 110px;
border: none !important;
border-bottom: 1px solid #ddd !important;
border-radius: 0;
padding-bottom: 5px;
} }
#myswatch { #myswatch {

View file

@ -9,17 +9,24 @@
background-color: #e4e4e4; background-color: #e4e4e4;
} }
#slider-btn-container { #slider-btn-container {
margin: 0 20px; margin: -18px 15px 0 20px;
margin-top: -15px;
} }
#slider-btn-container #playpause_button_icon { #slider-btn-container #playpause_button_icon {
color: white; color: white;
margin-right: 5px; 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 { #slider-btn-container .stepper {
border: 2px solid !important; border: 2px solid !important;
height: 25px; height: 30px;
width: 25px; width: 30px;
line-height: 28px;
margin-left: 5px; margin-left: 5px;
font-size: 13px; font-size: 13px;
} }

View file

@ -363,7 +363,7 @@
<div id="chatbox"> <div id="chatbox">
<div id="titlebar"> <div id="titlebar">
<span id ="titlelabel" data-l10n-id="pad.chat"></span> <h1 id ="titlelabel" data-l10n-id="pad.chat"></h1>
<a id="titlecross" class="hide-reduce-btn" onClick="chat.hide();return false;">-&nbsp;</a> <a id="titlecross" class="hide-reduce-btn" onClick="chat.hide();return false;">-&nbsp;</a>
<a id="titlesticky" class="stick-to-screen-btn" onClick="chat.stickToScreen(true);return false;" data-l10n-id="pad.chat.stick.title">&nbsp;&nbsp;</a> <a id="titlesticky" class="stick-to-screen-btn" onClick="chat.stickToScreen(true);return false;" data-l10n-id="pad.chat.stick.title">&nbsp;&nbsp;</a>
</div> </div>