diff --git a/app/javascript/flavours/glitch/actions/compose.js b/app/javascript/flavours/glitch/actions/compose.js
index 2fb97fa17e..093952316a 100644
--- a/app/javascript/flavours/glitch/actions/compose.js
+++ b/app/javascript/flavours/glitch/actions/compose.js
@@ -68,6 +68,14 @@ const messages = defineMessages({
uploadErrorPoll: { id: 'upload_error.poll', defaultMessage: 'File upload not allowed with polls.' },
});
+const COMPOSE_PANEL_BREAKPOINT = 600 + (285 * 1) + (10 * 3);
+
+export const ensureComposeIsVisible = (getState, routerHistory) => {
+ if (!getState().getIn(['compose', 'mounted']) && window.innerWidth < COMPOSE_PANEL_BREAKPOINT) {
+ routerHistory.push('/statuses/new');
+ }
+};
+
export function changeCompose(text) {
return {
type: COMPOSE_CHANGE,
@@ -81,16 +89,14 @@ export function cycleElefriendCompose() {
};
};
-export function replyCompose(status, router) {
+export function replyCompose(status, routerHistory) {
return (dispatch, getState) => {
dispatch({
type: COMPOSE_REPLY,
status: status,
});
- if (router && !getState().getIn(['compose', 'mounted'])) {
- router.push('/statuses/new');
- }
+ ensureComposeIsVisible(getState, routerHistory);
};
};
@@ -106,29 +112,25 @@ export function resetCompose() {
};
};
-export function mentionCompose(account, router) {
+export function mentionCompose(account, routerHistory) {
return (dispatch, getState) => {
dispatch({
type: COMPOSE_MENTION,
account: account,
});
- if (!getState().getIn(['compose', 'mounted'])) {
- router.push('/statuses/new');
- }
+ ensureComposeIsVisible(getState, routerHistory);
};
};
-export function directCompose(account, router) {
+export function directCompose(account, routerHistory) {
return (dispatch, getState) => {
dispatch({
type: COMPOSE_DIRECT,
account: account,
});
- if (!getState().getIn(['compose', 'mounted'])) {
- router.push('/statuses/new');
- }
+ ensureComposeIsVisible(getState, routerHistory);
};
};
diff --git a/app/javascript/flavours/glitch/actions/statuses.js b/app/javascript/flavours/glitch/actions/statuses.js
index 7e22a7f988..4d2bda78be 100644
--- a/app/javascript/flavours/glitch/actions/statuses.js
+++ b/app/javascript/flavours/glitch/actions/statuses.js
@@ -2,6 +2,7 @@ import api from 'flavours/glitch/util/api';
import { deleteFromTimelines } from './timelines';
import { importFetchedStatus, importFetchedStatuses } from './importer';
+import { ensureComposeIsVisible } from './compose';
export const STATUS_FETCH_REQUEST = 'STATUS_FETCH_REQUEST';
export const STATUS_FETCH_SUCCESS = 'STATUS_FETCH_SUCCESS';
@@ -80,7 +81,7 @@ export function redraft(status, raw_text, content_type) {
};
};
-export function deleteStatus(id, router, withRedraft = false) {
+export function deleteStatus(id, routerHistory, withRedraft = false) {
return (dispatch, getState) => {
let status = getState().getIn(['statuses', id]);
@@ -97,9 +98,7 @@ export function deleteStatus(id, router, withRedraft = false) {
if (withRedraft) {
dispatch(redraft(status, response.data.text, response.data.content_type));
- if (!getState().getIn(['compose', 'mounted'])) {
- router.push('/statuses/new');
- }
+ ensureComposeIsVisible(getState, routerHistory);
}
}).catch(error => {
dispatch(deleteStatusFail(id, error));
diff --git a/app/javascript/flavours/glitch/components/autosuggest_input.js b/app/javascript/flavours/glitch/components/autosuggest_input.js
index a6ae3bc75c..5fc952d8ea 100644
--- a/app/javascript/flavours/glitch/components/autosuggest_input.js
+++ b/app/javascript/flavours/glitch/components/autosuggest_input.js
@@ -49,7 +49,7 @@ export default class AutosuggestInput extends ImmutablePureComponent {
autoFocus: PropTypes.bool,
className: PropTypes.string,
id: PropTypes.string,
- searchTokens: ImmutablePropTypes.list,
+ searchTokens: PropTypes.arrayOf(PropTypes.string),
maxLength: PropTypes.number,
};
diff --git a/app/javascript/flavours/glitch/features/compose/components/navigation_bar.js b/app/javascript/flavours/glitch/features/compose/components/navigation_bar.js
index 59172bb232..3148434f19 100644
--- a/app/javascript/flavours/glitch/features/compose/components/navigation_bar.js
+++ b/app/javascript/flavours/glitch/features/compose/components/navigation_bar.js
@@ -17,7 +17,7 @@ export default class NavigationBar extends ImmutablePureComponent {
{this.props.account.get('acct')}
-
+
diff --git a/app/javascript/flavours/glitch/features/compose/components/search.js b/app/javascript/flavours/glitch/features/compose/components/search.js
index 5fed1567ac..5f8c6cd52e 100644
--- a/app/javascript/flavours/glitch/features/compose/components/search.js
+++ b/app/javascript/flavours/glitch/features/compose/components/search.js
@@ -60,6 +60,10 @@ class SearchPopout extends React.PureComponent {
export default @injectIntl
class Search extends React.PureComponent {
+ static contextTypes = {
+ router: PropTypes.object.isRequired,
+ };
+
static propTypes = {
value: PropTypes.string.isRequired,
submitted: PropTypes.bool,
@@ -67,6 +71,7 @@ class Search extends React.PureComponent {
onSubmit: PropTypes.func.isRequired,
onClear: PropTypes.func.isRequired,
onShow: PropTypes.func.isRequired,
+ openInRoute: PropTypes.bool,
intl: PropTypes.object.isRequired,
};
@@ -109,8 +114,10 @@ class Search extends React.PureComponent {
const { onSubmit } = this.props;
switch (e.key) {
case 'Enter':
- if (onSubmit) {
- onSubmit();
+ onSubmit();
+
+ if (this.props.openInRoute) {
+ this.context.router.history.push('/search');
}
break;
case 'Escape':
diff --git a/app/javascript/flavours/glitch/features/getting_started/index.js b/app/javascript/flavours/glitch/features/getting_started/index.js
index 25fff1974b..7b645c9d09 100644
--- a/app/javascript/flavours/glitch/features/getting_started/index.js
+++ b/app/javascript/flavours/glitch/features/getting_started/index.js
@@ -10,12 +10,10 @@ import ImmutablePropTypes from 'react-immutable-proptypes';
import ImmutablePureComponent from 'react-immutable-pure-component';
import { me, invitesEnabled, version } from 'flavours/glitch/util/initial_state';
import { fetchFollowRequests } from 'flavours/glitch/actions/accounts';
-import { changeSetting } from 'flavours/glitch/actions/settings';
import { List as ImmutableList } from 'immutable';
import { createSelector } from 'reselect';
import { fetchLists } from 'flavours/glitch/actions/lists';
import { preferencesLink, profileLink, signOutLink } from 'flavours/glitch/util/backend_links';
-import Toggle from 'react-toggle';
const messages = defineMessages({
heading: { id: 'getting_started.heading', defaultMessage: 'Getting started' },
@@ -54,7 +52,6 @@ const makeMapStateToProps = () => {
columns: state.getIn(['settings', 'columns']),
unreadFollowRequests: state.getIn(['user_lists', 'follow_requests', 'items'], ImmutableList()).size,
unreadNotifications: state.getIn(['notifications', 'unread']),
- forceSingleColumn: state.getIn(['settings', 'forceSingleColumn'], false),
});
return mapStateToProps;
@@ -64,7 +61,6 @@ const mapDispatchToProps = dispatch => ({
fetchFollowRequests: () => dispatch(fetchFollowRequests()),
fetchLists: () => dispatch(fetchLists()),
openSettings: () => dispatch(openModal('SETTINGS', {})),
- changeForceSingleColumn: checked => dispatch(changeSetting(['forceSingleColumn'], checked)),
});
const badgeDisplay = (number, limit) => {
@@ -92,8 +88,6 @@ export default class GettingStarted extends ImmutablePureComponent {
lists: ImmutablePropTypes.list,
fetchLists: PropTypes.func.isRequired,
openSettings: PropTypes.func.isRequired,
- forceSingleColumn: PropTypes.bool,
- changeForceSingleColumn: PropTypes.func.isRequired,
};
componentWillMount () {
@@ -108,12 +102,8 @@ export default class GettingStarted extends ImmutablePureComponent {
}
}
- handleForceSingleColumnChange = ({ target }) => {
- this.props.changeForceSingleColumn(target.checked);
- }
-
render () {
- const { intl, myAccount, columns, multiColumn, unreadFollowRequests, unreadNotifications, lists, openSettings, forceSingleColumn } = this.props;
+ const { intl, myAccount, columns, multiColumn, unreadFollowRequests, unreadNotifications, lists, openSettings } = this.props;
const navItems = [];
let listItems = [];
@@ -193,11 +183,6 @@ export default class GettingStarted extends ImmutablePureComponent {
-
-
);
}
diff --git a/app/javascript/flavours/glitch/features/search/index.js b/app/javascript/flavours/glitch/features/search/index.js
new file mode 100644
index 0000000000..b35c8ed495
--- /dev/null
+++ b/app/javascript/flavours/glitch/features/search/index.js
@@ -0,0 +1,17 @@
+import React from 'react';
+import SearchContainer from 'flavours/glitch/features/compose/containers/search_container';
+import SearchResultsContainer from 'flavours/glitch/features/compose/containers/search_results_container';
+
+const Search = () => (
+
+);
+
+export default Search;
diff --git a/app/javascript/flavours/glitch/features/ui/components/columns_area.js b/app/javascript/flavours/glitch/features/ui/components/columns_area.js
index d3d8aebd17..2e28bbe50e 100644
--- a/app/javascript/flavours/glitch/features/ui/components/columns_area.js
+++ b/app/javascript/flavours/glitch/features/ui/components/columns_area.js
@@ -13,6 +13,8 @@ import ColumnLoading from './column_loading';
import DrawerLoading from './drawer_loading';
import BundleColumnError from './bundle_column_error';
import { Compose, Notifications, HomeTimeline, CommunityTimeline, PublicTimeline, HashtagTimeline, DirectTimeline, FavouritedStatuses, BookmarkedStatuses, ListTimeline } from 'flavours/glitch/util/async-components';
+import ComposePanel from './compose_panel';
+import NavigationPanel from './navigation_panel';
import detectPassiveEvents from 'detect-passive-events';
import { scrollRight } from 'flavours/glitch/util/scroll';
@@ -173,14 +175,22 @@ export default class ColumnsArea extends ImmutablePureComponent {
return (
-
+
{content}
-
+
{floatingActionButton}
diff --git a/app/javascript/flavours/glitch/features/ui/components/compose_panel.js b/app/javascript/flavours/glitch/features/ui/components/compose_panel.js
new file mode 100644
index 0000000000..8acf899507
--- /dev/null
+++ b/app/javascript/flavours/glitch/features/ui/components/compose_panel.js
@@ -0,0 +1,41 @@
+import React from 'react';
+import SearchContainer from 'flavours/glitch/features/compose/containers/search_container';
+import ComposeFormContainer from 'flavours/glitch/features/compose/containers/compose_form_container';
+import NavigationContainer from 'flavours/glitch/features/compose/containers/navigation_container';
+import { invitesEnabled, version, repository, source_url } from 'mastodon/initial_state';
+import { Link } from 'react-router-dom';
+import { FormattedMessage } from 'react-intl';
+
+const ComposePanel = () => (
+
+
+
+
+
+
+
+
+
+ {invitesEnabled && - ·
}
+ - ·
+ - ·
+ - ·
+ - ·
+ - ·
+ - ·
+ - ·
+
+
+
+
+ {repository} (v{version}) }}
+ />
+
+
+
+);
+
+export default ComposePanel;
diff --git a/app/javascript/flavours/glitch/features/ui/components/list_panel.js b/app/javascript/flavours/glitch/features/ui/components/list_panel.js
new file mode 100644
index 0000000000..50592d3578
--- /dev/null
+++ b/app/javascript/flavours/glitch/features/ui/components/list_panel.js
@@ -0,0 +1,55 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import ImmutablePropTypes from 'react-immutable-proptypes';
+import ImmutablePureComponent from 'react-immutable-pure-component';
+import { fetchLists } from 'flavours/glitch/actions/lists';
+import { connect } from 'react-redux';
+import { createSelector } from 'reselect';
+import { NavLink, withRouter } from 'react-router-dom';
+import Icon from 'flavours/glitch/components/icon';
+
+const getOrderedLists = createSelector([state => state.get('lists')], lists => {
+ if (!lists) {
+ return lists;
+ }
+
+ return lists.toList().filter(item => !!item).sort((a, b) => a.get('title').localeCompare(b.get('title')));
+});
+
+const mapStateToProps = state => ({
+ lists: getOrderedLists(state),
+});
+
+export default @withRouter
+@connect(mapStateToProps)
+class ListPanel extends ImmutablePureComponent {
+
+ static propTypes = {
+ dispatch: PropTypes.func.isRequired,
+ lists: ImmutablePropTypes.list,
+ };
+
+ componentDidMount () {
+ const { dispatch } = this.props;
+ dispatch(fetchLists());
+ }
+
+ render () {
+ const { lists } = this.props;
+
+ if (!lists) {
+ return null;
+ }
+
+ return (
+
+
+
+ {lists.map(list => (
+ {list.get('title')}
+ ))}
+
+ );
+ }
+
+}
diff --git a/app/javascript/flavours/glitch/features/ui/components/navigation_panel.js b/app/javascript/flavours/glitch/features/ui/components/navigation_panel.js
new file mode 100644
index 0000000000..68dde7c5ca
--- /dev/null
+++ b/app/javascript/flavours/glitch/features/ui/components/navigation_panel.js
@@ -0,0 +1,27 @@
+import React from 'react';
+import { NavLink, withRouter } from 'react-router-dom';
+import { FormattedMessage } from 'react-intl';
+import Icon from 'flavours/glitch/components/icon';
+import NotificationsCounterIcon from './notifications_counter_icon';
+import ListPanel from './list_panel';
+
+const NavigationPanel = () => (
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+);
+
+export default withRouter(NavigationPanel);
diff --git a/app/javascript/flavours/glitch/features/ui/components/notifications_counter_icon.js b/app/javascript/flavours/glitch/features/ui/components/notifications_counter_icon.js
index 137658b94c..25df35264d 100644
--- a/app/javascript/flavours/glitch/features/ui/components/notifications_counter_icon.js
+++ b/app/javascript/flavours/glitch/features/ui/components/notifications_counter_icon.js
@@ -10,15 +10,17 @@ const mapStateToProps = state => ({
const formatNumber = num => num > 99 ? '99+' : num;
-const NotificationsCounterIcon = ({ count, showBadge }) => (
+const NotificationsCounterIcon = ({ count, className, showBadge }) => (
-
+
{showBadge && count > 0 && {formatNumber(count)}}
);
NotificationsCounterIcon.propTypes = {
count: PropTypes.number.isRequired,
+ showBadge: PropTypes.bool,
+ className: PropTypes.string,
};
export default connect(mapStateToProps)(NotificationsCounterIcon);
diff --git a/app/javascript/flavours/glitch/features/ui/components/tabs_bar.js b/app/javascript/flavours/glitch/features/ui/components/tabs_bar.js
index 8963b16b3d..dbd08aa2b1 100644
--- a/app/javascript/flavours/glitch/features/ui/components/tabs_bar.js
+++ b/app/javascript/flavours/glitch/features/ui/components/tabs_bar.js
@@ -7,14 +7,13 @@ import { isUserTouching } from 'flavours/glitch/util/is_mobile';
import NotificationsCounterIcon from './notifications_counter_icon';
export const links = [
- ,
- ,
+ ,
+ ,
- ,
- ,
- ,
-
- ,
+ ,
+ ,
+ ,
+ ,
];
export function getIndex (path) {
diff --git a/app/javascript/flavours/glitch/features/ui/index.js b/app/javascript/flavours/glitch/features/ui/index.js
index 36156a5ef6..f08b2dab8b 100644
--- a/app/javascript/flavours/glitch/features/ui/index.js
+++ b/app/javascript/flavours/glitch/features/ui/index.js
@@ -44,10 +44,11 @@ import {
Mutes,
PinnedStatuses,
Lists,
+ Search,
GettingStartedMisc,
} from 'flavours/glitch/util/async-components';
import { HotKeys } from 'react-hotkeys';
-import { me } from 'flavours/glitch/util/initial_state';
+import { me, forceSingleColumn } from 'flavours/glitch/util/initial_state';
import { defineMessages, injectIntl } from 'react-intl';
// Dummy import, to make sure that ends up in the application bundle.
@@ -68,7 +69,6 @@ const mapStateToProps = state => ({
unreadNotifications: state.getIn(['notifications', 'unread']),
showFaviconBadge: state.getIn(['local_settings', 'notifications', 'favicon_badge']),
hicolorPrivacyIcons: state.getIn(['local_settings', 'hicolor_privacy_icons']),
- forceSingleColumn: state.getIn(['settings', 'forceSingleColumn'], false),
});
const keyMap = {
@@ -126,7 +126,6 @@ export default class UI extends React.Component {
dropdownMenuIsOpen: PropTypes.bool,
unreadNotifications: PropTypes.number,
showFaviconBadge: PropTypes.bool,
- forceSingleColumn: PropTypes.bool,
};
state = {
@@ -432,7 +431,7 @@ export default class UI extends React.Component {
render () {
const { width, draggingOver } = this.state;
- const { children, layout, isWide, navbarUnder, dropdownMenuIsOpen, forceSingleColumn } = this.props;
+ const { children, layout, isWide, navbarUnder, dropdownMenuIsOpen } = this.props;
const singleColumn = forceSingleColumn || isMobile(width, layout);
const redirect = singleColumn ? : ;
@@ -494,7 +493,7 @@ export default class UI extends React.Component {
-
+
diff --git a/app/javascript/flavours/glitch/reducers/settings.js b/app/javascript/flavours/glitch/reducers/settings.js
index a568183dfa..a37863a697 100644
--- a/app/javascript/flavours/glitch/reducers/settings.js
+++ b/app/javascript/flavours/glitch/reducers/settings.js
@@ -15,8 +15,6 @@ const initialState = ImmutableMap({
skinTone: 1,
- forceSingleColumn: false,
-
home: ImmutableMap({
shows: ImmutableMap({
reblog: true,
diff --git a/app/javascript/flavours/glitch/styles/components/columns.scss b/app/javascript/flavours/glitch/styles/components/columns.scss
index f372a4830d..80d198ff78 100644
--- a/app/javascript/flavours/glitch/styles/components/columns.scss
+++ b/app/javascript/flavours/glitch/styles/components/columns.scss
@@ -26,7 +26,12 @@
display: flex;
justify-content: flex-end;
+ &--start {
+ justify-content: flex-start;
+ }
+
&__inner {
+ width: 285px;
pointer-events: auto;
height: 100%;
}
@@ -178,9 +183,31 @@
padding: 15px;
text-decoration: none;
- &:hover {
+ &:hover,
+ &:focus,
+ &:active {
background: lighten($ui-base-color, 11%);
}
+
+ &:focus {
+ outline: 0;
+ }
+
+ &--transparent {
+ background: transparent;
+ color: $ui-secondary-color;
+
+ &:hover,
+ &:focus,
+ &:active {
+ background: transparent;
+ color: $primary-text-color;
+ }
+
+ &.active {
+ color: $ui-highlight-color;
+ }
+ }
}
.column-link__icon {
@@ -506,31 +533,3 @@
margin: 0 5px;
}
}
-
-.floating-action-button {
- position: fixed;
- display: flex;
- justify-content: center;
- align-items: center;
- width: 3.9375rem;
- height: 3.9375rem;
- bottom: 1.3125rem;
- right: 1.3125rem;
- background: darken($ui-highlight-color, 3%);
- color: $white;
- border-radius: 50%;
- font-size: 21px;
- line-height: 21px;
- text-decoration: none;
- box-shadow: 2px 3px 9px rgba($base-shadow-color, 0.4);
-
- &:hover,
- &:focus,
- &:active {
- background: lighten($ui-highlight-color, 7%);
- }
-
- @media screen and (min-width: 630px) {
- display: none;
- }
-}
diff --git a/app/javascript/flavours/glitch/styles/components/index.scss b/app/javascript/flavours/glitch/styles/components/index.scss
index 53b678c9af..81098e52cc 100644
--- a/app/javascript/flavours/glitch/styles/components/index.scss
+++ b/app/javascript/flavours/glitch/styles/components/index.scss
@@ -564,6 +564,7 @@
display: block;
flex: 1 1 auto;
padding: 15px 10px;
+ padding-bottom: 13px;
color: $primary-text-color;
text-decoration: none;
text-align: center;
@@ -588,6 +589,7 @@
&:active {
@include multi-columns('screen and (min-width: 631px)') {
background: lighten($ui-base-color, 14%);
+ border-bottom-color: lighten($ui-base-color, 14%);
}
}
@@ -617,11 +619,21 @@
padding: 0;
}
- .search__input,
.autosuggest-textarea__textarea {
font-size: 16px;
}
+ .search__input {
+ line-height: 18px;
+ font-size: 16px;
+ padding: 15px;
+ padding-right: 30px;
+ }
+
+ .search__icon .fa {
+ top: 15px;
+ }
+
@media screen and (min-width: 360px) {
padding: 10px 0;
}
@@ -677,6 +689,58 @@
margin-top: 10px;
}
}
+
+ .account {
+ padding: 15px 10px;
+ }
+
+ .notification {
+ &__message {
+ margin-left: 48px + 15px * 2;
+ padding-top: 15px;
+ }
+
+ &__favourite-icon-wrapper {
+ left: -32px;
+ }
+
+ .status {
+ padding-top: 8px;
+ }
+
+ .account {
+ padding-top: 8px;
+ }
+
+ .account__avatar-wrapper {
+ margin-left: 17px;
+ margin-right: 15px;
+ }
+ }
+ }
+}
+
+.floating-action-button {
+ position: fixed;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ width: 3.9375rem;
+ height: 3.9375rem;
+ bottom: 1.3125rem;
+ right: 1.3125rem;
+ background: darken($ui-highlight-color, 3%);
+ color: $white;
+ border-radius: 50%;
+ font-size: 21px;
+ line-height: 21px;
+ text-decoration: none;
+ box-shadow: 2px 3px 9px rgba($base-shadow-color, 0.4);
+
+ &:hover,
+ &:focus,
+ &:active {
+ background: lighten($ui-highlight-color, 7%);
}
}
@@ -698,12 +762,41 @@
}
}
+@media screen and (max-width: 600px + (285px * 1) + (10px * 1)) {
+ .columns-area__panels__pane--compositional {
+ display: none;
+ }
+}
+
+@media screen and (min-width: 600px + (285px * 1) + (10px * 1)) {
+ .floating-action-button,
+ .tabs-bar__link.optional {
+ display: none;
+ }
+
+ .search-page .search {
+ display: none;
+ }
+}
+
+@media screen and (max-width: 600px + (285px * 2) + (10px * 2)) {
+ .columns-area__panels__pane--navigational {
+ display: none;
+ }
+}
+
+@media screen and (min-width: 600px + (285px * 2) + (10px * 2)) {
+ .tabs-bar {
+ display: none;
+ }
+}
+
.icon-with-badge {
position: relative;
&__badge {
position: absolute;
- right: -13px;
+ left: 9px;
top: -13px;
background: $ui-highlight-color;
border: 2px solid lighten($ui-base-color, 8%);
@@ -716,6 +809,57 @@
}
}
+.column-link--transparent .icon-with-badge__badge {
+ border-color: darken($ui-base-color, 8%);
+}
+
+.compose-panel {
+ width: 285px;
+ margin-top: 10px;
+ display: flex;
+ flex-direction: column;
+ height: 100%;
+
+ .search__input {
+ line-height: 18px;
+ font-size: 16px;
+ padding: 15px;
+ padding-right: 30px;
+ }
+
+ .search__icon .fa {
+ top: 15px;
+ }
+
+ .navigation-bar {
+ padding-top: 20px;
+ padding-bottom: 20px;
+ }
+
+ .flex-spacer {
+ background: transparent;
+ }
+
+ .autosuggest-textarea__textarea {
+ max-height: 200px;
+ }
+
+ .compose-form__upload-thumbnail {
+ height: 80px;
+ }
+}
+
+.navigation-panel {
+ margin-top: 10px;
+
+ hr {
+ border: 0;
+ background: transparent;
+ border-top: 1px solid lighten($ui-base-color, 4%);
+ margin: 10px 0;
+ }
+}
+
.scrollable {
overflow-y: scroll;
overflow-x: hidden;
@@ -1386,15 +1530,6 @@
height: 1em;
}
-.navigational-toggle {
- padding: 10px;
- display: flex;
- align-items: center;
- justify-content: space-between;
- font-size: 14px;
- color: $dark-text-color;
-}
-
.layout-toggle {
display: flex;
padding: 5px;
diff --git a/app/javascript/flavours/glitch/util/async-components.js b/app/javascript/flavours/glitch/util/async-components.js
index 0949522045..f2aeda834b 100644
--- a/app/javascript/flavours/glitch/util/async-components.js
+++ b/app/javascript/flavours/glitch/util/async-components.js
@@ -149,3 +149,7 @@ export function GettingStartedMisc () {
export function ListAdder () {
return import(/* webpackChunkName: "features/glitch/async/list_adder" */'flavours/glitch/features/list_adder');
}
+
+export function Search () {
+ return import(/*webpackChunkName: "features/glitch/async/search" */'flavours/glitch/features/search');
+}
diff --git a/app/javascript/flavours/glitch/util/initial_state.js b/app/javascript/flavours/glitch/util/initial_state.js
index 99d8a4dbca..72fd2e6f4c 100644
--- a/app/javascript/flavours/glitch/util/initial_state.js
+++ b/app/javascript/flavours/glitch/util/initial_state.js
@@ -28,5 +28,6 @@ export const version = getMeta('version');
export const mascot = getMeta('mascot');
export const isStaff = getMeta('is_staff');
export const defaultContentType = getMeta('default_content_type');
+export const forceSingleColumn = !getMeta('advanced_layout');
export default initialState;