Skip to content

Commit 40d92f2

Browse files
link cards on kanvas operate page
Signed-off-by: Rajesh-Nagarajan-11 <rajeshnagarajan36@gmail.com>
1 parent aa53405 commit 40d92f2

1 file changed

Lines changed: 45 additions & 45 deletions

File tree

src/sections/Kanvas/Kanvas-visualize/kanvas-visualize-features.js

Lines changed: 45 additions & 45 deletions
Original file line numberDiff line numberDiff line change
@@ -156,49 +156,49 @@ const KanvasisualizerFeatures = () => {
156156
<Row>
157157
<div className="project__block__wrap">
158158
<Col $sm={12} $md={6} $lg={4}>
159-
<a href="https://docs.layer5.io/kanvas/getting-started/import-designs/" style={{ textDecoration: 'none', color: 'inherit', display: 'block' }}>
160-
<div className={(isHovered && hoveredFeature != "Feature1") ? "project__block__inner darken" : "project__block__inner"} onMouseOver={() => handleMouseOver(1)} onMouseOut={handleMouseOut}>
161-
<div className="docs-icon-wrapper">
162-
<DocsIcon style={{ color: '#00D3A9' }} className="docs" />
159+
<a href="https://docs.layer5.io/kanvas/getting-started/import-designs/" style={{ textDecoration: "none", color: "inherit", display: "block" }}>
160+
<div className={(isHovered && hoveredFeature != "Feature1") ? "project__block__inner darken" : "project__block__inner"} onMouseOver={() => handleMouseOver(1)} onMouseOut={handleMouseOut}>
161+
<div className="docs-icon-wrapper">
162+
<DocsIcon style={{ color: "#00D3A9" }} className="docs" />
163+
</div>
164+
<div className="feature-image">
165+
<img src={ApplicationImportBoxes} alt="Application Import" style={{ position: "absolute" }} />
166+
<img src={ApplicationImportArrows} alt="" className={hoveredFeature == "Feature1" ? "secondary-image-visible" : "secondary-image"} />
167+
</div>
168+
<h3>Application Import</h3>
169+
<p>Import your existing Kubernetes, Helm, or Docker Compose applications.</p>
163170
</div>
164-
<div className="feature-image">
165-
<img src={ApplicationImportBoxes} alt="Application Import" style={{ position: "absolute" }} />
166-
<img src={ApplicationImportArrows} alt="" className={hoveredFeature == "Feature1" ? "secondary-image-visible" : "secondary-image"} />
167-
</div>
168-
<h3>Application Import</h3>
169-
<p>Import your existing Kubernetes, Helm, or Docker Compose applications.</p>
170-
</div>
171171
</a>
172172
</Col>
173173
<Col $sm={12} $md={6} $lg={4}>
174-
<a href="https://docs.layer5.io/kanvas/operator/resource-details/" style={{ textDecoration: 'none', color: 'inherit', display: 'block' }}>
175-
<div className={(isHovered && hoveredFeature != "Feature2") ? "project__block__inner darken" : "project__block__inner"} onMouseOver={() => handleMouseOver(2)} onMouseOut={handleMouseOut}>
176-
<div className="docs-icon-wrapper">
177-
<DocsIcon style={{ color: '#00D3A9' }} className="docs" />
174+
<a href="https://docs.layer5.io/kanvas/operator/resource-details/" style={{ textDecoration: "none", color: "inherit", display: "block" }}>
175+
<div className={(isHovered && hoveredFeature != "Feature2") ? "project__block__inner darken" : "project__block__inner"} onMouseOver={() => handleMouseOver(2)} onMouseOut={handleMouseOut}>
176+
<div className="docs-icon-wrapper">
177+
<DocsIcon style={{ color: "#00D3A9" }} className="docs" />
178+
</div>
179+
<div className="feature-image">
180+
<img src={PerformanceMetrics} alt="Performance Metrics" style={{ position: "absolute" }} />
181+
<img src={PerformanceMetricsGraph} alt="" className={hoveredFeature == "Feature2" ? "secondary-image-visible" : "secondary-image"} />
182+
</div>
183+
<h3>Real-time performance metrics</h3>
184+
<p>Monitor your clusters performing in action, set alerts and work with object-specific metrics.</p>
178185
</div>
179-
<div className="feature-image">
180-
<img src={PerformanceMetrics} alt="Performance Metrics" style={{ position: "absolute" }} />
181-
<img src={PerformanceMetricsGraph} alt="" className={hoveredFeature == "Feature2" ? "secondary-image-visible" : "secondary-image"} />
182-
</div>
183-
<h3>Real-time performance metrics</h3>
184-
<p>Monitor your clusters performing in action, set alerts and work with object-specific metrics.</p>
185-
</div>
186186
</a>
187187
</Col>
188188
<Col $sm={12} $md={6} $lg={4}>
189-
<a href="https://docs.layer5.io/kanvas/operator/#understanding-interactive-terminal" style={{ textDecoration: 'none', color: 'inherit', display: 'block' }}>
190-
<div className={(isHovered && hoveredFeature != "Feature3") ? "project__block__inner darken" : "project__block__inner"} onMouseOver={() => handleMouseOver(3)} onMouseOut={handleMouseOut}>
191-
<div className="docs-icon-wrapper">
192-
<DocsIcon style={{ color: '#00D3A9' }} className="docs" />
189+
<a href="https://docs.layer5.io/kanvas/operator/#understanding-interactive-terminal" style={{ textDecoration: "none", color: "inherit", display: "block" }}>
190+
<div className={(isHovered && hoveredFeature != "Feature3") ? "project__block__inner darken" : "project__block__inner"} onMouseOver={() => handleMouseOver(3)} onMouseOut={handleMouseOut}>
191+
<div className="docs-icon-wrapper">
192+
<DocsIcon style={{ color: "#00D3A9" }} className="docs" />
193+
</div>
194+
<div className="feature-image">
195+
<img src={InteractiveTerminal} alt="Interactive Terminal" style={{ position: "absolute", width: "80%", zIndex: "0" }} />
196+
<img src={InteractiveTerminalCode} alt="" className={hoveredFeature == "Feature3" ? "secondary-image-visible" : "secondary-image"} style={{ position: "relative", width: "80%", zIndex: "10" }} />
197+
</div>
198+
<h3>Interactive Terminal</h3>
199+
<p>Establish sessions with one or more pods at a time.</p>
193200
</div>
194-
<div className="feature-image">
195-
<img src={InteractiveTerminal} alt="Interactive Terminal" style={{ position: "absolute", width: "80%", zIndex: "0" }} />
196-
<img src={InteractiveTerminalCode} alt="" className={hoveredFeature == "Feature3" ? "secondary-image-visible" : "secondary-image"} style={{ position: "relative", width: "80%", zIndex: "10" }} />
197-
</div>
198-
<h3>Interactive Terminal</h3>
199-
<p>Establish sessions with one or more pods at a time.</p>
200-
</div>
201-
</a>
201+
</a>
202202
</Col>
203203
<Col $sm={12} $md={6} $lg={4}>
204204
<div className={(isHovered && hoveredFeature != "Feature4") ? "project__block__inner darken" : "project__block__inner"} onMouseOver={() => handleMouseOver(4)} onMouseOut={handleMouseOut}>
@@ -223,18 +223,18 @@ const KanvasisualizerFeatures = () => {
223223
</div>
224224
</Col>
225225
<Col $sm={12} $md={6} $lg={4}>
226-
<a href="https://docs.layer5.io/kanvas/operator/#understanding-log-streamer" style={{ textDecoration: 'none', color: 'inherit', display: 'block' }}>
227-
<div className={(isHovered && hoveredFeature != "Feature6") ? "project__block__inner darken" : "project__block__inner"} onMouseOver={() => handleMouseOver(6)} onMouseOut={handleMouseOut}>
228-
<div className="docs-icon-wrapper">
229-
<DocsIcon style={{ color: '#00D3A9' }} className="docs" />
226+
<a href="https://docs.layer5.io/kanvas/operator/#understanding-log-streamer" style={{ textDecoration: "none", color: "inherit", display: "block" }}>
227+
<div className={(isHovered && hoveredFeature != "Feature6") ? "project__block__inner darken" : "project__block__inner"} onMouseOver={() => handleMouseOver(6)} onMouseOut={handleMouseOut}>
228+
<div className="docs-icon-wrapper">
229+
<DocsIcon style={{ color: "#00D3A9" }} className="docs" />
230+
</div>
231+
<div className="feature-image">
232+
<img src={LogStream} alt="Log Stream" style={{ position: "absolute" }} />
233+
<img src={LogStreamSearch} alt="" className={hoveredFeature == "Feature6" ? "secondary-image-visible" : "secondary-image"} />
234+
</div>
235+
<h3>Log Stream</h3>
236+
<p>Stream and filter through the logs using keywords for multiple Kubernetes Pods simultaneously.</p>
230237
</div>
231-
<div className="feature-image">
232-
<img src={LogStream} alt="Log Stream" style={{ position: "absolute" }} />
233-
<img src={LogStreamSearch} alt="" className={hoveredFeature == "Feature6" ? "secondary-image-visible" : "secondary-image"} />
234-
</div>
235-
<h3>Log Stream</h3>
236-
<p>Stream and filter through the logs using keywords for multiple Kubernetes Pods simultaneously.</p>
237-
</div>
238238
</a>
239239
</Col>
240240
</div>

0 commit comments

Comments
 (0)