mirror of
https://github.com/ansible/awx.git
synced 2024-10-31 15:21:13 +03:00
add shared DataListCell component
This commit is contained in:
parent
d8452e1259
commit
22dbe5c0f9
14
src/components/DataListCell/DataListCell.jsx
Normal file
14
src/components/DataListCell/DataListCell.jsx
Normal file
@ -0,0 +1,14 @@
|
||||
import { DataListCell as PFDataListCell } from '@patternfly/react-core';
|
||||
import styled from 'styled-components';
|
||||
|
||||
const DataListCell = styled(PFDataListCell)`
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding-bottom: ${props => (props.righthalf ? '16px' : '8px')};
|
||||
@media screen and (min-width: 768px) {
|
||||
padding-bottom: 0;
|
||||
justify-content: ${props => (props.lastcolumn ? 'flex-end' : 'inherit')};
|
||||
}
|
||||
`;
|
||||
|
||||
export default DataListCell;
|
11
src/components/DataListCell/DataListCell.test.jsx
Normal file
11
src/components/DataListCell/DataListCell.test.jsx
Normal file
@ -0,0 +1,11 @@
|
||||
import React from 'react';
|
||||
import { mountWithContexts } from '@testUtils/enzymeHelpers';
|
||||
|
||||
import DataListCell from './DataListCell';
|
||||
|
||||
describe('DataListCell', () => {
|
||||
test('renders without failing', () => {
|
||||
const wrapper = mountWithContexts(<DataListCell />);
|
||||
expect(wrapper).toHaveLength(1);
|
||||
});
|
||||
});
|
1
src/components/DataListCell/index.js
Normal file
1
src/components/DataListCell/index.js
Normal file
@ -0,0 +1 @@
|
||||
export { default } from './DataListCell';
|
@ -5,21 +5,12 @@ import {
|
||||
DataListItemRow,
|
||||
DataListItemCells,
|
||||
DataListCheck,
|
||||
DataListCell as PFDataListCell,
|
||||
} from '@patternfly/react-core';
|
||||
import styled from 'styled-components';
|
||||
|
||||
import DataListCell from '@components/DataListCell';
|
||||
import VerticalSeparator from '@components/VerticalSeparator';
|
||||
import { toTitleCase } from '@util/strings';
|
||||
|
||||
const DataListCell = styled(PFDataListCell)`
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@media screen and (min-width: 768px) {
|
||||
padding-bottom: 0;
|
||||
}
|
||||
`;
|
||||
|
||||
class JobListItem extends Component {
|
||||
render () {
|
||||
const {
|
||||
|
@ -8,13 +8,13 @@ import {
|
||||
DataListItemRow,
|
||||
DataListItemCells,
|
||||
DataListCheck,
|
||||
DataListCell as PFDataListCell,
|
||||
} from '@patternfly/react-core';
|
||||
import {
|
||||
Link
|
||||
} from 'react-router-dom';
|
||||
import styled from 'styled-components';
|
||||
|
||||
import DataListCell from '@components/DataListCell';
|
||||
import VerticalSeparator from '@components/VerticalSeparator';
|
||||
import { Organization } from '@types';
|
||||
|
||||
@ -38,16 +38,6 @@ const ListGroup = styled.span`
|
||||
}
|
||||
`;
|
||||
|
||||
const DataListCell = styled(PFDataListCell)`
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding-bottom: ${props => (props.righthalf ? '16px' : '8px')};
|
||||
|
||||
@media screen and (min-width: 768px) {
|
||||
padding-bottom: 0;
|
||||
}
|
||||
`;
|
||||
|
||||
class OrganizationListItem extends React.Component {
|
||||
static propTypes = {
|
||||
organization: Organization.isRequired,
|
||||
|
@ -5,23 +5,13 @@ import {
|
||||
DataListItemRow,
|
||||
DataListItemCells,
|
||||
DataListCheck,
|
||||
DataListCell as PFDataListCell,
|
||||
} from '@patternfly/react-core';
|
||||
import styled from 'styled-components';
|
||||
|
||||
import VerticalSeparator from '@components/VerticalSeparator';
|
||||
import DataListCell from '@components/DataListCell';
|
||||
import LaunchButton from '@components/LaunchButton';
|
||||
import VerticalSeparator from '@components/VerticalSeparator';
|
||||
import { toTitleCase } from '@util/strings';
|
||||
|
||||
const DataListCell = styled(PFDataListCell)`
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@media screen and (min-width: 768px) {
|
||||
padding-bottom: 0;
|
||||
justify-content: ${props => (props.lastcolumn ? 'flex-end' : 'inherit')};
|
||||
}
|
||||
`;
|
||||
|
||||
class TemplateListItem extends Component {
|
||||
render () {
|
||||
const {
|
||||
|
Loading…
Reference in New Issue
Block a user