diff options
| -rw-r--r-- | app/javascript/mastodon/features/ui/index.js | 9 | ||||
| -rw-r--r-- | app/javascript/styles/basics.scss | 36 | ||||
| -rw-r--r-- | app/serializers/initial_state_serializer.rb | 1 | ||||
| -rwxr-xr-x | app/views/layouts/application.html.haml | 1 |
4 files changed, 16 insertions, 31 deletions
diff --git a/app/javascript/mastodon/features/ui/index.js b/app/javascript/mastodon/features/ui/index.js index 34b59fcc5..8f971ae67 100644 --- a/app/javascript/mastodon/features/ui/index.js +++ b/app/javascript/mastodon/features/ui/index.js @@ -1,5 +1,4 @@ import React from 'react'; -import classNames from 'classnames'; import NotificationsContainer from './containers/notifications_container'; import PropTypes from 'prop-types'; import LoadingBarContainer from './containers/loading_bar_container'; @@ -43,7 +42,6 @@ import { import '../../components/status'; const mapStateToProps = state => ({ - systemFontUi: state.getIn(['meta', 'system_font_ui']), isComposing: state.getIn(['compose', 'is_composing']), }); @@ -58,7 +56,6 @@ export default class UI extends React.PureComponent { static propTypes = { dispatch: PropTypes.func.isRequired, children: PropTypes.node, - systemFontUi: PropTypes.bool, isComposing: PropTypes.bool, location: PropTypes.object, }; @@ -197,12 +194,8 @@ export default class UI extends React.PureComponent { const { width, draggingOver } = this.state; const { children } = this.props; - const className = classNames('ui', { - 'system-font': this.props.systemFontUi, - }); - return ( - <div className={className} ref={this.setRef}> + <div className='ui' ref={this.setRef}> <TabsBar /> <ColumnsAreaContainer ref={this.setColumnsAreaRef} singleColumn={isMobile(width)}> <WrappedSwitch> diff --git a/app/javascript/styles/basics.scss b/app/javascript/styles/basics.scss index 6e87157ec..f18a32201 100644 --- a/app/javascript/styles/basics.scss +++ b/app/javascript/styles/basics.scss @@ -1,4 +1,5 @@ body { + font-family: 'mastodon-font-sans-serif', sans-serif; background: $ui-base-color; background-size: cover; background-attachment: fixed; @@ -13,9 +14,19 @@ body { -webkit-tap-highlight-color: rgba(0,0,0,0); -webkit-tap-highlight-color: transparent; - // This is done because we want to use mastodon-font-sans-serif (a.k.a Roboto) on the `.ui` element in the app UI - &:not(.app-body) { - font-family: 'mastodon-font-sans-serif', sans-serif; + &.system-font { + // system-ui => standard property (Chrome/Android WebView 56+, Opera 43+, Safari 11+) + // -apple-system => Safari <11 specific + // BlinkMacSystemFont => Chrome <56 on macOS specific + // Segoe UI => Windows 7/8/10 + // Oxygen => KDE + // Ubuntu => Unity/Ubuntu + // Cantarell => GNOME + // Fira Sans => Firefox OS + // Droid Sans => Older Androids (<4.0) + // Helvetica Neue => Older macOS <10.11 + // mastodon-font-sans-serif => web-font (Roboto) fallback and newer Androids (>=4.0) + font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", mastodon-font-sans-serif, sans-serif; } &.app-body { @@ -72,22 +83,3 @@ button { align-items: center; justify-content: center; } - -.ui.system-font { - // system-ui => standard property (Chrome/Android WebView 56+, Opera 43+, Safari 11+) - // -apple-system => Safari <11 specific - // BlinkMacSystemFont => Chrome <56 on macOS specific - // Segoe UI => Windows 7/8/10 - // Oxygen => KDE - // Ubuntu => Unity/Ubuntu - // Cantarell => GNOME - // Fira Sans => Firefox OS - // Droid Sans => Older Androids (<4.0) - // Helvetica Neue => Older macOS <10.11 - // mastodon-font-sans-serif => web-font (Roboto) fallback and newer Androids (>=4.0) - font-family: system-ui, -apple-system,BlinkMacSystemFont, "Segoe UI","Oxygen", "Ubuntu","Cantarell","Fira Sans","Droid Sans","Helvetica Neue",mastodon-font-sans-serif, sans-serif; -} - -.ui:not(.system-font) { - font-family: 'mastodon-font-sans-serif', sans-serif; -} diff --git a/app/serializers/initial_state_serializer.rb b/app/serializers/initial_state_serializer.rb index 0ac5e8319..32ffcc688 100644 --- a/app/serializers/initial_state_serializer.rb +++ b/app/serializers/initial_state_serializer.rb @@ -19,7 +19,6 @@ class InitialStateSerializer < ActiveModel::Serializer store[:boost_modal] = object.current_account.user.setting_boost_modal store[:delete_modal] = object.current_account.user.setting_delete_modal store[:auto_play_gif] = object.current_account.user.setting_auto_play_gif - store[:system_font_ui] = object.current_account.user.setting_system_font_ui end store diff --git a/app/views/layouts/application.html.haml b/app/views/layouts/application.html.haml index 82b20810a..0ba0ffc37 100755 --- a/app/views/layouts/application.html.haml +++ b/app/views/layouts/application.html.haml @@ -35,6 +35,7 @@ = yield :header_tags - body_classes ||= @body_classes + - body_classes += ' system-font' if current_account&.user&.setting_system_font_ui %body{ class: add_rtl_body_class(body_classes) } = content_for?(:content) ? yield(:content) : yield |