rushilwiz/website
1
0
Fork 0
mirror of https://github.com/PotentiaRobotics/website.git synced 2025-04-16 10:20:20 -04:00
Code Issues Actions Packages Projects Releases Wiki Activity

Better styling

Browse Source
This commit is contained in:
Ram Reddy 2021-07-13 18:01:36 -04:00
parent 2720a03db2
commit 799dfd23d3
4 changed files with 37 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
src/components/About.js
View File

@ -14,6 +14,7 @@ import kedar from './assets/img/Kedar.PNG'
import icon from './assets/img/aboutlogo.PNG'
import raghav from './assets/img/Raghav.PNG'
import shruti from './assets/img/shruti.png'
import group from './assets/img/group.png'
import classnames from 'classnames'
import GroupPhoto from './assets/img/team_picture.png'
@ -62,12 +63,15 @@ class About extends Component {
return (
<body className="backColor">
<h1 id='title'>About Us</h1>
<h1 id='title'><span className="backColor3" >About Us</span></h1>
<Container fluid id='container'>
{/* Put something else here later */}
<Row>
<Col sm={{ size: 6, order: 2, offset: 1 }}><img className="imgStyle" id = "teamimage" src = {group} alt = "Group Pic"></img></Col>
<Col sm={{ size: 6, order: 2, offset: 1 }}><p className="rowColor" id = "ourDescription">Potentia Robotics is the first high school team building a fully-functional humanoid robot. It is run entirely by students from Thomas Jefferson High School for Science and Technology (TJHSST). Our goal is to build Olympian, a 6-foot tall, low-cost bipedal humanoid robot with a human-like dynamically stable gait, limb mobility, and balance capabilities, that can be controlled effectively and efficiently from afar.</p></Col>
</Row>
</Container>
<Tabs>
<Tabs className="backColor2">
<TabList>
<Tab>Leadership</Tab>
<Tab>Programming Subteam</Tab>
@ -89,7 +93,7 @@ class About extends Component {
</Col>
<Col sm={{ size: 6, order: 2, offset: 1 }}>
<img src={adi} alt='Image of Team member' />
<img className="imgStyle2" src={adi} alt='Image of Team member' />
</Col>
</Row>

25
src/components/assets/About.scss
View File

@ -6,10 +6,24 @@
}
.backColor {
background-color: #293241;
background-color: #3D5A80;
color: #E0FBFC;
}
.imgStyle {
border: 15px solid #98C1D9;
padding: 10px;
}
.imgStyle2 {
border: 5px solid #EE6C4D;
padding: 5px;
}
.backColor2 {
background-color: #293241;
}
.nameStyle {
display:inline-block;
border-bottom:2px solid#98C1D9;
@ -62,6 +76,13 @@ img{
}
.simple-highlight{
background-color: #E0FBFC;
background-color: #98C1D9;
color:#293241;
padding:0.1em 0.2em;
}
.backColor3 {
background-color: #E0FBFC;
color:#3D5A80;
padding:0.1em 0.2em;
}

BIN
src/components/assets/img/group.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 311 KiB

9
src/components/assets/react-tabs.scss
View File

@ -2,7 +2,7 @@
-webkit-tap-highlight-color: transparent;
&__tab-list {
border-bottom: 1px solid #98C1D9;
border-bottom: 1px solid #293241;
margin: 0 0 10px;
padding: 0;
}
@ -19,14 +19,15 @@
background-color:#98C1D9;
&--selected {
background: #EE6C4D;
background: #293241;
border-color: #aaa;
color: #E0FBFC;
color: #98C1D9;
border-radius: 5px 5px 0 0;
}
&--disabled {
color: #E0FBFC;
color: #293241;
background-color:#98C1D9;
cursor: default;
}