Isaac Aracena
139 lines
2.8 KiB
CSS
139 lines
2.8 KiB
CSS
@import "tailwindcss";
|
|
@plugin "@tailwindcss/typography";
|
|
|
|
:root {
|
|
color-scheme: dark;
|
|
}
|
|
|
|
html {
|
|
min-height: 100%;
|
|
overflow-y: scroll;
|
|
}
|
|
|
|
body,
|
|
#root {
|
|
min-height: 100%;
|
|
}
|
|
|
|
body {
|
|
margin: 0;
|
|
background: #060816;
|
|
font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
|
|
overflow-x: hidden;
|
|
}
|
|
|
|
@layer utilities {
|
|
.scrollbar-hide::-webkit-scrollbar {
|
|
display: none;
|
|
}
|
|
|
|
.scrollbar-hide {
|
|
-ms-overflow-style: none;
|
|
scrollbar-width: none;
|
|
}
|
|
|
|
.scrollbar-thin::-webkit-scrollbar {
|
|
width: 8px;
|
|
height: 8px;
|
|
}
|
|
|
|
.scrollbar-thin::-webkit-scrollbar-track {
|
|
background: transparent;
|
|
}
|
|
|
|
.scrollbar-thin::-webkit-scrollbar-thumb {
|
|
background: rgba(255, 255, 255, 0.12);
|
|
border-radius: 999px;
|
|
}
|
|
|
|
.scrollbar-thin::-webkit-scrollbar-thumb:hover {
|
|
background: rgba(255, 255, 255, 0.22);
|
|
}
|
|
}
|
|
|
|
@layer components {
|
|
.audio-preview-range {
|
|
height: 20px;
|
|
appearance: none;
|
|
-webkit-appearance: none;
|
|
background: transparent;
|
|
}
|
|
|
|
.audio-preview-range::-webkit-slider-runnable-track {
|
|
height: 6px;
|
|
border-radius: 999px;
|
|
background: rgba(255, 255, 255, 0.16);
|
|
}
|
|
|
|
.audio-preview-range::-webkit-slider-thumb {
|
|
width: 16px;
|
|
height: 16px;
|
|
margin-top: -5px;
|
|
border: 3px solid #ffffff;
|
|
border-radius: 999px;
|
|
appearance: none;
|
|
-webkit-appearance: none;
|
|
background: #67e8f9;
|
|
box-shadow: 0 0 0 5px rgba(103, 232, 249, 0.16), 0 8px 18px rgba(0, 0, 0, 0.32);
|
|
}
|
|
|
|
.audio-preview-range::-moz-range-track {
|
|
height: 6px;
|
|
border: 0;
|
|
border-radius: 999px;
|
|
background: rgba(255, 255, 255, 0.16);
|
|
}
|
|
|
|
.audio-preview-range::-moz-range-thumb {
|
|
width: 16px;
|
|
height: 16px;
|
|
border: 3px solid #ffffff;
|
|
border-radius: 999px;
|
|
background: #67e8f9;
|
|
box-shadow: 0 0 0 5px rgba(103, 232, 249, 0.16), 0 8px 18px rgba(0, 0, 0, 0.32);
|
|
}
|
|
}
|
|
|
|
@layer components {
|
|
.message-audio-range {
|
|
height: 20px;
|
|
appearance: none;
|
|
-webkit-appearance: none;
|
|
background: transparent;
|
|
}
|
|
|
|
.message-audio-range::-webkit-slider-runnable-track {
|
|
height: 6px;
|
|
border-radius: 999px;
|
|
background: transparent;
|
|
}
|
|
|
|
.message-audio-range::-webkit-slider-thumb {
|
|
width: 16px;
|
|
height: 16px;
|
|
margin-top: -5px;
|
|
border: 3px solid #ffffff;
|
|
border-radius: 999px;
|
|
appearance: none;
|
|
-webkit-appearance: none;
|
|
background: #67e8f9;
|
|
box-shadow: 0 0 0 5px rgba(103, 232, 249, 0.16), 0 8px 18px rgba(0, 0, 0, 0.32);
|
|
}
|
|
|
|
.message-audio-range::-moz-range-track {
|
|
height: 6px;
|
|
border: 0;
|
|
border-radius: 999px;
|
|
background: transparent;
|
|
}
|
|
|
|
.message-audio-range::-moz-range-thumb {
|
|
width: 16px;
|
|
height: 16px;
|
|
border: 3px solid #ffffff;
|
|
border-radius: 999px;
|
|
background: #67e8f9;
|
|
box-shadow: 0 0 0 5px rgba(103, 232, 249, 0.16), 0 8px 18px rgba(0, 0, 0, 0.32);
|
|
}
|
|
}
|