diff --git a/website/src/pages/index.tsx b/website/src/pages/index.tsx index 541bfbf2..f5a57e3b 100644 --- a/website/src/pages/index.tsx +++ b/website/src/pages/index.tsx @@ -125,62 +125,71 @@ function useFilteredUsers() { } function ShowcaseTemplateSearch() { - const cover = useBaseUrl("/img/cover.png"); return ( -
-
+ { + currentTarget.style.display = "none"; }} - > + alt="" + /> +
+
+ + {TITLE} + +
- {TITLE} + {DESCRIPTION} -
- - {DESCRIPTION} - - - - Not familiar with the Azure Developer CLI (azd)? - + - Learn more - - + Not familiar with the Azure Developer CLI (azd)? + + Learn more + + +
); @@ -640,7 +649,6 @@ function ShowcaseCards() { ); } - export default function Showcase(): JSX.Element { return ( diff --git a/website/src/pages/styles.module.css b/website/src/pages/styles.module.css index cb0d9652..a00c109f 100644 --- a/website/src/pages/styles.module.css +++ b/website/src/pages/styles.module.css @@ -24,10 +24,22 @@ margin-right: 0; } +.cover{ + pointer-events: none; + position: absolute; + width: 100%; + height: 100%; +} + +.searchContainer{ + display: inline-block; + overflow: hidden; + position: relative; + width: 100%; +} + .searchArea { - background-image: url("/img/cover.svg"); - background-size: cover; - background-repeat: "no-repeat"; + position: relative; width: 100%; height: 300px; display: flex; diff --git a/website/static/img/cover.svg b/website/static/img/cover.svg deleted file mode 100644 index 8c168a94..00000000 --- a/website/static/img/cover.svg +++ /dev/null @@ -1,14 +0,0 @@ - - - - - - - - - - - - - - diff --git a/website/static/img/coverBackground.png b/website/static/img/coverBackground.png new file mode 100644 index 00000000..7a6983bd Binary files /dev/null and b/website/static/img/coverBackground.png differ