hazem/yslootahrobotics
1
1
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: add robotics showcase components and UI enhancements
CI/CD / test-and-build (push) Waiting to run
Details
CI/CD / deploy (push) Blocked by required conditions
Details

Browse Source 
- Introduced FounderSection component to highlight leadership and vision.
- Created ServicesGrid component to display various robotics services offered.
- Developed RoboticsScrollShowcase for showcasing robots with interactive elements.
- Implemented RoboticsSplineShowcase featuring a 3D Spline scene for enhanced user experience.
- Added reusable Card component for consistent styling across sections.
- Integrated ContainerScroll for animated scrolling effects in the showcase.
- Built SplineScene component for lazy loading Spline 3D scenes.
- Added Spotlight component for interactive hover effects.
- Created utility function for class name merging to streamline styling.
This commit is contained in:
Najjar\NajjarV02
2026-05-20 17:46:36 +04:00
parent 92cf4aba3b
commit 461a00384c
73 changed files with 2041 additions and 582 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/robotics/RobotProductCard.tsx
+13 -13
View File
@@ -19,7 +19,7 @@ export function RobotProductCard({ robot, priority = false }: Props) {
display: 'flex',
flexDirection: 'column',
height: '100%',
color: '#f5f1e8',
color: '#FBFBFD',
}}
>
<Link
@@ -41,7 +41,7 @@ export function RobotProductCard({ robot, priority = false }: Props) {
position: 'absolute',
inset: 0,
backgroundImage:
'linear-gradient(rgba(196, 162, 101,0.05) 1px, transparent 1px), linear-gradient(90deg, rgba(196, 162, 101,0.05) 1px, transparent 1px)',
'linear-gradient(rgba(39, 63, 148,0.05) 1px, transparent 1px), linear-gradient(90deg, rgba(39, 63, 148,0.05) 1px, transparent 1px)',
backgroundSize: '32px 32px',
maskImage: 'radial-gradient(ellipse 60% 60% at 50% 50%, #000 30%, transparent 80%)',
WebkitMaskImage: 'radial-gradient(ellipse 60% 60% at 50% 50%, #000 30%, transparent 80%)',
@@ -90,11 +90,11 @@ export function RobotProductCard({ robot, priority = false }: Props) {
padding: '0.35rem 0.7rem',
borderRadius: '999px',
background: 'rgba(255,255,255,0.05)',
border: '1px solid rgba(196, 162, 101,0.2)',
border: '1px solid rgba(39, 63, 148,0.2)',
fontSize: '0.66rem',
letterSpacing: '0.18em',
textTransform: 'uppercase',
color: '#cbc4b3',
color: '#DEE0F0',
backdropFilter: 'blur(8px)',
}}
>
@@ -104,11 +104,11 @@ export function RobotProductCard({ robot, priority = false }: Props) {
<div style={{ padding: '1.5rem', display: 'flex', flexDirection: 'column', gap: '0.75rem', flex: 1 }}>
<h3 style={{ margin: 0, fontSize: '1.2rem', fontWeight: 600, letterSpacing: '-0.01em' }}>
<Link href={detailHref} style={{ color: '#f5f1e8', textDecoration: 'none' }}>
<Link href={detailHref} style={{ color: '#FBFBFD', textDecoration: 'none' }}>
{robot.name}
</Link>
</h3>
<p style={{ margin: 0, color: '#94908a', fontSize: '0.88rem', lineHeight: 1.55, flex: 1 }}>
<p style={{ margin: 0, color: '#8891C7', fontSize: '0.88rem', lineHeight: 1.55, flex: 1 }}>
{robot.shortDescription}
</p>
@@ -118,10 +118,10 @@ export function RobotProductCard({ robot, priority = false }: Props) {
key={u}
style={{
fontSize: '0.7rem',
color: '#94908a',
color: '#8891C7',
padding: '0.2rem 0.5rem',
borderRadius: 999,
border: '1px solid rgba(196, 162, 101,0.18)',
border: '1px solid rgba(39, 63, 148,0.18)',
background: 'rgba(15, 12, 8,0.5)',
letterSpacing: '0.04em',
}}
@@ -135,7 +135,7 @@ export function RobotProductCard({ robot, priority = false }: Props) {
style={{
marginTop: 'auto',
paddingTop: '0.75rem',
borderTop: '1px solid rgba(196, 162, 101,0.1)',
borderTop: '1px solid rgba(39, 63, 148,0.1)',
display: 'flex',
flexWrap: 'wrap',
gap: '0.4rem',
@@ -176,8 +176,8 @@ export function RobotProductCard({ robot, priority = false }: Props) {
padding: '0.55rem 0.75rem',
borderRadius: 10,
background: 'transparent',
border: '1px solid rgba(196, 162, 101,0.2)',
color: '#cbc4b3',
border: '1px solid rgba(39, 63, 148,0.2)',
color: '#DEE0F0',
fontSize: '0.72rem',
fontWeight: 600,
letterSpacing: '0.1em',
@@ -198,8 +198,8 @@ export function RobotProductCard({ robot, priority = false }: Props) {
padding: '0.55rem 0.75rem',
borderRadius: 10,
background: 'transparent',
border: '1px solid rgba(196, 162, 101,0.2)',
color: '#cbc4b3',
border: '1px solid rgba(39, 63, 148,0.2)',
color: '#DEE0F0',
fontSize: '0.72rem',
fontWeight: 600,
letterSpacing: '0.1em',