Style scrollbars

Author: SanderMertens

etc/query_editor/css/style.css

@@ -120,3 +120,24 @@ span.code-number {
   width: 100%;
   height: 100%;
 }
+
+/* Customizes the scrollbar's track */
+::-webkit-scrollbar-track {
+  background-color: rgba(0, 0, 0, 0);
+}
+
+/* Customizes the scrollbar's thumb */
+::-webkit-scrollbar-thumb {
+  background-color: rgba(255, 255, 255, 0.2);
+  border-radius: var(--border-radius-medium);
+}
+
+/* Customizes the scrollbar thumb on hover */
+::-webkit-scrollbar-thumb:hover {
+  background-color: rgba(255, 255, 255, 0.5);
+}
+
+/* Sets the scrollbar width */
+::-webkit-scrollbar {
+  width: 8.5px;
+}

etc/query_editor/js/components/url-bar.vue

@@ -75,12 +75,14 @@ const setFocus = (value) => {
   text-align: center;
   border-color: var(--border);
   color: var(--secondary-text);
+  cursor: pointer;
 }
 
 #url-bar:focus {
   color: var(--highlight-text);
   border-color: var(--dark-blue);
   box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
+  cursor: text;
 }
 
 </style>