Fixing lint errors, removed inline styles

parent 3f0c2e8d
import React, { Component } from 'react';
import styles from './App.module.scss';
import style from './App.module.scss';
import { BrowserRouter as Router, Route, Redirect, Switch } from 'react-router-dom';
import PLPPage from 'pages/PLP';
import PDPPage from 'pages/PDP';
......@@ -21,7 +21,7 @@ class App extends Component {
if (loading) {
return (
<LoadingAnimation style={{ height: '100vh' }}></LoadingAnimation>
<LoadingAnimation className={style.loadingAnimation}></LoadingAnimation>
);
}
else {
......
......@@ -4,4 +4,8 @@ body {
box-sizing: border-box;
}
main {}
\ No newline at end of file
main {}
.loadingAnimation {
height: 100vh;
}
\ No newline at end of file
......@@ -50,7 +50,7 @@ class ImageCarousel extends Component {
<div>{`Total images: ${images.length}`}</div>
<div className={style.content}>
<Arrow onArrowClick={this.previousSlide} glyph="&#9664;" />
<img src={curImage.url} />
<img src={curImage.url} alt={curImage.alt} />
<Arrow onArrowClick={this.nextSlide} glyph="&#9654;" />
</div>
<button className={style.closeButton} onClick={onClose}>Close</button>
......
......@@ -4,9 +4,9 @@ import React from "react";
import styles from './LoadingAnimation.module.scss';
function LoadingAnimation(props) {
const { className = '' } = props;
return (
<div className={styles.loadingAnimation} style={props.style} >
<div className={`${styles.loadingAnimation} ${className}`} >
<div className={styles.loader}></div>
</div>
);
......
......@@ -4,7 +4,6 @@
display: flex;
align-items: center;
justify-content: center;
height: 100%;
.loader {
border: 16px solid $gray1;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment