diff --git a/src/components/Tooling/Content/AdditionalInfo/AdditionalInfo.tsx b/src/components/Tooling/Content/AdditionalInfo/AdditionalInfo.tsx index 40d515d7..e03c8333 100644 --- a/src/components/Tooling/Content/AdditionalInfo/AdditionalInfo.tsx +++ b/src/components/Tooling/Content/AdditionalInfo/AdditionalInfo.tsx @@ -31,7 +31,7 @@ const AdditionalInfo = ({ data, selectedTool, onClose }) => { fill-rule="evenodd" clip-rule="evenodd" d="M17.731 1.56775C18.0897 1.20911 18.0897 0.627628 17.731 0.268984C17.3724 -0.0896612 16.7909 -0.0896612 16.4322 0.268984L9 7.70123L1.56775 0.268984C1.20911 -0.0896611 0.627629 -0.0896611 0.268984 0.268984C-0.0896607 0.627628 -0.0896607 1.20911 0.268984 1.56775L7.70123 9L0.268984 16.4323C-0.0896612 16.7909 -0.0896612 17.3724 0.268984 17.731C0.627628 18.0897 1.20911 18.0897 1.56775 17.731L17.731 1.56775ZM12.0065 10.7078C11.6479 10.3491 11.0664 10.3491 10.7078 10.7078C10.3491 11.0664 10.3491 11.6479 10.7078 12.0065L16.4322 17.731C16.7909 18.0897 17.3724 18.0897 17.731 17.731C18.0897 17.3724 18.0897 16.7909 17.731 16.4322L12.0065 10.7078Z" - fill="black" + fill="currentColor" /> diff --git a/src/components/Tooling/Content/Content.module.css b/src/components/Tooling/Content/Content.module.css index f848b8fe..d84b42e7 100644 --- a/src/components/Tooling/Content/Content.module.css +++ b/src/components/Tooling/Content/Content.module.css @@ -2,11 +2,13 @@ border-radius: 27px; /* background: #fff8f3; */ padding: 30px; + margin-bottom: 30px; } .toolsList { display: grid; - grid-template-columns: 1fr 1fr; + grid-template-columns: 1fr minmax(424px, 1fr); + /* grid-template-columns: 8fr 2fr; */ gap: 30px; margin-top: 30px; } diff --git a/src/layouts/MainLayout.astro b/src/layouts/MainLayout.astro index f78e9fad..323d736b 100644 --- a/src/layouts/MainLayout.astro +++ b/src/layouts/MainLayout.astro @@ -137,15 +137,20 @@ changeLanguage(content.lang) margin-right: 20px; } - .wider-content { - grid-template-columns: minmax(230px, 2fr) 8fr 2fr; - } - #grid-right { grid-column: 3; display: flex; } } + + @media screen and (max-width: 90em) and (min-width: 72em) { + .wider-content { + grid-template-columns: 1fr minmax(0, 68vw); + } + .wider-content #grid-right { + display: none; + } + }