-
{title}
@@ -61,13 +63,15 @@ export default function HomepageFeatures() {
return (
+
{FeatureList.map((props, idx) => (
-
+
);
}
+
diff --git a/src/components/features/styles.module.css b/src/components/features/styles.module.css
index c1c84d4899..3b4c98d78d 100644
--- a/src/components/features/styles.module.css
+++ b/src/components/features/styles.module.css
@@ -1,7 +1,6 @@
.features {
display: flex;
align-items: center;
- padding: 2rem 0;
width: 100%;
}
@@ -17,4 +16,4 @@
.featureSvg {
height: 97.5px;
width: 100px;
-}
+}
\ No newline at end of file
diff --git a/src/components/resources/index.js b/src/components/resources/index.js
index 48412923fe..77e595cc47 100644
--- a/src/components/resources/index.js
+++ b/src/components/resources/index.js
@@ -1,11 +1,11 @@
-import React, {useCallback, useRef, useState} from 'react'
+import React, { useCallback, useRef, useState } from 'react'
import styles from './index.module.css';
import Link from '@docusaurus/Link';
-import {useColorMode} from '@docusaurus/theme-common';
+import { useColorMode } from '@docusaurus/theme-common';
import Button from '../button';
const Graphics = {
- apis({color = "#5559F2"}) {
+ apis({ color = "#5559F2" }) {
return (
)
},
- docs({color = "#5559F2"}) {
+ docs({ color = "#5559F2" }) {
return (
)
},
- getStarted({color = "#767AF5"}) {
+ getStarted({ color = "#767AF5" }) {
return (
)
},
- resources({color = "#5559F2"}) {
+ resources({ color = "#5559F2" }) {
return (
)
},
- tutorials({color = "#5559F2"}) {
+ tutorials({ color = "#5559F2" }) {
return (
)
},
- walletSdkSwift({color = "#5559F2"}) {
+ walletSdkSwift({ color = "#5559F2" }) {
return (
)
},
- walletSdkKmm({color = "#5559F2"}) {
+ walletSdkKmm({ color = "#5559F2" }) {
return (
)
},
- walletSdkTS({color = "#5559F2"}) {
+ walletSdkTS({ color = "#5559F2" }) {
return (
-
)
@@ -172,10 +172,10 @@ function Resource(props) {
const ref = useRef(null);
const lightRef = useRef(null)
const backgroundRef = useRef(null);
- const {colorMode} = useColorMode();
+ const { colorMode } = useColorMode();
const handleMouseMove = useCallback((event) => {
- const {clientX, clientY, currentTarget} = event;
+ const { clientX, clientY, currentTarget } = event;
const {
height: targetHeight,
width: targetWidth,
@@ -188,16 +188,16 @@ function Resource(props) {
const mouseY = (clientY - offsetY);
const x = ((mouseX - centerX) * .06);
const y = ((mouseY - centerY) * .06);
- ref.current.animate({transform: `rotateX(${x}deg) rotateY(${y}deg)`}, {fill: "forwards"})
+ ref.current.animate({ transform: `rotateX(${x}deg) rotateY(${y}deg)` }, { fill: "forwards" })
lightRef.current.animate({
top: `${mouseY}px`,
left: `${mouseX}px`,
- }, {fill: "forwards", duration: 500})
+ }, { fill: "forwards", duration: 500 })
}, [ref, lightRef])
const handleMouseLeave = useCallback((event) => {
event.preventDefault()
- ref.current.animate({transform: `rotateX(${0}deg) rotateY(${0}deg)`}, {fill: "forwards", duration: 1000})
+ ref.current.animate({ transform: `rotateX(${0}deg) rotateY(${0}deg)` }, { fill: "forwards", duration: 1000 })
}, [backgroundRef])
@@ -209,16 +209,27 @@ function Resource(props) {
onMouseMove={handleMouseMove}
>
-
+
{props.title}
{props.content}
-
-
);
}
+export function FutureOfIdentity() {
+ return (
+ <>
+
+
Build the Future of Digital Identity
+
Hyperledger Identus is an open-source platform for building secure, standards-based digital identity solutions. With complete DID and verifiable credential functionality, it gives developers everything they need to create and integrate self-sovereign identity into apps and workflows - bridging trust between users, organizations, and systems.
+
{
RESOURCES.map((resource, index) => (
-
+
);
}
+
diff --git a/src/components/resources/index.module.css b/src/components/resources/index.module.css
index 9b907d9d98..d89607e1c2 100644
--- a/src/components/resources/index.module.css
+++ b/src/components/resources/index.module.css
@@ -19,9 +19,11 @@
margin-left: auto;
align-self: flex-end;
}
+
.resource:hover .resource__link__svg__0 {
transform: rotate(180deg);
}
+
.resource__link__svg__0 {
transform-origin: 12px center;
transition: transform 250ms;
@@ -30,9 +32,11 @@
.resource:hover .resource__link__svg__1 {
transform: translateX(15px);
}
+
.resource__link__svg__1 {
transition: transform 250ms;
}
+
.resource p {
font-size: 14px;
margin-bottom: 0;
@@ -77,6 +81,7 @@
.resource:hover .resource__light {
opacity: 1;
}
+
.resource__light {
top: 0;
left: 0;
@@ -91,7 +96,8 @@
z-index: 10;
}
-.home__resources .resource h3, p {
+.home__resources .resource h3,
+p {
/*color: var(--ifm-color-gray-600);*/
color: inherit;
}
@@ -126,4 +132,36 @@
background: var(--ifm-color-primary);
padding: .625rem 1.75rem;
text-decoration: none;
+}
+
+.project__description {
+ max-width: 693px;
+ margin: clamp(1rem, 20vw, 3rem) auto 5rem;
+ height: auto;
+ text-align: center;
+}
+
+.project__description h5 {
+ font-size: 17px;
+ line-height: 28px;
+ color: var(--ifm-color-primary);
+}
+
+.project__description h2 {
+ font-size: clamp(1.5rem, 2vw, 1.875rem);
+ font-weight: 400;
+ line-height: 38px;
+ margin-bottom: 0;
+ color: var(--ifm-color-resources-intro);
+}
+
+.project__description a {
+ color: #ffffff;
+ border-radius: 25px;
+ font-size: 1rem;
+ display: inline-block;
+ margin-top: 3.125rem;
+ background: var(--ifm-color-primary);
+ padding: .625rem 1.75rem;
+ text-decoration: none;
}
\ No newline at end of file
diff --git a/src/pages/index.module.css b/src/pages/index.module.css
index 7a4480f01c..af84004aed 100644
--- a/src/pages/index.module.css
+++ b/src/pages/index.module.css
@@ -12,7 +12,7 @@
.heroBanner {
overflow: hidden;
- height: 100vh;
+ height: 40vh;
}
.container {
@@ -34,7 +34,7 @@
.hero__title {
color: var(--ifm-hero-text-color);
font-weight: 500;
- font-size: clamp(2rem, 5vw,4rem);
+ font-size: clamp(2rem, 5vw, 4rem);
}
@media screen and (max-width: 996px) {
@@ -65,6 +65,7 @@
.heroBanner {
height: auto;
}
+
.hero__content {
height: auto;
}
@@ -73,6 +74,6 @@
@media screen and (min-height: 667px) {
.hero__content {
- top: clamp(9.125rem, 100vw, 11.125rem);
+ top: clamp(5.125rem, 100vw, 9.125rem);
}
-}
+}
\ No newline at end of file