Merge pull request pterodactyl#2118 from Sir3lit/stylingchanges

Add scrollbar styling + change syntax background color

Author: DaneEveritt

resources/styles/components/forms.css

@@ -123,6 +123,7 @@ select.input:not(.appearance-none) {
 select.input-dark:not(.appearance-none) {
     @apply .bg-neutral-600 .border-neutral-500 .text-neutral-200;
     background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='%23C3D1DF' d='M9.293 12.95l.707.707L15.657 8l-1.414-1.414L10 10.828 5.757 6.586 4.343 8z'/%3e%3c/svg%3e ");
+    background-color: hsl(220deg 21% 16%);
 
     &:hover:not(:disabled), &:focus {
         @apply .border-neutral-400;

resources/styles/components/miscellaneous.css

@@ -27,3 +27,39 @@ code.clean {
         @apply .mt-4;
     }
 }
+
+::-webkit-scrollbar {
+    background: none;
+    width: 16px;
+    height: 16px;
+}
+
+ ::-webkit-scrollbar-thumb {
+     border: solid 0 rgb(0 0 0 / 0%);
+     border-right-width: 4px;
+     border-left-width: 4px;
+     -webkit-border-radius: 9px 4px;
+     -webkit-box-shadow: inset 0 0 0 1px hsl(211, 10%, 53%), inset 0 0 0 4px hsl(209deg 18% 30%);
+}
+
+ ::-webkit-scrollbar-track-piece {
+     margin: 4px 0;
+}
+
+ ::-webkit-scrollbar-thumb:horizontal {
+     border-right-width: 0;
+     border-left-width: 0;
+     border-top-width: 4px;
+     border-bottom-width: 4px;
+     -webkit-border-radius: 4px 9px;
+}
+
+ ::-webkit-scrollbar-thumb:hover {
+     -webkit-box-shadow:
+       inset 0 0 0 1px hsl(212, 92%, 43%),
+       inset 0 0 0 4px hsl(212, 92%, 43%);
+}
+
+ ::-webkit-scrollbar-corner {
+     background: transparent;
+}