Commit 1c3842c8 authored by Alexander Kotov's avatar Alexander Kotov

add static tower component

parent fc0c4f8b
#root {
display: flex;
flex-direction: column;
}
.Board {
display: flex;
}
\ No newline at end of file
import React, { Component } from 'react';
import './App.css';
import React, { Component } from 'react'
import './App.css'
import Tower from './components/Tower/Tower.jsx'
class App extends Component {
render() {
return (
<div>
<div className="Board">
<Tower></Tower>
<Tower></Tower>
<Tower></Tower>
</div>
);
}
}
export default App;
export default App
.Tower {
flex-grow: 1;
margin: 0 5vw;
}
.Disk {
margin: auto;
height: 2vw;
border-radius: .3vw;
}
\ No newline at end of file
import React, { Component } from 'react'
import './Tower.css'
export default class Tower extends Component {
render() {
return (
<div className="Tower">
<div className="Disk" style={{backgroundColor: '#669BBC', width: '20%'}}></div>
<div className="Disk" style={{backgroundColor: '#A8C686', width: '40%'}}></div>
<div className="Disk" style={{backgroundColor: '#F3A712', width: '60%'}}></div>
<div className="Disk" style={{backgroundColor: '#29335C', width: '80%'}}></div>
<div className="Disk" style={{backgroundColor: '#E4572E', width: '100%'}}></div>
</div>
)
}
}
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