diff --git a/website/src/components/widgets/companies-section.tsx b/website/src/components/widgets/companies-section.tsx
index 3a7455fa58a..cc729eb67ba 100644
--- a/website/src/components/widgets/companies-section.tsx
+++ b/website/src/components/widgets/companies-section.tsx
@@ -25,6 +25,7 @@ import E2mLogoSvg from "@/images/companies/e2m.svg";
import ExlrtLogoSvg from "@/images/companies/exlrt.svg";
import EzeepLogoSvg from "@/images/companies/ezeep.svg";
import FulcrumLogoSvg from "@/images/companies/fulcrum.svg";
+import GalaxusLogoSvg from "@/images/companies/galaxus.svg";
import GiaLogoSvg from "@/images/companies/gia.svg";
import HiloLogoSvg from "@/images/companies/hilo.svg";
import IncloudLogoSvg from "@/images/companies/incloud.svg";
@@ -66,6 +67,11 @@ export const CompaniesSection: FC = () => (
+
+
+
+
+
@@ -250,20 +256,12 @@ export const CompaniesSection: FC = () => (
);
const FADE = keyframes`
- 0% {
- opacity: 1;
- z-index: 1;
+ 0%, 33% {
+ opacity: 0;
}
- 25% {
+ 8%, 24% {
opacity: 1;
}
- 49% {
- z-index: 1;
- }
- 50% {
- opacity: 0;
- z-index: 0;
- }
`;
const Carousel = styled.div`
@@ -283,17 +281,21 @@ const Carousel = styled.div`
& > * {
position: absolute;
- animation: 12s ${FADE} linear infinite;
+ animation: ${FADE} 15s infinite;
opacity: 0;
z-index: 0;
}
& > *:nth-child(1) {
- animation-delay: 0s;
+ animation-delay: 0;
}
& > *:nth-child(2) {
- animation-delay: 6s;
+ animation-delay: 5s;
+ }
+
+ & > *:nth-child(3) {
+ animation-delay: 10s;
}
`;
@@ -313,6 +315,15 @@ const SwissLifeLogo = styled.div`
}
`;
+const GalaxusLogo = styled.div`
+ & svg {
+ min-height: 30px;
+ min-width: 150px;
+ height: 90px;
+ margin: 20px;
+ }
+`;
+
const TICKER = keyframes`
0% {
transform: translate3d(0, 0, 0);
diff --git a/website/src/images/companies/galaxus.svg b/website/src/images/companies/galaxus.svg
new file mode 100644
index 00000000000..f0f0b5f7e9a
--- /dev/null
+++ b/website/src/images/companies/galaxus.svg
@@ -0,0 +1,6 @@
+