👌 increase option label size
This commit is contained in:
parent
c88bf44490
commit
3ce0a51c49
3 changed files with 10 additions and 5 deletions
|
@ -1,7 +1,7 @@
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import PropTypes from 'prop-types';
|
import PropTypes from 'prop-types';
|
||||||
import styled from 'styled-components';
|
import styled from 'styled-components';
|
||||||
import { prop } from '../../theme';
|
import { prop, remSize } from '../../theme';
|
||||||
|
|
||||||
|
|
||||||
const PreferenceTitle = styled.h4.attrs(props => ({ ...props, className: 'preference__title' }))`
|
const PreferenceTitle = styled.h4.attrs(props => ({ ...props, className: 'preference__title' }))`
|
||||||
|
@ -11,9 +11,12 @@ const PreferenceTitle = styled.h4.attrs(props => ({ ...props, className: 'prefer
|
||||||
const Preference = styled.div.attrs(props => ({ ...props, className: 'preference' }))`
|
const Preference = styled.div.attrs(props => ({ ...props, className: 'preference' }))`
|
||||||
flex-wrap: nowrap !important;
|
flex-wrap: nowrap !important;
|
||||||
align-items: baseline !important;
|
align-items: baseline !important;
|
||||||
justify-items: space-between
|
justify-items: space-between;
|
||||||
`;
|
`;
|
||||||
|
|
||||||
|
const OptionLabel = styled.label.attrs({ className: 'preference__option' })`
|
||||||
|
font-size: ${remSize(14)} !important;
|
||||||
|
`;
|
||||||
|
|
||||||
const Selector = ({
|
const Selector = ({
|
||||||
title, value, onSelect, options,
|
title, value, onSelect, options,
|
||||||
|
@ -32,7 +35,7 @@ const Selector = ({
|
||||||
className="preference__radio-button"
|
className="preference__radio-button"
|
||||||
value={option.value}
|
value={option.value}
|
||||||
checked={value === option.value}
|
checked={value === option.value}
|
||||||
/><label htmlFor={option.id} className="preference__option">{option.label}</label>
|
/><OptionLabel htmlFor={option.id} >{option.label}</OptionLabel>
|
||||||
</React.Fragment>))}
|
</React.Fragment>))}
|
||||||
</div>
|
</div>
|
||||||
</Preference>
|
</Preference>
|
||||||
|
|
|
@ -2,9 +2,11 @@ import PropTypes from 'prop-types';
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import { connect } from 'react-redux';
|
import { connect } from 'react-redux';
|
||||||
import getConfig from '../../utils/getConfig';
|
import getConfig from '../../utils/getConfig';
|
||||||
import DevTools from './components/DevTools';
|
// import DevTools from './components/DevTools';
|
||||||
import { setPreviousPath } from '../IDE/actions/ide';
|
import { setPreviousPath } from '../IDE/actions/ide';
|
||||||
|
|
||||||
|
const DevTools = () => <></>;
|
||||||
|
|
||||||
class App extends React.Component {
|
class App extends React.Component {
|
||||||
constructor(props, context) {
|
constructor(props, context) {
|
||||||
super(props, context);
|
super(props, context);
|
||||||
|
|
|
@ -50,7 +50,7 @@ const MobileIDEView = (props) => {
|
||||||
}
|
}
|
||||||
>
|
>
|
||||||
<IconButton
|
<IconButton
|
||||||
to="/mobile/settings"
|
to="/mobile/preferences"
|
||||||
onClick={() => setOverlay('preferences')}
|
onClick={() => setOverlay('preferences')}
|
||||||
icon={PreferencesIcon}
|
icon={PreferencesIcon}
|
||||||
aria-label="Open preferences menu"
|
aria-label="Open preferences menu"
|
||||||
|
|
Loading…
Reference in a new issue