add proper arrow buttons, add proper space for nh child

Filip Łukasik · Filip Łukasik · commit eb2fa660d568 · 2022-04-08T06:25:31.000+02:00
diff --git a/scaladoc/resources/dotty_res/images/icon-buttons/arrow-down/dark/Ankieta dla klienta.template b/scaladoc/resources/dotty_res/images/icon-buttons/arrow-down/dark/Ankieta dla klienta.template
diff --git a/scaladoc/resources/dotty_res/images/icon-buttons/arrow-down/dark/active.svg b/scaladoc/resources/dotty_res/images/icon-buttons/arrow-down/dark/active.svg
@@ -0,0 +1,3 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M4.04469 6.29339C4.12576 6.11474 4.30382 6 4.50001 6H11.5C11.6962 6 11.8743 6.11474 11.9553 6.29339C12.0364 6.47205 12.0055 6.68161 11.8763 6.82925L8.3763 10.8293C8.28135 10.9378 8.14419 11 8.00001 11C7.85583 11 7.71866 10.9378 7.62372 10.8293L4.12372 6.82925C3.99453 6.68161 3.96362 6.47205 4.04469 6.29339Z" fill="##CCCCCC"/>
+</svg>
diff --git a/scaladoc/resources/dotty_res/images/icon-buttons/arrow-down/dark/default.svg b/scaladoc/resources/dotty_res/images/icon-buttons/arrow-down/dark/default.svg
diff --git a/scaladoc/resources/dotty_res/images/icon-buttons/arrow-down/dark/disabled.svg b/scaladoc/resources/dotty_res/images/icon-buttons/arrow-down/dark/disabled.svg
@@ -0,0 +1,3 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M4.04469 6.29339C4.12576 6.11474 4.30382 6 4.50001 6H11.5C11.6962 6 11.8743 6.11474 11.9553 6.29339C12.0364 6.47205 12.0055 6.68161 11.8763 6.82925L8.3763 10.8293C8.28135 10.9378 8.14419 11 8.00001 11C7.85583 11 7.71866 10.9378 7.62372 10.8293L4.12372 6.82925C3.99453 6.68161 3.96362 6.47205 4.04469 6.29339Z" fill="#A09FA6"/>
+</svg>
diff --git a/scaladoc/resources/dotty_res/images/icon-buttons/arrow-down/dark/focus.svg b/scaladoc/resources/dotty_res/images/icon-buttons/arrow-down/dark/focus.svg
@@ -0,0 +1,3 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M4.04469 6.29339C4.12576 6.11474 4.30382 6 4.50001 6H11.5C11.6962 6 11.8743 6.11474 11.9553 6.29339C12.0364 6.47205 12.0055 6.68161 11.8763 6.82925L8.3763 10.8293C8.28135 10.9378 8.14419 11 8.00001 11C7.85583 11 7.71866 10.9378 7.62372 10.8293L4.12372 6.82925C3.99453 6.68161 3.96362 6.47205 4.04469 6.29339Z" fill="#A09FA6"/>
+</svg>
diff --git a/scaladoc/resources/dotty_res/images/icon-buttons/arrow-down/dark/hover.svg b/scaladoc/resources/dotty_res/images/icon-buttons/arrow-down/dark/hover.svg
diff --git a/scaladoc/resources/dotty_res/images/icon-buttons/arrow-down/dark/selected.svg b/scaladoc/resources/dotty_res/images/icon-buttons/arrow-down/dark/selected.svg
diff --git a/scaladoc/resources/dotty_res/images/icon-buttons/arrow-down/light/active.svg b/scaladoc/resources/dotty_res/images/icon-buttons/arrow-down/light/active.svg
diff --git a/scaladoc/resources/dotty_res/images/icon-buttons/arrow-down/light/default.svg b/scaladoc/resources/dotty_res/images/icon-buttons/arrow-down/light/default.svg
@@ -1,3 +1,3 @@
-<svg width="16" height="16" viewBox="0 0 16 16" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
 <path fill-rule="evenodd" clip-rule="evenodd" d="M4.04469 6.29339C4.12576 6.11474 4.30382 6 4.50001 6H11.5C11.6962 6 11.8743 6.11474 11.9553 6.29339C12.0364 6.47205 12.0055 6.68161 11.8763 6.82925L8.3763 10.8293C8.28135 10.9378 8.14419 11 8.00001 11C7.85583 11 7.71866 10.9378 7.62372 10.8293L4.12372 6.82925C3.99453 6.68161 3.96362 6.47205 4.04469 6.29339Z" fill="#6F6E77"/>
 </svg>
diff --git a/scaladoc/resources/dotty_res/images/icon-buttons/arrow-down/light/disabled.svg b/scaladoc/resources/dotty_res/images/icon-buttons/arrow-down/light/disabled.svg
@@ -0,0 +1,3 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M4.04469 6.29339C4.12576 6.11474 4.30382 6 4.50001 6H11.5C11.6962 6 11.8743 6.11474 11.9553 6.29339C12.0364 6.47205 12.0055 6.68161 11.8763 6.82925L8.3763 10.8293C8.28135 10.9378 8.14419 11 8.00001 11C7.85583 11 7.71866 10.9378 7.62372 10.8293L4.12372 6.82925C3.99453 6.68161 3.96362 6.47205 4.04469 6.29339Z" fill="#6F6E77"/>
+</svg>
diff --git a/scaladoc/resources/dotty_res/images/icon-buttons/arrow-down/light/focus.svg b/scaladoc/resources/dotty_res/images/icon-buttons/arrow-down/light/focus.svg
@@ -0,0 +1,3 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M4.04469 6.29339C4.12576 6.11474 4.30382 6 4.50001 6H11.5C11.6962 6 11.8743 6.11474 11.9553 6.29339C12.0364 6.47205 12.0055 6.68161 11.8763 6.82925L8.3763 10.8293C8.28135 10.9378 8.14419 11 8.00001 11C7.85583 11 7.71866 10.9378 7.62372 10.8293L4.12372 6.82925C3.99453 6.68161 3.96362 6.47205 4.04469 6.29339Z" fill="#6F6E77"/>
+</svg>
diff --git a/scaladoc/resources/dotty_res/images/icon-buttons/arrow-down/light/hover.svg b/scaladoc/resources/dotty_res/images/icon-buttons/arrow-down/light/hover.svg
@@ -0,0 +1,3 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M4.04469 6.29339C4.12576 6.11474 4.30382 6 4.50001 6H11.5C11.6962 6 11.8743 6.11474 11.9553 6.29339C12.0364 6.47205 12.0055 6.68161 11.8763 6.82925L8.3763 10.8293C8.28135 10.9378 8.14419 11 8.00001 11C7.85583 11 7.71866 10.9378 7.62372 10.8293L4.12372 6.82925C3.99453 6.68161 3.96362 6.47205 4.04469 6.29339Z" fill="#1A1523"/>
+</svg>
diff --git a/scaladoc/resources/dotty_res/images/icon-buttons/arrow-down/light/selected.svg b/scaladoc/resources/dotty_res/images/icon-buttons/arrow-down/light/selected.svg
@@ -0,0 +1,3 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M4.04469 6.29339C4.12576 6.11474 4.30382 6 4.50001 6H11.5C11.6962 6 11.8743 6.11474 11.9553 6.29339C12.0364 6.47205 12.0055 6.68161 11.8763 6.82925L8.3763 10.8293C8.28135 10.9378 8.14419 11 8.00001 11C7.85583 11 7.71866 10.9378 7.62372 10.8293L4.12372 6.82925C3.99453 6.68161 3.96362 6.47205 4.04469 6.29339Z" fill="#1A1523"/>
+</svg>
diff --git a/scaladoc/resources/dotty_res/images/icon-buttons/arrow-right/dark/active.svg b/scaladoc/resources/dotty_res/images/icon-buttons/arrow-right/dark/active.svg
diff --git a/scaladoc/resources/dotty_res/images/icon-buttons/arrow-right/dark/default.svg b/scaladoc/resources/dotty_res/images/icon-buttons/arrow-right/dark/default.svg
diff --git a/scaladoc/resources/dotty_res/images/icon-buttons/arrow-right/dark/disabled.svg b/scaladoc/resources/dotty_res/images/icon-buttons/arrow-right/dark/disabled.svg
@@ -0,0 +1,3 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M6.29339 11.9553C6.11474 11.8743 6 11.6962 6 11.5V4.50001C6 4.30382 6.11474 4.12576 6.29339 4.04469C6.47205 3.96362 6.68161 3.99453 6.82925 4.12372L10.8293 7.62372C10.9378 7.71866 11 7.85583 11 8.00001C11 8.14419 10.9378 8.28135 10.8293 8.3763L6.82925 11.8763C6.68161 12.0055 6.47205 12.0364 6.29339 11.9553Z" fill="#A09FA6"/>
+</svg>
diff --git a/scaladoc/resources/dotty_res/images/icon-buttons/arrow-right/dark/focus.svg b/scaladoc/resources/dotty_res/images/icon-buttons/arrow-right/dark/focus.svg
@@ -0,0 +1,3 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M6.29339 11.9553C6.11474 11.8743 6 11.6962 6 11.5V4.50001C6 4.30382 6.11474 4.12576 6.29339 4.04469C6.47205 3.96362 6.68161 3.99453 6.82925 4.12372L10.8293 7.62372C10.9378 7.71866 11 7.85583 11 8.00001C11 8.14419 10.9378 8.28135 10.8293 8.3763L6.82925 11.8763C6.68161 12.0055 6.47205 12.0364 6.29339 11.9553Z" fill="#A09FA6"/>
+</svg>
diff --git a/scaladoc/resources/dotty_res/images/icon-buttons/arrow-right/dark/hover.svg b/scaladoc/resources/dotty_res/images/icon-buttons/arrow-right/dark/hover.svg
@@ -0,0 +1,3 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M6.29339 11.9553C6.11474 11.8743 6 11.6962 6 11.5V4.50001C6 4.30382 6.11474 4.12576 6.29339 4.04469C6.47205 3.96362 6.68161 3.99453 6.82925 4.12372L10.8293 7.62372C10.9378 7.71866 11 7.85583 11 8.00001C11 8.14419 10.9378 8.28135 10.8293 8.3763L6.82925 11.8763C6.68161 12.0055 6.47205 12.0364 6.29339 11.9553Z" fill="#CCCCCC"/>
+</svg>
diff --git a/scaladoc/resources/dotty_res/images/icon-buttons/arrow-right/dark/selected.svg b/scaladoc/resources/dotty_res/images/icon-buttons/arrow-right/dark/selected.svg
diff --git a/scaladoc/resources/dotty_res/images/icon-buttons/arrow-right/light/active.svg b/scaladoc/resources/dotty_res/images/icon-buttons/arrow-right/light/active.svg
diff --git a/scaladoc/resources/dotty_res/images/icon-buttons/arrow-right/light/default.svg b/scaladoc/resources/dotty_res/images/icon-buttons/arrow-right/light/default.svg
@@ -1,3 +1,3 @@
-<svg width="16" height="16" viewBox="0 0 16 16" fill="currentColor"  xmlns="http://www.w3.org/2000/svg">
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
 <path fill-rule="evenodd" clip-rule="evenodd" d="M6.29339 11.9553C6.11474 11.8743 6 11.6962 6 11.5V4.50001C6 4.30382 6.11474 4.12576 6.29339 4.04469C6.47205 3.96362 6.68161 3.99453 6.82925 4.12372L10.8293 7.62372C10.9378 7.71866 11 7.85583 11 8.00001C11 8.14419 10.9378 8.28135 10.8293 8.3763L6.82925 11.8763C6.68161 12.0055 6.47205 12.0364 6.29339 11.9553Z" fill="#6F6E77"/>
 </svg>
diff --git a/scaladoc/resources/dotty_res/images/icon-buttons/arrow-right/light/disabled.svg b/scaladoc/resources/dotty_res/images/icon-buttons/arrow-right/light/disabled.svg
@@ -0,0 +1,3 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M6.29339 11.9553C6.11474 11.8743 6 11.6962 6 11.5V4.50001C6 4.30382 6.11474 4.12576 6.29339 4.04469C6.47205 3.96362 6.68161 3.99453 6.82925 4.12372L10.8293 7.62372C10.9378 7.71866 11 7.85583 11 8.00001C11 8.14419 10.9378 8.28135 10.8293 8.3763L6.82925 11.8763C6.68161 12.0055 6.47205 12.0364 6.29339 11.9553Z" fill="#6F6E77"/>
+</svg>
diff --git a/scaladoc/resources/dotty_res/images/icon-buttons/arrow-right/light/focus.svg b/scaladoc/resources/dotty_res/images/icon-buttons/arrow-right/light/focus.svg
@@ -0,0 +1,3 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M6.29339 11.9553C6.11474 11.8743 6 11.6962 6 11.5V4.50001C6 4.30382 6.11474 4.12576 6.29339 4.04469C6.47205 3.96362 6.68161 3.99453 6.82925 4.12372L10.8293 7.62372C10.9378 7.71866 11 7.85583 11 8.00001C11 8.14419 10.9378 8.28135 10.8293 8.3763L6.82925 11.8763C6.68161 12.0055 6.47205 12.0364 6.29339 11.9553Z" fill="#6F6E77"/>
+</svg>
diff --git a/scaladoc/resources/dotty_res/images/icon-buttons/arrow-right/light/hover.svg b/scaladoc/resources/dotty_res/images/icon-buttons/arrow-right/light/hover.svg
@@ -0,0 +1,3 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M6.29339 11.9553C6.11474 11.8743 6 11.6962 6 11.5V4.50001C6 4.30382 6.11474 4.12576 6.29339 4.04469C6.47205 3.96362 6.68161 3.99453 6.82925 4.12372L10.8293 7.62372C10.9378 7.71866 11 7.85583 11 8.00001C11 8.14419 10.9378 8.28135 10.8293 8.3763L6.82925 11.8763C6.68161 12.0055 6.47205 12.0364 6.29339 11.9553Z" fill="#1A1523"/>
+</svg>
diff --git a/scaladoc/resources/dotty_res/images/icon-buttons/arrow-right/light/selected.svg b/scaladoc/resources/dotty_res/images/icon-buttons/arrow-right/light/selected.svg
@@ -0,0 +1,3 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M6.29339 11.9553C6.11474 11.8743 6 11.6962 6 11.5V4.50001C6 4.30382 6.11474 4.12576 6.29339 4.04469C6.47205 3.96362 6.68161 3.99453 6.82925 4.12372L10.8293 7.62372C10.9378 7.71866 11 7.85583 11 8.00001C11 8.14419 10.9378 8.28135 10.8293 8.3763L6.82925 11.8763C6.68161 12.0055 6.47205 12.0364 6.29339 11.9553Z" fill="#1A1523"/>
+</svg>
diff --git a/scaladoc/resources/dotty_res/images/icon-buttons/moon/light/active copy.svg b/scaladoc/resources/dotty_res/images/icon-buttons/moon/light/active copy.svg
@@ -0,0 +1,3 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M5.47085 1.4707C5.16678 2.25514 5 3.10802 5 3.99985C5 7.86584 8.13401 10.9999 12 10.9999C12.8918 10.9999 13.7447 10.8331 14.5291 10.529C13.5151 13.145 10.9742 14.9999 8 14.9999C4.13401 14.9999 1 11.8658 1 7.99985C1 5.02569 2.85484 2.48475 5.47085 1.4707Z" fill="#1A1523"/>
+</svg>
diff --git a/scaladoc/resources/dotty_res/images/icon-buttons/moon/light/default copy.svg b/scaladoc/resources/dotty_res/images/icon-buttons/moon/light/default copy.svg
@@ -0,0 +1,3 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M5.47085 1.4707C5.16678 2.25514 5 3.10802 5 3.99985C5 7.86584 8.13401 10.9999 12 10.9999C12.8918 10.9999 13.7447 10.8331 14.5291 10.529C13.5151 13.145 10.9742 14.9999 8 14.9999C4.13401 14.9999 1 11.8658 1 7.99985C1 5.02569 2.85484 2.48475 5.47085 1.4707Z" fill="#A09FA6"/>
+</svg>
diff --git a/scaladoc/resources/dotty_res/images/icon-buttons/moon/light/disabled copy.svg b/scaladoc/resources/dotty_res/images/icon-buttons/moon/light/disabled copy.svg
@@ -0,0 +1,3 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M5.47085 1.4707C5.16678 2.25514 5 3.10802 5 3.99985C5 7.86584 8.13401 10.9999 12 10.9999C12.8918 10.9999 13.7447 10.8331 14.5291 10.529C13.5151 13.145 10.9742 14.9999 8 14.9999C4.13401 14.9999 1 11.8658 1 7.99985C1 5.02569 2.85484 2.48475 5.47085 1.4707Z" fill="#A09FA6"/>
+</svg>
diff --git a/scaladoc/resources/dotty_res/images/icon-buttons/moon/light/focus copy.svg b/scaladoc/resources/dotty_res/images/icon-buttons/moon/light/focus copy.svg
@@ -0,0 +1,3 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M5.47085 1.4707C5.16678 2.25514 5 3.10802 5 3.99985C5 7.86584 8.13401 10.9999 12 10.9999C12.8918 10.9999 13.7447 10.8331 14.5291 10.529C13.5151 13.145 10.9742 14.9999 8 14.9999C4.13401 14.9999 1 11.8658 1 7.99985C1 5.02569 2.85484 2.48475 5.47085 1.4707Z" fill="#A09FA6"/>
+</svg>
diff --git a/scaladoc/resources/dotty_res/images/icon-buttons/moon/light/hover copy.svg b/scaladoc/resources/dotty_res/images/icon-buttons/moon/light/hover copy.svg
@@ -0,0 +1,3 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M5.47085 1.4707C5.16678 2.25514 5 3.10802 5 3.99985C5 7.86584 8.13401 10.9999 12 10.9999C12.8918 10.9999 13.7447 10.8331 14.5291 10.529C13.5151 13.145 10.9742 14.9999 8 14.9999C4.13401 14.9999 1 11.8658 1 7.99985C1 5.02569 2.85484 2.48475 5.47085 1.4707Z" fill="#CCCCCC"/>
+</svg>
diff --git a/scaladoc/resources/dotty_res/images/icon-buttons/moon/light/selected copy.svg b/scaladoc/resources/dotty_res/images/icon-buttons/moon/light/selected copy.svg
@@ -0,0 +1,3 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M5.47085 1.4707C5.16678 2.25514 5 3.10802 5 3.99985C5 7.86584 8.13401 10.9999 12 10.9999C12.8918 10.9999 13.7447 10.8331 14.5291 10.529C13.5151 13.145 10.9742 14.9999 8 14.9999C4.13401 14.9999 1 11.8658 1 7.99985C1 5.02569 2.85484 2.48475 5.47085 1.4707Z" fill="#EDEDEF"/>
+</svg>
diff --git a/scaladoc/resources/dotty_res/scripts/ux.js b/scaladoc/resources/dotty_res/scripts/ux.js
@@ -19,6 +19,7 @@ window.addEventListener("DOMContentLoaded", () => {
 
   $(".ar").on('click', function (e) {
     $(this).parent().parent().toggleClass("expanded")
+    $(this).toggleClass("expanded")
     e.stopPropagation()
   });
 
diff --git a/scaladoc/resources/dotty_res/styles/theme/components/button/icon-button.css b/scaladoc/resources/dotty_res/styles/theme/components/button/icon-button.css
@@ -0,0 +1,268 @@
+.icon-button {
+  background: unset;
+  border: none;
+  cursor: pointer;
+  outline: none !important;
+  padding: 0;
+}
+
+.icon-button::after {
+  width: calc(2 * var(--base-spacing));
+  height: calc(2 * var(--base-spacing));
+}
+
+.icon-button:focus {
+  box-shadow: 0px 0px 0px 2px var(--focus-default);
+  border-radius: 4px;
+}
+
+.icon-button:disabled {
+  opacity: 0.5;
+}
+
+/* theme-toggle button */
+
+#theme-toggle.icon-button::after {
+  content: url("../../../../images/icon-buttons/moon/light/default.svg");
+}
+
+#theme-toggle.icon-button:hover::after {
+  content: url("../../../../images/icon-buttons/moon/light/hover.svg");
+}
+
+#theme-toggle.icon-button:active::after {
+  content: url("../../../../images/icon-buttons/moon/light/active.svg");
+}
+
+#theme-toggle.icon-button:disabled::after {
+  content: url("../../../../images/icon-buttons/moon/light/disabled.svg");
+}
+
+#theme-toggle.icon-button:focus::after {
+  content: url("../../../../images/icon-buttons/moon/light/focus.svg");
+}
+
+#theme-toggle.icon-button.selected::after {
+  content: url("../../../../images/icon-buttons/moon/light/selected.svg");
+}
+
+.theme-dark #theme-toggle.icon-button::after {
+  content: url("../../../../images/icon-buttons/sun/dark/default.svg");
+}
+
+.theme-dark #theme-toggle.icon-button:hover::after {
+  content: url("../../../../images/icon-buttons/sun/dark/hover.svg");
+}
+
+.theme-dark #theme-toggle.icon-button:active::after {
+  content: url("../../../../images/icon-buttons/sun/dark/active.svg");
+}
+
+.theme-dark #theme-toggle.icon-button:disabled::after {
+  content: url("../../../../images/icon-buttons/sun/dark/disabled.svg");
+}
+
+.theme-dark #theme-toggle.icon-button:focus::after {
+  content: url("../../../../images/icon-buttons/sun/dark/focus.svg");
+}
+
+.theme-dark #theme-toggle.icon-button.selected::after {
+  content: url("../../../../images/icon-buttons/sun/dark/selected.svg");
+}
+
+/* search-toggle button */
+
+#search-toggle.icon-button::after {
+  content: url("../../../../images/icon-buttons/search/light/default.svg");
+}
+
+#search-toggle.icon-button:hover::after {
+  content: url("../../../../images/icon-buttons/search/light/hover.svg");
+}
+
+#search-toggle.icon-button:active::after {
+  content: url("../../../../images/icon-buttons/search/light/active.svg");
+}
+
+#search-toggle.icon-button:disabled::after {
+  content: url("../../../../images/icon-buttons/search/light/disabled.svg");
+}
+
+#search-toggle.icon-button:focus::after {
+  content: url("../../../../images/icon-buttons/search/light/focus.svg");
+}
+
+#search-toggle.icon-button.selected::after {
+  content: url("../../../../images/icon-buttons/search/light/selected.svg");
+}
+
+.theme-dark #search-toggle.icon-button::after {
+  content: url("../../../../images/icon-buttons/search/dark/default.svg");
+}
+
+.theme-dark #search-toggle.icon-button:hover::after {
+  content: url("../../../../images/icon-buttons/search/dark/hover.svg");
+}
+
+.theme-dark #search-toggle.icon-button:active::after {
+  content: url("../../../../images/icon-buttons/search/dark/active.svg");
+}
+
+.theme-dark #search-toggle.icon-button:disabled::after {
+  content: url("../../../../images/icon-buttons/search/dark/disabled.svg");
+}
+
+.theme-dark #search-toggle.icon-button:focus::after {
+  content: url("../../../../images/icon-buttons/search/dark/focus.svg");
+}
+
+.theme-dark #search-toggle.icon-button.selected::after {
+  content: url("../../../../images/icon-buttons/search/dark/selected.svg");
+}
+
+/* hamburger button */
+.icon-button.hamburger::after {
+  content: url("../../../../images/icon-buttons/hamburger/light/default.svg");
+}
+
+.icon-button.hamburger:hover::after {
+  content: url("../../../../images/icon-buttons/hamburger/light/hover.svg");
+}
+
+.icon-button.hamburger:active::after {
+  content: url("../../../../images/icon-buttons/hamburger/light/active.svg");
+}
+
+.icon-button.hamburger:disabled::after {
+  content: url("../../../../images/icon-buttons/hamburger/light/disabled.svg");
+}
+
+.icon-button.hamburger:focus::after {
+  content: url("../../../../images/icon-buttons/hamburger/light/focus.svg");
+}
+
+.icon-button.hamburger.selected::after {
+  content: url("../../../../images/icon-buttons/hamburger/light/selected.svg");
+}
+
+.theme-dark .icon-button.hamburger::after {
+  content: url("../../../../images/icon-buttons/hamburger/dark/default.svg");
+}
+
+.theme-dark .icon-button.hamburger:hover::after {
+  content: url("../../../../images/icon-buttons/hamburger/dark/hover.svg");
+}
+
+.theme-dark .icon-button.hamburger:active::after {
+  content: url("../../../../images/icon-buttons/hamburger/dark/active.svg");
+}
+
+.theme-dark .icon-button.hamburger:disabled::after {
+  content: url("../../../../images/icon-buttons/hamburger/dark/disabled.svg");
+}
+
+.theme-dark .icon-button.hamburger:focus::after {
+  content: url("../../../../images/icon-buttons/hamburger/dark/focus.svg");
+}
+
+.theme-dark .icon-button.hamburger.selected::after {
+  content: url("../../../../images/icon-buttons/hamburger/dark/selected.svg");
+}
+
+/*navigation arrow button */
+
+.ar.icon-button::after {
+  content: url("../../../../images/icon-buttons/arrow-right/light/default.svg");
+}
+
+.ar.icon-button:hover::after {
+  content: url("../../../../images/icon-buttons/arrow-right/light/hover.svg");
+}
+
+.ar.icon-button:active::after {
+  content: url("../../../../images/icon-buttons/arrow-right/light/active.svg");
+}
+
+.ar.icon-button:disabled::after {
+  content: url("../../../../images/icon-buttons/arrow-right/light/disabled.svg");
+}
+
+.ar.icon-button:focus::after {
+  content: url("../../../../images/icon-buttons/arrow-right/light/focus.svg");
+}
+
+.ar.icon-button.selected::after {
+  content: url("../../../../images/icon-buttons/arrow-right/light/selected.svg");
+}
+
+.theme-dark .ar.icon-button::after {
+  content: url("../../../../images/icon-buttons/arrow-right/dark/default.svg");
+}
+
+.theme-dark .ar.icon-button:hover::after {
+  content: url("../../../../images/icon-buttons/arrow-right/dark/hover.svg");
+}
+
+.theme-dark .ar.icon-button:active::after {
+  content: url("../../../../images/icon-buttons/arrow-right/dark/active.svg");
+}
+
+.theme-dark .ar.icon-button:disabled::after {
+  content: url("../../../../images/icon-buttons/arrow-right/dark/disabled.svg");
+}
+
+.theme-dark .ar.icon-button:focus::after {
+  content: url("../../../../images/icon-buttons/arrow-right/dark/focus.svg");
+}
+
+.theme-dark .ar.icon-button.selected::after {
+  content: url("../../../../images/icon-buttons/arrow-right/dark/selected.svg");
+}
+
+.ar.icon-button.expanded::after {
+  content: url("../../../../images/icon-buttons/arrow-down/light/default.svg");
+}
+
+.ar.icon-button.expanded:hover::after {
+  content: url("../../../../images/icon-buttons/arrow-down/light/hover.svg");
+}
+
+.ar.icon-button.expanded:active::after {
+  content: url("../../../../images/icon-buttons/arrow-down/light/active.svg");
+}
+
+.ar.icon-button.expanded:disabled::after {
+  content: url("../../../../images/icon-buttons/arrow-down/light/disabled.svg");
+}
+
+.ar.icon-button.expanded:focus::after {
+  content: url("../../../../images/icon-buttons/arrow-down/light/focus.svg");
+}
+
+.ar.icon-button.expanded.selected::after {
+  content: url("../../../../images/icon-buttons/arrow-down/light/selected.svg");
+}
+
+.theme-dark .ar.icon-button.expanded::after {
+  content: url("../../../../images/icon-buttons/arrow-down/dark/default.svg");
+}
+
+.theme-dark .ar.icon-button.expanded:hover::after {
+  content: url("../../../../images/icon-buttons/arrow-down/dark/hover.svg");
+}
+
+.theme-dark .ar.icon-button.expanded:active::after {
+  content: url("../../../../images/icon-buttons/arrow-down/dark/active.svg");
+}
+
+.theme-dark .ar.icon-button.expanded:disabled::after {
+  content: url("../../../../images/icon-buttons/arrow-down/dark/disabled.svg");
+}
+
+.theme-dark .ar.icon-button.expanded:focus::after {
+  content: url("../../../../images/icon-buttons/arrow-down/dark/focus.svg");
+}
+
+.theme-dark .ar.icon-button.expanded.selected::after {
+  content: url("../../../../images/icon-buttons/arrow-down/dark/selected.svg");
+}
diff --git a/scaladoc/resources/dotty_res/styles/theme/components/navigation-item.css b/scaladoc/resources/dotty_res/styles/theme/components/navigation-item.css
diff --git a/scaladoc/src/dotty/tools/scaladoc/renderers/HtmlRenderer.scala b/scaladoc/src/dotty/tools/scaladoc/renderers/HtmlRenderer.scala
diff --git a/scaladoc/src/dotty/tools/scaladoc/renderers/Resources.scala b/scaladoc/src/dotty/tools/scaladoc/renderers/Resources.scala
