Changing webApp menu to be on the left

This commit is contained in:
nogafam.es Admin 2021-10-24 01:57:01 +02:00
parent 2df4b3f0ce
commit 34fca2f237
2 changed files with 25 additions and 12 deletions

View File

@ -10,23 +10,20 @@ import TrendsContainer from 'mastodon/features/getting_started/containers/trends
const NavigationPanel = () => (
<div className='navigation-panel'>
<NavLink className='column-link column-link--transparent' to='/home' data-preview-title-id='column.home' data-preview-icon='home' ><Icon className='column-link__icon' id='home' fixedWidth /><FormattedMessage id='tabs_bar.home' defaultMessage='Home' /></NavLink>
<NavLink className='column-link column-link--transparent' to='/notifications' data-preview-title-id='column.notifications' data-preview-icon='bell' ><NotificationsCounterIcon className='column-link__icon' /><FormattedMessage id='tabs_bar.notifications' defaultMessage='Notifications' /></NavLink>
<NavLink className='column-link column-link--transparent' to='/home' data-preview-title-id='column.home' data-preview-icon='home' ><FormattedMessage id='tabs_bar.home' defaultMessage='Home' /><Icon className='column-link__icon' id='home' fixedWidth /></NavLink>
<NavLink className='column-link column-link--transparent' to='/notifications' data-preview-title-id='column.notifications' data-preview-icon='bell' ><FormattedMessage id='tabs_bar.notifications' defaultMessage='Notifications' /><NotificationsCounterIcon className='column-link__icon' /></NavLink>
<FollowRequestsNavLink />
<NavLink className='column-link column-link--transparent' to='/public/local' data-preview-title-id='column.community' data-preview-icon='users' ><Icon className='column-link__icon' id='users' fixedWidth /><FormattedMessage id='tabs_bar.local_timeline' defaultMessage='Local' /></NavLink>
<NavLink className='column-link column-link--transparent' exact to='/public' data-preview-title-id='column.public' data-preview-icon='globe' ><Icon className='column-link__icon' id='globe' fixedWidth /><FormattedMessage id='tabs_bar.federated_timeline' defaultMessage='Federated' /></NavLink>
<NavLink className='column-link column-link--transparent' to='/conversations'><Icon className='column-link__icon' id='envelope' fixedWidth /><FormattedMessage id='navigation_bar.direct' defaultMessage='Direct messages' /></NavLink>
<NavLink className='column-link column-link--transparent' to='/favourites'><Icon className='column-link__icon' id='star' fixedWidth /><FormattedMessage id='navigation_bar.favourites' defaultMessage='Favourites' /></NavLink>
<NavLink className='column-link column-link--transparent' to='/bookmarks'><Icon className='column-link__icon' id='bookmark' fixedWidth /><FormattedMessage id='navigation_bar.bookmarks' defaultMessage='Bookmarks' /></NavLink>
<NavLink className='column-link column-link--transparent' to='/lists'><Icon className='column-link__icon' id='list-ul' fixedWidth /><FormattedMessage id='navigation_bar.lists' defaultMessage='Lists' /></NavLink>
{profile_directory && <NavLink className='column-link column-link--transparent' to='/directory'><Icon className='column-link__icon' id='address-book-o' fixedWidth /><FormattedMessage id='getting_started.directory' defaultMessage='Profile directory' /></NavLink>}
<NavLink className='column-link column-link--transparent' to='/public/local' data-preview-title-id='column.community' data-preview-icon='users' ><FormattedMessage id='tabs_bar.local_timeline' defaultMessage='Local' /><Icon className='column-link__icon' id='users' fixedWidth /></NavLink>
<NavLink className='column-link column-link--transparent' exact to='/public' data-preview-title-id='column.public' data-preview-icon='globe' ><FormattedMessage id='tabs_bar.federated_timeline' defaultMessage='Federated' /><Icon className='column-link__icon' id='globe' fixedWidth /></NavLink>
<NavLink className='column-link column-link--transparent' to='/conversations'><FormattedMessage id='navigation_bar.direct' defaultMessage='Direct messages' /><Icon className='column-link__icon' id='envelope' fixedWidth /></NavLink>
<NavLink className='column-link column-link--transparent' to='/favourites'><FormattedMessage id='navigation_bar.favourites' defaultMessage='Favourites' /><Icon className='column-link__icon' id='star' fixedWidth /></NavLink>
<NavLink className='column-link column-link--transparent' to='/bookmarks'><FormattedMessage id='navigation_bar.bookmarks' defaultMessage='Bookmarks' /><Icon className='column-link__icon' id='bookmark' fixedWidth /></NavLink>
<ListPanel />
<hr />
<a className='column-link column-link--transparent' href='/settings/preferences'><Icon className='column-link__icon' id='cog' fixedWidth /><FormattedMessage id='navigation_bar.preferences' defaultMessage='Preferences' /></a>
<a className='column-link column-link--transparent' href='/relationships'><Icon className='column-link__icon' id='users' fixedWidth /><FormattedMessage id='navigation_bar.follows_and_followers' defaultMessage='Follows and followers' /></a>
{showTrends && <div className='flex-spacer' />}
{showTrends && <TrendsContainer />}

View File

@ -2438,7 +2438,22 @@ a.account__display-name {
@media screen and (max-width: 600px + (285px * 2) + (10px * 2)) {
.columns-area__panels__pane--navigational {
display: none;
min-width: 4em !important;
.columns-area__panels__pane__inner {
width: 4em !important;
left: 0;
background: #fff;
z-index: 100;
}
.column-link > span {
display: none;
}
.column-link__icon {
margin-left: 0 !important;
}
}
}
@ -2890,6 +2905,7 @@ a.account__display-name {
font-size: 16px;
padding: 15px;
text-decoration: none;
text-align: right;
&:hover,
&:focus,
@ -2920,7 +2936,7 @@ a.account__display-name {
.column-link__icon {
display: inline-block;
margin-right: 5px;
margin-left: 5px;
}
.column-link__badge {