Issue #308: FIX sidebar responsive and resources boards cards on resources page

src/app/components/GroupCardsCollections.js

@@ -28,7 +28,7 @@ export default function GroupCardsCollections({ data, cardsPerRow, collectionId
 
     <div className="flex flex-col">
       <div className="mx-1 flex flex-col">
-        <div id="contentSize" className={`flex content flex-wrap max-sm:justify-center mb-4 max-sm:ml-0 gap-1 md:ml-0 gap-5 ${expanded ? "" : "overflow-y-hidden h-[270px]"}`}>
+        <div id="contentSize" className={`flex content flex-wrap max-sm:justify-center mb-4 max-sm:ml-0 md:ml-0 gap-6 pb-1 pl-1 ${expanded ? "" : "overflow-y-hidden h-[270px]"}`}>
 
         {data?.length !== 0 ? data?.sort((a,b) => a.position - b.position).map((item, index) => {
             return (
@@ -57,9 +57,7 @@ export default function GroupCardsCollections({ data, cardsPerRow, collectionId
         {/*mostra botão de ver mais caso os recursos de uma coleção cabem em mais de uma linha */}
         {showButton ?
           (
-            <button
-                fullWidth
-                disableElevation
+            <button                
                 variant="outlined"
                 className="group hover:bg-lightGray-HC-white text-darkGray-HC-white hover:text-darkGray-HC-dark transition-all duration-300 -ml-4 py-2 border-hidden rounded-xl normal-case flex justify-center items-center gap-2"
                 onClick={toggleContent}

src/app/components/InfiniteScrollCards.js

@@ -125,7 +125,7 @@ export default function InfiniteScrollCards({ data, searchClass, setNewSize, new
 
             case "LearningObject":
                 return (
-                    <div className="flex max-2xl:gap-4 flex-wrap ml-7 max-md:ml-0 max-md:justify-center">
+                    <div className="flex max-2xl:gap-4 gap-2 gap-y-4 flex-wrap ml-7 max-md:ml-0 max-md:justify-center">
                         {data?.map((item, index) => (
                             <Cards
                                 id={item['id']}

src/app/components/SideBar.js

@@ -150,7 +150,7 @@ export default function SideBar({ setFilterState, filterState }) {
       <NeedLoginModal open={needLoginOpen} setOpen={setNeedLoginOpen} />
 
       <div className="max-md:hidden min-h-0 overflow-y-auto flex flex-col text-darkGray-HC-white-underline font-light">
-        <div className="flex flex-col justify-start items-center gap-2 w-full mb-5">
+        <div className="flex flex-col justify-start items-center gap-1 w-full mb-5">
           {acessoRapido
           .filter(item => loggedIn || (item.title !== "Sair" && item.href !== "/perfil"))
           .map((item, index) => {
@@ -167,7 +167,7 @@ export default function SideBar({ setFilterState, filterState }) {
                 key={index}
                 alt={item.title}
                 title={item.title}
-                className={`aspect-square cursor-pointer hover:bg-lightGray-HC-white hover:text-darkGray-HC-dark-underline focus:bg-lightGray-HC-white text-center rounded-lg items-center justify-center pt-2 w-[53%] h-[53%]
+                className={`aspect-square cursor-pointer hover:bg-lightGray-HC-white hover:text-darkGray-HC-dark-underline focus:bg-lightGray-HC-white text-center rounded-lg pt-2 w-[60%] h-[68px]
                   ${(page === item.href) || (pathname.startsWith(item.href)) ? "bg-lightGray-HC-white text-darkGray-HC-dark-underline font-bold" : ""}
                 `}
               >