import React, { FC } from 'react';
import styled from 'styled-components';

import { RendererProps } from './RendererProps';

const Div = styled.div<RendererProps>`
    font-family: PreplyInter;
    @supports (font-variation-settings: normal) {
        font-family: PreplyInterV;
    }
    line-height: ${({ value }) => value};
    font-size: 14px;
`;

export const RendererLineHeightPixels: FC<RendererProps> = ({ value }) => {
    return (
        <Div value={value}>
            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec massa nulla, suscipit id
            purus quis, facilisis tempus tortor. Praesent felis quam, tincidunt vitae libero ut,
            bibendum condimentum nunc.
        </Div>
    );
};