<commit_before>import React from 'react'
import styled from '@datapunt/asc-core'
import {
  breakpoint,
  styles,
  Link,
  Row,
  Column,
  Heading,
  themeColor,
  CompactThemeProvider,
} from '@datapunt/asc-ui'
import HighlightsBlock from './HighlightsBlock'
import NavigationLinksBlock from './NavigationLinksBlock'
import SpecialsBlock from './SpecialsBlock'
import OrganizationBlock from './OrganizationBlock'
import AboutBlock from './AboutBlock'
import FooterComponent from '../app/components/Footer/Footer'
import Header from '../app/components/Header'
import '../_styles.scss'
import '../../modules/atlas/atlas.scss'
import ShareBar from '../app/components/ShareBar/ShareBar'

const LandingPageStyle = styled.div`
  position: relative;
  @media screen and ${breakpoint('min-width', 'laptopM')} {
    margin: 0 24px;
  }

  .block {
    margin-top: 40px;
    @media screen and ${breakpoint('min-width', 'laptopM')} {
      margin-top: 80px;
    }
  }

  & > ${styles.RowStyle} {
    background-color: ${themeColor('tint', 'level1')};

    @media screen and ${breakpoint('min-width', 'laptopM')} {
      position: relative;

      &::after {
        content: '';
        background-color: ${themeColor('support', 'valid')};
        bottom: 0;
        display: block;
        position: absolute;
        right: -24px;
        top: 0;
        width: 24px;
      }
    }
  }
`

const StyledShareBar = styled(ShareBar)`
  margin-top: 56px;

  @media screen and ${breakpoint('max-width', 'laptopM')} {
    margin-top: 16px;
  }
`

const Subtiltle = styled(Heading)`
  padding-top: 56px;

  @media screen and ${breakpoint('max-width', 'laptopM')} {
    padding-top: 16px;
  }
`

const OverviewLink = styled(Link)`
  margin-top: 32px;
  padding: 8px 3px 8px 0;

  @media screen and ${breakpoint('max-width', 'tabletM')} {
    margin-top: 12px;
  }
`

const StyledFooter = styled(FooterComponent)`
  margin-top: 56px;
`

const StickyRow = styled(Row)`
  position: sticky;
  top: 0;
  z-index: 2;

  @media screen and ${breakpoint('min-width', 'laptopM')} {
    box-shadow: none;
    position: relative;
  }
`<commit_msg>DP-7094 fixed block distances<commit_after>import React from 'react'
import styled, { css } from '@datapunt/asc-core'
import {
  breakpoint,
  styles,
  Link,
  Row,
  Column,
  Heading,
  themeColor,
  CompactThemeProvider,
} from '@datapunt/asc-ui'
import HighlightsBlock from './HighlightsBlock'
import NavigationLinksBlock from './NavigationLinksBlock'
import SpecialsBlock from './SpecialsBlock'
import OrganizationBlock from './OrganizationBlock'
import AboutBlock from './AboutBlock'
import FooterComponent from '../app/components/Footer/Footer'
import Header from '../app/components/Header'
import '../_styles.scss'
import '../../modules/atlas/atlas.scss'
import ShareBar from '../app/components/ShareBar/ShareBar'

// Generates the top margin for the building blocks
const blockTopMargin = (offset = 0) => css`
  margin-top: ${40 - offset}px;
  @media screen and ${breakpoint('min-width', 'laptopM')} {
    margin-top: ${80 - offset}px;
  }
`

const LandingPageStyle = styled.div`
  position: relative;
  @media screen and ${breakpoint('min-width', 'laptopM')} {
    margin: 0 24px;
  }

  .block {
    ${blockTopMargin()}
  }

  & > ${styles.RowStyle} {
    background-color: ${themeColor('tint', 'level1')};

    @media screen and ${breakpoint('min-width', 'laptopM')} {
      position: relative;

      &::after {
        content: '';
        background-color: ${themeColor('support', 'valid')};
        bottom: 0;
        display: block;
        position: absolute;
        right: -24px;
        top: 0;
        width: 24px;
      }
    }
  }
`

const StyledShareBar = styled(ShareBar)`
  ${blockTopMargin(24)}
`

const Subtiltle = styled(Heading)`
  ${blockTopMargin(24)}
`

const OverviewLink = styled(Link)`
  margin-top: 32px;
  padding: 8px 3px 8px 0;

  @media screen and ${breakpoint('max-width', 'tabletM')} {
    margin-top: 12px;
  }
`

const StyledFooter = styled(FooterComponent)`
  margin-top: 72px;
`

const StickyRow = styled(Row)`
  position: sticky;
  top: 0;
  z-index: 2;

  @media screen and ${breakpoint('min-width', 'laptopM')} {
    box-shadow: none;
    position: relative;
  }
`
{'fraction_non_alphanumeric': 0.14943342776203966, 'fraction_numerical': 0.016288951841359773, 'mean_word_length': 3.4135416666666667, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 6, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '7366895', 'n_tokens_mistral': 1505, 'n_tokens_neox': 1422, 'n_words': 344}