[web] interviews: tweak grid layout spacing

apps/web/src/components/interviews/company/InterviewsCompanyGuideListWithFilters.tsx

@@ -84,7 +84,7 @@ export default function InterviewsStudyListListWithFilters({
           />
         </div>
       ) : (
-        <div className="grid gap-6 md:grid-cols-2">
+        <div className="grid gap-4 md:grid-cols-2 xl:gap-6">
           {filteredCompanyGuides.map((companyGuide) => {
             const session = sessions.find(
               (session_) => session_.key === companyGuide.slug,

apps/web/src/components/interviews/dashboard/InterviewsDashboardContinueLearningSection.tsx

@@ -53,7 +53,7 @@ export default function InterviewsDashboardContinueLearningSection({
           id="wvGU2J"
         />
       </Heading>
-      <div className={clsx('grid gap-4 md:grid-cols-2')}>
+      <div className={clsx('grid gap-4 md:grid-cols-2 xl:gap-6')}>
         {items.map(({ completedCount, href, title, questionsCount }) => {
           const progressPercentage =
             Math.min(completedCount / Math.max(questionsCount, 1), 1) * 100;
@@ -62,7 +62,7 @@ export default function InterviewsDashboardContinueLearningSection({
             <div
               key={href}
               className={clsx(
-                'flex items-center justify-between gap-4 p-6',
+                'flex items-center justify-between gap-6 p-6',
                 'rounded-lg',
                 themeBackgroundCardWhiteOnLightColor,
                 ['border', themeBorderElementColor],

apps/web/src/components/interviews/dashboard/InterviewsDashboardRecommendedPreparationStrategy.tsx

@@ -72,7 +72,7 @@ function PreparationStrategyCard({ data }: { data: PreparationStrategyItem }) {
         themeBackgroundCardWhiteOnLightColor,
         ['border', themeBorderElementColor],
       )}>
-      <div className="flex flex-1 flex-col gap-6 md:flex-row md:items-center">
+      <div className="flex flex-1 flex-col gap-4 md:flex-row md:items-center">
         {customIcon
           ? customIcon
           : Icon && (

apps/web/src/components/interviews/dashboard/time-savers/InterviewsDashboardCompanySection.tsx

@@ -33,7 +33,7 @@ export default function InterviewsDashboardCompanySection({
         description: 'Title for prepare by company',
         id: 'kju3R1',
       })}>
-      <div className="grid gap-6 md:grid-cols-2">
+      <div className="grid gap-4 md:grid-cols-2 xl:gap-6">
         {companyGuides.map((companyGuide) => {
           const session = questionListSessions.find(
             (session_) => session_.key === companyGuide.slug,

apps/web/src/components/interviews/marketing/InterviewsMarketingCompaniesSection.tsx

@@ -65,7 +65,7 @@ export default function InterviewsMarketingCompaniesSection({
           )}>
           <div
             className={clsx(
-              'grid gap-6 md:grid-cols-2 lg:grid-cols-3',
+              'grid gap-4 md:grid-cols-2 lg:grid-cols-3 xl:gap-6',
               'w-full',
             )}>
             {companyGuides.slice(0, isTablet ? 8 : 9).map((companyGuide) => {

apps/web/src/components/interviews/marketing/InterviewsMarketingContactSection.tsx

@@ -153,7 +153,7 @@ export default function InterviewsMarketingContactSection() {
             <div
               className={clsx(
                 'grid grid-cols-1 md:grid-cols-2 lg:grid-cols-1',
-                'gap-x-6',
+                'gap-4 xl:gap-6',
                 '-py-5',
               )}>
               {data.map(({ key, label, icon: Icon, href, tooltip }) => (

apps/web/src/components/interviews/questions/listings/practice/InterviewsFrameworkAndLanguageSection.tsx

@@ -224,7 +224,7 @@ export default function InterviewsFrameworkAndLanguageSection({
           />
         </Text>
       </div>
-      <div className="grid gap-6 md:grid-cols-2">
+      <div className="grid gap-4 md:grid-cols-2 xl:gap-6">
         {frameworks.map((framework) => (
           <FrameworkCard key={framework.title} {...framework} />
         ))}

apps/web/src/components/ui/Navbar/Navbar.tsx

@@ -72,8 +72,8 @@ function Navbar(
         className,
       )}>
       <NavbarHeightStyles
-        hideOnDesktop={hideOnDesktop}
         borderHeight={bottomBorder ? 1 : 0}
+        hideOnDesktop={hideOnDesktop}
       />
       <div className="max-w-8xl mx-auto px-6">
         <div