Commit b03c3069 authored by NERUSU PRANEETH's avatar NERUSU PRANEETH

changed the arrows in phase 1,3

parent 562b22fe
Pipeline #19927 passed with stage
in 2 minutes and 33 seconds
......@@ -81,42 +81,25 @@ Phase4() {
<Container className='Container'>
<Row justify='start'>
{
<Col xs={5.5}></Col>
<Col>
{
this.state.rain ? <ReactRain numDrops="1000"></ReactRain> : null
}
}
</Col>
</Row>
<Row>
<Col xs={0} sm={0} > { this.state.sun ? <Sun> <Cloud /> </Sun> : null } </Col>
<Col xs={10}>{this.state.cloud ? <Cloud /> : null}
<Row>
<Col xs={2.2}> {this.state.arrow ? null : null} </Col >
<Col xs={2.4}> {this.state.arrow ? <A1up /> : null} </Col >
<Col xs={2.4}> {this.state.arrow ? <A1up /> : null} </Col >
<Col xs={2.4}> {this.state.arrow ? <A1up />: null} </Col >
<Col xs={2.4}> {this.state.arrow ? <A1up />: null} </Col >
</Row>
<Row>
<Col xs={1}>
{ this.state.cloud3 ? <Cloud5 /> : null}
</Col>
<Col xs={3}>
{ this.state.cloud3 ? <Cloud /> : null} </Col>
</Row>
</Col>
<Col xs={0} sm={0} > { this.state.sun ? <Sun /> : null } </Col>
<Col xs={8} xs={10}>{this.state.cloud ? <Cloud /> : null} </Col>
</Row>
<Row>
<Col xs={9.8}> {this.state.cloud ? <Cloud />: null} </Col >
</Row>
......@@ -127,7 +110,7 @@ Phase4() {
</Col >
<Col xs={2}>
<Col xs={2} >
{this.state.arrow ? <A1up /> : null}
</Col>
......@@ -140,99 +123,99 @@ Phase4() {
</Col>
<Col xs={2}>
{this.state.arrow ? <A1up /> : null}
{this.state.arrow ? null : null}
</Col>
</Row>
<Row>
<Col xs={2}>
{this.state.arrow ? <A1up /> : null}
{this.state.arrow ? null : null}
</Col >
<Col xs={2}>
{this.state.arrow ? <A1up /> : null}
{this.state.arrow ? null : null}
</Col>
<Col xs={2}>
{this.state.arrow ? <A1up /> : null}
{this.state.arrow ? null : null}
</Col>
<Col xs={2}>
{this.state.arrow ? <A1up /> : null}
{this.state.arrow ? null : null}
</Col>
<Col xs={2}>
{this.state.arrow ? <A1up /> : null}
{this.state.arrow ? null : null}
</Col>
</Row>
<Row>
<Col xs={2}>
{this.state.arrow ? <A1up /> : null}
{this.state.arrow ? null : null}
</Col >
<Col xs={2}>
{this.state.arrow ? <A1up /> : null}
{this.state.arrow ? null : null}
</Col>
<Col xs={2}>
{this.state.arrow ? <A1up /> : null}
{this.state.arrow ? null : null}
</Col>
<Col xs={2}>
{this.state.arrow ? <A1up /> : null}
{this.state.arrow ? null : null}
</Col>
<Col xs={2}>
{this.state.arrow ? <A1up /> : null}
{this.state.arrow ? null : null}
</Col>
</Row>
<Row>
<Col xs={2}>
{this.state.arrow ? <A1up /> : null}
{this.state.arrow ? null : null}
</Col >
<Col xs={2}>
{this.state.arrow ? <A1up /> : null}
{this.state.arrow ? null : null}
</Col>
<Col xs={2}>
{this.state.arrow ? <A1up /> : null}
{this.state.arrow ? null : null}
</Col>
<Col xs={2}>
{this.state.arrow ? <A1up /> : null}
{this.state.arrow ? null : null}
</Col>
<Col xs={2}>
{this.state.arrow ? <A1up /> : null}
{this.state.arrow ? null : null}
</Col>
</Row>
<Row>
<Col xs={2}>
{this.state.arrow ? <A1up /> : null}
{this.state.arrow ? null : null}
</Col >
<Col xs={2}>
{this.state.arrow ? <A1up /> : null}
{this.state.arrow ? null : null}
</Col>
<Col xs={2}>
{this.state.arrow ? <A1up /> : null}
{this.state.arrow ? null : null}
</Col>
<Col xs={2}>
{this.state.arrow ? <A1up /> : null}
{this.state.arrow ? null : null}
</Col>
<Col xs={2}>
{this.state.arrow ? <A1up /> : null}
{this.state.arrow ? null : null}
</Col>
</Row>
......@@ -258,6 +241,7 @@ Phase4() {
</Container>
</Col>
<Col sm={2}>
<Row>
......@@ -312,8 +296,8 @@ Phase4() {
<Button onClick={() => this.Phase3()} className="B2">
<Flippy
style={{ width: '290px', height: '238px' }}
flipOnHover={false}
flipOnClick={true}
flipOnHover={true}
flipOnClick={false}
flipDirection="horizontal"
>
......@@ -321,7 +305,7 @@ Phase4() {
<img src={P3} style={{ maxWidth: '100%', maxHeight: '100%' }} />
</FrontSide>
<BackSide style={{ backgroundColor: '#175852'}}> DATA </BackSide>
<BackSide style={{ backgroundColor: '#175852'}}> EVAPORATION </BackSide>
</Flippy>
</Button>
......@@ -336,7 +320,7 @@ Phase4() {
<Flippy
style={{ width: '290px', height: '238px' }}
flipOnHover={false}
flipOnClick={true}
flipOnClick={true}
flipDirection="horizontal"
>
......
import React, { Component } from 'react';
import SmoothImage from 'react-smooth-image';
import 'react-marquee';
import a1up from './images/a2.png';
import a1up from './images/AUpCurve.png';
class A1up extends Component {
render() {
return (
<div >
<header >
<marquee direction={"up"} scrollamount={"80"} scrolldelay={"200"}><img src={a1up} className="A1up" /></marquee>
<marquee Height={"500x"} direction={"up"} scrollamount={"80"} scrolldelay={"200"}><img src={a1up} className="A1up" /></marquee>
</header>
</div>
);
......
import React, { Component } from 'react';
import 'react-marquee';
import a3 from './images/a1down.png';
import a3 from './images/A2DownCurve.png';
import './App.css';
class A2Down extends Component {
render() {
return (
<div> <marquee direction={"down"} scrollamount={"15"}>
<div> <marquee Height={"600px"}direction={"down"} scrollamount={"50"}>
<img src={a3} />
<img src={a3} />
<img src={a3} /><br />
</marquee>
<marquee direction={"down"} scrollamount={"30"}>
<img src={a3} />
<img src={a3} />
<img src={a3} /> <br />
</marquee>
<marquee direction={"down"} scrollamount={"60"}>
<img src={a3} />
<img src={a3} />
<img src={a3} />
</marquee>
</div>);
}
}
......
import React, { Component } from 'react';
import 'react-marquee';
import a3 from './images/a1left.png';
import a3 from './images/A2leftCurve.png';
import './App.css';
class A2Left extends Component {
render() {
return (
<div>
<marquee direction={"left"} scrollamount={"120"}>
<img src={a3} />
<img src={a3} />
<img src={a3} />
</marquee>
<marquee direction={"left"} scrollamount={"60"}>
<marquee direction={"left"} scrollamount={"100"}>
<img src={a3} />
<img src={a3} />
<img src={a3} /><br />
</marquee>
<marquee direction={"left"} scrollamount={"30"}>
<marquee direction={"left"} scrollamount={"100"}>
<img src={a3} />
<img src={a3} />
<img src={a3} /> <br />
</marquee>
<marquee direction={"left"} scrollamount={"15"}>
<marquee direction={"left"} scrollamount={"100"}>
<img src={a3} />
<img src={a3} />
<img src={a3} />
......
......@@ -58,7 +58,7 @@
cursor: pointer;
margin: 5px 2px;
}
.Cloud:hover{
.Cloud{
float:right;
}
......@@ -79,7 +79,7 @@ float:right;
text-align: center;
}
.A1up:hover{
.A1up{
float: right;
align-items:left;
-webkit-animation-name: mymove; /* Safari 4.0 - 8.0 */
......
......@@ -10,7 +10,7 @@ class Cloud extends Component {
render() {
return (
<div>
<marquee behavior={"slide"} direction={"right"} scrollamount={"5"}>
<marquee behavior={"slide"} direction={"right"} scrollamount={"25"}>
<img className="Cloud" src={cloud}/>
<img className="Cloud" src={cloud}/>
......
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