Skip to content

Commit 8a63fcd

Browse files
committed
Merge branch 'master' of github.com:ModusCreateOrg/extjs-reactjs-examples
2 parents a8411f5 + e87e28c commit 8a63fcd

File tree

6 files changed

+51
-43
lines changed

6 files changed

+51
-43
lines changed

19-tabpanel/a-tabpanel/src/Tab.css

Lines changed: 0 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -6,26 +6,6 @@
66
.tab:hover {
77
background-color: #d8d8d8;
88
}
9-
.tab-panel.top .tab,
10-
.tab-panel.bottom .tab {
11-
padding: 12px 6px;
12-
}
13-
.tab-panel.left .tab,
14-
.tab-panel.right .tab {
15-
padding: 6px 12px;
16-
}
17-
.tab-panel.top .tab.active {
18-
border-bottom-color: #1e8bfb;
19-
}
20-
.tab-panel.left .tab.active {
21-
border-right-color: #1e8bfb;
22-
}
23-
.tab-panel.bottom .tab.active {
24-
border-top-color: #1e8bfb;
25-
}
26-
.tab-panel.right .tab.active {
27-
border-left-color: #1e8bfb;
28-
}
299
.tab.active:hover {
3010
background-color: transparent;
3111
}

19-tabpanel/a-tabpanel/src/Tab.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,10 +5,10 @@ import './Tab.css';
55

66
const Tab = props => {
77
const { tabtext, icon, activetab, cardindex, onClick } = props,
8-
isActive = activetab === cardindex ? 'active' : '';
8+
isActive = activetab === cardindex ? ' active' : '';
99

1010
return (
11-
<div className={`tab ${isActive}`} onClick={onClick}>
11+
<div className={`tab${isActive}`} onClick={onClick}>
1212
{icon ? <FontAwesome icon={Icons[`fa${icon}`]} /> : ''}
1313
{tabtext}
1414
</div>

19-tabpanel/a-tabpanel/src/TabPanel.css

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -30,6 +30,27 @@
3030
.tab-panel.right .tab-strip {
3131
flex-direction: column;
3232
}
33+
34+
.tab-panel.top .tab,
35+
.tab-panel.bottom .tab {
36+
padding: 12px 6px;
37+
}
38+
.tab-panel.left .tab,
39+
.tab-panel.right .tab {
40+
padding: 6px 12px;
41+
}
42+
.tab-panel.top .tab.active {
43+
border-bottom-color: #1e8bfb;
44+
}
45+
.tab-panel.left .tab.active {
46+
border-right-color: #1e8bfb;
47+
}
48+
.tab-panel.bottom .tab.active {
49+
border-top-color: #1e8bfb;
50+
}
51+
.tab-panel.right .tab.active {
52+
border-left-color: #1e8bfb;
53+
}
3354

3455
.card-ct {
3556
flex: 1;

19-tabpanel/a-tabpanel/src/TabPanel.js

Lines changed: 11 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -35,15 +35,17 @@ class TabPanel extends Component {
3535
</div>
3636
<div className="card-ct">
3737
{React.Children.map(children, (child, i) => {
38-
const { className } = child.props,
39-
isActive = i === activetab ? 'active' : '',
40-
cardProps = {
41-
...child.props,
42-
43-
className: `${className} card ${isActive}`,
44-
cardindex: i,
45-
activetab: activetab
46-
};
38+
let { className } = child.props;
39+
className = className ? ` ${className}` : '';
40+
41+
const isActive = i === activetab ? ' active' : '';
42+
const cardProps = {
43+
...child.props,
44+
45+
className: `card${className}${isActive}`,
46+
cardindex: i,
47+
activetab: activetab
48+
};
4749

4850
return React.cloneElement(child, cardProps);
4951
})}

20-carousel/a-carousel/src/Carousel.css

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -70,7 +70,7 @@
7070
background-color: #b5b5b5;
7171
}
7272
.nav-strip .nav.active .nav-dot {
73-
background-color: #1e8bfb !important;
73+
background-color: #1e8bfb;
7474
}
7575

7676
.carousel .card {

20-carousel/a-carousel/src/Carousel.js

Lines changed: 16 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -18,15 +18,18 @@ class Carousel extends Component {
1818
}
1919

2020
render () {
21-
const { children, className, position } = this.props;
21+
let { className } = this.props;
22+
className = className ? ` ${className}` : '';
23+
24+
const { children, position } = this.props;
2225
const { activecard } = this.state;
2326
const xPositions = ['top', 'bottom'],
2427
axis = xPositions.includes(position) ? 'x' : 'y';
2528

2629
return (
2730
<div
2831
{...this.props}
29-
className = {`${className} carousel ${position}`}
32+
className = {`carousel ${position}${className}`}
3033
>
3134
<div className={`nav-strip`}>
3235
{React.Children.map(children, (child, i) => {
@@ -47,15 +50,17 @@ class Carousel extends Component {
4750
axis={axis}
4851
>
4952
{React.Children.map(children, (child, i) => {
50-
const { className } = child.props,
51-
isActive = (i === activecard) ? 'active' : '',
52-
cardProps = {
53-
...child.props,
54-
style : {flex: 1},
55-
className : `${className} card ${isActive}`,
56-
cardindex : i,
57-
activecard
58-
};
53+
let { className } = child.props;
54+
className = className ? ` ${className}` : '';
55+
56+
const isActive = (i === activecard) ? ' active' : '';
57+
const cardProps = {
58+
...child.props,
59+
style : {flex: 1},
60+
className : ` card${isActive}${className}`,
61+
cardindex : i,
62+
activecard
63+
};
5964

6065
return React.cloneElement(child, cardProps);
6166
})}

0 commit comments

Comments
 (0)