mirrors/etherpad-lite
1
0
Fork 0
mirror of https://github.com/ether/etherpad-lite.git synced 2025-04-26 10:26:15 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions 17

css: improve gritters

Browse source 
- have two containers, one of the top, on of the bottom;
- remove gritting chat message when opening the chat.
This commit is contained in:
Sebastian Castro 2020-04-18 11:19:50 +02:00 • committed by muxator
parent 3e12b6d132
commit b06324ad80
5 changed files with 90 additions and 37 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -1,7 +1,3 @@
#gritter-container {
top: 20px;
bottom: auto;
}
.gritter-item:not(.error) .popup-content{
background-color: #64d29b;
background-color: var(--primary-color);
@ -9,29 +5,61 @@
color: var(--bg-color);
}
.gritter-item .popup-content {
margin-bottom: 10px;
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;
margin: 0 !important;
}
.gritter-item .gritter-title {
margin-bottom: 10px;
}
.gritter-item .gritter-close {
margin-left: 10px;
margin-right: -5px;
margin-left: 15px;
margin-right: 0px;
}
.gritter-item:not(.error) .gritter-close .buttonicon {
color: #ffffff;
color: var(--bg-color);
}
.gritter-item.popup > .popup-content {
/* 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);
transition: all 0.4s cubic-bezier(0.74, -0.05, 0.27, 1.75)
transform: scale(1) translateY(0) !important;
transition: all 0.4s cubic-bezier(0.74, -0.05, 0.27, 1.75) !important;
}