2022-02-20 18:46:21 +01:00
|
|
|
import PageSizePicker from './pagesize-picker'
|
|
|
|
import OrientationPicker from './orientation-picker'
|
2022-02-20 19:29:14 +01:00
|
|
|
import PrintIcon from 'shared/components/icons/print'
|
|
|
|
import RightIcon from 'shared/components/icons/right'
|
2022-06-28 02:02:51 -05:00
|
|
|
import { useTranslation } from 'next-i18next'
|
2022-02-20 18:46:21 +01:00
|
|
|
|
|
|
|
const PrintLayoutSettings = props => {
|
2022-02-25 08:30:03 +01:00
|
|
|
if (!props.draft?.parts?.pages?.pages) return null
|
2022-02-20 19:29:14 +01:00
|
|
|
const { cols, rows, count } = props.draft.parts.pages.pages
|
2022-06-28 02:02:51 -05:00
|
|
|
const { t } = useTranslation(['workbench'])
|
2022-02-20 18:46:21 +01:00
|
|
|
|
|
|
|
return (
|
2022-02-20 19:29:14 +01:00
|
|
|
<div className="flex flex-row gap-8 justify-center">
|
2022-02-20 18:46:21 +01:00
|
|
|
<PageSizePicker {...props} />
|
|
|
|
<OrientationPicker {...props} />
|
2022-06-28 02:02:51 -05:00
|
|
|
<button
|
|
|
|
key="reset"
|
|
|
|
onClick={() => props.unsetGist('layout')}
|
|
|
|
className="btn btn-primary"
|
|
|
|
>
|
|
|
|
<span className="capitalize">
|
|
|
|
{t('reset')}
|
|
|
|
</span>
|
|
|
|
</button>
|
2022-02-20 19:29:14 +01:00
|
|
|
<div className="flex flex-row font-bold items-center px-0 text-xl">
|
|
|
|
<PrintIcon />
|
|
|
|
<span className="ml-2">{count}</span>
|
|
|
|
<span className="mx-6 opacity-50">|</span>
|
|
|
|
<RightIcon />
|
|
|
|
<span className="ml-2">{cols}</span>
|
|
|
|
<span className="mx-6 opacity-50">|</span>
|
|
|
|
<div className="rotate-90"><RightIcon /></div>
|
|
|
|
<span className="text-xl ml-2">{rows}</span>
|
|
|
|
</div>
|
2022-02-20 18:46:21 +01:00
|
|
|
</div>
|
|
|
|
)
|
|
|
|
}
|
|
|
|
|
|
|
|
export default PrintLayoutSettings
|