mediawiki-extensions-Discus.../modules/dt.init.less
Bartosz Dziewoński b92ae47e00 Tweak colors and timing of the highlight on posted comments
* Use a slightly different color
* Use 'mix-blend-mode: multiply' when available to avoid fading
  the text color
* Add fade-in animation and make fade-out animation slower

Bug: T268994
Change-Id: I210ed4fd55c3dc184d13daf915fa93bee3699ad5
2020-12-01 23:44:39 +01:00

75 lines
1.4 KiB
Plaintext

.dt-init-replylink-buttons {
user-select: none;
margin-left: 0.5em;
// Chromium bug (T260072): Element with `user-select: none` at the end of a paragraph causes
// triple-click (to select the paragraph) to also select the first character of the next paragraph
// https://bugs.chromium.org/p/chromium/issues/detail?id=1116214
display: inline-flex;
.client-nojs & {
display: none;
}
.dt-init-replylink {
&-reply {
cursor: pointer;
}
// Similar to mw-editsection-bracket
&-bracket {
color: #54595d;
&:first-of-type {
margin-right: 0.25em;
}
&:not( :first-of-type ) {
margin-left: 0.25em;
}
}
}
&.dt-init-replylink-active {
visibility: hidden;
}
.dt-init-replylink-open & > a {
color: #72777d;
pointer-events: none;
}
@media print {
display: none;
}
}
.dt-init-highlight {
// Support: IE11
// On supporting browsers, we instead use non-transparent color with mix-blend-mode.
// Identical to #ffe29e on white background.
background-color: rgba( 255, 198, 60, 0.5 );
position: absolute;
pointer-events: none;
opacity: 0;
}
@supports ( mix-blend-mode: multiply ) {
.dt-init-highlight-overlay {
mix-blend-mode: multiply;
}
.dt-init-highlight {
background-color: #ffe29e;
}
}
.dt-init-highlight-fadein {
opacity: 1;
transition: opacity 100ms;
}
.dt-init-highlight-fadeout {
opacity: 0;
transition: opacity 500ms ease-out;
}