dennisfrank / decent-discord Goto Github PK
View Code? Open in Web Editor NEWA decent Discord theme
License: MIT License
A decent Discord theme
License: MIT License
Looks like there are two issues with the :thumbsup:
emoji that have cropped up recently...
:thumbsup:
inline, the icon is gigantic.:thumbsup:
as a reaction to a comment, the icon is a broken image.Not sure when it started, but seems to be a recent issue. It only happens with the :thumbsup:
(or :+1
) emoji.
/* Server bar transition */
[class*="guildsWrapper-"] {
transition: .2s width ease-out;
}
/* Hide server bar */
[class*="guildsWrapper-"]:not(:hover) {
position: relative;
width: 0;
overflow: visible;
contain: unset;
}
/* Hide server bar content */
[class*="guildsWrapper-"]:not(:hover) * {
display: none;
}
/* Invisible hover area */
[class*="guildsWrapper-"]::after {
content: "" !important;
position: absolute;
top: 0;
bottom: 0;
left: 80%;
width: 20px;
z-index: 99999;
}
/* Min width for messages */
[class*="containerCozyBounded-"] {
min-width: 200px;
overflow-x: scroll;
}
When you hover over a message, the background turns grey (like Slack). I love that! ❤️
But it seems to highlight all messages in that block from that user. So if the person posted 3 times in a row, all 3 messages will be highlighted.
Is there a way to restrict that to a single message? It makes it a little trickier to find the reaction/edit links when you hover over on the right-hand side.
Feel free to add message hover colors similar to Slack:
:root {
--theme-light-message-hover-bg-color: rgba(0,0,0,.03);
--theme-dark-message-hover-bg-color: rgba(255,255,255,.03);
}
.theme-light [class*="containerCozyBounded-"]:hover {
background-color: var(--theme-light-message-hover-bg-color);
}
.theme-dark [class*="containerCozyBounded-"]:hover {
background-color: var(--theme-dark-message-hover-bg-color);
}
:-)
If one do not use the app, but a browser, the window width can be set much smaller. In this case, I find the font size a little too large. Maybe this could be solved quite elegantly with fluid font sizes?
https://css-tricks.com/snippets/css/fluid-typography/
https://css-tricks.com/between-the-lines/
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.