Mirrors/unleash.unleash
1
0
Fork 0
mirror of https://github.com/Unleash/unleash.git synced 2025-01-25 00:07:47 +01:00
Code Issues Projects Releases Wiki Activity

fix: minor css tweaks for mobile

Browse Source
This commit is contained in:
Ivar Conradi Østhus 2020-09-25 22:09:18 +02:00
parent 97decf801a
commit 1759bfe911
3 changed files with 25 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
frontend/src/component/feature/form/form-update-feature-component.jsx
View File

@ -2,6 +2,8 @@ import React, { Component } from 'react';
import PropTypes from 'prop-types';
import StrategiesSection from './strategies-section-container';
import styles from './strategy.scss';
import { FormButtons } from './../../common';
class UpdateFeatureComponent extends Component {
@ -32,7 +34,7 @@ class UpdateFeatureComponent extends Component {
return (
<form onSubmit={onSubmit(input, features)}>
<section style={{ padding: '16px' }}>
<section className={styles.paddingDesktop}>
<StrategiesSection
configuredStrategies={configuredStrategies}
featureToggleName={input.name}

12
frontend/src/component/feature/form/strategy.scss
View File

@ -64,3 +64,15 @@
display: inline-block;
vertical-align: bottom;
}
.paddingDesktop {
padding: 16px;
}
@media (max-width: 500px) {
.paddingDesktop {
padding: 0;
}
}

14
frontend/src/component/feature/view-component.jsx
View File

@ -205,7 +205,9 @@ export default class ViewFeatureToggleComponent extends React.Component {
checked={featureToggle.enabled}
onChange={() => toggleFeature(!featureToggle.enabled, featureToggle.name)}
>
{featureToggle.enabled ? 'Enabled' : 'Disabled'}
<span className="mdl-cell--hide-phone">
{featureToggle.enabled ? 'Enabled' : 'Disabled'}
</span>
</Switch>
) : (
<Switch disabled ripple checked={featureToggle.enabled}>
@ -250,10 +252,14 @@ export default class ViewFeatureToggleComponent extends React.Component {
tabBarProps={{ style: { width: '100%' } }}
className="mdl-color--grey-100"
>
<Tab onClick={() => this.goToTab('strategies', featureToggleName)}>Strategies</Tab>
<Tab onClick={() => this.goToTab('strategies', featureToggleName)}>Activation</Tab>
<Tab onClick={() => this.goToTab('view', featureToggleName)}>Metrics</Tab>
<Tab onClick={() => this.goToTab('variants', featureToggleName)}>Variants</Tab>
<Tab onClick={() => this.goToTab('history', featureToggleName)}>History</Tab>
<Tab onClick={() => this.goToTab('variants', featureToggleName)}>
V<span className="mdl-cell--hide-phone">ariants</span>
</Tab>
<Tab onClick={() => this.goToTab('history', featureToggleName)}>
L<span className="mdl-cell--hide-phone">og</span>
</Tab>
</Tabs>
{tabContent}
</Card>