diff --git a/docroot/profiles/sdss/sdss_profile/themes/sdss_subtheme/decoupled-menu/dist/islands/main-menu.island.umd.js b/docroot/profiles/sdss/sdss_profile/themes/sdss_subtheme/decoupled-menu/dist/islands/main-menu.island.umd.js
index 4af1483b8..9100de917 100644
--- a/docroot/profiles/sdss/sdss_profile/themes/sdss_subtheme/decoupled-menu/dist/islands/main-menu.island.umd.js
+++ b/docroot/profiles/sdss/sdss_profile/themes/sdss_subtheme/decoupled-menu/dist/islands/main-menu.island.umd.js
@@ -156,7 +156,7 @@
}
@media (min-width: 992px) {
- margin: 12px 10px 0 10px;
+ margin: 12px 10px 0 0;
&:hover, &:focus, &:active {
@@ -173,7 +173,6 @@
@media (min-width: 992px) {
color: ${e=>e.open?"#ffffff":"#155f65"};
background-color: ${e=>e.open?"#F5FEFF":"transparent"};
- padding-bottom: ${e=>(e.level,"0")};
width: ${e=>0===e.level?"fit-content":"100%"};
padding-bottom: ${e=>0===e.level?"2rem":"0"};
border-radius: ${e=>0===e.level?"10px":"0"};
@@ -204,15 +203,17 @@
color: ${({level:e})=>"#2E2D29"};
font-weight: 400;
font-size: 1.9rem;
- padding: ${({level:e})=>0!=e?"0":"16px 0"};
+ padding: ${({level:e})=>"16px 16px 16px 8px"};
+ padding: ${({level:e})=>"16px 16px 2rem 16px"};
margin-bottom: ${({level:e,inTrail:t,isCurrent:r})=>0===e?"-6px":""};
&:hover, &:focus {
- color: ${({level:e})=>0!=e?"#155F65":"#2E2D29"};
+ color: ${({level:e})=>e>0?"#155F65":"#2E2D29"};
background-color: #F5FEFF;
border-radius: 10px;
- padding: ${({level:e})=>0!=e?"16px":"0"};
+ padding: ${({level:e})=>"16px 16px 16px 8px"};
+ padding: ${({level:e})=>"16px 16px 2rem 16px"};
}
}
`,un=Or.h2`
diff --git a/docroot/profiles/sdss/sdss_profile/themes/sdss_subtheme/decoupled-menu/src/components/menu-level-0.tsx b/docroot/profiles/sdss/sdss_profile/themes/sdss_subtheme/decoupled-menu/src/components/menu-level-0.tsx
deleted file mode 100644
index d1fb20c80..000000000
--- a/docroot/profiles/sdss/sdss_profile/themes/sdss_subtheme/decoupled-menu/src/components/menu-level-0.tsx
+++ /dev/null
@@ -1,53 +0,0 @@
-const MenuLevel0 = ({...props}) => {
- return (
-
-
- {!isNoLink &&
-
- {title}
-
- }
- {isNoLink &&
- {title}
- }
-
- {items && level === 0 ? (
-
- ) : ""
- }
-
-
- {items &&
-
-
-
-
- {items.map(item =>
-
- )}
-
-
-
- }
-
- )
- }
- export default MenuLevel0;
diff --git a/docroot/profiles/sdss/sdss_profile/themes/sdss_subtheme/decoupled-menu/src/main-menu.island.tsx b/docroot/profiles/sdss/sdss_profile/themes/sdss_subtheme/decoupled-menu/src/main-menu.island.tsx
index c12572a04..12586be49 100644
--- a/docroot/profiles/sdss/sdss_profile/themes/sdss_subtheme/decoupled-menu/src/main-menu.island.tsx
+++ b/docroot/profiles/sdss/sdss_profile/themes/sdss_subtheme/decoupled-menu/src/main-menu.island.tsx
@@ -31,7 +31,7 @@ if (isBlueHeader.length === 0) {
}
-const TopList = styled.ul<{ open?: boolean }>`
+const TopList = styled.ul<{ open?: boolean, level?: number }>`
display: ${props => props.open ? "block" : "none"};
padding: ${props => props.open ? "225px 0 0 0" : "0"};
top: ${props => props.open ? "-225px" : "0"};
@@ -278,7 +278,7 @@ const Button = styled.button<{ open?: boolean }>`
}
@media (min-width: 992px) {
- margin: 12px 10px 0 10px;
+ margin: 12px 10px 0 0;
&:hover, &:focus, &:active {
@@ -297,7 +297,6 @@ const MenuItemContainer = styled.div<{ open?: boolean, level?: number }>`
@media (min-width: 992px) {
color: ${props => props.open ? "#ffffff" : "#155f65"};
background-color: ${props => props.open ? "#F5FEFF" : "transparent"};
- padding-bottom: ${props => props.level === 0 ? "0" : "0"};
width: ${props => props.level === 0 ? "fit-content" : "100%"};
padding-bottom: ${props => props.level === 0 ? "2rem" : "0"};
border-radius: ${props => props.level === 0 ? "10px" : "0"};
@@ -330,15 +329,17 @@ const MenuLink = styled.a<{ isCurrent?: boolean, inTrail?: boolean, level?: numb
color: ${({level}) => level != 0 ? "#2E2D29" : "#2E2D29"};
font-weight: 400;
font-size: 1.9rem;
- padding: ${({level}) => level != 0 ? "0" : "16px 0"};
+ padding: ${({level}) => level > 0 ? "16px 16px 16px 8px" : "16px 16px 16px 8px"};
+ padding: ${({level}) => level === 0 ? "16px 16px 2rem 16px" : "16px 16px 2rem 16px"};
margin-bottom: ${({level, inTrail, isCurrent}) => level === 0 ? (isCurrent ? "-6px" : (inTrail ? "-6px" : "-6px")) : ""};
&:hover, &:focus {
- color: ${({level}) => level != 0 ? "#155F65" : "#2E2D29"};
+ color: ${({level}) => level > 0 ? "#155F65" : "#2E2D29"};
background-color: #F5FEFF;
border-radius: 10px;
- padding: ${({level}) => level != 0 ? "16px" : "0"};
+ padding: ${({level}) => level > 0 ? "16px 16px 16px 8px" : "16px 16px 16px 8px"};
+ padding: ${({level}) => level === 0 ? "16px 16px 2rem 16px" : "16px 16px 2rem 16px"};
}
}
`