fix: styles with sphinx design elements (#306)

ansys · Sep 26, 2023 · 646bdc0 · 646bdc0
1 parent a3d9b17
commit 646bdc0
Showing 1 changed file with 22 additions and 7 deletions.
diff --git a/src/ansys_sphinx_theme/theme/ansys_sphinx_theme/static/css/ansys_sphinx_theme.css b/src/ansys_sphinx_theme/theme/ansys_sphinx_theme/static/css/ansys_sphinx_theme.css
@@ -862,19 +862,23 @@ html[data-theme="dark"] .highlight pre {
 Sphinx design
 ##############
 */
+
+blockquote {
+  background-color: var(--pst-color-background);
+}
 .sd-sphinx-override,
 .sd-sphinx-override * {
-  background-color: transparent !important;
   font-size: medium;
   flex: auto;
 }
+
 /* Sphinx-design tab */
 
 /* Common styles for all screen sizes */
 .sd-tab-set > input:not(.focus-visible) + label {
   outline: none;
   font-size: large;
-  -webkit-tap-highlight-color: transparent;
+  -webkit-tap-highlight-color: var(--pst-color-background) !important;
   color: var(--pst-color-text-base);
 }
 
@@ -917,12 +921,13 @@ Sphinx design
 /* Common styles for all screen sizes */
 .sd-card .sd-card-text {
   font-family: var(--pst-font-family-base) !important;
+  background-color: var(--pst-color-background) !important;
 }
 
-.sd-card .sd-card-header {
+.bd-content .sd-card .sd-card-header {
   border: none;
-  background-color: white;
-  color: #150458 !important;
+  background-color: transparent;
+  color: var(--pst-color-text-base) !important;
   font-size: var(--pst-font-size-h5);
   font-weight: bold;
   font-family: var(--pst-font-family-base);
@@ -936,6 +941,12 @@ Sphinx design
   font-family: var(--pst-font-family-base);
 }
 
+.bd-content .sd-card .sd-card-body,
+.bd-content .sd-card .sd-card-footer,
+.bd-content .sd-card .sd-card-text {
+  background-color: transparent;
+}
+
 html[data-theme="dark"] .sd-shadow-sm {
   box-shadow: 0 0.1rem 1rem rgba(250, 250, 250, 0.6) !important;
 }
@@ -976,15 +987,19 @@ html[data-theme="dark"] .sd-card-img-top[src*=".png"] {
 Sphinx-design dropdown
 */
 
-details.sd-dropdown .sd-summary-title {
+.bd-content details.sd-dropdown .sd-summary-title {
   border: 1px solid var(--pst-color-text-base) !important;
-  color: var(--sd-color-card-text) !important;
+  color: var(--pst-color-text-base) !important;
   font-family: var(monospace) !important;
   font-size: medium;
   text-align: left;
   padding-left: 1rem;
 }
 
+details.sd-dropdown summary.sd-card-header + div.sd-summary-content {
+  background-color: transparent;
+}
+
 /*
 #################################
 Right side toctree color and font