random-mirrors/gab-social
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Progress

Browse Source
This commit is contained in:
mgabdev
2020-02-03 13:24:24 -05:00
parent 960c43d24c
commit 1cd851e02e
51 changed files with 932 additions and 939 deletions
Download Patch File Download Diff File Expand all files Collapse all files

36
app/javascript/gabsocial/components/header/assets/gab_logo/gab_logo.js Normal file
View File

@@ -0,0 +1,36 @@
import './gab_logo.scss'
const GabLogo = ({
className = 'gab-logo',
width = '50px',
height = '30px',
viewBox = '0 0 50 30'
}) => (
<svg
className={className}
version='1.1'
xmlns='http://www.w3.org/2000/svg'
x='0px'
y='0px'
width={width}
height={height}
viewBox={viewBox}
xmlSpace='preserve'
>
<g>
<path className='gab-logo__path' d='M13.8,7.6h-2.4v0.7V9l-0.4-0.3C10.2,7.8,9,7.2,7.7,7.2c-0.2,0-0.4,0-0.4,0c-0.1,0-0.3,0-0.5,0
c-5.6,0.3-8.7,7.2-5.4,12.1c2.3,3.4,7.1,4.1,9.7,1.5l0.3-0.3l0,0.7c0,1-0.1,1.5-0.4,2.2c-1,2.4-4.1,3-6.8,1.3
c-0.2-0.1-0.4-0.2-0.4-0.2c-0.1,0.1-1.9,3.5-1.9,3.6c0,0.1,0.5,0.4,0.8,0.6c2.2,1.4,5.6,1.7,8.3,0.8c2.7-0.9,4.5-3.2,5-6.4
c0.2-1.1,0.2-0.8,0.2-8.4l0-7.1H13.8z M9.7,17.6c-2.2,1.2-4.9-0.4-4.9-2.9C4.8,12.6,7,11,9,11.6C11.8,12.4,12.3,16.1,9.7,17.6z'/>
<path className='gab-logo__path' d='M45.6,7.7c-2.4-1-5-0.6-6.7,1L38.6,9V4.5V0h-2.4h-2.4v11v11h2.4h2.4v-0.7v-0.7l0.3,0.3
c2.4,2.4,6.9,1.9,9.3-0.9C51.5,15.9,50.1,9.6,45.6,7.7z M43.7,17.5c-2.1,1.4-5.1-0.2-5.1-2.8c0-2.1,1.9-3.7,3.9-3.3
C45.4,12.1,46.2,15.8,43.7,17.5z'/>
<path className='gab-logo__path' d='M31.5,12.5c-0.7-3.7-3.1-5.5-7.1-5.3c-1.7,0.1-4,0.7-4.8,1.4l-0.1,0.1l0.7,1.7c0.4,0.9,0.7,1.7,0.7,1.7
c0,0,0.1,0,0.2-0.1c2.7-1.4,5.4-0.9,5.6,1.1l0,0.2l-0.4-0.1c-3-0.8-6.3-0.1-7.7,1.6c-1.8,2.2-0.9,5.8,1.7,7.1
c2.1,1,4.6,0.6,6.1-0.8l0.2-0.2v0.6v0.6h2.4h2.4v-4C31.7,13.7,31.7,13.3,31.5,12.5z M26.9,16.4c-0.1,0.7-0.5,1.5-1,2
c-1.2,1.1-3,0.7-3.2-0.7c-0.2-1,0.6-1.7,2-1.8c0.1,0,0.2,0,0.2,0c0,0,0.2,0,0.4,0c0.5,0,1,0.1,1.4,0.2l0.3,0.1L26.9,16.4z'/>
</g>
</svg>
)
export default GabLogo

9
app/javascript/gabsocial/components/header/assets/gab_logo/gab_logo.scss Normal file
View File

@@ -0,0 +1,9 @@
.gab-logo {
enable-background: new 0 0 50 30;
&__path {
fill-rule: evenodd;
clip-rule: evenodd;
fill: $gab-brand-default;
}
}

1
app/javascript/gabsocial/components/header/assets/gab_logo/index.js Normal file
View File

@@ -0,0 +1 @@
export { default } from './gab_logo';

29
app/javascript/gabsocial/components/header/assets/tabs_bar_icon/group_icon.js Normal file
View File

@@ -0,0 +1,29 @@
const GroupIcon = ({
className = 'header-nav__item__icon',
width = '26px',
height = '26px',
viewBox = '0 0 48 48'
}) => (
<svg
className={className}
version='1.1'
xmlns='http://www.w3.org/2000/svg'
x='0px'
y='0px'
width={width}
height={height}
viewBox={viewBox}
xmlSpace='preserve'
>
<g>
<path className='header-nav__item__icon__path' d="M 41 25 L 37 25 C 37 26 37 27 37 28 L 37 42 C 37 43 37 43 37 44 L 43 44 C 46 44 48 42 48 40 L 48 32 C 48 28 44 25 41 25 Z M 41 25"/>
<path className='header-nav__item__icon__path' d="M 10 28 C 10 27 10 26 10 25 L 6 25 C 3 25 0 28 0 32 L 0 40 C 0 42 1 44 4 44 L 10 44 C 10 43 10 43 10 42 Z M 10 28"/>
<path className='header-nav__item__icon__path' d="M 28 22 L 19 22 C 15 22 12 25 12 28 L 12 42 C 12 43 13 44 14 44 L 33 44 C 34 44 35 43 35 42 L 35 28 C 35 25 32 22 28 22 Z M 28 22"/>
<circle className='header-nav__item__icon__path' cx="8" cy="15" r="6"/>
<circle className='header-nav__item__icon__path' cx="24" cy="11" r="9"/>
<circle className='header-nav__item__icon__path' cx="40" cy="15" r="6"/>
</g>
</svg>
)
export default GroupIcon

24
app/javascript/gabsocial/components/header/assets/tabs_bar_icon/home_icon.js Normal file
View File

@@ -0,0 +1,24 @@
const HomeIcon = ({
className = 'header-nav__item__icon',
width = '26px',
height = '26px',
viewBox = '0 0 48 48'
}) => (
<svg
className={className}
version='1.1'
xmlns='http://www.w3.org/2000/svg'
x='0px'
y='0px'
width={width}
height={height}
viewBox={viewBox}
xmlSpace='preserve'
>
<g>
<path className='header-nav__item__icon__path' d='M 47.238281 21.695312 L 25.039062 0.417969 C 24.457031 -0.140625 23.542969 -0.140625 22.960938 0.417969 L 0.738281 21.71875 C 0.269531 22.1875 0 22.835938 0 23.5 C 0 24.878906 1.121094 26 2.5 26 L 6 26 L 6 45 C 6 46.65625 7.34375 48 9 48 L 17.5 48 C 18.328125 48 19 47.328125 19 46.5 L 19 33.5 C 19 33.226562 19.222656 33 19.5 33 L 28.5 33 C 28.773438 33 29 33.226562 29 33.5 L 29 46.5 C 29 47.328125 29.671875 48 30.5 48 L 39 48 C 40.65625 48 42 46.65625 42 45 L 42 26 L 45.5 26 C 46.878906 26 48 24.878906 48 23.5 C 48 22.835938 47.730469 22.1875 47.238281 21.695312 Z M 47.238281 21.695312' />
</g>
</svg>
)
export default HomeIcon

11
app/javascript/gabsocial/components/header/assets/tabs_bar_icon/index.js Normal file
View File

@@ -0,0 +1,11 @@
import GroupIcon from './group_icon';
import HomeIcon from './home_icon';
import NotificationsIcon from './notifications_icon';
import SearchIcon from './search_icon';
export {
GroupIcon,
HomeIcon,
NotificationsIcon,
SearchIcon,
}

26
app/javascript/gabsocial/components/header/assets/tabs_bar_icon/notifications_icon.js Normal file
View File

@@ -0,0 +1,26 @@
const NotificationsIcon = ({
className = 'header-nav__item__icon',
width = '26px',
height = '26px',
viewBox = '0 0 48 48'
}) => (
<svg
className={className}
version='1.1'
xmlns='http://www.w3.org/2000/svg'
x='0px'
y='0px'
width={width}
height={height}
viewBox={viewBox}
xmlSpace='preserve'
>
<g>
<path className='header-nav__item__icon__path header-nav__item__icon__path--fill' d='M 17 40 C 18 46 21 48 24 48 C 26 48 29 46 30 40 Z M 17 40' />
<path className='header-nav__item__icon__path header-nav__item__icon__path--fill' d='M 24 4 C 25 4 27 4 29 5 L 29 5 C 29 2 27 0 24 0 L 23 0 C 20 0 18 2 18 5 L 18 5 C 20 4 22 4 24 4 Z M 24 4' />
<path className='header-nav__item__icon__path' d='M 41 40 L 6 40 C 5 40 5 40 5 39 C 4 39 5 38 5 38 C 5 38 6 37 8 35 C 9 30 10 25 10 21 C 10 13 16 7 24 7 C 31 7 37 13 37 20 C 37 20 37 20 37 21 C 37 25 38 30 39 35 C 41 37 42 38 42 38 C 42 38 43 39 42 39 C 42 40 42 40 41 40 Z M 42 38 Z M 42 38' />
</g>
</svg>
)
export default NotificationsIcon

24
app/javascript/gabsocial/components/header/assets/tabs_bar_icon/search_icon.js Normal file
View File

@@ -0,0 +1,24 @@
const SearchIcon = ({
className = 'tabs-bar-icon',
width = '16px',
height = '16px',
viewBox = '0 0 48 48'
}) => (
<svg
className={className}
version='1.1'
xmlns='http://www.w3.org/2000/svg'
x='0px'
y='0px'
width={width}
height={height}
viewBox={viewBox}
xmlSpace='preserve'
>
<g>
<path className='tabs-bar-icon__path' d='M 47.414062 44.585938 L 33.761719 30.9375 C 36.40625 27.671875 38 23.519531 38 19 C 38 8.523438 29.476562 0 19 0 C 8.523438 0 0 8.523438 0 19 C 0 29.476562 8.523438 38 19 38 C 23.519531 38 27.667969 36.40625 30.9375 33.765625 L 44.585938 47.414062 C 44.976562 47.804688 45.488281 48 46 48 C 46.511719 48 47.023438 47.804688 47.414062 47.414062 C 48.195312 46.632812 48.195312 45.367188 47.414062 44.585938 Z M 19 34 C 10.726562 34 4 27.273438 4 19 C 4 10.726562 10.726562 4 19 4 C 27.273438 4 34 10.726562 34 19 C 34 27.273438 27.273438 34 19 34 Z M 19 34'/>
</g>
</svg>
)
export default SearchIcon

309
app/javascript/gabsocial/components/header/header.js Normal file
View File

@@ -0,0 +1,309 @@
import { Link, NavLink } from 'react-router-dom';
import ImmutablePropTypes from 'react-immutable-proptypes';
import ImmutablePureComponent from 'react-immutable-pure-component';
import { injectIntl, defineMessages } from 'react-intl';
import classNames from 'classnames';
import Avatar from '../avatar';
import IconButton from '../icon_button';
import Icon from '../icon';
import DisplayName from '../display_name';
import { closeSidebar } from '../../actions/sidebar';
import { shortNumberFormat } from '../../utils/numbers';
import { me } from '../../initial_state';
import { makeGetAccount } from '../../selectors';
import ProgressPanel from '../progress_panel';
import GabLogo from './assets/gab_logo';
import {
GroupIcon,
HomeIcon,
NotificationsIcon,
} from './assets/tabs_bar_icon';
console.log("header global - styles:", styles);
const messages = defineMessages({
followers: { id: 'account.followers', defaultMessage: 'Followers' },
follows: { id: 'account.follows', defaultMessage: 'Follows' },
profile: { id: 'account.profile', defaultMessage: 'Profile' },
preferences: { id: 'navigation_bar.preferences', defaultMessage: 'Preferences' },
follow_requests: { id: 'navigation_bar.follow_requests', defaultMessage: 'Follow requests' },
blocks: { id: 'navigation_bar.blocks', defaultMessage: 'Blocked users' },
domain_blocks: { id: 'navigation_bar.domain_blocks', defaultMessage: 'Hidden domains' },
mutes: { id: 'navigation_bar.mutes', defaultMessage: 'Muted users' },
filters: { id: 'navigation_bar.filters', defaultMessage: 'Muted words' },
logout: { id: 'navigation_bar.logout', defaultMessage: 'Logout' },
lists: { id: 'column.lists', defaultMessage: 'Lists', },
apps: { id: 'tabs_bar.apps', defaultMessage: 'Apps' },
more: { id: 'sidebar.more', defaultMessage: 'More' },
pro: { id: 'promo.gab_pro', defaultMessage: 'Upgrade to GabPRO' },
trends: { id: 'promo.trends', defaultMessage: 'Trends' },
search: { id: 'tabs_bar.search', defaultMessage: 'Search' },
shop: { id: 'tabs_bar.shop', defaultMessage: 'Store - Buy Merch' },
donate: { id: 'tabs_bar.donate', defaultMessage: 'Make a Donation' },
})
const mapStateToProps = state => {
const getAccount = makeGetAccount();
return {
account: getAccount(state, me),
sidebarOpen: state.get('sidebar').sidebarOpen,
};
};
const mapDispatchToProps = (dispatch) => ({
onClose() {
dispatch(closeSidebar());
},
});
export default @connect(mapStateToProps, mapDispatchToProps)
@injectIntl
class Header extends ImmutablePureComponent {
static propTypes = {
intl: PropTypes.object.isRequired,
account: ImmutablePropTypes.map,
sidebarOpen: PropTypes.bool,
onClose: PropTypes.func.isRequired,
};
state = {
moreOpen: false,
}
componentDidUpdate() {
if (!me) return;
if (this.props.sidebarOpen) {
document.body.classList.add('with-modals--active');
} else {
document.body.classList.remove('with-modals--active');
}
}
toggleMore = () => {
this.setState({
moreOpen: !this.state.moreOpen
});
}
handleSidebarClose = () => {
this.props.onClose();
this.setState({
moreOpen: false,
});
}
render() {
const { sidebarOpen, intl, account } = this.props;
const { moreOpen } = this.state;
if (!me || !account) return null;
const acct = account.get('acct');
const isPro = account.get('is_pro');
const classes = classNames('sidebar-menu__root', {
'sidebar-menu__root--visible': sidebarOpen,
});
const moreIcon = moreOpen ? 'minus' : 'plus';
const moreContainerStyle = { display: moreOpen ? 'block' : 'none' };
const sidebarItems = [
{
name: 'Home',
icon: <NotificationsIcon />,
to: '/',
},
{
name: 'Notifications',
icon: <NotificationsIcon />,
to: '/',
},
{
name: 'Groups',
icon: <NotificationsIcon />,
to: '/',
},
{
name: 'Lists',
icon: <NotificationsIcon />,
to: '/',
},
{
name: 'Chat',
icon: <NotificationsIcon />,
to: '/',
},
{
name: 'Trends',
icon: <NotificationsIcon />,
to: '/',
},
{
name: 'Profile',
icon: <NotificationsIcon />,
to: '/',
},
];
return (
<header role='banner' className={[styles.header].join(' ')}>
<div className='header__container'>
<div className='header-scrollarea'>
<div className='header-scrollarea__container'>
<h1 className='header__heading'>
<a className='header__heading__btn'>
<GabLogo />
</a>
</h1>
<nav className='header-nav'>
{
sidebarItems.map((sidebarItem, i) => {
return (
<NavLink to={sidebarItem.to} className='header-nav__item' key={`header-nav__item-${i}`}>
<div className='header-nav__item__block'>
{sidebarItem.icon}
<span className='header-nav__item__title'>{sidebarItem.name}</span>
</div>
</NavLink>
)
})
}
<a className='header-nav__item'>
<div className='header-nav__item__block'>
<NotificationsIcon />
<span className='header-nav__item__title'>More</span>
</div>
</a>
</nav>
</div>
</div>
</div>
</header>
)
return (
<div className={classes}>
<div className='sidebar-menu__wrapper' role='button' onClick={this.handleSidebarClose} />
<div className='sidebar-menu'>
<div className='sidebar-menu-header'>
<span className='sidebar-menu-header__title'>Account Info</span>
<IconButton title='close' onClick={this.handleSidebarClose} icon='close' className='sidebar-menu-header__btn' />
</div>
<div className='sidebar-menu__content'>
<div className='sidebar-menu-profile'>
<div className='sidebar-menu-profile__avatar'>
<Link to={`/${acct}`} title={acct} onClick={this.handleSidebarClose}>
<Avatar account={account} />
</Link>
</div>
<div className='sidebar-menu-profile__name'>
<DisplayName account={account} />
</div>
<div className='sidebar-menu-profile__stats'>
<NavLink className='sidebar-menu-profile-stat' to={`/${acct}/followers`} onClick={this.handleSidebarClose} title={intl.formatNumber(account.get('followers_count'))}>
<strong className='sidebar-menu-profile-stat__value'>{shortNumberFormat(account.get('followers_count'))}</strong>
<span className='sidebar-menu-profile-stat__label'>{intl.formatMessage(messages.followers)}</span>
</NavLink>
<NavLink className='sidebar-menu-profile-stat' to={`/${acct}/following`} onClick={this.handleSidebarClose} title={intl.formatNumber(account.get('following_count'))}>
<strong className='sidebar-menu-profile-stat__value'>{shortNumberFormat(account.get('following_count'))}</strong>
<span className='sidebar-menu-profile-stat__label'>{intl.formatMessage(messages.follows)}</span>
</NavLink>
</div>
</div>
<div className='sidebar-menu__section'>
<ProgressPanel />
</div>
<div className='sidebar-menu__section sidebar-menu__section--borderless'>
<NavLink className='sidebar-menu-item' to={`/${acct}`} onClick={this.handleSidebarClose}>
<Icon id='user' fixedWidth />
<span className='sidebar-menu-item__title'>{intl.formatMessage(messages.profile)}</span>
</NavLink>
{
!isPro &&
<a className='sidebar-menu-item' href='https://pro.gab.com'>
<Icon id='arrow-up' fixedWidth />
<span className='sidebar-menu-item__title'>{intl.formatMessage(messages.pro)}</span>
</a>
}
<a className='sidebar-menu-item' href='https://shop.dissenter.com/category/donations'>
<Icon id='heart' fixedWidth />
<span className='sidebar-menu-item__title'>{intl.formatMessage(messages.donate)}</span>
</a>
<a className='sidebar-menu-item' href='https://shop.dissenter.com'>
<Icon id='shopping-cart' fixedWidth />
<span className='sidebar-menu-item__title'>{intl.formatMessage(messages.shop)}</span>
</a>
<a className='sidebar-menu-item' href='https://trends.gab.com'>
<Icon id='signal' fixedWidth />
<span className='sidebar-menu-item__title'>{intl.formatMessage(messages.trends)}</span>
</a>
<NavLink className='sidebar-menu-item' to='/search' onClick={this.handleSidebarClose}>
<Icon id='search' fixedWidth />
<span className='sidebar-menu-item__title'>{intl.formatMessage(messages.search)}</span>
</NavLink>
<a className='sidebar-menu-item' href='/settings/preferences'>
<Icon id='cog' fixedWidth />
<span className='sidebar-menu-item__title'>{intl.formatMessage(messages.preferences)}</span>
</a>
</div>
<div className='sidebar-menu__section'>
<div className='sidebar-menu-item' onClick={this.toggleMore} role='button'>
<Icon id={moreIcon} fixedWidth />
<span className='sidebar-menu-item__title'>{intl.formatMessage(messages.more)}</span>
</div>
<div style={moreContainerStyle}>
<NavLink className='sidebar-menu-item' to='/lists' onClick={this.handleSidebarClose}>
<Icon id='list' fixedWidth />
<span className='sidebar-menu-item__title'>{intl.formatMessage(messages.lists)}</span>
</NavLink>
<NavLink className='sidebar-menu-item' to='/follow_requests' onClick={this.handleSidebarClose}>
<Icon id='user-plus' fixedWidth />
<span className='sidebar-menu-item__title'>{intl.formatMessage(messages.follow_requests)}</span>
</NavLink>
<NavLink className='sidebar-menu-item' to='/blocks' onClick={this.handleSidebarClose}>
<Icon id='ban' fixedWidth />
<span className='sidebar-menu-item__title'>{intl.formatMessage(messages.blocks)}</span>
</NavLink>
<NavLink className='sidebar-menu-item' to='/domain_blocks' onClick={this.handleSidebarClose}>
<Icon id='sitemap' fixedWidth />
<span className='sidebar-menu-item__title'>{intl.formatMessage(messages.domain_blocks)}</span>
</NavLink>
<NavLink className='sidebar-menu-item' to='/mutes' onClick={this.handleSidebarClose}>
<Icon id='times-circle' fixedWidth />
<span className='sidebar-menu-item__title'>{intl.formatMessage(messages.mutes)}</span>
</NavLink>
<a className='sidebar-menu-item' href='/filters'>
<Icon id='filter' fixedWidth />
<span className='sidebar-menu-item__title'>{intl.formatMessage(messages.filters)}</span>
</a>
</div>
</div>
<div className='sidebar-menu__section'>
<a className='sidebar-menu-item' href='/auth/sign_out' data-method='delete'>
<span className='sidebar-menu-item__title'>{intl.formatMessage(messages.logout)}</span>
</a>
</div>
</div>
</div>
</div>
);
}
}

285
app/javascript/gabsocial/components/header/header.scss Normal file
View File

@@ -0,0 +1,285 @@
.header {
display: flex;
flex-basis: auto;
flex-direction: column;
flex-shrink: 0;
flex-grow: 1;
align-items: flex-end;
z-index: 3;
&__container {
display: flex;
flex-basis: auto;
flex-direction: column;
flex-shrink: 0;
width: 275px;
}
&__heading {
display: flex;
width: 100%;
margin-top: 4px;
&__btn {
display: flex;
max-width: 100%;
padding: 10px;
cursor: pointer;
}
}
}
.header-scrollarea {
position: fixed;
height: 100%;
top: 0;
&__container {
display: flex;
width: 275px;
height: 100%;
padding-left: 20px;
padding-right: 20px;
flex-direction: column;
align-items: flex-start;
overflow: hidden;
overflow-y: scroll;
}
}
.header-nav {
display: flex;
width: 100%;
flex-direction: column;
&__item {
display: flex;
align-items: flex-start;
width: 100%;
flex-grow: 1;
height: 54px;
cursor: pointer;
text-decoration: none;
@include vertical-padding(4px);
&__block {
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
max-width: 100%;
padding: 10px;
border-radius: 27px;
}
&__icon {
@include size(26px);
&__path {
stroke: #fff;
fill: none;
stroke-width: 4px;
stroke-linecap: round;
&--fill {
stroke: none !important;
fill: #fff !important;
}
}
}
&__title {
overflow-wrap: break-word;
font-size: 19px;
color: #fff;
@include horizontal-margin(15px);
}
&:hover & {
&__block {
background-color: rgba($gab-brand-default, 0.25);
}
&__title {
color: $gab-brand-default;
}
}
}
}
// .sidebar-menu {
// display: flex;
// position: fixed;
// flex-direction: column;
// width: 275px;
// height: 100vh;
// top: 0;
// bottom: 0;
// left: 0;
// background: $gab-background-container;
// transform: translateX(-275px);
// transition: all 0.15s linear;
// z-index: 10001;
// body.theme-gabsocial-light & {
// background: $gab-background-container-light;
// }
// &__root {
// display: none;
// }
// &__wrapper {
// display: block;
// position: fixed;
// top: 0;
// left: 0;
// right: 0;
// bottom: 0;
// z-index: 10000;
// background-color: transparent;
// transition: background-color 0.2s linear;
// transition-delay: 0.1s;
// }
// &__content {
// display: flex;
// flex: 1 1;
// flex-direction: column;
// padding-bottom: 40px;
// overflow: hidden;
// overflow-y: scroll;
// -webkit-overflow-scrolling: touch;
// }
// &__section {
// display: block;
// margin: 4px 0;
// border-top: 1px solid lighten($ui-base-color, 4%);
// &--borderless {
// margin: 0;
// border-top: none;
// }
// }
// @media (max-width: 400px) {
// width: 90vw;
// }
// }
// .sidebar-menu__root--visible {
// display: block;
// .sidebar-menu {
// transform: translateX(0);
// }
// .sidebar-menu__wrapper {
// background-color: rgba(0,0,0,0.3);
// }
// }
// .sidebar-menu-header {
// display: flex;
// height: 46px;
// padding: 12px 14px;
// border-bottom: 1px solid lighten($ui-base-color, 4%);
// box-sizing: border-box;
// align-items: center;
// &__title {
// display: block;
// font-size: 18px;
// font-weight: 600;
// color: $primary-text-color;
// }
// &__btn {
// margin-left: auto;
// }
// }
// .sidebar-menu-profile {
// display: block;
// padding: 14px 18px;
// &__avatar {
// display: block;
// width: 56px;
// height: 56px;
// }
// &__name {
// display: block;
// margin-top: 10px;
// .display-name__account {
// display: block;
// margin-top: 2px;
// }
// }
// &__stats {
// display: flex;
// margin-top: 12px;
// }
// }
// .sidebar-menu-profile-stat {
// display: flex;
// font-size: 14px;
// text-decoration: none;
// &:not(:first-of-type) {
// margin-left: 18px;
// }
// &__value {
// display: flex;
// margin-right: 3px;
// font-weight: 700;
// color: $primary-text-color;
// }
// &__label {
// display: flex;
// color: $primary-text-color;
// }
// &:hover {
// text-decoration: underline;
// }
// }
// .sidebar-menu-item {
// display: flex;
// padding: 16px 18px;
// cursor: pointer;
// text-decoration: none;
// color: $primary-text-color;
// font-size: 15px;
// font-weight: 400;
// height: 50px;
// box-sizing: border-box;
// &:hover {
// background-color: rgba($gab-brand-default, 0.1);
// .fa {
// color: $primary-text-color;
// }
// }
// .fa {
// margin-right: 10px;
// }
// &:hover {
// &__title {
// color: $primary-text-color;
// }
// }
// }

1
app/javascript/gabsocial/components/header/index.js Normal file
View File

@@ -0,0 +1 @@
export { default } from './header';