Skip to content
This repository was archived by the owner on Jan 19, 2023. It is now read-only.

Commit 5046995

Browse files
fritz-cfritz-c
committed
Remove deprecated classes. Fixes #16 
1 parent bd542aa commit 5046995

File tree

2 files changed

+15
-33
lines changed

2 files changed

+15
-33
lines changed

‎README.md‎

Lines changed: 0 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -72,14 +72,7 @@ export default class LightboxExample extends Component {
7272
}
7373
}
7474

75-
7675
```
77-
78-
## Deprecation Notice
79-
80-
All unprefixed classes (listed below) will be removed in v4.0.0. Use their `ril-` prefixed alternatives instead.
81-
`close`, `closing`, `download-blocker`, `image-current`, `image-next`, `image-prev`, `inner`, `next-button`, `not-loaded`, `outer`, `prev-button`, `toolbar`, `toolbar-left`, `toolbar-right`, `zoom-in`, `zoom-out`
82-
8376
## Options
8477

8578
Property | Type | Default | Required | Description
@@ -116,7 +109,6 @@ enableZoom | bool | `true` | | Set to false to disab
116109
| Firefox | Yes |
117110
| Safari | Yes |
118111
| IE >= 10 | Yes |
119-
| IE 9 | Everything works, but no animations |
120112

121113
## Contributing
122114

‎src/react-image-lightbox.js‎

Lines changed: 15 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -1307,7 +1307,7 @@ class ReactImageLightbox extends Component {
13071307
// Fall back to loading icon if the thumbnail has not been loaded
13081308
images.push(
13091309
<div
1310-
className={`${imageClass} ${styles.image} not-loaded ril-not-loaded`}
1310+
className={`${imageClass} ${styles.image} ril-not-loaded`}
13111311
style={imageStyle}
13121312
key={this.props[srcType] + keyEndings[srcType]}
13131313
>
@@ -1334,7 +1334,7 @@ class ReactImageLightbox extends Component {
13341334
style={imageStyle}
13351335
key={imageSrc + keyEndings[srcType]}
13361336
>
1337-
<div className={`download-blocker ril-download-blocker ${styles.downloadBlocker}`} />
1337+
<div className={`ril-download-blocker ${styles.downloadBlocker}`} />
13381338
</div>
13391339
);
13401340
} else {
@@ -1358,13 +1358,13 @@ class ReactImageLightbox extends Component {
13581358
// Next Image (displayed on the right)
13591359
addImage(
13601360
'nextSrc',
1361-
`image-next ril-image-next ${styles.imageNext}`,
1361+
`ril-image-next ${styles.imageNext}`,
13621362
ReactImageLightbox.getTransform({ x: boxSize.width })
13631363
);
13641364
// Main Image
13651365
addImage(
13661366
'mainSrc',
1367-
'image-current ril-image-current',
1367+
'ril-image-current',
13681368
ReactImageLightbox.getTransform({
13691369
x: -1 * offsetX,
13701370
y: -1 * offsetY,
@@ -1374,7 +1374,7 @@ class ReactImageLightbox extends Component {
13741374
// Previous Image (displayed on the left)
13751375
addImage(
13761376
'prevSrc',
1377-
`image-prev ril-image-prev ${styles.imagePrev}`,
1377+
`ril-image-prev ${styles.imagePrev}`,
13781378
ReactImageLightbox.getTransform({ x: -1 * boxSize.width })
13791379
);
13801380

@@ -1424,15 +1424,6 @@ class ReactImageLightbox extends Component {
14241424
},
14251425
};
14261426

1427-
// DEPRECATION NOTICE
1428-
// All unprefixed classes (listed below) will be removed in v4.0.0.
1429-
// Use their `ril-` prefixed alternatives instead.
1430-
//
1431-
// DEPRECATED: close, closing, download-blocker, image-current,
1432-
// image-next, image-prev, inner, next-button, not-loaded,
1433-
// outer, prev-button, toolbar, toolbar-left, toolbar-right,
1434-
// zoom-in, zoom-out
1435-
14361427
return (
14371428
<Modal
14381429
isOpen
@@ -1443,8 +1434,8 @@ class ReactImageLightbox extends Component {
14431434
>
14441435
<div // eslint-disable-line jsx-a11y/no-static-element-interactions
14451436
// Floating modal with closing animations
1446-
className={`outer ril-outer ${styles.outer} ${styles.outerAnimating}` +
1447-
(isClosing ? ` closing ril-closing ${styles.outerClosing}` : '')
1437+
className={`ril-outer ${styles.outer} ${styles.outerAnimating}` +
1438+
(isClosing ? ` ril-closing ${styles.outerClosing}` : '')
14481439
}
14491440
style={{
14501441
transition: `opacity ${animationDuration}ms`,
@@ -1464,7 +1455,7 @@ class ReactImageLightbox extends Component {
14641455

14651456
<div // eslint-disable-line jsx-a11y/no-static-element-interactions
14661457
// Image holder
1467-
className={`inner ril-inner ${styles.inner}`}
1458+
className={`ril-inner ${styles.inner}`}
14681459
onClick={clickOutsideToClose ? this.closeIfClickInner : noop}
14691460
>
14701461
{images}
@@ -1473,7 +1464,7 @@ class ReactImageLightbox extends Component {
14731464
{prevSrc &&
14741465
<button // Move to previous image button
14751466
type="button"
1476-
className={`prev-button ril-prev-button ${styles.navButtons} ${styles.navButtonPrev}`}
1467+
className={`ril-prev-button ${styles.navButtons} ${styles.navButtonPrev}`}
14771468
key="prev"
14781469
onClick={!this.isAnimating() ? this.requestMovePrev : noop} // Ignore clicks during animation
14791470
/>
@@ -1482,16 +1473,16 @@ class ReactImageLightbox extends Component {
14821473
{nextSrc &&
14831474
<button // Move to next image button
14841475
type="button"
1485-
className={`next-button ril-next-button ${styles.navButtons} ${styles.navButtonNext}`}
1476+
className={`ril-next-button ${styles.navButtons} ${styles.navButtonNext}`}
14861477
key="next"
14871478
onClick={!this.isAnimating() ? this.requestMoveNext : noop} // Ignore clicks during animation
14881479
/>
14891480
}
14901481

14911482
<div // Lightbox toolbar
1492-
className={`toolbar ril-toolbar ${styles.toolbar}`}
1483+
className={`ril-toolbar ${styles.toolbar}`}
14931484
>
1494-
<ul className={`toolbar-left ril-toolbar-left ${styles.toolbarSide} ${styles.toolbarLeftSide}`}>
1485+
<ul className={`ril-toolbar-left ${styles.toolbarSide} ${styles.toolbarLeftSide}`}>
14951486
<li className={`ril-toolbar__item ${styles.toolbarItem}`}>
14961487
<span className={`ril-toolbar__item__child ${styles.toolbarItemChild}`}>
14971488
{imageTitle}
@@ -1501,7 +1492,6 @@ class ReactImageLightbox extends Component {
15011492

15021493
<ul
15031494
className={[
1504-
'toolbar-right',
15051495
'ril-toolbar-right',
15061496
styles.toolbarSide,
15071497
styles.toolbarRightSide,
@@ -1516,7 +1506,7 @@ class ReactImageLightbox extends Component {
15161506
<button // Lightbox zoom in button
15171507
type="button"
15181508
key="zoom-in"
1519-
className={`zoom-in ril-zoom-in ${zoomInButtonClasses.join(' ')}`}
1509+
className={`ril-zoom-in ${zoomInButtonClasses.join(' ')}`}
15201510
onClick={zoomInButtonHandler}
15211511
/>
15221512
</li>
@@ -1527,7 +1517,7 @@ class ReactImageLightbox extends Component {
15271517
<button // Lightbox zoom out button
15281518
type="button"
15291519
key="zoom-out"
1530-
className={`zoom-out ril-zoom-out ${zoomOutButtonClasses.join(' ')}`}
1520+
className={`ril-zoom-out ${zoomOutButtonClasses.join(' ')}`}
15311521
onClick={zoomOutButtonHandler}
15321522
/>
15331523
</li>
@@ -1537,7 +1527,7 @@ class ReactImageLightbox extends Component {
15371527
<button // Lightbox close button
15381528
type="button"
15391529
key="close"
1540-
className={'close ril-close ril-toolbar__item__child' +
1530+
className={'ril-close ril-toolbar__item__child' +
15411531
` ${styles.toolbarItemChild} ${styles.builtinButton} ${styles.closeButton}`
15421532
}
15431533
onClick={!this.isAnimating() ? this.requestClose : noop} // Ignore clicks during animation

0 commit comments

Comments
 (0)