Enhance team page styling and structure adjustments.
Removed `pointer-events: none` to enable hover effects on images and updated font weight for better visibility. Added new CSS for tooltips and modified navigation/yaml configuration for better presentation.
This commit is contained in:
File diff suppressed because one or more lines are too long
@@ -28,6 +28,7 @@
|
||||
@import 'modules/testimonials';
|
||||
@import "modules/faq";
|
||||
@import "modules/lightbox";
|
||||
@import "modules/blog";
|
||||
|
||||
//Responsive Design
|
||||
@import "responsive/medium";
|
||||
|
||||
@@ -33,6 +33,7 @@
|
||||
}
|
||||
|
||||
.satag--footer-social-icons{
|
||||
padding-top: 5px;
|
||||
a{
|
||||
padding-right: 10px;
|
||||
}
|
||||
|
||||
@@ -12,13 +12,14 @@
|
||||
|
||||
// Logo vergrößern
|
||||
.md-header__button.md-logo {
|
||||
padding: 1.2rem;
|
||||
padding-left: 0.5rem;
|
||||
padding: 2.2rem;
|
||||
//padding-left: 0.5rem;
|
||||
|
||||
img, svg {
|
||||
width: 325px; // Größeres Logo (Standardwert ist 40px)
|
||||
height: auto;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
// Navigationsleiste anpassen
|
||||
|
||||
@@ -107,7 +107,7 @@
|
||||
|
||||
@include ohne-balken;
|
||||
|
||||
text-align: center;
|
||||
text-align: left;
|
||||
.satag--home-counters-container{
|
||||
display: flex;
|
||||
flex-wrap: wrap; // Erlaubt Umbruch bei kleinen Bildschirmen
|
||||
|
||||
@@ -41,6 +41,12 @@
|
||||
|
||||
.md-tabs__list {
|
||||
height: 4rem;
|
||||
|
||||
// Remove left margin/padding from the first tab item to align with content container
|
||||
.md-tabs__item:first-child {
|
||||
margin-left: 0;
|
||||
padding-left: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.md-tabs__link {
|
||||
@@ -62,6 +68,16 @@
|
||||
text-transform: uppercase !important;
|
||||
}
|
||||
|
||||
// Secondary navigation (TOC) styling - make all text 80% of the normal size
|
||||
.md-nav.md-nav--secondary {
|
||||
font-size: 80%; // Set font size to 80% of the parent element
|
||||
|
||||
// Ensure all child elements inherit the font size
|
||||
* {
|
||||
font-size: inherit;
|
||||
}
|
||||
}
|
||||
|
||||
// Footer navigation
|
||||
.md-footer__title {
|
||||
font-size: 100%;
|
||||
|
||||
@@ -61,7 +61,7 @@ h1, h2, h3, h4, h5, h6 {
|
||||
cursor: default;
|
||||
text-decoration: none;
|
||||
color: inherit;
|
||||
pointer-events: none;
|
||||
// Removed pointer-events: none to allow hover effects on images
|
||||
}
|
||||
|
||||
.team-agent-image {
|
||||
@@ -104,7 +104,7 @@ h1, h2, h3, h4, h5, h6 {
|
||||
|
||||
.team-agent-position {
|
||||
//font-size: 0.7rem;
|
||||
font-weight: 400;
|
||||
font-weight: 700;
|
||||
opacity: .9;
|
||||
color: #fff;
|
||||
margin-bottom: 0.1rem;
|
||||
@@ -124,6 +124,10 @@ h1, h2, h3, h4, h5, h6 {
|
||||
}
|
||||
}
|
||||
|
||||
.team-agent-position{
|
||||
font-weight: bold !important;
|
||||
min-height: 4rem;
|
||||
}
|
||||
// Expertise-Bereich
|
||||
.team-expertise {
|
||||
|
||||
|
||||
@@ -2,7 +2,7 @@
|
||||
.satag--home-testimonials-container {
|
||||
max-width: 1200px;
|
||||
margin: 0 auto;
|
||||
padding: 0 1rem;
|
||||
padding-top: 4rem;
|
||||
|
||||
h2 {
|
||||
text-align: left;
|
||||
|
||||
@@ -49,6 +49,11 @@ h1 {
|
||||
}
|
||||
}
|
||||
|
||||
// H1 styling for blog articles
|
||||
.md-content--post h1 {
|
||||
font-size: 4rem;
|
||||
}
|
||||
|
||||
// H2 styling
|
||||
.md-typeset h2,
|
||||
h2 {
|
||||
@@ -118,20 +123,120 @@ a.headerlink {
|
||||
// Tooltip styling for MkDocs Material
|
||||
.md-tooltip {
|
||||
// Increase the z-index to ensure tooltips appear above other elements
|
||||
z-index: 10;
|
||||
z-index: 999 !important;
|
||||
display: block !important;
|
||||
visibility: visible !important;
|
||||
opacity: 0 !important; // Start with opacity 0
|
||||
transition: opacity 0.3s ease !important; // Add transition for fade effect
|
||||
transition-delay: 1.5s !important; // 1.5 second delay before showing
|
||||
|
||||
// Style the tooltip content
|
||||
.md-tooltip__inner {
|
||||
font-size: .9rem !important;
|
||||
padding: 0.5rem !important;
|
||||
background-color: rgba(0, 0, 0, 0.8) !important;
|
||||
font-size: 1.04rem !important; // 80% of normal font size (1.3rem)
|
||||
padding: 0.8rem !important;
|
||||
margin-top: 0.5rem !important; // Add top spacing
|
||||
background-color: rgba(0, 0, 0, 0.9) !important;
|
||||
border-radius: 4px !important;
|
||||
color: white !important;
|
||||
max-width: 300px !important;
|
||||
white-space: normal !important;
|
||||
transform: none !important;
|
||||
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.5) !important;
|
||||
}
|
||||
}
|
||||
|
||||
// When parent element is hovered for 1.5 seconds, show the tooltip
|
||||
*:hover > .md-tooltip,
|
||||
*:focus > .md-tooltip,
|
||||
*:hover ~ .md-tooltip,
|
||||
*:focus ~ .md-tooltip,
|
||||
*:hover + .md-tooltip,
|
||||
*:focus + .md-tooltip {
|
||||
opacity: 1 !important;
|
||||
transition-delay: 0s !important; // Remove delay when showing
|
||||
}
|
||||
|
||||
// Global tooltip styling to ensure all tooltips are affected
|
||||
[data-md-tooltip],
|
||||
[data-md-tooltip]:before,
|
||||
[data-md-tooltip]:after,
|
||||
.md-tooltip:before,
|
||||
.md-tooltip:after,
|
||||
[class*="tooltip"],
|
||||
[class*="tooltip"]:before,
|
||||
[class*="tooltip"]:after {
|
||||
font-size: 1.04rem !important; // 80% of normal font size (1.3rem)
|
||||
margin-top: 0.5rem !important; // Add top spacing
|
||||
visibility: visible !important;
|
||||
z-index: 9999 !important;
|
||||
pointer-events: auto !important;
|
||||
transition: opacity 0.3s ease !important; // Add transition for fade effect
|
||||
transition-delay: 1.5s !important; // 1.5 second delay before showing
|
||||
opacity: 0 !important; // Start with opacity 0
|
||||
}
|
||||
|
||||
// When parent element is hovered, show these tooltip elements
|
||||
*:hover > [data-md-tooltip],
|
||||
*:hover > [data-md-tooltip]:before,
|
||||
*:hover > [data-md-tooltip]:after,
|
||||
*:hover > .md-tooltip:before,
|
||||
*:hover > .md-tooltip:after,
|
||||
*:hover > [class*="tooltip"],
|
||||
*:hover > [class*="tooltip"]:before,
|
||||
*:hover > [class*="tooltip"]:after,
|
||||
*:hover ~ [data-md-tooltip],
|
||||
*:hover ~ [data-md-tooltip]:before,
|
||||
*:hover ~ [data-md-tooltip]:after,
|
||||
*:hover ~ .md-tooltip:before,
|
||||
*:hover ~ .md-tooltip:after,
|
||||
*:hover ~ [class*="tooltip"],
|
||||
*:hover ~ [class*="tooltip"]:before,
|
||||
*:hover ~ [class*="tooltip"]:after,
|
||||
*:hover + [data-md-tooltip],
|
||||
*:hover + [data-md-tooltip]:before,
|
||||
*:hover + [data-md-tooltip]:after,
|
||||
*:hover + .md-tooltip:before,
|
||||
*:hover + .md-tooltip:after,
|
||||
*:hover + [class*="tooltip"],
|
||||
*:hover + [class*="tooltip"]:before,
|
||||
*:hover + [class*="tooltip"]:after,
|
||||
*:focus > [data-md-tooltip],
|
||||
*:focus > [data-md-tooltip]:before,
|
||||
*:focus > [data-md-tooltip]:after,
|
||||
*:focus > .md-tooltip:before,
|
||||
*:focus > .md-tooltip:after,
|
||||
*:focus > [class*="tooltip"],
|
||||
*:focus > [class*="tooltip"]:before,
|
||||
*:focus > [class*="tooltip"]:after,
|
||||
*:focus ~ [data-md-tooltip],
|
||||
*:focus ~ [data-md-tooltip]:before,
|
||||
*:focus ~ [data-md-tooltip]:after,
|
||||
*:focus ~ .md-tooltip:before,
|
||||
*:focus ~ .md-tooltip:after,
|
||||
*:focus ~ [class*="tooltip"],
|
||||
*:focus ~ [class*="tooltip"]:before,
|
||||
*:focus ~ [class*="tooltip"]:after,
|
||||
*:focus + [data-md-tooltip],
|
||||
*:focus + [data-md-tooltip]:before,
|
||||
*:focus + [data-md-tooltip]:after,
|
||||
*:focus + .md-tooltip:before,
|
||||
*:focus + .md-tooltip:after,
|
||||
*:focus + [class*="tooltip"],
|
||||
*:focus + [class*="tooltip"]:before,
|
||||
*:focus + [class*="tooltip"]:after {
|
||||
opacity: 1 !important;
|
||||
transition-delay: 0s !important; // Remove delay when showing
|
||||
}
|
||||
|
||||
// Hide tooltip when triggered by the logo
|
||||
.md-header__button.md-logo:hover + .md-tooltip,
|
||||
.md-header__button.md-logo:focus + .md-tooltip,
|
||||
.md-header__button.md-logo + .md-tooltip {
|
||||
display: none !important;
|
||||
opacity: 0 !important;
|
||||
visibility: hidden !important;
|
||||
}
|
||||
|
||||
// Hide source file info
|
||||
.md-source-file {
|
||||
display: none;
|
||||
|
||||
Reference in New Issue
Block a user