Merge branch 'demo' into 'develop'

Add "demo" mode for taking screenshots

See merge request soapbox-pub/soapbox-fe!1007
This commit is contained in:
Alex Gleason 2022-01-27 01:52:06 +00:00
commit f0051b7bbc
3 changed files with 12 additions and 3 deletions

View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 95 95" width="100" height="100"><path d="M94.909 19.374C94.909 8.674 86.235 0 75.534 0c-10.647 0-19.28 8.591-19.365 19.217l-15.631 2.09c-1.961-6.007-7.598-10.35-14.258-10.35-8.284 0-15.002 6.716-15.002 15.002 0 6.642 4.321 12.267 10.303 14.24l-2.205 16.056c-10.66.049-19.285 8.7-19.285 19.37C.091 86.325 8.765 95 19.466 95c10.677 0 19.332-8.638 19.37-19.304l18.093-2.501c1.979 5.972 7.598 10.285 14.234 10.285 8.284 0 15.002-6.716 15.002-15.002 0-6.891-4.652-12.682-10.983-14.441l1.365-15.339c10.229-.53 18.363-8.966 18.363-19.324zM56.194 67.8l-18.116 2.505a19.39 19.39 0 0 0-13.312-13.3l2.205-16.077a14.98 14.98 0 0 0 14.27-14.222l15.655-2.094c1.894 6.757 7.351 12.009 14.225 13.612l-1.365 15.322c-7.4.688-13.224 6.753-13.562 14.254z" fill="#0482d8"/></svg>

After

Width:  |  Height:  |  Size: 812 B

View file

@ -54,6 +54,9 @@ const mapStateToProps = (state) => {
const soapboxConfig = getSoapboxConfig(state);
const locale = settings.get('locale');
// In demo mode, force the default brand color
const brandColor = settings.get('demo') ? '#0482d8' : soapboxConfig.get('brandColor');
return {
showIntroduction,
me,
@ -63,11 +66,11 @@ const mapStateToProps = (state) => {
dyslexicFont: settings.get('dyslexicFont'),
demetricator: settings.get('demetricator'),
locale: validLocale(locale) ? locale : 'en',
themeCss: generateThemeCss(soapboxConfig.get('brandColor')),
themeCss: generateThemeCss(brandColor),
brandColor: soapboxConfig.get('brandColor'),
themeMode: settings.get('themeMode'),
halloween: settings.get('halloween'),
customCss: soapboxConfig.get('customCss'),
customCss: settings.get('demo') ? null : soapboxConfig.get('customCss'),
};
};

View file

@ -6,6 +6,7 @@ import { FormattedMessage, injectIntl, defineMessages } from 'react-intl';
import { connect } from 'react-redux';
import { Link, NavLink, withRouter } from 'react-router-dom';
import { getSettings } from 'soapbox/actions/settings';
import { getSoapboxConfig } from 'soapbox/actions/soapbox';
import Icon from 'soapbox/components/icon';
import IconWithCounter from 'soapbox/components/icon_with_counter';
@ -168,10 +169,14 @@ const mapStateToProps = state => {
const reportsCount = state.getIn(['admin', 'openReports']).count();
const approvalCount = state.getIn(['admin', 'awaitingApproval']).count();
const instance = state.get('instance');
const settings = getSettings(state);
// In demo mode, use the Soapbox logo
const logo = settings.get('demo') ? require('images/soapbox-logo.svg') : getSoapboxConfig(state).get('logo');
return {
account: state.getIn(['accounts', me]),
logo: getSoapboxConfig(state).get('logo'),
logo,
features: getFeatures(instance),
notificationCount: state.getIn(['notifications', 'unread']),
chatsCount: state.getIn(['chats', 'items']).reduce((acc, curr) => acc + Math.min(curr.get('unread', 0), 1), 0),