fix: Manually Overwrite Dokka Styles and Logo (#114)

Mohammad-Dwairi · web-flow · commit 57ee626b0b80 · 2024-08-08T13:43:18.000+03:00
diff --git a/assets/custom-styles.css b/assets/custom-styles.css
@@ -6,3 +6,11 @@
     --dokka-logo-height: 35px;
     --dokka-logo-width: 35px;
 }
+
+.library-name--link::before {
+    margin-right: 10px;
+}
+
+.filter-section .platform-tag {
+    display: none;
+}
diff --git a/images/logo-icon.svg b/images/logo-icon.svg
@@ -1,14 +1,17 @@
-<!--
-  - Copyright 2014-2023 JetBrains s.r.o. Use of this source code is governed by the Apache 2.0 license.
-  -->
-
-<svg width="64" height="64" viewBox="0 0 64 64" fill="none" xmlns="http://www.w3.org/2000/svg">
-    <path d="M64 64H0V0H64L31.3373 31.5369L64 64Z" fill="url(#paint0_radial)"/>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="41.538" height="44"
+     viewBox="0 0 41.538 44">
     <defs>
-        <radialGradient id="paint0_radial" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(61.8732 2.63097) scale(73.3111)">
-            <stop offset="0.00343514" stop-color="#EF4857"/>
-            <stop offset="0.4689" stop-color="#D211EC"/>
-            <stop offset="1" stop-color="#7F52FF"/>
-        </radialGradient>
+        <style>.a{fill:none;}.b{clip-path:url(#a);}.c{fill:#fff;}</style>
+        <clipPath id="a">
+            <path class="a" d="M0,0H41.538V44H0Z" transform="translate(0.659)"/>
+        </clipPath>
     </defs>
+    <g transform="translate(-0.659)">
+        <path class="a" d="M0,0H41.538V44H0Z" transform="translate(0.659)"/>
+        <g class="b">
+            <path class="c"
+                  d="M31.511,20.307A10.823,10.823,0,0,0,20.643,9.887c-6.489,0-10.869,5.878-10.869,11.935,0,7.214,4.719,12.38,12.807,12.38H37.915A20,20,0,0,1,20.727,44C9.268,44,0,34.112,0,22S9.268,0,20.727,0,41.538,9.887,41.538,22a25.89,25.89,0,0,1-1.011,6.858H17.357V26.453l8.173-.268c4.129-.177,5.982-2.4,5.982-5.878"
+                  transform="translate(0.659)"/>
+        </g>
+    </g>
 </svg>
diff --git a/older/3.2.2/images/logo-icon.svg b/older/3.2.2/images/logo-icon.svg
@@ -1,14 +1,17 @@
-<!--
-  - Copyright 2014-2023 JetBrains s.r.o. Use of this source code is governed by the Apache 2.0 license.
-  -->
-
-<svg width="64" height="64" viewBox="0 0 64 64" fill="none" xmlns="http://www.w3.org/2000/svg">
-    <path d="M64 64H0V0H64L31.3373 31.5369L64 64Z" fill="url(#paint0_radial)"/>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="41.538" height="44"
+     viewBox="0 0 41.538 44">
     <defs>
-        <radialGradient id="paint0_radial" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(61.8732 2.63097) scale(73.3111)">
-            <stop offset="0.00343514" stop-color="#EF4857"/>
-            <stop offset="0.4689" stop-color="#D211EC"/>
-            <stop offset="1" stop-color="#7F52FF"/>
-        </radialGradient>
+        <style>.a{fill:none;}.b{clip-path:url(#a);}.c{fill:#fff;}</style>
+        <clipPath id="a">
+            <path class="a" d="M0,0H41.538V44H0Z" transform="translate(0.659)"/>
+        </clipPath>
     </defs>
+    <g transform="translate(-0.659)">
+        <path class="a" d="M0,0H41.538V44H0Z" transform="translate(0.659)"/>
+        <g class="b">
+            <path class="c"
+                  d="M31.511,20.307A10.823,10.823,0,0,0,20.643,9.887c-6.489,0-10.869,5.878-10.869,11.935,0,7.214,4.719,12.38,12.807,12.38H37.915A20,20,0,0,1,20.727,44C9.268,44,0,34.112,0,22S9.268,0,20.727,0,41.538,9.887,41.538,22a25.89,25.89,0,0,1-1.011,6.858H17.357V26.453l8.173-.268c4.129-.177,5.982-2.4,5.982-5.878"
+                  transform="translate(0.659)"/>
+        </g>
+    </g>
 </svg>
diff --git a/older/3.2.2/styles/logo-styles.css b/older/3.2.2/styles/logo-styles.css
@@ -4,6 +4,6 @@
 
 :root {
     --dokka-logo-image-url: url('../images/logo-icon.svg');
-    --dokka-logo-height: 50px;
-    --dokka-logo-width: 50px;
+    --dokka-logo-height: 35px;
+    --dokka-logo-width: 35px;
 }
diff --git a/older/3.2.2/styles/style.css b/older/3.2.2/styles/style.css
@@ -51,6 +51,14 @@
 
     --sidebar-width: 280px;
     --sidemenu-section-active-color: #7F52FF;
+
+    /* Overwrite default styles */
+    --sidemenu-section-active-color: #1668e3;
+    --active-section-color: #1668e3;
+    --active-tab-border-color: #1668e3;
+    --hover-link-color: #1668e3;
+    --dokka-logo-height: 35px;
+    --dokka-logo-width: 35px;
 }
 
 html {
@@ -1507,3 +1515,11 @@ has only one header, and the header text is the same as the tab name, so no poin
 .main-content[data-page-type="package"] .tabs-section-body h2 {
     display: none;
 }
+
+.library-name--link::before {
+    margin-right: 10px;
+}
+
+.filter-section .platform-tag {
+    display: none;
+}
diff --git a/older/4.1.0/images/logo-icon.svg b/older/4.1.0/images/logo-icon.svg
@@ -1,14 +1,17 @@
-<!--
-  - Copyright 2014-2023 JetBrains s.r.o. Use of this source code is governed by the Apache 2.0 license.
-  -->
-
-<svg width="64" height="64" viewBox="0 0 64 64" fill="none" xmlns="http://www.w3.org/2000/svg">
-    <path d="M64 64H0V0H64L31.3373 31.5369L64 64Z" fill="url(#paint0_radial)"/>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="41.538" height="44"
+     viewBox="0 0 41.538 44">
     <defs>
-        <radialGradient id="paint0_radial" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(61.8732 2.63097) scale(73.3111)">
-            <stop offset="0.00343514" stop-color="#EF4857"/>
-            <stop offset="0.4689" stop-color="#D211EC"/>
-            <stop offset="1" stop-color="#7F52FF"/>
-        </radialGradient>
+        <style>.a{fill:none;}.b{clip-path:url(#a);}.c{fill:#fff;}</style>
+        <clipPath id="a">
+            <path class="a" d="M0,0H41.538V44H0Z" transform="translate(0.659)"/>
+        </clipPath>
     </defs>
+    <g transform="translate(-0.659)">
+        <path class="a" d="M0,0H41.538V44H0Z" transform="translate(0.659)"/>
+        <g class="b">
+            <path class="c"
+                  d="M31.511,20.307A10.823,10.823,0,0,0,20.643,9.887c-6.489,0-10.869,5.878-10.869,11.935,0,7.214,4.719,12.38,12.807,12.38H37.915A20,20,0,0,1,20.727,44C9.268,44,0,34.112,0,22S9.268,0,20.727,0,41.538,9.887,41.538,22a25.89,25.89,0,0,1-1.011,6.858H17.357V26.453l8.173-.268c4.129-.177,5.982-2.4,5.982-5.878"
+                  transform="translate(0.659)"/>
+        </g>
+    </g>
 </svg>
diff --git a/older/4.1.0/styles/logo-styles.css b/older/4.1.0/styles/logo-styles.css
@@ -4,6 +4,6 @@
 
 :root {
     --dokka-logo-image-url: url('../images/logo-icon.svg');
-    --dokka-logo-height: 50px;
-    --dokka-logo-width: 50px;
+    --dokka-logo-height: 35px;
+    --dokka-logo-width: 35px;
 }
diff --git a/older/4.1.0/styles/style.css b/older/4.1.0/styles/style.css
@@ -51,6 +51,14 @@
 
     --sidebar-width: 280px;
     --sidemenu-section-active-color: #7F52FF;
+
+    /* Overwrite default styles */
+    --sidemenu-section-active-color: #1668e3;
+    --active-section-color: #1668e3;
+    --active-tab-border-color: #1668e3;
+    --hover-link-color: #1668e3;
+    --dokka-logo-height: 35px;
+    --dokka-logo-width: 35px;
 }
 
 html {
@@ -1507,3 +1515,11 @@ has only one header, and the header text is the same as the tab name, so no poin
 .main-content[data-page-type="package"] .tabs-section-body h2 {
     display: none;
 }
+
+.library-name--link::before {
+    margin-right: 10px;
+}
+
+.filter-section .platform-tag {
+    display: none;
+}
diff --git a/older/4.1.1/images/logo-icon.svg b/older/4.1.1/images/logo-icon.svg
@@ -1,14 +1,17 @@
-<!--
-  - Copyright 2014-2023 JetBrains s.r.o. Use of this source code is governed by the Apache 2.0 license.
-  -->
-
-<svg width="64" height="64" viewBox="0 0 64 64" fill="none" xmlns="http://www.w3.org/2000/svg">
-    <path d="M64 64H0V0H64L31.3373 31.5369L64 64Z" fill="url(#paint0_radial)"/>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="41.538" height="44"
+     viewBox="0 0 41.538 44">
     <defs>
-        <radialGradient id="paint0_radial" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(61.8732 2.63097) scale(73.3111)">
-            <stop offset="0.00343514" stop-color="#EF4857"/>
-            <stop offset="0.4689" stop-color="#D211EC"/>
-            <stop offset="1" stop-color="#7F52FF"/>
-        </radialGradient>
+        <style>.a{fill:none;}.b{clip-path:url(#a);}.c{fill:#fff;}</style>
+        <clipPath id="a">
+            <path class="a" d="M0,0H41.538V44H0Z" transform="translate(0.659)"/>
+        </clipPath>
     </defs>
+    <g transform="translate(-0.659)">
+        <path class="a" d="M0,0H41.538V44H0Z" transform="translate(0.659)"/>
+        <g class="b">
+            <path class="c"
+                  d="M31.511,20.307A10.823,10.823,0,0,0,20.643,9.887c-6.489,0-10.869,5.878-10.869,11.935,0,7.214,4.719,12.38,12.807,12.38H37.915A20,20,0,0,1,20.727,44C9.268,44,0,34.112,0,22S9.268,0,20.727,0,41.538,9.887,41.538,22a25.89,25.89,0,0,1-1.011,6.858H17.357V26.453l8.173-.268c4.129-.177,5.982-2.4,5.982-5.878"
+                  transform="translate(0.659)"/>
+        </g>
+    </g>
 </svg>
diff --git a/older/4.1.1/styles/logo-styles.css b/older/4.1.1/styles/logo-styles.css
@@ -4,6 +4,6 @@
 
 :root {
     --dokka-logo-image-url: url('../images/logo-icon.svg');
-    --dokka-logo-height: 50px;
-    --dokka-logo-width: 50px;
+    --dokka-logo-height: 35px;
+    --dokka-logo-width: 35px;
 }
diff --git a/older/4.1.1/styles/style.css b/older/4.1.1/styles/style.css
@@ -51,6 +51,14 @@
 
     --sidebar-width: 280px;
     --sidemenu-section-active-color: #7F52FF;
+
+    /* Overwrite default styles */
+    --sidemenu-section-active-color: #1668e3;
+    --active-section-color: #1668e3;
+    --active-tab-border-color: #1668e3;
+    --hover-link-color: #1668e3;
+    --dokka-logo-height: 35px;
+    --dokka-logo-width: 35px;
 }
 
 html {
@@ -1507,3 +1515,11 @@ has only one header, and the header text is the same as the tab name, so no poin
 .main-content[data-page-type="package"] .tabs-section-body h2 {
     display: none;
 }
+
+.library-name--link::before {
+    margin-right: 10px;
+}
+
+.filter-section .platform-tag {
+    display: none;
+}
diff --git a/older/4.1.2/images/logo-icon.svg b/older/4.1.2/images/logo-icon.svg
@@ -1,14 +1,17 @@
-<!--
-  - Copyright 2014-2023 JetBrains s.r.o. Use of this source code is governed by the Apache 2.0 license.
-  -->
-
-<svg width="64" height="64" viewBox="0 0 64 64" fill="none" xmlns="http://www.w3.org/2000/svg">
-    <path d="M64 64H0V0H64L31.3373 31.5369L64 64Z" fill="url(#paint0_radial)"/>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="41.538" height="44"
+     viewBox="0 0 41.538 44">
     <defs>
-        <radialGradient id="paint0_radial" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(61.8732 2.63097) scale(73.3111)">
-            <stop offset="0.00343514" stop-color="#EF4857"/>
-            <stop offset="0.4689" stop-color="#D211EC"/>
-            <stop offset="1" stop-color="#7F52FF"/>
-        </radialGradient>
+        <style>.a{fill:none;}.b{clip-path:url(#a);}.c{fill:#fff;}</style>
+        <clipPath id="a">
+            <path class="a" d="M0,0H41.538V44H0Z" transform="translate(0.659)"/>
+        </clipPath>
     </defs>
+    <g transform="translate(-0.659)">
+        <path class="a" d="M0,0H41.538V44H0Z" transform="translate(0.659)"/>
+        <g class="b">
+            <path class="c"
+                  d="M31.511,20.307A10.823,10.823,0,0,0,20.643,9.887c-6.489,0-10.869,5.878-10.869,11.935,0,7.214,4.719,12.38,12.807,12.38H37.915A20,20,0,0,1,20.727,44C9.268,44,0,34.112,0,22S9.268,0,20.727,0,41.538,9.887,41.538,22a25.89,25.89,0,0,1-1.011,6.858H17.357V26.453l8.173-.268c4.129-.177,5.982-2.4,5.982-5.878"
+                  transform="translate(0.659)"/>
+        </g>
+    </g>
 </svg>
diff --git a/older/4.1.2/styles/logo-styles.css b/older/4.1.2/styles/logo-styles.css
@@ -4,6 +4,6 @@
 
 :root {
     --dokka-logo-image-url: url('../images/logo-icon.svg');
-    --dokka-logo-height: 50px;
-    --dokka-logo-width: 50px;
+    --dokka-logo-height: 35px;
+    --dokka-logo-width: 35px;
 }
diff --git a/older/4.1.2/styles/style.css b/older/4.1.2/styles/style.css
@@ -51,6 +51,14 @@
 
     --sidebar-width: 280px;
     --sidemenu-section-active-color: #7F52FF;
+
+    /* Overwrite default styles */
+    --sidemenu-section-active-color: #1668e3;
+    --active-section-color: #1668e3;
+    --active-tab-border-color: #1668e3;
+    --hover-link-color: #1668e3;
+    --dokka-logo-height: 35px;
+    --dokka-logo-width: 35px;
 }
 
 html {
@@ -1507,3 +1515,11 @@ has only one header, and the header text is the same as the tab name, so no poin
 .main-content[data-page-type="package"] .tabs-section-body h2 {
     display: none;
 }
+
+.library-name--link::before {
+    margin-right: 10px;
+}
+
+.filter-section .platform-tag {
+    display: none;
+}
diff --git a/older/4.1.3/images/logo-icon.svg b/older/4.1.3/images/logo-icon.svg
@@ -1,14 +1,17 @@
-<!--
-  - Copyright 2014-2023 JetBrains s.r.o. Use of this source code is governed by the Apache 2.0 license.
-  -->
-
-<svg width="64" height="64" viewBox="0 0 64 64" fill="none" xmlns="http://www.w3.org/2000/svg">
-    <path d="M64 64H0V0H64L31.3373 31.5369L64 64Z" fill="url(#paint0_radial)"/>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="41.538" height="44"
+     viewBox="0 0 41.538 44">
     <defs>
-        <radialGradient id="paint0_radial" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(61.8732 2.63097) scale(73.3111)">
-            <stop offset="0.00343514" stop-color="#EF4857"/>
-            <stop offset="0.4689" stop-color="#D211EC"/>
-            <stop offset="1" stop-color="#7F52FF"/>
-        </radialGradient>
+        <style>.a{fill:none;}.b{clip-path:url(#a);}.c{fill:#fff;}</style>
+        <clipPath id="a">
+            <path class="a" d="M0,0H41.538V44H0Z" transform="translate(0.659)"/>
+        </clipPath>
     </defs>
+    <g transform="translate(-0.659)">
+        <path class="a" d="M0,0H41.538V44H0Z" transform="translate(0.659)"/>
+        <g class="b">
+            <path class="c"
+                  d="M31.511,20.307A10.823,10.823,0,0,0,20.643,9.887c-6.489,0-10.869,5.878-10.869,11.935,0,7.214,4.719,12.38,12.807,12.38H37.915A20,20,0,0,1,20.727,44C9.268,44,0,34.112,0,22S9.268,0,20.727,0,41.538,9.887,41.538,22a25.89,25.89,0,0,1-1.011,6.858H17.357V26.453l8.173-.268c4.129-.177,5.982-2.4,5.982-5.878"
+                  transform="translate(0.659)"/>
+        </g>
+    </g>
 </svg>
diff --git a/older/4.1.3/styles/logo-styles.css b/older/4.1.3/styles/logo-styles.css
@@ -4,6 +4,6 @@
 
 :root {
     --dokka-logo-image-url: url('../images/logo-icon.svg');
-    --dokka-logo-height: 50px;
-    --dokka-logo-width: 50px;
+    --dokka-logo-height: 35px;
+    --dokka-logo-width: 35px;
 }
diff --git a/older/4.1.3/styles/style.css b/older/4.1.3/styles/style.css
@@ -51,6 +51,14 @@
 
     --sidebar-width: 280px;
     --sidemenu-section-active-color: #7F52FF;
+
+    /* Overwrite default styles */
+    --sidemenu-section-active-color: #1668e3;
+    --active-section-color: #1668e3;
+    --active-tab-border-color: #1668e3;
+    --hover-link-color: #1668e3;
+    --dokka-logo-height: 35px;
+    --dokka-logo-width: 35px;
 }
 
 html {
@@ -1507,3 +1515,11 @@ has only one header, and the header text is the same as the tab name, so no poin
 .main-content[data-page-type="package"] .tabs-section-body h2 {
     display: none;
 }
+
+.library-name--link::before {
+    margin-right: 10px;
+}
+
+.filter-section .platform-tag {
+    display: none;
+}
diff --git a/older/4.2.0/images/logo-icon.svg b/older/4.2.0/images/logo-icon.svg
@@ -1,14 +1,17 @@
-<!--
-  - Copyright 2014-2023 JetBrains s.r.o. Use of this source code is governed by the Apache 2.0 license.
-  -->
-
-<svg width="64" height="64" viewBox="0 0 64 64" fill="none" xmlns="http://www.w3.org/2000/svg">
-    <path d="M64 64H0V0H64L31.3373 31.5369L64 64Z" fill="url(#paint0_radial)"/>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="41.538" height="44"
+     viewBox="0 0 41.538 44">
     <defs>
-        <radialGradient id="paint0_radial" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(61.8732 2.63097) scale(73.3111)">
-            <stop offset="0.00343514" stop-color="#EF4857"/>
-            <stop offset="0.4689" stop-color="#D211EC"/>
-            <stop offset="1" stop-color="#7F52FF"/>
-        </radialGradient>
+        <style>.a{fill:none;}.b{clip-path:url(#a);}.c{fill:#fff;}</style>
+        <clipPath id="a">
+            <path class="a" d="M0,0H41.538V44H0Z" transform="translate(0.659)"/>
+        </clipPath>
     </defs>
+    <g transform="translate(-0.659)">
+        <path class="a" d="M0,0H41.538V44H0Z" transform="translate(0.659)"/>
+        <g class="b">
+            <path class="c"
+                  d="M31.511,20.307A10.823,10.823,0,0,0,20.643,9.887c-6.489,0-10.869,5.878-10.869,11.935,0,7.214,4.719,12.38,12.807,12.38H37.915A20,20,0,0,1,20.727,44C9.268,44,0,34.112,0,22S9.268,0,20.727,0,41.538,9.887,41.538,22a25.89,25.89,0,0,1-1.011,6.858H17.357V26.453l8.173-.268c4.129-.177,5.982-2.4,5.982-5.878"
+                  transform="translate(0.659)"/>
+        </g>
+    </g>
 </svg>
diff --git a/older/4.2.0/styles/logo-styles.css b/older/4.2.0/styles/logo-styles.css
diff --git a/older/4.2.0/styles/style.css b/older/4.2.0/styles/style.css
diff --git a/styles/logo-styles.css b/styles/logo-styles.css
diff --git a/styles/style.css b/styles/style.css

Original file line number	Diff line number	Diff line change
`@@ -4,6 +4,6 @@`
`4`	`4`
`5`	`5`	`:root {`
`6`	`6`	`--dokka-logo-image-url: url('../images/logo-icon.svg');`
`7`		`- --dokka-logo-height: 50px;`
`8`		`- --dokka-logo-width: 50px;`
	`7`	`+ --dokka-logo-height: 35px;`
	`8`	`+ --dokka-logo-width: 35px;`
`9`	`9`	`}`