includes fix for #210

Merge branch 'gw/1003-firefoxscrollbars'
This commit is contained in:
Ginger Wong
2020-10-03 13:51:52 -07:00
3 changed files with 14 additions and 4 deletions

View File

@@ -1,6 +1,7 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html lang="en">
<head> <head>
<title>Owncast</title>
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0"/> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0"/>
@@ -77,7 +78,7 @@
<img src="https://owncast.online/images/logo.png" /> <img src="https://owncast.online/images/logo.png" />
<br/> <br/>
<p> <p>
This <a href="https://owncast.online" target="_blank">Owncast</a> stream requires Javascript to play. This <a href="https://owncast.online" rel="noopener noreferrer" target="_blank">Owncast</a> stream requires Javascript to play.
</p> </p>
</div> </div>
</noscript> </noscript>

View File

@@ -14,6 +14,7 @@ May have overrides for other components with own stylesheets.
html { html {
font-size: 14px; font-size: 14px;
scrollbar-width: none;
} }
a:hover { a:hover {
@@ -24,6 +25,9 @@ a:hover {
width: 0px; width: 0px;
background: transparent; background: transparent;
} }
.scrollbar-hidden {
scrollbar-width: none; /* moz only */
}
#app-container * { #app-container * {

View File

@@ -80,6 +80,7 @@
.emoji-picker.owncast { .emoji-picker.owncast {
--secondary-text-color: rgba(255,255,255,.5); --secondary-text-color: rgba(255,255,255,.5);
--category-button-color: rgba(255,255,255,.5); --category-button-color: rgba(255,255,255,.5);
--hover-color: rgba(255,255,255,.25);
background: rgba(26,32,44,1); /* tailwind bg-gray-900 */ background: rgba(26,32,44,1); /* tailwind bg-gray-900 */
color: rgba(226,232,240,1); /* tailwind text-gray-300 */ color: rgba(226,232,240,1); /* tailwind text-gray-300 */
@@ -101,15 +102,19 @@
} }
.emoji-picker__emojis::-webkit-scrollbar-track { .emoji-picker__emojis::-webkit-scrollbar-track {
border-radius: 8px; border-radius: 8px;
background-color: rgba(0,0,0,.2); background-color: black;
box-shadow: inset 0 0 3px rgba(0,0,0,0.3); box-shadow: inset 0 0 3px rgba(0,0,0,0.3);
} }
.emoji-picker__emojis::-webkit-scrollbar-thumb { .emoji-picker__emojis::-webkit-scrollbar-thumb {
background-color: rgba(0,0,0,.45); background-color: var(--category-button-color);
border-radius: 8px; border-radius: 8px;
} }
.emoji-picker__emojis {
scrollbar-color: var(--category-button-color) black;
}
/******************************/ /******************************/