-
Notifications
You must be signed in to change notification settings - Fork 4.7k
Site editor sidebar: home template details #51223
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Changes from 25 commits
ffa68fe
bbdecb2
69a7c26
c869804
d7b7519
d857c7a
4859f0e
bed5420
4970d48
4860c8f
076d6cb
d0679a7
09601a6
6096d07
8b37c3c
374bb50
484e981
1316ff9
0c8f0b6
dfe8f75
424cec1
aa2af8e
88787ed
90c3d79
a7d95ff
2ade33c
File filter
Filter by extension
Conversations
Jump to
Diff view
Diff view
There are no files selected for viewing
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,39 @@ | ||
| /** | ||
| * WordPress dependencies | ||
| */ | ||
| import { __, sprintf } from '@wordpress/i18n'; | ||
| import { humanTimeDiff } from '@wordpress/date'; | ||
| import { createInterpolateElement } from '@wordpress/element'; | ||
|
|
||
| /** | ||
| * Internal dependencies | ||
| */ | ||
| import { | ||
| SidebarNavigationScreenDetailsPanelRow, | ||
| SidebarNavigationScreenDetailsPanelLabel, | ||
| SidebarNavigationScreenDetailsPanelValue, | ||
| } from '../sidebar-navigation-screen-details-panel'; | ||
|
|
||
| export default function SidebarNavigationScreenDetailsFooter( { | ||
| lastModifiedDateTime, | ||
|
||
| } ) { | ||
| return ( | ||
| <SidebarNavigationScreenDetailsPanelRow className="edit-site-sidebar-navigation-screen-details-footer"> | ||
| <SidebarNavigationScreenDetailsPanelLabel> | ||
| { __( 'Last modified' ) } | ||
| </SidebarNavigationScreenDetailsPanelLabel> | ||
| <SidebarNavigationScreenDetailsPanelValue> | ||
| { createInterpolateElement( | ||
| sprintf( | ||
| /* translators: %s: is the relative time when the post was last modified. */ | ||
| __( '<time>%s</time>' ), | ||
| humanTimeDiff( lastModifiedDateTime ) | ||
| ), | ||
| { | ||
| time: <time dateTime={ lastModifiedDateTime } />, | ||
| } | ||
| ) } | ||
| </SidebarNavigationScreenDetailsPanelValue> | ||
| </SidebarNavigationScreenDetailsPanelRow> | ||
| ); | ||
| } | ||
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,5 @@ | ||
| .edit-site-sidebar-navigation-screen-details-footer { | ||
| padding-top: $grid-unit-10; | ||
| padding-bottom: $grid-unit-10; | ||
| padding-left: $grid-unit-20; | ||
| } |
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,40 @@ | ||
| /** | ||
| * WordPress dependencies | ||
| */ | ||
| import { | ||
| __experimentalVStack as VStack, | ||
| __experimentalHeading as Heading, | ||
| } from '@wordpress/components'; | ||
|
|
||
| /** | ||
| * Internal dependencies | ||
| */ | ||
| import SidebarNavigationScreenDetailsPanelLabel from './sidebar-navigation-screen-details-panel-label'; | ||
| import SidebarNavigationScreenDetailsPanelRow from './sidebar-navigation-screen-details-panel-row'; | ||
| import SidebarNavigationScreenDetailsPanelValue from './sidebar-navigation-screen-details-panel-value'; | ||
|
|
||
| function SidebarNavigationScreenDetailsPanel( { title, children, spacing } ) { | ||
| return ( | ||
| <VStack | ||
| className="edit-site-sidebar-navigation-details-screen-panel" | ||
| spacing={ spacing } | ||
| > | ||
| { title && ( | ||
| <Heading | ||
| className="edit-site-sidebar-navigation-details-screen-panel__heading" | ||
| level={ 3 } | ||
| > | ||
| { title } | ||
| </Heading> | ||
| ) } | ||
| { children } | ||
| </VStack> | ||
| ); | ||
| } | ||
|
|
||
| export { | ||
| SidebarNavigationScreenDetailsPanel, | ||
| SidebarNavigationScreenDetailsPanelRow, | ||
| SidebarNavigationScreenDetailsPanelLabel, | ||
| SidebarNavigationScreenDetailsPanelValue, | ||
| }; |
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,14 @@ | ||
| /** | ||
| * WordPress dependencies | ||
| */ | ||
| import { __experimentalText as Text } from '@wordpress/components'; | ||
|
|
||
| export default function SidebarNavigationScreenDetailsPanelLabel( { | ||
| children, | ||
| } ) { | ||
| return ( | ||
| <Text className="edit-site-sidebar-navigation-details-screen-panel__label"> | ||
| { children } | ||
| </Text> | ||
| ); | ||
| } |
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,29 @@ | ||
| /** | ||
| * External dependencies | ||
| */ | ||
| import classnames from 'classnames'; | ||
|
|
||
| /** | ||
| * WordPress dependencies | ||
| */ | ||
| import { __experimentalHStack as HStack } from '@wordpress/components'; | ||
|
|
||
| export default function SidebarNavigationScreenDetailsPanelRow( { | ||
| label, | ||
| children, | ||
| className, | ||
| } ) { | ||
| return ( | ||
| <HStack | ||
| key={ label } | ||
| spacing={ 5 } | ||
| alignment="left" | ||
| className={ classnames( | ||
| 'edit-site-sidebar-navigation-details-screen-panel__row', | ||
| className | ||
| ) } | ||
| > | ||
| { children } | ||
| </HStack> | ||
| ); | ||
| } |
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,14 @@ | ||
| /** | ||
| * WordPress dependencies | ||
| */ | ||
| import { __experimentalText as Text } from '@wordpress/components'; | ||
|
|
||
| export default function SidebarNavigationScreenDetailsPanelValue( { | ||
| children, | ||
| } ) { | ||
| return ( | ||
| <Text className="edit-site-sidebar-navigation-details-screen-panel__value"> | ||
| { children } | ||
| </Text> | ||
| ); | ||
| } |
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,25 @@ | ||
| .edit-site-sidebar-navigation-details-screen-panel { | ||
| margin-bottom: $grid-unit-30; | ||
|
|
||
| &:last-of-type { | ||
| margin-bottom: 0; | ||
| } | ||
|
|
||
| .edit-site-sidebar-navigation-details-screen-panel__heading { | ||
| color: $gray-400; | ||
| text-transform: uppercase; | ||
| font-weight: 500; | ||
| font-size: 11px; | ||
| padding: 0; | ||
| margin-bottom: 0; | ||
| } | ||
| } | ||
|
|
||
| .edit-site-sidebar-navigation-details-screen-panel__label.edit-site-sidebar-navigation-details-screen-panel__label { | ||
| color: $gray-600; | ||
| width: 100px; | ||
| } | ||
|
|
||
| .edit-site-sidebar-navigation-details-screen-panel__value.edit-site-sidebar-navigation-details-screen-panel__value { | ||
| color: $gray-200; | ||
| } |
Uh oh!
There was an error while loading. Please reload this page.