Sha256: da0a55961229c104b3baaa7a4dca6f961983859463189c6f130d80e8436765c2

Contents?: true

Size: 1.05 KB

Versions: 100

Compression:

Stored size: 1.05 KB

Contents

/* @flow */

import React from 'react'
import classnames from 'classnames'

import DateTime from '../pb_kit/dateTime'
import { buildCss } from '../utilities/props'
import { globalProps } from '../utilities/globalProps'

import Body from '../pb_body/_body'
import Title from '../pb_title/_title'

type DateYearStackedProps = {
  align?: "left" | "center" | "right",
  className?: string | array<string>,
  dark?: boolean,
  data?: string,
  date: string,
  id?: string,
}

const DateYearStacked = (props: DateYearStackedProps) => {
  const { align = 'left', className, dark = false, date } = props
  const dateTimestamp = new DateTime({ value: date })
  const css = classnames(
    buildCss('pb_date_year_stacked', align),
    globalProps(props),
    className
  )

  return (
    <div className={css}>
      <Title
          dark={dark}
          size={4}
          text={`${dateTimestamp.toDay()} ${dateTimestamp
          .toMonth()
          .toUpperCase()}`}
      />
      <Body color="light">{dateTimestamp.toYear()}</Body>
    </div>
  )
}

export default DateYearStacked

Version data entries

100 entries across 100 versions & 1 rubygems

Version Path
playbook_ui-11.4.0.pre.alpha.rubytheme2 app/pb_kits/playbook/pb_date_year_stacked/_date_year_stacked.jsx
playbook_ui-11.4.0.pre.alpha.rubytheme1 app/pb_kits/playbook/pb_date_year_stacked/_date_year_stacked.jsx
playbook_ui-11.4.0 app/pb_kits/playbook/pb_date_year_stacked/_date_year_stacked.jsx
playbook_ui-11.3.0.pre.alpha2 app/pb_kits/playbook/pb_date_year_stacked/_date_year_stacked.jsx
playbook_ui-11.3.0.pre.alpha1 app/pb_kits/playbook/pb_date_year_stacked/_date_year_stacked.jsx
playbook_ui-11.3.0 app/pb_kits/playbook/pb_date_year_stacked/_date_year_stacked.jsx
playbook_ui-11.2.7 app/pb_kits/playbook/pb_date_year_stacked/_date_year_stacked.jsx
playbook_ui-11.2.6 app/pb_kits/playbook/pb_date_year_stacked/_date_year_stacked.jsx
playbook_ui-11.2.5 app/pb_kits/playbook/pb_date_year_stacked/_date_year_stacked.jsx
playbook_ui-11.2.4 app/pb_kits/playbook/pb_date_year_stacked/_date_year_stacked.jsx
playbook_ui-11.2.4.pre.alpha1 app/pb_kits/playbook/pb_date_year_stacked/_date_year_stacked.jsx
playbook_ui-11.2.3 app/pb_kits/playbook/pb_date_year_stacked/_date_year_stacked.jsx
playbook_ui-11.2.2 app/pb_kits/playbook/pb_date_year_stacked/_date_year_stacked.jsx
playbook_ui-11.2.1 app/pb_kits/playbook/pb_date_year_stacked/_date_year_stacked.jsx
playbook_ui-11.2.0 app/pb_kits/playbook/pb_date_year_stacked/_date_year_stacked.jsx
playbook_ui-11.1.2 app/pb_kits/playbook/pb_date_year_stacked/_date_year_stacked.jsx
playbook_ui-11.1.2.pre.alpha1 app/pb_kits/playbook/pb_date_year_stacked/_date_year_stacked.jsx
playbook_ui-11.1.1 app/pb_kits/playbook/pb_date_year_stacked/_date_year_stacked.jsx
playbook_ui-11.1.1.pre.alpha1 app/pb_kits/playbook/pb_date_year_stacked/_date_year_stacked.jsx
playbook_ui-11.1.0 app/pb_kits/playbook/pb_date_year_stacked/_date_year_stacked.jsx