Skip to content

Commit 82b47de

Browse files
fix flex problem
Signed-off-by: saurabhraghuvanshii <saurabhsraghuvanshi@gmail.com>
1 parent dc256e4 commit 82b47de

3 files changed

Lines changed: 71 additions & 58 deletions

File tree

src/sections/Meshery/Features-section/features-section.style.js

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,9 @@ const FeaturesSectionWrapper = styled.section`
88
margin-bottom: 8rem;
99
overflow: hidden;
1010
position: relative;
11+
width: 100%;
12+
max-width: 100%;
13+
min-height: 0;
1114
.skw{
1215
display: grid;
1316
position: relative;

src/sections/Meshery/index.js

Lines changed: 60 additions & 58 deletions
Original file line numberDiff line numberDiff line change
@@ -20,64 +20,66 @@ import Nic from "../../collections/members/nicholas-jackson/nic-jackson.webp";
2020
const MesheryPage = () => {
2121
return (
2222
<MesheryWrapper>
23-
<Container>
24-
<div className="info">
25-
<Row className="description">
26-
<Col className="desc-text" $lg={6} $md={6} $sm={10} $xs={8}>
27-
<h1 className="heading-1"> Wrangle your infrastructure</h1>
28-
<h1 className="heading-2"> <span className="heading-2"> collaboratively</span></h1>
29-
<p className="desc-p">
30-
{/* Meshery is the cloud native manager. <br /> */}
31-
Confidently design, deploy, and operate your infrastructure and workloads with Meshery.
32-
</p>
33-
<Button $primary className="banner-btn" title="Schedule a Demo" $external={true}
34-
$url="https://calendar.google.com/calendar/appointments/schedules/AcZssZ3pmcApaDP4xd8hvG5fy8ylxuFxD3akIRc5vpWJ60q-HemQi80SFFAVftbiIsq9pgiA2o8yvU56?gv=true"
35-
>
36-
<GiClockwork size={21} className="button-icon" />
37-
</Button>
38-
<Button $secondary className="banner-btn" title="Run Meshery"
39-
$url="/cloud-native-management/meshery/getting-started"
40-
>
41-
<FiDownloadCloud size={21} className="button-icon" />
42-
</Button>
43-
</Col>
44-
<Col $lg={6} $md={6} className="meshery-hero-img desc-text">
45-
<video autoPlay muted loop controls className="meshery-video" >
46-
<source src={mesheryDemo} type="video/webm" />
47-
</video>
48-
{/* <img className="meshery-sup-img" src={mesheryFullStack} alt="Meshery the multi-mesh manager" /> */}
49-
<Button $primary className="banner-btn align-btn"
50-
title="Star the Repository" $url="https://github.com/meshery/meshery" $external={ true }
51-
>
52-
<FaGithub size={21} className="button-icon" />
53-
</Button>
54-
</Col>
55-
</Row>
56-
</div>
57-
<FeaturesTable />
58-
</Container>
59-
<FeaturesSection />
60-
<Container>
61-
<InlineQuotes
62-
quote="Meshery is the perfect tool for ensuring that your applications are optimally configured and performing well; it also gives you a fantastic visual insight into what can be a large amount of textual configuration"
63-
person="Nic Jackson"
64-
title="Principal Developer Advocate at HashiCorp"
65-
image={Nic}
66-
/>
67-
<div className="callout">
68-
<h1> Manage your clusters with features you won't find anywhere else.</h1>
69-
</div>
70-
</Container>
71-
<Features />
72-
<Container>
73-
<DockerExtensionCTA />
74-
<InlineQuotes
75-
quote="The Meshery Extension transforms Docker Desktop into a powerful load generation utility, conveniently enabling me to deploy and configure any cloud native infrastructure with a click of the button and invoke and control load-based performance tests from my desktop."
76-
person="Maximiliano Churichi"
77-
title="Software Engineer at HPE"
78-
image={Maximiliano}
79-
/>
80-
</Container>
23+
<div>
24+
<Container>
25+
<div className="info">
26+
<Row className="description">
27+
<Col className="desc-text" $lg={6} $md={6} $sm={10} $xs={8}>
28+
<h1 className="heading-1"> Wrangle your infrastructure</h1>
29+
<h1 className="heading-2"> <span className="heading-2"> collaboratively</span></h1>
30+
<p className="desc-p">
31+
{/* Meshery is the cloud native manager. <br /> */}
32+
Confidently design, deploy, and operate your infrastructure and workloads with Meshery.
33+
</p>
34+
<Button $primary className="banner-btn" title="Schedule a Demo" $external={true}
35+
$url="https://calendar.google.com/calendar/appointments/schedules/AcZssZ3pmcApaDP4xd8hvG5fy8ylxuFxD3akIRc5vpWJ60q-HemQi80SFFAVftbiIsq9pgiA2o8yvU56?gv=true"
36+
>
37+
<GiClockwork size={21} className="button-icon" />
38+
</Button>
39+
<Button $secondary className="banner-btn" title="Run Meshery"
40+
$url="/cloud-native-management/meshery/getting-started"
41+
>
42+
<FiDownloadCloud size={21} className="button-icon" />
43+
</Button>
44+
</Col>
45+
<Col $lg={6} $md={6} className="meshery-hero-img desc-text">
46+
<video autoPlay muted loop controls className="meshery-video" >
47+
<source src={mesheryDemo} type="video/webm" />
48+
</video>
49+
{/* <img className="meshery-sup-img" src={mesheryFullStack} alt="Meshery the multi-mesh manager" /> */}
50+
<Button $primary className="banner-btn align-btn"
51+
title="Star the Repository" $url="https://github.com/meshery/meshery" $external={true}
52+
>
53+
<FaGithub size={21} className="button-icon" />
54+
</Button>
55+
</Col>
56+
</Row>
57+
</div>
58+
<FeaturesTable />
59+
</Container>
60+
<FeaturesSection />
61+
<Container>
62+
<InlineQuotes
63+
quote="Meshery is the perfect tool for ensuring that your applications are optimally configured and performing well; it also gives you a fantastic visual insight into what can be a large amount of textual configuration"
64+
person="Nic Jackson"
65+
title="Principal Developer Advocate at HashiCorp"
66+
image={Nic}
67+
/>
68+
<div className="callout">
69+
<h1> Manage your clusters with features you won't find anywhere else.</h1>
70+
</div>
71+
</Container>
72+
<Features />
73+
<Container>
74+
<DockerExtensionCTA />
75+
<InlineQuotes
76+
quote="The Meshery Extension transforms Docker Desktop into a powerful load generation utility, conveniently enabling me to deploy and configure any cloud native infrastructure with a click of the button and invoke and control load-based performance tests from my desktop."
77+
person="Maximiliano Churichi"
78+
title="Software Engineer at HPE"
79+
image={Maximiliano}
80+
/>
81+
</Container>
82+
</div>
8183
</MesheryWrapper>
8284

8385
);

src/sections/Meshery/meshery.style.js

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,14 @@ const MesheryWrapper = styled.section`
66
overflow-x: hidden;
77
display: flex;
88
flex-direction: column;
9+
width: 100%;
10+
11+
> div:first-child {
12+
align-items: center;
13+
width: 100%;
14+
overflow-x: hidden;
15+
}
16+
917
.info {
1018
position: relative;
1119
overflow: hidden;

0 commit comments

Comments
 (0)