[Docs] Page styling (#24637)

another part
openvinotoolkit · May 22, 2024 · ef6ca0a · ef6ca0a
1 parent 6f7cf28
commit ef6ca0a
Show file tree

Hide file tree

Showing 3 changed files with 56 additions and 11 deletions.
diff --git a/docs/sphinx_setup/_static/css/custom.css b/docs/sphinx_setup/_static/css/custom.css
@@ -20,6 +20,14 @@ main  .searchForm {
 pre {
     white-space: pre-wrap;
     word-wrap: break-word;
+    background-color: white;
+    color: red !important;
+}
+
+button.copybtn {
+    opacity: 100;
+    border: white 1px solid;
+    background-color: white !important;
 }
 
 /* cookie wap requirement */
@@ -31,6 +39,7 @@ a#wap_dns {display: none;}
     background-repeat: no-repeat;
     background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64' aria-labelledby='openvino github' aria-describedby='openvino github' role='img' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Ctitle%3EGithub%3C/title%3E%3Cdesc%3EA solid styled icon from Orion Icon Library.%3C/desc%3E%3Cpath d='M32 0a32.021 32.021 0 0 0-10.1 62.4c1.6.3 2.2-.7 2.2-1.5v-6c-8.9 1.9-10.8-3.8-10.8-3.8-1.5-3.7-3.6-4.7-3.6-4.7-2.9-2 .2-1.9.2-1.9 3.2.2 4.9 3.3 4.9 3.3 2.9 4.9 7.5 3.5 9.3 2.7a6.93 6.93 0 0 1 2-4.3c-7.1-.8-14.6-3.6-14.6-15.8a12.27 12.27 0 0 1 3.3-8.6 11.965 11.965 0 0 1 .3-8.5s2.7-.9 8.8 3.3a30.873 30.873 0 0 1 8-1.1 30.292 30.292 0 0 1 8 1.1c6.1-4.1 8.8-3.3 8.8-3.3a11.965 11.965 0 0 1 .3 8.5 12.1 12.1 0 0 1 3.3 8.6c0 12.3-7.5 15-14.6 15.8a7.746 7.746 0 0 1 2.2 5.9v8.8c0 .9.6 1.8 2.2 1.5A32.021 32.021 0 0 0 32 0z' fill='rgb(255, 255, 255)'%3E%3C/path%3E%3Cpath %3E%3C/path%3E%3C/svg%3E ");
 }
+
 .fa-square-github path {
     fill: none;
 }
@@ -144,13 +153,10 @@ nav.bd-links .current>a {
     font-size: 2rem!important;
 }
 
-.bd-header .navbar-nav li a.nav-link:hover {
-    color: white;
-    text-decoration: none;
-}
-
-.bd-links__title {
+.svg-inline--fa .fa-outdent {
     display: none;
+    visibility: none;
+    color: white;
 }
 
 li.toctree-l1.has-children  > a.reference.internal {
@@ -196,6 +202,11 @@ nav.bd-links li>a {
     }
 }
 
+.download-docs .sst-dropdown .sst-btn {
+    border-color: lightgray !important;
+}
+
+
 /* Moving dropdown arrows to the left */
 details.sd-dropdown .sd-summary-up,
 details.sd-dropdown .sd-summary-down {
@@ -209,6 +220,11 @@ details.sd-dropdown:not([open]).sd-card {
     padding: 0px;
 }
 
+/* Ttile is at the same place for both open and close states */
+.sd-card-header {
+    border-radius: 0px !important;
+
+}
 
 /* Ttile is at the same place for both open and close states */
 details.sd-dropdown[open].sd-card {
@@ -220,8 +236,6 @@ details.sd-dropdown .sd-summary-title {
     padding-left: 40px;
 }
 
-
-
 /* Second level items                 */
 #bd-docs-nav > div > ul > li > ul {
     padding-left: 0.3rem;
@@ -264,7 +278,6 @@ details.sd-dropdown .sd-summary-title {
     padding-right: 10px!important;
 }
 
-
 /* Code reference text formatting override */
 /* =================================================== */
 code {
@@ -283,9 +296,28 @@ code {
     background-color: #0054AE !important;
 }
 
-.admonition {
-    border-radius:0px !important;
+.admonition.tip, div.admonition.tip {
+    border-color: var(--pst-color-success) !important;
+    background-color: #effdf6 !important;
 }
+
+.admonition.important, div.admonition.important {
+    border-color: var(--pst-color-attention);
+    background-color: #fbf5f0 !important;
+}
+
+.admonition.warning, div.admonition.warning {
+    background-color: #fbf5f0 !important;
+}
+
+.admonition.note, div.admonition.note {
+    background-color: #f1fafe;
+}
+
+details.sd-dropdown summary.sd-card-header+div.sd-summary-content {
+    background-color: rgb(242, 248, 251);
+}
+
 /* Table Sort Button */
 /* =================================================== */
 .sort-header {

diff --git a/docs/sphinx_setup/_static/js/modern.js b/docs/sphinx_setup/_static/js/modern.js
@@ -0,0 +1,12 @@
+$(document).ready(function() {
+    const elems = $( 'details.sd-dropdown' );
+    for(let i = 0; i < elems.length; i++){
+        elems[i].style.cssText = 'box-shadow: none !important; border: 1px !important;'
+    }
+
+
+    const admonitions = $( '.admonition' );
+    for(let i = 0; i < admonitions.length; i++){
+        admonitions[i].style.cssText = 'box-shadow: none !important; border-radius:0px !important; '
+    }
+})
diff --git a/docs/sphinx_setup/conf.py b/docs/sphinx_setup/conf.py
@@ -199,6 +199,7 @@
     'js/papaparse.min.js',
     'js/viewer.min.js',
     'js/custom.js',
+    'js/modern.js',
 ]
 
 # monkeypatch sphinx api doc to prevent showing inheritance from object and enum.Enum