Progress
This commit is contained in:
mgabdev
parent
1cd851e02e
commit
df346596cf
@ -7,7 +7,7 @@ class HomeController < ApplicationController
|
||||
before_action :set_data_for_meta
|
||||
|
||||
def index
|
||||
@body_classes = 'app-body'
|
||||
#
|
||||
end
|
||||
|
||||
private
|
||||
|
||||
@ -1,13 +1,11 @@
|
||||
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'
|
||||
@ -18,14 +16,14 @@ const GabLogo = ({
|
||||
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
|
||||
<path className={styles.fillColorBrand} 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
|
||||
<path className={styles.fillColorBrand} 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
|
||||
<path className={styles.fillColorBrand} 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'/>
|
||||
65
app/javascript/gabsocial/components/header/header.js → app/javascript/gabsocial/components/header.js
65
app/javascript/gabsocial/components/header/header.js → app/javascript/gabsocial/components/header.js
@ -3,15 +3,15 @@ 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 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,
|
||||
@ -19,8 +19,6 @@ import {
|
||||
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' },
|
||||
@ -120,17 +118,17 @@ class Header extends ImmutablePureComponent {
|
||||
{
|
||||
name: 'Notifications',
|
||||
icon: <NotificationsIcon />,
|
||||
to: '/',
|
||||
to: '/notifications',
|
||||
},
|
||||
{
|
||||
name: 'Groups',
|
||||
icon: <NotificationsIcon />,
|
||||
to: '/',
|
||||
to: '/groups',
|
||||
},
|
||||
{
|
||||
name: 'Lists',
|
||||
icon: <NotificationsIcon />,
|
||||
to: '/',
|
||||
to: '/lists',
|
||||
},
|
||||
{
|
||||
name: 'Chat',
|
||||
@ -150,37 +148,34 @@ class Header extends ImmutablePureComponent {
|
||||
];
|
||||
|
||||
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'>
|
||||
<header role='banner' className={[styles.default, styles.flexGrow1, styles.z3, styles.alignItemsEnd].join(' ')}>
|
||||
<div className={[styles.default, styles.width275PX].join(' ')}>
|
||||
<div className={[styles.default, styles.positionFixed, styles.top0, styles.height100PC].join(' ')}>
|
||||
<div className={[styles.default, styles.height100PC, styles.width275PX, styles.paddingHorizontal20PX].join(' ')}>
|
||||
<h1 className={[styles.default].join(' ')}>
|
||||
<NavLink to='/' aria-label='Gab' className={[styles.default, styles.noSelect, styles.noUnderline, styles.height50PX, styles.justifyContentCenter, styles.cursorPointer, styles.paddingHoizontal10PX].join(' ')}>
|
||||
<GabLogo />
|
||||
</a>
|
||||
</NavLink>
|
||||
</h1>
|
||||
<nav className='header-nav'>
|
||||
|
||||
<nav aria-label='Primary' role='navigation' className={[styles.default, styles.width100PC].join(' ')}>
|
||||
{
|
||||
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>
|
||||
<NavLink to={sidebarItem.to} key={`header-nav-item-${i}`} className={[styles.default, styles.noUnderline, styles.cursorPointer, styles.width100PC, styles.alignItemsStart, styles.flexGrow1].join(' ')}>
|
||||
<div className={[styles.default, styles.maxWidth100PC, styles.flexRow, styles.paddingVertical10PX, styles.paddingHoizontal10PX, styles.circle, styles.alignItemsCenter].join(' ')}>
|
||||
<div className={[styles.default]}>
|
||||
{sidebarItem.icon}
|
||||
</div>
|
||||
<div className={[styles.default, styles.paddingHorizontal20PX, styles.textOverflowEllipsis, styles.overflowWrapBreakWord, styles.displayInline].join(' ')}>
|
||||
<span className={[styles.default, styles.fontWeightBold, styles.fontSize19PX, styles.text].join(' ')}>
|
||||
{sidebarItem.name}
|
||||
</span>
|
||||
</div>
|
||||
</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>
|
||||
@ -1,285 +0,0 @@
|
||||
.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 +0,0 @@
|
||||
export { default } from './header';
|
||||
161
app/javascript/gabsocial/components/link_footer.js
Normal file
161
app/javascript/gabsocial/components/link_footer.js
Normal file
@ -0,0 +1,161 @@
|
||||
import moment from 'moment'
|
||||
import classNames from 'classnames/bind'
|
||||
import {
|
||||
defineMessages,
|
||||
injectIntl,
|
||||
} from 'react-intl'
|
||||
import { openModal } from '../actions/modal'
|
||||
import {
|
||||
version,
|
||||
repository,
|
||||
source_url,
|
||||
me,
|
||||
} from '../initial_state'
|
||||
|
||||
const messages = defineMessages({
|
||||
invite: { id: 'getting_started.invite', defaultMessage: 'Invite people' },
|
||||
hotkeys: { id: 'navigation_bar.keyboard_shortcuts', defaultMessage: 'Hotkeys' },
|
||||
security: { id: 'getting_started.security', defaultMessage: 'Security' },
|
||||
about: { id: 'navigation_bar.info', defaultMessage: 'About' },
|
||||
developers: { id: 'getting_started.developers', defaultMessage: 'Developers' },
|
||||
terms: { id: 'getting_started.terms', defaultMessage: 'Terms of Service' },
|
||||
dmca: { id: 'getting_started.dmca', defaultMessage: 'DMCA' },
|
||||
terms: { id: 'getting_started.terms_of_sale', defaultMessage: 'Terms of Sale' },
|
||||
privacy: { id: 'getting_started.privacy', defaultMessage: 'Privacy Policy' },
|
||||
logout: { id: 'navigation_bar.logout', defaultMessage: 'Logout' },
|
||||
notice: { id: 'getting_started.open_source_notice', defaultMessage: 'Gab Social is open source software. You can contribute or report issues on our self-hosted GitLab at {gitlab}.' },
|
||||
})
|
||||
|
||||
const mapDispatchToProps = (dispatch) => ({
|
||||
onOpenHotkeys() {
|
||||
dispatch(openModal('HOTKEYS'))
|
||||
},
|
||||
})
|
||||
|
||||
export default @connect(null, mapDispatchToProps)
|
||||
@injectIntl
|
||||
class LinkFooter extends PureComponent {
|
||||
|
||||
static propTypes = {
|
||||
intl: PropTypes.object.isRequired,
|
||||
onOpenHotkeys: PropTypes.func.isRequired,
|
||||
}
|
||||
|
||||
state = {
|
||||
hoveringItemIndex: null,
|
||||
}
|
||||
|
||||
onMouseEnterLinkFooterItem = (i) => {
|
||||
this.setState({
|
||||
hoveringItemIndex: i,
|
||||
})
|
||||
}
|
||||
|
||||
onMouseLeaveLinkFooterItem = () => {
|
||||
this.setState({
|
||||
hoveringItemIndex: null,
|
||||
})
|
||||
}
|
||||
|
||||
render() {
|
||||
const { onOpenHotkeys, intl } = this.props
|
||||
const { hoveringItemIndex } = this.state
|
||||
|
||||
const cx = classNames.bind(styles);
|
||||
|
||||
const currentYear = moment().format('YYYY')
|
||||
|
||||
const linkFooterItems = [
|
||||
{
|
||||
to: '#',
|
||||
onClick: onOpenHotkeys,
|
||||
text: intl.formatMessage(messages.hotkeys),
|
||||
requiresUser: true,
|
||||
},
|
||||
{
|
||||
to: '/auth/edit',
|
||||
text: intl.formatMessage(messages.security),
|
||||
requiresUser: true,
|
||||
},
|
||||
{
|
||||
to: '/about',
|
||||
text: intl.formatMessage(messages.about),
|
||||
},
|
||||
{
|
||||
to: '/settings/applications',
|
||||
text: intl.formatMessage(messages.developers),
|
||||
},
|
||||
{
|
||||
to: '/about/tos',
|
||||
text: intl.formatMessage(messages.terms),
|
||||
},
|
||||
{
|
||||
to: '/about/dmca',
|
||||
text: intl.formatMessage(messages.dmca),
|
||||
},
|
||||
{
|
||||
to: '/about/sales',
|
||||
text: intl.formatMessage(messages.terms),
|
||||
},
|
||||
{
|
||||
to: '/about/privacy',
|
||||
text: intl.formatMessage(messages.privacy),
|
||||
},
|
||||
{
|
||||
to: '/auth/sign_out',
|
||||
text: intl.formatMessage(messages.logout),
|
||||
requiresUser: true,
|
||||
logout: true,
|
||||
},
|
||||
]
|
||||
|
||||
return (
|
||||
<div className={styles.default}>
|
||||
<nav aria-label='Footer' role='navigation' className={[styles.default, styles.flexWrap, styles.flexRow].join(' ')}>
|
||||
{
|
||||
linkFooterItems.map((linkFooterItem, i) => {
|
||||
if (linkFooterItem.requiresUser && !me) return null
|
||||
const classes = cx({
|
||||
default: 1,
|
||||
fontSize13PX: 1,
|
||||
text: 1,
|
||||
marginVertical5PX: 1,
|
||||
paddingRight15PX: 1,
|
||||
colorSubtle: i !== hoveringItemIndex,
|
||||
noUnderline: i !== hoveringItemIndex,
|
||||
colorBlack: i === hoveringItemIndex,
|
||||
underline: i === hoveringItemIndex,
|
||||
})
|
||||
return (
|
||||
<a
|
||||
key={`link-footer-item-${i}`}
|
||||
href={linkFooterItem.to}
|
||||
data-method={linkFooterItem.logout ? 'delete' : null}
|
||||
onClick={linkFooterItem.onClick || null}
|
||||
onMouseEnter={() => this.onMouseEnterLinkFooterItem(i)}
|
||||
onMouseLeave={() => this.onMouseLeaveLinkFooterItem(i)}
|
||||
className={classes}
|
||||
>
|
||||
{linkFooterItem.text}
|
||||
</a>
|
||||
)
|
||||
})
|
||||
}
|
||||
</nav>
|
||||
|
||||
<p>
|
||||
{intl.formatMessage(messages.invite, {
|
||||
gitlab: (
|
||||
<span>
|
||||
<a href={source_url} rel='noopener' target='_blank'>{repository}</a>
|
||||
(v{version})
|
||||
</span>
|
||||
)
|
||||
})}
|
||||
</p>
|
||||
<p>© {currentYear} Gab AI Inc.</p>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
}
|
||||
@ -1 +0,0 @@
|
||||
export { default } from './link_footer';
|
||||
@ -1,64 +0,0 @@
|
||||
import { defineMessages, injectIntl } from 'react-intl';
|
||||
import { openModal } from '../../actions/modal';
|
||||
import { invitesEnabled, version, repository, source_url, me } from '../../initial_state';
|
||||
|
||||
import './link_footer.scss';
|
||||
|
||||
const messages = defineMessages({
|
||||
invite: { id:'getting_started.invite', defaultMessage: 'Invite people' },
|
||||
hotkeys: { id: 'navigation_bar.keyboard_shortcuts', defaultMessage: 'Hotkeys' },
|
||||
security: { id: 'getting_started.security', defaultMessage: 'Security' },
|
||||
about: { id: 'navigation_bar.info', defaultMessage: 'About' },
|
||||
developers: { id: 'getting_started.developers', defaultMessage: 'Developers' },
|
||||
terms: { id: 'getting_started.terms', defaultMessage: 'Terms of Service' },
|
||||
dmca: { id: 'getting_started.dmca', defaultMessage: 'DMCA' },
|
||||
terms: { id: 'getting_started.terms_of_sale', defaultMessage: 'Terms of Sale' },
|
||||
privacy: { id: 'getting_started.privacy', defaultMessage: 'Privacy Policy' },
|
||||
logout: { id: 'navigation_bar.logout', defaultMessage: 'Logout' },
|
||||
notice: { id: 'getting_started.open_source_notice', defaultMessage: 'Gab Social is open source software. You can contribute or report issues on our self-hosted GitLab at {gitlab}.' },
|
||||
});
|
||||
|
||||
const mapDispatchToProps = (dispatch) => ({
|
||||
onOpenHotkeys() {
|
||||
dispatch(openModal('HOTKEYS'));
|
||||
},
|
||||
});
|
||||
|
||||
export default @connect(null, mapDispatchToProps)
|
||||
@injectIntl
|
||||
class LinkFooter extends PureComponent {
|
||||
|
||||
static propTypes = {
|
||||
intl: PropTypes.object.isRequired,
|
||||
onOpenHotkeys: PropTypes.func.isRequired,
|
||||
};
|
||||
|
||||
render() {
|
||||
const { onOpenHotkeys, intl } = this.props;
|
||||
|
||||
return (
|
||||
<div className='link-footer'>
|
||||
<ul>
|
||||
{(invitesEnabled && me) && <li><a href='/invites'>{intl.formatMessage(messages.invite)}</a> · </li>}
|
||||
{me && <li><a href='#' onClick={onOpenHotkeys}>{intl.formatMessage(messages.hotkeys)}</a> · </li>}
|
||||
{me && <li><a href='/auth/edit'>{intl.formatMessage(messages.security)}</a> · </li>}
|
||||
<li><a href='/about'>{intl.formatMessage(messages.about)}</a> · </li>
|
||||
<li><a href='/settings/applications'>{intl.formatMessage(messages.developers)}</a> · </li>
|
||||
<li><a href='/about/tos'>{intl.formatMessage(messages.terms)}</a> · </li>
|
||||
<li><a href='/about/dmca'>{intl.formatMessage(messages.dmca)}</a> · </li>
|
||||
<li><a href='/about/sales'>{intl.formatMessage(messages.terms)}</a> · </li>
|
||||
<li><a href='/about/privacy'>{intl.formatMessage(messages.privacy)}</a></li>
|
||||
{me && <li> · <a href='/auth/sign_out' data-method='delete'>{intl.formatMessage(messages.logout)}</a></li>}
|
||||
</ul>
|
||||
|
||||
<p>
|
||||
{intl.formatMessage(messages.invite, {
|
||||
gitlab: <span><a href={source_url} rel='noopener' target='_blank'>{repository}</a> (v{version})</span>
|
||||
})}
|
||||
</p>
|
||||
<p>© 2019 Gab AI Inc.</p>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
};
|
||||
@ -1,33 +0,0 @@
|
||||
.link-footer {
|
||||
flex: 0 0 auto;
|
||||
padding: 20px 10px 10px 10px;
|
||||
|
||||
ul {
|
||||
margin-bottom: 10px;
|
||||
li {
|
||||
display: inline;
|
||||
}
|
||||
}
|
||||
|
||||
p {
|
||||
color: $dark-text-color;
|
||||
font-size: 13px;
|
||||
margin-bottom: 20px;
|
||||
|
||||
a {
|
||||
color: $gab-secondary-text;
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
|
||||
a {
|
||||
text-decoration: none;
|
||||
color: $gab-secondary-text;
|
||||
|
||||
&:hover,
|
||||
&:focus,
|
||||
&:active {
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
}
|
||||
34
app/javascript/gabsocial/components/page_layout.js
Normal file
34
app/javascript/gabsocial/components/page_layout.js
Normal file
@ -0,0 +1,34 @@
|
||||
import Header from './header'
|
||||
|
||||
export default class PageLayout extends PureComponent {
|
||||
static propTypes = {
|
||||
layout: PropTypes.object,
|
||||
};
|
||||
|
||||
render() {
|
||||
const { children, layout } = this.props;
|
||||
|
||||
const right = layout.RIGHT || null;
|
||||
|
||||
return (
|
||||
<div className={[styles.default, styles.flexRow, styles.width100PC, styles.height100PC].join(' ')}>
|
||||
<Header />
|
||||
<main role='main' className={[styles.default, styles.flexShrink1, styles.flexGrow1, styles.flexRow].join(' ')}>
|
||||
<div className={[styles.default, styles.width990PX, styles.flexRow].join(' ')}>
|
||||
<div className={[styles.default, styles.width600PX, styles.z1].join(' ')}>
|
||||
<div className={styles.default}>
|
||||
{children}
|
||||
</div>
|
||||
</div>
|
||||
<div className={[styles.default, styles.width350PX].join(' ')}>
|
||||
<div className={styles.default}>
|
||||
{right}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
}
|
||||
@ -1 +0,0 @@
|
||||
export { default } from './page_layout';
|
||||
@ -1,36 +0,0 @@
|
||||
import Header from '../header'
|
||||
|
||||
console.log("in the page_layout - styles:", styles);
|
||||
|
||||
export default class PageLayout extends PureComponent {
|
||||
static propTypes = {
|
||||
layout: PropTypes.object,
|
||||
};
|
||||
|
||||
render() {
|
||||
const { children, layout } = this.props;
|
||||
|
||||
const right = layout.RIGHT || null;
|
||||
|
||||
return (
|
||||
<div className='page'>
|
||||
{/*<Header />*/}
|
||||
<main className='main' role='main'>
|
||||
<div className='main__container'>
|
||||
<div className='main-contents'>
|
||||
<div className='main-contents__inner'>
|
||||
{ /* children */ }
|
||||
</div>
|
||||
</div>
|
||||
<div className='main-sidebar'>
|
||||
<div className='main-sidebar__inner'>
|
||||
{ /* right */ }
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
}
|
||||
@ -1,54 +0,0 @@
|
||||
.page {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
width: 100%;
|
||||
|
||||
&__top {
|
||||
display: flex;
|
||||
z-index: 105;
|
||||
|
||||
@include size(100%, auto);
|
||||
|
||||
@media (min-width:895px) {
|
||||
top: -290px;
|
||||
position: sticky;
|
||||
}
|
||||
}
|
||||
|
||||
.main {
|
||||
display: flex;
|
||||
flex-basis: auto;
|
||||
flex-direction: column;
|
||||
flex-shrink: 1;
|
||||
flex-grow: 1;
|
||||
align-items: flex-start;
|
||||
|
||||
&__container {
|
||||
display: flex;
|
||||
align-items: stretch;
|
||||
justify-content: space-between;
|
||||
flex-grow: 1;
|
||||
flex-direction: row;
|
||||
width: 990px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.main-contents {
|
||||
display: flex;
|
||||
max-width: 600px;
|
||||
z-index: 1;
|
||||
|
||||
&__inner {
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.main-sidebar {
|
||||
display: flex;
|
||||
width: 350px;
|
||||
|
||||
&__inner {
|
||||
|
||||
}
|
||||
}
|
||||
@ -16,52 +16,52 @@ import { clearHeight } from '../../actions/height_cache';
|
||||
import { openModal } from '../../actions/modal';
|
||||
import WrappedRoute from './util/wrapped_route';
|
||||
import { isMobile } from '../../utils/is_mobile';
|
||||
import NotificationsContainer from '../../containers/notifications_container';
|
||||
import LoadingBarContainer from '../../containers/loading_bar_container';
|
||||
import ModalContainer from '../../containers/modal_container';
|
||||
import UploadArea from '../../components/upload_area';
|
||||
import FooterBar from '../../components/footer_bar';
|
||||
// import NotificationsContainer from '../../containers/notifications_container';
|
||||
// import LoadingBarContainer from '../../containers/loading_bar_container';
|
||||
// import ModalContainer from '../../containers/modal_container';
|
||||
// import UploadArea from '../../components/upload_area';
|
||||
// import FooterBar from '../../components/footer_bar';
|
||||
// import TrendsPanel from './components/trends_panel';
|
||||
import { WhoToFollowPanel } from '../../components/panel';
|
||||
import LinkFooter from '../../components/link_footer';
|
||||
import ProfilePage from '../../pages/profile_page';
|
||||
// import { WhoToFollowPanel } from '../../components/panel';
|
||||
// import LinkFooter from '../../components/link_footer';
|
||||
// import ProfilePage from '../../pages/profile_page';
|
||||
// import GroupsPage from 'gabsocial/pages/groups_page';
|
||||
import GroupPage from '../../pages/group_page';
|
||||
import SearchPage from '../../pages/search_page';
|
||||
// import GroupPage from '../../pages/group_page';
|
||||
// import SearchPage from '../../pages/search_page';
|
||||
import HomePage from '../../pages/home_page';
|
||||
import GroupSidebarPanel from '../groups/sidebar_panel';
|
||||
// import GroupSidebarPanel from '../groups/sidebar_panel';
|
||||
|
||||
import {
|
||||
Status,
|
||||
GettingStarted,
|
||||
CommunityTimeline,
|
||||
AccountTimeline,
|
||||
AccountGallery,
|
||||
// Status,
|
||||
// GettingStarted,
|
||||
// CommunityTimeline,
|
||||
// AccountTimeline,
|
||||
// AccountGallery,
|
||||
HomeTimeline,
|
||||
Followers,
|
||||
Following,
|
||||
Reblogs,
|
||||
Favourites,
|
||||
DirectTimeline,
|
||||
HashtagTimeline,
|
||||
Notifications,
|
||||
FollowRequests,
|
||||
GenericNotFound,
|
||||
FavouritedStatuses,
|
||||
Blocks,
|
||||
DomainBlocks,
|
||||
Mutes,
|
||||
PinnedStatuses,
|
||||
Search,
|
||||
Explore,
|
||||
Groups,
|
||||
GroupTimeline,
|
||||
ListTimeline,
|
||||
Lists,
|
||||
GroupMembers,
|
||||
GroupRemovedAccounts,
|
||||
GroupCreate,
|
||||
GroupEdit,
|
||||
// Followers,
|
||||
// Following,
|
||||
// Reblogs,
|
||||
// Favourites,
|
||||
// DirectTimeline,
|
||||
// HashtagTimeline,
|
||||
// Notifications,
|
||||
// FollowRequests,
|
||||
// GenericNotFound,
|
||||
// FavouritedStatuses,
|
||||
// Blocks,
|
||||
// DomainBlocks,
|
||||
// Mutes,
|
||||
// PinnedStatuses,
|
||||
// Search,
|
||||
// Explore,
|
||||
// Groups,
|
||||
// GroupTimeline,
|
||||
// ListTimeline,
|
||||
// Lists,
|
||||
// GroupMembers,
|
||||
// GroupRemovedAccounts,
|
||||
// GroupCreate,
|
||||
// GroupEdit,
|
||||
} from './util/async-components';
|
||||
import { me, meUsername } from '../../initial_state';
|
||||
|
||||
@ -70,8 +70,8 @@ import { me, meUsername } from '../../initial_state';
|
||||
import '../../components/status';
|
||||
import { fetchGroups } from '../../actions/groups';
|
||||
|
||||
import '../../../styles/application.scss';
|
||||
import './ui.scss';
|
||||
// import '../../../styles/application.scss';
|
||||
// import './ui.scss';
|
||||
|
||||
const messages = defineMessages({
|
||||
beforeUnload: { id: 'ui.beforeunload', defaultMessage: 'Your draft will be lost if you leave Gab Social.' },
|
||||
@ -114,30 +114,30 @@ const keyMap = {
|
||||
};
|
||||
|
||||
const LAYOUT = {
|
||||
EMPTY: {
|
||||
LEFT: null,
|
||||
RIGHT: null,
|
||||
},
|
||||
DEFAULT: {
|
||||
LEFT: [
|
||||
<WhoToFollowPanel key='0' />,
|
||||
<LinkFooter key='1' />,
|
||||
],
|
||||
RIGHT: [
|
||||
// <TrendsPanel />,
|
||||
<GroupSidebarPanel key='0' />
|
||||
],
|
||||
},
|
||||
STATUS: {
|
||||
TOP: null,
|
||||
LEFT: null,
|
||||
RIGHT: [
|
||||
<GroupSidebarPanel key='0' />,
|
||||
<WhoToFollowPanel key='1' />,
|
||||
// <TrendsPanel />,
|
||||
<LinkFooter key='2' />,
|
||||
],
|
||||
},
|
||||
// EMPTY: {
|
||||
// LEFT: null,
|
||||
// RIGHT: null,
|
||||
// },
|
||||
// DEFAULT: {
|
||||
// LEFT: [
|
||||
// <WhoToFollowPanel key='0' />,
|
||||
// <LinkFooter key='1' />,
|
||||
// ],
|
||||
// RIGHT: [
|
||||
// // <TrendsPanel />,
|
||||
// <GroupSidebarPanel key='0' />
|
||||
// ],
|
||||
// },
|
||||
// STATUS: {
|
||||
// TOP: null,
|
||||
// LEFT: null,
|
||||
// RIGHT: [
|
||||
// <GroupSidebarPanel key='0' />,
|
||||
// <WhoToFollowPanel key='1' />,
|
||||
// // <TrendsPanel />,
|
||||
// <LinkFooter key='2' />,
|
||||
// ],
|
||||
// },
|
||||
};
|
||||
|
||||
const shouldHideFAB = path => path.match(/^\/posts\/|^\/search|^\/getting-started/);
|
||||
@ -182,12 +182,12 @@ class SwitchingColumnsArea extends PureComponent {
|
||||
<Switch>
|
||||
<Redirect from='/' to='/home' exact />
|
||||
<WrappedRoute path='/home' exact page={HomePage} component={HomeTimeline} content={children} />
|
||||
<WrappedRoute path='/timeline/all' exact page={HomePage} component={CommunityTimeline} content={children} />
|
||||
{/*<WrappedRoute path='/timeline/all' exact page={HomePage} component={CommunityTimeline} content={children} />
|
||||
|
||||
{/*<WrappedRoute path='/groups' exact page={GroupsPage} component={Groups} content={children} componentParams={{ activeTab: 'featured' }} />
|
||||
<WrappedRoute path='/groups' exact page={GroupsPage} component={Groups} content={children} componentParams={{ activeTab: 'featured' }} />
|
||||
<WrappedRoute path='/groups/create' page={GroupsPage} component={Groups} content={children} componentParams={{ showCreateForm: true, activeTab: 'featured' }} />
|
||||
<WrappedRoute path='/groups/browse/member' page={GroupsPage} component={Groups} content={children} componentParams={{ activeTab: 'member' }} />
|
||||
<WrappedRoute path='/groups/browse/admin' page={GroupsPage} component={Groups} content={children} componentParams={{ activeTab: 'admin' }} />*/}
|
||||
<WrappedRoute path='/groups/browse/admin' page={GroupsPage} component={Groups} content={children} componentParams={{ activeTab: 'admin' }} />
|
||||
<WrappedRoute path='/groups/:id/members' page={GroupPage} component={GroupMembers} content={children} />
|
||||
<WrappedRoute path='/groups/:id/removed_accounts' page={GroupPage} component={GroupRemovedAccounts} content={children} />
|
||||
<WrappedRoute path='/groups/:id/edit' page={GroupPage} component={GroupEdit} content={children} />
|
||||
@ -240,7 +240,7 @@ class SwitchingColumnsArea extends PureComponent {
|
||||
<Redirect from='/@:username/posts/:statusId/reblogs' to='/:username/posts/:statusId/reblogs' />
|
||||
<WrappedRoute path='/:username/posts/:statusId/reblogs' layout={LAYOUT.STATUS} component={Reblogs} content={children} />
|
||||
|
||||
<WrappedRoute layout={LAYOUT.EMPTY} component={GenericNotFound} content={children} />
|
||||
<WrappedRoute layout={LAYOUT.EMPTY} component={GenericNotFound} content={children} />*/}
|
||||
</Switch>
|
||||
);
|
||||
}
|
||||
@ -531,7 +531,7 @@ class UI extends PureComponent {
|
||||
|
||||
return (
|
||||
<HotKeys keyMap={keyMap} handlers={handlers} ref={this.setHotkeysRef} attach={window} focused>
|
||||
<div className={classNames('ui', { 'is-composing': isComposing })} ref={this.setRef} style={{ pointerEvents: dropdownMenuIsOpen ? 'none' : null }}>
|
||||
<div ref={this.setRef} style={{ pointerEvents: dropdownMenuIsOpen ? 'none' : null }}>
|
||||
<SwitchingColumnsArea location={location} onLayoutChange={this.handleLayoutChange}>
|
||||
{children}
|
||||
</SwitchingColumnsArea>
|
||||
|
||||
@ -1,10 +1,10 @@
|
||||
import { Fragment } from 'react';
|
||||
import GroupSidebarPanel from '../features/groups/sidebar_panel';
|
||||
// import GroupSidebarPanel from '../features/groups/sidebar_panel';
|
||||
import LinkFooter from '../components/link_footer';
|
||||
import PromoPanel from '../components/promo_panel';
|
||||
import UserPanel from '../components/user_panel';
|
||||
// import PromoPanel from '../components/promo_panel';
|
||||
// import UserPanel from '../components/user_panel';
|
||||
import PageLayout from '../components/page_layout';
|
||||
import TimelineComposeBlock from '../components/timeline_compose_block';
|
||||
// import TimelineComposeBlock from '../components/timeline_compose_block';
|
||||
|
||||
export default class HomePage extends PureComponent {
|
||||
render () {
|
||||
@ -15,15 +15,15 @@ export default class HomePage extends PureComponent {
|
||||
layout={{
|
||||
RIGHT: (
|
||||
<Fragment>
|
||||
<GroupSidebarPanel />
|
||||
<PromoPanel />
|
||||
{/*<GroupSidebarPanel />*/}
|
||||
{/*<PromoPanel />*/}
|
||||
<LinkFooter />
|
||||
</Fragment>
|
||||
),
|
||||
}}
|
||||
>
|
||||
<TimelineComposeBlock size={46} shouldCondense={true} autoFocus={false} />
|
||||
{children}
|
||||
{/*<TimelineComposeBlock size={46} shouldCondense={true} autoFocus={false} />*/}
|
||||
{/*children*/}
|
||||
</PageLayout>
|
||||
)
|
||||
}
|
||||
|
||||
@ -1,55 +1,33 @@
|
||||
html,body{
|
||||
html, body {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
body{
|
||||
-ms-overflow-style:scrollbar;
|
||||
overflow-y:scroll;
|
||||
overscroll-behavior-y:none;
|
||||
}
|
||||
|
||||
html {
|
||||
-ms-text-size-adjust: 100%;
|
||||
-webkit-text-size-adjust: 100%;
|
||||
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
overflow-y: scroll;
|
||||
overscroll-behavior-y: none;
|
||||
}
|
||||
|
||||
.default {
|
||||
align-items: stretch;
|
||||
border: 0 solid black;
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
flex-basis: auto;
|
||||
flex-direction: column;
|
||||
align-items: stretch;
|
||||
flex-shrink: 0;
|
||||
margin-bottom: 0px;
|
||||
margin-left: 0px;
|
||||
margin-right: 0px;
|
||||
margin-top: 0px;
|
||||
min-height: 0px;
|
||||
min-width: 0px;
|
||||
padding-bottom: 0px;
|
||||
padding-left: 0px;
|
||||
padding-right: 0px;
|
||||
padding-top: 0px;
|
||||
position: relative;
|
||||
border: 0 solid black;
|
||||
z-index: 0;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.text {
|
||||
font: 14px system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Ubuntu, "Helvetica Neue", sans-serif;
|
||||
}
|
||||
|
||||
.color-black {
|
||||
color: rgba(0, 0, 0, 1.00);
|
||||
}
|
||||
|
||||
.inline {
|
||||
display: inline;
|
||||
white-space: pre-wrap;
|
||||
word-wrap: break-word;
|
||||
font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Ubuntu, "Helvetica Neue", sans-serif;
|
||||
}
|
||||
|
||||
.wrap {
|
||||
@ -57,128 +35,131 @@ body {
|
||||
word-wrap: break-word;
|
||||
}
|
||||
|
||||
.overflowWrapBreakWord {
|
||||
overflow-wrap: break-word;
|
||||
}
|
||||
|
||||
.inherit {
|
||||
color: inherit;
|
||||
font: inherit;
|
||||
white-space: inherit;
|
||||
}
|
||||
|
||||
.r-13awgt0 {
|
||||
-ms-flex-negative: 1;
|
||||
-ms-flex-positive: 1;
|
||||
-ms-flex-preferred-size: 0%;
|
||||
-webkit-box-flex: 1;
|
||||
-webkit-flex-basis: 0%;
|
||||
-webkit-flex-grow: 1;
|
||||
-webkit-flex-shrink: 1;
|
||||
.flex-normal {
|
||||
flex-basis: 0%;
|
||||
flex-grow: 1;
|
||||
flex-shrink: 1;
|
||||
}
|
||||
|
||||
.r-4qtqp9 {
|
||||
display: inline-block;
|
||||
.flexGrow1 { flex-grow: 1; }
|
||||
.flexShrink1 { flex-shrink: 1; }
|
||||
.flexRow { flex-direction: row; }
|
||||
.flexWrap { flex-wrap: wrap; }
|
||||
|
||||
.alignItemsEnd { align-items: flex-end; }
|
||||
.alignItemsStart { align-items: flex-start; }
|
||||
.alignItemsCenter { align-items: center; }
|
||||
|
||||
.justifyContentSpaceBetween { justify-content: space-between; }
|
||||
.justifyContentCenter { justify-content: center; }
|
||||
|
||||
.overflowHidden {
|
||||
overflow-x: hidden;
|
||||
overflow-y: hidden;
|
||||
}
|
||||
|
||||
.r-ywje51 {
|
||||
margin-bottom: auto;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
margin-top: auto;
|
||||
}
|
||||
|
||||
.r-hvic4v {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.r-1adg3ll {
|
||||
display: block;
|
||||
}
|
||||
|
||||
|
||||
.r-12vffkv>* {
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
.r-12vffkv {
|
||||
pointer-events: none !important;
|
||||
}
|
||||
|
||||
.r-14lw9ot {
|
||||
background-color: rgba(255, 255, 255, 1.00);
|
||||
}
|
||||
|
||||
.r-1p0dtai {
|
||||
bottom: 0px;
|
||||
}
|
||||
|
||||
.r-1d2f490 {
|
||||
left: 0px;
|
||||
}
|
||||
|
||||
.r-1xcajam {
|
||||
position: fixed;
|
||||
}
|
||||
|
||||
.r-zchlnj {
|
||||
right: 0px;
|
||||
}
|
||||
|
||||
.r-ipm5af {
|
||||
top: 0px;
|
||||
}
|
||||
|
||||
.r-yyyyoo {
|
||||
fill: currentcolor;
|
||||
}
|
||||
|
||||
.r-1xvli5t {
|
||||
height: 1.25em;
|
||||
}
|
||||
|
||||
.r-dnmrzs {
|
||||
.textOverflowEllipsis {
|
||||
max-width: 100%;
|
||||
overflow-x: hidden;
|
||||
overflow-y: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.r-bnwqim {
|
||||
position: relative;
|
||||
.circle { border-radius: 9999px; }
|
||||
|
||||
.marginAuto { margin: auto; }
|
||||
|
||||
.displayNone { display: none; }
|
||||
.displayBlock { display: block; }
|
||||
.displayInline { display: inline; }
|
||||
.displayInlineBlock { display: inline-block; }
|
||||
|
||||
.cursorPointer { cursor: pointer }
|
||||
|
||||
.pointerEventsAuto > * { pointer-events: auto;}
|
||||
.pointerEventsNone { pointer-events: none !important; }
|
||||
|
||||
.backgroundWhite { background-color: #fff; }
|
||||
.colorBlack { color: #000; }
|
||||
.colorSubtle { color: #666; }
|
||||
.colorBrand { color: rgb(29, 161, 242); }
|
||||
.fillColorBrand { fill: #21cf7a; }
|
||||
|
||||
.bottom0 { bottom: 0; }
|
||||
.left0 { left: 0px; }
|
||||
.right0 { right: 0px; }
|
||||
.top0 { top: 0px; }
|
||||
|
||||
.lineHeight125 { height: 1.25em; }
|
||||
.lineHeight2 { line-height: 2em; }
|
||||
|
||||
.positionFixed { position: fixed; }
|
||||
.positionRelative { position: relative; }
|
||||
.positionAbsolute { position: absolute; }
|
||||
|
||||
.noSelect { user-select: none; }
|
||||
|
||||
.height100PC { height: 100%; }
|
||||
.height50PX { height: 50px; }
|
||||
.height72PX { height: 72px; }
|
||||
|
||||
.width990PX { width: 990px; }
|
||||
.width600PX { width: 600px; }
|
||||
.width350PX { width: 350px; }
|
||||
.width275PX { width: 275px; }
|
||||
.width100PC { width: 100%; }
|
||||
.width72PX { width: 72px; }
|
||||
.maxWidth100PC { max-width: 100%; }
|
||||
|
||||
.top0 { top: 0; }
|
||||
.top60PC { top: 60%; }
|
||||
|
||||
.textAlignCenter { text-align: center; }
|
||||
|
||||
.fontSize19PX { font-size: 19px; }
|
||||
.fontSize13PX { font-size: 13px; }
|
||||
|
||||
.fontWeightNormal { font-weight: 400; }
|
||||
.fontWeightBold { font-weight: 600; }
|
||||
|
||||
.noUnderline { text-decoration: none; }
|
||||
.underline { text-decoration: underline; }
|
||||
|
||||
.z1 { z-index: 1; }
|
||||
.z2 { z-index: 2; }
|
||||
.z3 { z-index: 3; }
|
||||
|
||||
.marginVertical5PX {
|
||||
margin-top: 5px;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
.r-1plcrui {
|
||||
vertical-align: text-bottom;
|
||||
.paddingVertical10PX {
|
||||
padding-top: 10px;
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
|
||||
.r-lrvibr {
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
-webkit-user-select: none;
|
||||
user-select: none;
|
||||
.paddingHoizontal10PX {
|
||||
padding-left: 10px;
|
||||
padding-right: 10px;
|
||||
}
|
||||
|
||||
.color-brand {
|
||||
color: rgba(29, 161, 242, 1.00);
|
||||
.paddingHorizontal20PX {
|
||||
padding-left: 20px;
|
||||
padding-right: 20px;
|
||||
}
|
||||
|
||||
.height-72-px {
|
||||
height: 72px;
|
||||
}
|
||||
|
||||
.position-relative {
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.width-72-px {
|
||||
width: 72px;
|
||||
}
|
||||
|
||||
.top-60-pc {
|
||||
top: 60%;
|
||||
}
|
||||
|
||||
.line-height-2 {
|
||||
line-height: 2em;
|
||||
}
|
||||
|
||||
.text-align-center {
|
||||
text-align: center;
|
||||
.paddingRight15PX {
|
||||
padding-right: 15px;
|
||||
}
|
||||
@ -8,7 +8,7 @@
|
||||
|
||||
= javascript_pack_tag 'application', integrity: true, crossorigin: 'anonymous'
|
||||
|
||||
.app-holder#gabsocial{ data: { props: Oj.dump(default_props) } }
|
||||
#gabsocial{ data: { props: Oj.dump(default_props) } }
|
||||
%noscript
|
||||
= image_pack_tag 'logo.png', alt: 'Gab Social'
|
||||
|
||||
|
||||
@ -19,7 +19,7 @@ module.exports = {
|
||||
sourceMap: true,
|
||||
importLoaders: 2,
|
||||
modules: true,
|
||||
// localIdentName: '[name]',
|
||||
localIdentName: '[hash:base64:5]',
|
||||
},
|
||||
},
|
||||
{
|
||||
|
||||
Loading…
Reference in New Issue
Block a user