Merge branch 'master' into fix/blog-card-ui-cleanup

Xynash · web-flow · commit 7bfeaace5d73 · 2026-03-22T17:06:07.000+05:30
diff --git a/src/collections/handbook/repository-overview/repo-data.js b/src/collections/handbook/repository-overview/repo-data.js
@@ -48,7 +48,7 @@ export const repo_data = [
         project: "Meshery Documentation",
         image: meshery,
         site: "http://docs.meshery.io",
-        language: "Jekyll",
+        language: "Hugo",
         maintainers_name: ["Vacant"],
         link: [""],
         repository: "https://github.com/meshery/meshery/tree/master/docs",
diff --git a/src/collections/members/ritesh-karankal/index.mdx b/src/collections/members/ritesh-karankal/index.mdx
@@ -8,9 +8,7 @@ linkedin: riteshkarankal
 layer5: bf6a3e39-503c-4f58-b244-e5243cfb7cd5
 location: Chhattisgarh, India
 bio: Hi, I’m Ritesh Karankal I’m a CSE graduate, always curious and always learning with a focus on DevOps and related technologies.I’m passionate about contributing to open source, building distributed systems, exploring cloud-native tech, and diving into all things automation. Always excited to learn, share, and build cool stuff with the community.
-badges:
- - community
-status: Active
+status: Inactive
 emeritus: yes
 maintainer: no
 published: true
diff --git a/src/collections/sistent/components/select/code.mdx b/src/collections/sistent/components/select/code.mdx
@@ -11,7 +11,7 @@ import { FormControl, Select, MenuItem, InputLabel, OutlinedInput, ListSubheader
 export const BasicSelectCodeDemo = ({ variant, ...props }) => {
   return (
     <FormControl sx={{ width: "200px" }} variant={variant} {...props}>
-      <Select defaultValue={10} {...props}>
+      <Select MenuProps={{ disableScrollLock: true, marginThreshold: null }} defaultValue={10} {...props}>
         <MenuItem value={10}>Ten</MenuItem>
         <MenuItem value={20}>Twenty</MenuItem>
         <MenuItem value={30}>Thirty</MenuItem>
@@ -23,7 +23,7 @@ export const BasicSelectCodeDemo = ({ variant, ...props }) => {
 export const AutoWidthSelectCodeDemo = () => {
   return (
     <FormControl sx={{ minWidth: "120px" }}>
-      <Select defaultValue={10} autoWidth>
+      <Select MenuProps={{ disableScrollLock: true, marginThreshold: null }} defaultValue={10} autoWidth>
         <MenuItem value={10}>Ten</MenuItem>
         <MenuItem value={20}>Twenty</MenuItem>
         <MenuItem value={30}>Thirty</MenuItem>
@@ -35,7 +35,7 @@ export const AutoWidthSelectCodeDemo = () => {
 export const FullWidthSelectCodeDemo = () => {
   return (
     <FormControl fullWidth>
-      <Select defaultValue={10} fullWidth>
+      <Select MenuProps={{ disableScrollLock: true, marginThreshold: null }} defaultValue={10} fullWidth>
         <MenuItem value={10}>Ten</MenuItem>
         <MenuItem value={20}>Twenty</MenuItem>
         <MenuItem value={30}>Thirty</MenuItem>
@@ -48,7 +48,7 @@ export const LabelSelectCodeDemo = () => {
   return (
     <FormControl sx={{ width: "200px" }}>
       <InputLabel id="demo-select-label">Age</InputLabel>
-      <Select
+      <Select MenuProps={{ disableScrollLock: true, marginThreshold: null }}
         labelId="demo-select-label"
         id="demo-select"
         label="Age"
@@ -64,7 +64,7 @@ export const LabelSelectCodeDemo = () => {
 export const HelperSelectCodeDemo = () => {
   return (
     <FormControl sx={{ width: "200px" }}>
-      <Select defaultValue={10}>
+      <Select MenuProps={{ disableScrollLock: true, marginThreshold: null }} defaultValue={10}>
         <MenuItem value={10}>Ten</MenuItem>
         <MenuItem value={20}>Twenty</MenuItem>
         <MenuItem value={30}>Thirty</MenuItem>
@@ -78,7 +78,7 @@ export const PlaceholderSelectCodeDemo = () => {
   const [selectedAge, setSelectedAge] = useState("");
   return (
     <FormControl sx={{ width: "200px" }}>
-      <Select
+      <Select MenuProps={{ disableScrollLock: true, marginThreshold: null }}
         id="demo-select-placeholder"
         onChange={(e) => setSelectedAge(e.target.value)}
         renderValue={() => {
@@ -99,7 +99,7 @@ export const PlaceholderSelectCodeDemo = () => {
 export const GroupingSelectCodeDemo = () => {
   return (
     <FormControl sx={{ width: "200px" }}>
-      <Select defaultValue={10}>
+      <Select MenuProps={{ disableScrollLock: true, marginThreshold: null }} defaultValue={10}>
         <ListSubheader muiSkipListHighlight>Group 1</ListSubheader>
         <MenuItem value={10}>Ten</MenuItem>
         <MenuItem value={20}>Twenty</MenuItem>
@@ -118,14 +118,14 @@ export const BehaviorSelectCodeDemo = () => {
   return (
     <Grid container spacing={2} sx={{ justifyContent: "center" }}>
       <FormControl sx={{ width: "200px" }} disabled>
-        <Select defaultValue={10}>
+        <Select MenuProps={{ disableScrollLock: true, marginThreshold: null }} defaultValue={10}>
           <MenuItem value={10}>Ten</MenuItem>
           <MenuItem value={20}>Twenty</MenuItem>
           <MenuItem value={30}>Thirty</MenuItem>
         </Select>
       </FormControl>
       <FormControl sx={{ width: "200px" }} error>
-        <Select defaultValue={10}>
+        <Select MenuProps={{ disableScrollLock: true, marginThreshold: null }} defaultValue={10}>
           <MenuItem value={10}>Ten</MenuItem>
           <MenuItem value={20}>Twenty</MenuItem>
           <MenuItem value={30}>Thirty</MenuItem>
@@ -139,7 +139,7 @@ export const RequiredSelectCodeDemo = () => {
   return (
     <FormControl sx={{ width: "200px" }} required>
       <InputLabel id="demo-select-label-required">Age</InputLabel>
-      <Select
+      <Select MenuProps={{ disableScrollLock: true, marginThreshold: null }}
         labelId="demo-select-label-required"
         id="demo-select-required"
         label="Age"
@@ -159,7 +159,7 @@ export const MultipleSelectCodeDemo = () => {
   };
   return (
     <FormControl sx={{ width: "200px" }}>
-      <Select
+      <Select MenuProps={{ disableScrollLock: true, marginThreshold: null }}
         multiple
         input={<OutlinedInput label="Name" />}
         value={multipleAges}
diff --git a/src/collections/sistent/components/select/guidance.mdx b/src/collections/sistent/components/select/guidance.mdx
@@ -14,7 +14,7 @@ export const StateSelectDemo = (props) => {
   return (
     <FormControl sx={{ width: "200px" }} {...props}>
       <InputLabel id="demo-simple-select-state-label">Age</InputLabel>
-      <Select
+      <Select MenuProps={{ disableScrollLock: true, marginThreshold: null }}
         labelId="demo-simple-select-state-label"
         id="demo-simple-select-state"
         value={age}
@@ -43,7 +43,7 @@ export const HelperSelectDemo = () => {
     >
       <FormControl sx={{ width: "200px" }}>
         <InputLabel id="demo-select-label">Age</InputLabel>
-        <Select
+        <Select MenuProps={{ disableScrollLock: true, marginThreshold: null }}
           labelId="demo-select-label"
           id="demo-select"
           label="Age"
@@ -55,7 +55,7 @@ export const HelperSelectDemo = () => {
         <FormHelperText>With label + Helper text</FormHelperText>
       </FormControl>
       <FormControl sx={{ width: "200px" }}>
-        <Select id="demo-select-without-label">
+        <Select MenuProps={{ disableScrollLock: true, marginThreshold: null }} id="demo-select-without-label">
           <MenuItem value={10}>Ten</MenuItem>
           <MenuItem value={20}>Twenty</MenuItem>
           <MenuItem value={30}>Thirty</MenuItem>
@@ -71,7 +71,7 @@ export const PlaceholderSelectDemo = () => {
   const handleChange = (event) => setAge(event.target.value);
   return (
     <FormControl sx={{ width: "200px" }}>
-      <Select
+      <Select MenuProps={{ disableScrollLock: true, marginThreshold: null }}
         id="demo-select-placeholder"
         value={age}
         onChange={handleChange}
@@ -95,7 +95,7 @@ export const GroupingSelectDemo = () => {
   return (
     <FormControl sx={{ width: "200px" }}>
       <InputLabel id="demo-select-label-grouped">Age</InputLabel>
-      <Select
+      <Select MenuProps={{ disableScrollLock: true, marginThreshold: null }}
         labelId="demo-select-label-grouped"
         id="demo-select-grouped"
         label="Age"
@@ -123,7 +123,7 @@ export const MultipleSelectDemo = () => {
   return (
     <FormControl sx={{ width: "200px" }}>
       <InputLabel id="demo-multiple-name-label">Age</InputLabel>
-      <Select
+      <Select MenuProps={{ disableScrollLock: true, marginThreshold: null }}
         multiple
         labelId="demo-multiple-name-label"
         id="demo-multiple-name"
diff --git a/src/collections/sistent/components/select/index.mdx b/src/collections/sistent/components/select/index.mdx
@@ -16,7 +16,7 @@ export const BasicSelectDemo = ({ variant, ...props }) => {
   return (
     <FormControl sx={{ width: "200px" }} variant={variant} {...props}>
       <InputLabel id={labelId}>Age</InputLabel>
-      <Select
+      <Select MenuProps={{ disableScrollLock: true, marginThreshold: null }}
         labelId={labelId}
         id={`demo-select-${variant || 'outlined'}`}
         value={age}
@@ -37,7 +37,7 @@ export const AutoWidthSelectDemo = () => {
   return (
     <FormControl sx={{ minWidth: "120px", m: 1 }}>
       <InputLabel id="demo-simple-select-autowidth-label">Age</InputLabel>
-      <Select
+      <Select MenuProps={{ disableScrollLock: true, marginThreshold: null }}
         labelId="demo-simple-select-autowidth-label"
         id="demo-simple-select-autowidth"
         value={age}
@@ -59,7 +59,7 @@ export const SmallSelectDemo = () => {
   return (
     <FormControl sx={{ minWidth: "80px", m: 1 }} size="small">
       <InputLabel id="demo-simple-select-small-label">Age</InputLabel>
-      <Select
+      <Select MenuProps={{ disableScrollLock: true, marginThreshold: null }}
         labelId="demo-simple-select-small-label"
         id="demo-simple-select-small"
         value={age}
@@ -80,7 +80,7 @@ export const FullWidthSelectDemo = () => {
   return (
     <FormControl fullWidth sx={{ m: 1 }}>
       <InputLabel id="demo-simple-select-fullwidth-label">Age</InputLabel>
-      <Select
+      <Select MenuProps={{ disableScrollLock: true, marginThreshold: null }}
         labelId="demo-simple-select-fullwidth-label"
         id="demo-simple-select-fullwidth"
         value={age}
@@ -104,7 +104,7 @@ export const MultipleSelectDemo = () => {
   return (
     <FormControl sx={{ width: "200px" }}>
       <InputLabel id="demo-multiple-name-label">Age</InputLabel>
-      <Select
+      <Select MenuProps={{ disableScrollLock: true, marginThreshold: null }}
         labelId="demo-multiple-name-label"
         id="demo-multiple-name"
         multiple
diff --git a/src/components/Card/Card.style.js b/src/components/Card/Card.style.js
@@ -60,16 +60,29 @@ export const CardWrapper = styled.div`
 
     .gatsby-image-wrapper,
     .old-gatsby-image-wrapper {
+      width: 100%;
       height: 100%;
-      margin-top: 0.2rem;
+      margin-top: 0;
       transition: all 0.3s ease-in;
+      display: flex;
+      align-items: center;
+      justify-content: center;
     }
-    img {
-      height: inherit;
-      max-height: 180px;
+
+    .gatsby-image-wrapper img,
+    .old-gatsby-image-wrapper img {
+      max-width: 100%;
+      max-height: 100%;
+      width: auto;
+      height: auto;
       display: block;
-      text-align: center;
-      margin: auto;
+      object-fit: contain;
+      object-position: center;
+      margin: 0 auto;
+    }
+
+    @media screen and (max-width: 768px) {
+      height: 9.5rem;
     }
   }
 
