From 7cb1b07724ee0fb4154954ef1bfa2708403f2e7d Mon Sep 17 00:00:00 2001 From: CamDavidsonPilon Date: Thu, 21 Nov 2024 22:15:36 -0500 Subject: [PATCH] new images --- src/components/HomepageFeatures.js | 18 +++---- src/components/HomepageFeatures.module.css | 22 +++++++- static/img/misc/interface.svg | 1 - static/img/misc/optical_density.svg | 14 ----- static/img/misc/plugins.svg | 11 ---- static/img/misc/prof_teaching_right.svg | 53 +++++++++++++++++++ .../scientist_holding_pioreactor_right.svg | 43 +++++++++++++++ static/img/misc/undraw_professor_re_mj1s.svg | 1 - static/img/misc/undraw_scientist_ft0o.svg | 1 - 9 files changed, 126 insertions(+), 38 deletions(-) delete mode 100644 static/img/misc/interface.svg delete mode 100644 static/img/misc/optical_density.svg delete mode 100644 static/img/misc/plugins.svg create mode 100644 static/img/misc/prof_teaching_right.svg create mode 100644 static/img/misc/scientist_holding_pioreactor_right.svg delete mode 100644 static/img/misc/undraw_professor_re_mj1s.svg delete mode 100644 static/img/misc/undraw_scientist_ft0o.svg diff --git a/src/components/HomepageFeatures.js b/src/components/HomepageFeatures.js index 254dbe35a..171b4ae58 100644 --- a/src/components/HomepageFeatures.js +++ b/src/components/HomepageFeatures.js @@ -7,7 +7,7 @@ import { useColorMode } from '@docusaurus/theme-common'; const FeatureList = [ { title: 'User Guide', - Svg: require('@site/static/img/misc/undraw_scientist_ft0o.svg').default, + Svg: require('@site/static/img/misc/scientist_holding_pioreactor_right.svg').default, link: "/user-guide/introduction", description: ( <> @@ -27,7 +27,7 @@ const FeatureList = [ }, { title: 'Experiments', - Svg: require('@site/static/img/misc/undraw_professor_re_mj1s.svg').default, + Svg: require('@site/static/img/misc/prof_teaching_right.svg').default, link: "/experiments/introduction", description: ( <> @@ -39,15 +39,15 @@ const FeatureList = [ function Feature({Svg, title, description, link}) { return ( -
-
+
+
- + className={styles.featureSvg} + stroke={useColorMode().colorMode === "dark" ? "white" : "#5332CA"} + fill={useColorMode().colorMode === "dark" ? "white" : "#5332CA"} + alt={title} /> +

{title}

diff --git a/src/components/HomepageFeatures.module.css b/src/components/HomepageFeatures.module.css index 8bc00f692..af278730d 100644 --- a/src/components/HomepageFeatures.module.css +++ b/src/components/HomepageFeatures.module.css @@ -6,7 +6,27 @@ } .featureSvg { - height: 130px; + height: 140px; width: auto; margin-bottom: 10px; + transition: transform 0.4s ease, fill 0.4s ease; + +} + +.featureCard { + transition: transform 0.4s ease, box-shadow 0.4s ease; + border-radius: 8px; /* Optional: for rounded corners */ + padding: 16px; +} + +.featureCard:hover { + transform: translateY(-2px); /* Less lift */ + box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.1); /* Softer shadow */ } + + +.featureCard:hover .featureSvg { + transform: scale(1.05); /* Slightly smaller scale */ + fill: #FFB84D; /* Subtle color change */ +} + diff --git a/static/img/misc/interface.svg b/static/img/misc/interface.svg deleted file mode 100644 index 7ae4d3cda..000000000 --- a/static/img/misc/interface.svg +++ /dev/null @@ -1 +0,0 @@ -interface \ No newline at end of file diff --git a/static/img/misc/optical_density.svg b/static/img/misc/optical_density.svg deleted file mode 100644 index e3a0e4963..000000000 --- a/static/img/misc/optical_density.svg +++ /dev/null @@ -1,14 +0,0 @@ - - - optical_density - - - - - - - - - - - \ No newline at end of file diff --git a/static/img/misc/plugins.svg b/static/img/misc/plugins.svg deleted file mode 100644 index 8870eaa25..000000000 --- a/static/img/misc/plugins.svg +++ /dev/null @@ -1,11 +0,0 @@ - - - plugins - - - - - - - - \ No newline at end of file diff --git a/static/img/misc/prof_teaching_right.svg b/static/img/misc/prof_teaching_right.svg new file mode 100644 index 000000000..1dfdea8d4 --- /dev/null +++ b/static/img/misc/prof_teaching_right.svg @@ -0,0 +1,53 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/static/img/misc/scientist_holding_pioreactor_right.svg b/static/img/misc/scientist_holding_pioreactor_right.svg new file mode 100644 index 000000000..a25791cb2 --- /dev/null +++ b/static/img/misc/scientist_holding_pioreactor_right.svg @@ -0,0 +1,43 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/static/img/misc/undraw_professor_re_mj1s.svg b/static/img/misc/undraw_professor_re_mj1s.svg deleted file mode 100644 index 4fdda4a65..000000000 --- a/static/img/misc/undraw_professor_re_mj1s.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/static/img/misc/undraw_scientist_ft0o.svg b/static/img/misc/undraw_scientist_ft0o.svg deleted file mode 100644 index 8583e49dc..000000000 --- a/static/img/misc/undraw_scientist_ft0o.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file