CS-290
/
GoServer
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Make cell change color on corner hover.

This commit is contained in:
Danila Fedorin 2018-06-03 13:09:20 -07:00
parent e1ecf2e0ac
commit 7190ea2ded
2 changed files with 20 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

35
public/css/main.css
View File

@ -22,40 +22,37 @@ body {
margin: auto;
border-radius: 10px; }
.black-player .overlay:hover {
background-image: url("../svg/black.svg"); }
.black-player .board-cell:hover .overlay {
background-color: black; }
.white-player .overlay:hover {
background-image: url("../svg/white.svg"); }
.white-player .board-cell:hover .overlay {
background-color: white; }
.board-cell {
display: inline-block;
position: relative;
background-image: url("../svg/cross.svg");
background-size: 100%;
padding: 5.5555555556%; }
padding: 5.55556%; }
.board-cell .overlay {
position: absolute;
box-sizing: border-box;
top: 0%;
left: 0%;
width: 100%;
height: 100%;
background-image: url("../svg/cross.svg");
transition: background-image .25s;
background-size: 100%; }
top: 10%;
left: 10%;
width: 80%;
height: 80%;
border-radius: 50%;
transition: background-color .25s; }
.board-cell.small {
padding: 5.5555555556%; }
padding: 5.55556%; }
.board-cell.medium {
padding: 3.8461538462%; }
padding: 3.84615%; }
.board-cell.large {
padding: 2.6315789474%; }
padding: 2.63158%; }
.black-cell .overlay {
background-image: url("../svg/black.svg"); }
background-color: black; }
.white-cell .overlay {
background-image: url("../svg/white.svg"); }
background-color: white; }
.split-wrapper {
display: flex;

8
public/scss/main.scss
View File

@ -33,14 +33,14 @@ body {
border-radius: 10px;
}
.black-player .overlay {
&:hover {
.black-player {
.board-cell:hover .overlay {
background-color: black;
}
}
.white-player .overlay {
&:hover {
.white-player {
.board-cell:hover .overlay {
background-color: white;
}
}