haunter/sharechess
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

WIP

Browse Source
This commit is contained in:
Maciej Caderek
2022-02-14 22:56:07 +01:00
parent 15ccd8acbf
commit c8fd7a05f1
13 changed files with 94 additions and 47 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/ui/components/Boards.css
View File

@@ -1,5 +1,7 @@
.boards {
text-align: center;
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
}
.boards__ico {

5
src/ui/components/Controls.css
View File

@@ -4,7 +4,7 @@
}
.controls {
background: #0e0e13;
background: var(--color-bg-block);
height: 100%;
padding: 20px;
border-bottom-left-radius: 5px;
@@ -15,7 +15,6 @@
margin: 3px;
padding: 5px;
font-size: 3rem;
background: rgb(0, 173, 136);
text-align: center;
border-radius: 5px;
width: 44px;
@@ -23,7 +22,7 @@
}
.controls__button:hover {
background: rgb(0, 207, 162);
background: var(--color-btn-light);
cursor: pointer;
}

11
src/ui/components/GameTabs.css
View File

@@ -16,17 +16,22 @@
border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
height: 38px;
background: var(--color-tab);
}
.game-tabs__btn:hover {
background: var(--color-tab-light);
}
.game-tabs__btn--active {
width: 50%;
background: #0e0e13;
color: #aaa;
background: var(--color-bg-block);
color: var(--color-text);
cursor: default;
}
.game-tabs__btn--active:hover {
background: #0e0e13;
background: var(--color-bg-block);
}
.game-tabs__btn:nth-child(1) {

4
src/ui/components/Load.css
View File

@@ -1,5 +1,5 @@
.load {
background: #0e0e13;
background: var(--color-bg-block);
padding: 20px;
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
@@ -39,7 +39,7 @@
.load__pgn-file-info p {
margin-top: 10px;
color: #677794;
color: var(--color-text-dimmed);
}
.load__link-input {

9
src/ui/components/Moves.css
View File

@@ -5,7 +5,6 @@
}
.move {
/* display: inline-block; */
padding: 3px;
}
@@ -14,18 +13,18 @@
width: 40px;
text-align: right;
margin-right: 20px;
color: #aaa;
color: var(--color-text);
}
.move__ply {
display: inline-block;
width: 70px;
color: rgb(0, 173, 136);
color: var(--color-btn);
}
.move__ply--current {
color: #aaa;
background-color: #ffffff22;
color: var(--color-text);
background-color: var(--color-highlight);
}
.move__ply:hover {

4
src/ui/components/Pieces.css
View File

@@ -1,5 +1,7 @@
.pieces {
text-align: center;
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
}
.pieces__ico {
@@ -7,7 +9,7 @@
margin: 5px;
cursor: pointer;
width: 82px;
background-color: #ffffff22;
background-color: var(--color-highlight);
}
.pieces__ico--active {

11
src/ui/components/SetupTabs.css
View File

@@ -18,16 +18,21 @@
border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
height: 38px;
background: var(--color-tab);
}
.setup-tabs__btn:hover {
background: var(--color-tab-light);
}
.setup-tabs__btn--active {
background: #0e0e13;
color: #aaa;
background: var(--color-bg-block);
color: var(--color-text);
cursor: default;
}
.setup-tabs__btn--active:hover {
background: #0e0e13;
background: var(--color-bg-block);
}
.setup-tabs__btn:nth-child(1),

9
src/ui/components/Share.css
View File

@@ -1,3 +1,8 @@
.share {
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
}
.share__format,
.share__size {
padding: 10px;
@@ -33,7 +38,6 @@
.share__format--active:hover,
.share__size--active:hover {
background: rgb(0, 173, 136);
cursor: default;
}
@@ -50,7 +54,6 @@
margin: 3px;
padding: 5px;
font-size: 3rem;
background: rgb(0, 173, 136);
text-align: center;
border-radius: 5px;
width: 44px;
@@ -63,7 +66,7 @@
}
.options__button:hover {
background: rgb(0, 207, 162);
background: var(--color-btn-light);
cursor: pointer;
}

4
src/ui/components/Share.tsx
View File

@@ -86,6 +86,10 @@ const Share: Component<{ handlers: Handlers }> = (props) => {
readOnly
placeholder="Current FEN..."
value={state.fen}
onClick={(e) => {
const target = e.target as HTMLInputElement;
target.select();
}}
/>
<div class="double">

2
src/ui/components/reusable/Scrollable.css
View File

@@ -1,5 +1,5 @@
.scrollable {
background: #0e0e13;
background: var(--color-bg-block);
height: auto;
padding: 40px 20px;
height: 100%;