Skip to content

Commit

Permalink
mayor update for bugfixing
Browse files Browse the repository at this point in the history
  • Loading branch information
@Deg42
Deg42 committed May 23, 2022
1 parent ba10302 commit 626bb86
Show file tree
Hide file tree
Showing 9 changed files with 236 additions and 160 deletions.
25 changes: 14 additions & 11 deletions README.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,12 +2,19 @@

## TODO

## Wontfix
- [X] Remind me
- [X] Forgot Password
- [X] Change images

### Bugs
- [ ] Roll dices and reload
- [X] Roll dices and reload

### General
- [X] Routing URLs ?
- [X] Add logout
- [ ] Cancel background image animation cancel
- [ ] Translate values

### Navbar
- [X] Fix navbar
Expand All @@ -16,26 +23,22 @@
### Login
See login.js comments
- [X] Front Validations
- [ ] Remind me
- [ ] Forgot Password
- [ ] Change image

### Register
See register.js comments
- [X] Front Validations
- [ ] Terms and Conditions
- [ ] Change image
- [X] Terms and Conditions

### Games
- [X] Get games
- [X] Search bar
- [X] Modal create game
- [X] Join game
- [ ] Validations on create game
- [ ] Color on table points
- [X] Color on table points

### Game
- [ ] Game name
- [ ] *'Kiriki'* on roll
- [ ] Value table
- [ ] Winning a game
- [X] Game name
- [X] *'Kiriki'* on roll
- [X] Value table
- [ ] Winning a game, update game
47 changes: 23 additions & 24 deletions css/style.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,8 +7,8 @@ body {
height: 48px;
background-size: 48px 48px;
background-repeat: no-repeat;
background-position: center
}
background-position: center;
}

.container {
margin-bottom: 0;
Expand All @@ -23,12 +23,11 @@ body {
height: 64px;
background-size: 64px 64px;
background-repeat: no-repeat;
background-position: center
background-position: center;
}

.fs-7{
.fs-7 {
font-size: 0.75em;

}

.turned-30 {
Expand Down Expand Up @@ -62,14 +61,13 @@ body {
background-image: url("../assets/icons/as-dice.svg");
}

.btn-modifier{
width: 48px;
.btn-modifier {
width: 48px;
}

.flip:hover
{
transform: rotate(360deg);
transition: all 0.3s ease-in-out 0s;
.flip:hover {
transform: rotate(360deg);
transition: all 0.3s ease-in-out 0s;
}

.shake:hover {
Expand Down Expand Up @@ -108,32 +106,32 @@ width: 48px;

@keyframes shake-alt {
0% {
transform: translateX(0px) rotate(0deg);
transform: translateX(0px) rotate(0deg);
}

20% {
transform: translateX(-4px) rotate(-4deg);
transform: translateX(-4px) rotate(-4deg);
}

40% {
transform: translateX(-2px) rotate(-2deg);
transform: translateX(-2px) rotate(-2deg);
}

60% {
transform: translateX(4px) rotate(4deg);
transform: translateX(4px) rotate(4deg);
}

80% {
transform: translateX(2px) rotate(2deg);
transform: translateX(2px) rotate(2deg);
}

100% {
transform: translateX(0px) rotate(0deg);
transform: translateX(0px) rotate(0deg);
}
}

.zoom {
transition: transform .2s;
transition: transform 0.2s;
}

.zoom:hover {
Expand Down Expand Up @@ -191,17 +189,18 @@ button#toggle-password:focus {
background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem);
}

#password.input-password[type="password"]:valid, #createGamePassword.input-password[type="password"]:valid {
#password.input-password[type="password"]:valid,
#createGamePassword.input-password[type="password"]:valid {
background-image: url("data:image/svg+xml,%3Csvg width='1em' height='1em' viewBox='0 0 16 16' fill='currentColor' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M13.359 11.238C15.06 9.72 16 8 16 8s-3-5.5-8-5.5a7.028 7.028 0 0 0-2.79.588l.77.771A5.944 5.944 0 0 1 8 3.5c2.12 0 3.879 1.168 5.168 2.457A13.134 13.134 0 0 1 14.828 8c-.058.087-.122.183-.195.288-.335.48-.83 1.12-1.465 1.755-.165.165-.337.328-.517.486l.708.709z'/%3E%3Cpath d='M11.297 9.176a3.5 3.5 0 0 0-4.474-4.474l.823.823a2.5 2.5 0 0 1 2.829 2.829l.822.822zm-2.943 1.299l.822.822a3.5 3.5 0 0 1-4.474-4.474l.823.823a2.5 2.5 0 0 0 2.829 2.829z'/%3E%3Cpath d='M3.35 5.47c-.18.16-.353.322-.518.487A13.134 13.134 0 0 0 1.172 8l.195.288c.335.48.83 1.12 1.465 1.755C4.121 11.332 5.881 12.5 8 12.5c.716 0 1.39-.133 2.02-.36l.77.772A7.029 7.029 0 0 1 8 13.5C3 13.5 0 8 0 8s.939-1.721 2.641-3.238l.708.709z'/%3E%3Cpath fill-rule='evenodd' d='M13.646 14.354l-12-12 .708-.708 12 12-.708.708z'/%3E%3C/svg%3E") !important;
}

#password.input-password[type="text"]:valid, #createGamePassword.input-password[type="text"]:valid {
#password.input-password[type="text"]:valid,
#createGamePassword.input-password[type="text"]:valid {
background-image: url("data:image/svg+xml,%3Csvg width='1em' height='1em' viewBox='0 0 16 16' fill='currentColor' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' d='M16 8s-3-5.5-8-5.5S0 8 0 8s3 5.5 8 5.5S16 8 16 8zM1.173 8a13.134 13.134 0 0 0 1.66 2.043C4.12 11.332 5.88 12.5 8 12.5c2.12 0 3.879-1.168 5.168-2.457A13.134 13.134 0 0 0 14.828 8a13.133 13.133 0 0 0-1.66-2.043C11.879 4.668 10.119 3.5 8 3.5c-2.12 0-3.879 1.168-5.168 2.457A13.133 13.133 0 0 0 1.172 8z'/%3E%3Cpath fill-rule='evenodd' d='M8 5.5a2.5 2.5 0 1 0 0 5 2.5 2.5 0 0 0 0-5zM4.5 8a3.5 3.5 0 1 1 7 0 3.5 3.5 0 0 1-7 0z'/%3E%3C/svg%3E") !important;
}


@media only screen and ( max-width: 768px ) {
body {
@media only screen and (max-width: 768px) {
body {
background-image: url("../assets/img/bg-mobile.svg");
}
}
Expand All @@ -212,7 +211,7 @@ button#toggle-password:focus {
height: 32px;
background-size: 32px 32px;
background-repeat: no-repeat;
background-position: center
background-position: center;
}

.fs-7 {
Expand Down
138 changes: 75 additions & 63 deletions game.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -45,70 +45,14 @@
</header>
<main>
<div class="container bg-light">
<button id="test"></button>
<div class="row d-flex justify-content-center bg-light">
<div class="col fs-5 text-center my-4">
<h1>Nombre del juego</h1>
<h1 id="gameName">Nombre del juego</h1>
</div>
<div class="col fs-5 my-4">
<div class="row">
<div class="col">
<button class="btn btn-primary" id="hideTable">Tabla de Valores <i
class="fa fa-caret-down"></i>
</button>
</div>
<div class="col">
<ol class="list-group list-group-numbered fw-bold d-none" id="valueTable">
<li class="list-group-item d-flex align-items-start bg-primary text-light">
<div class="ms-2 me-auto text-center">
<div>Sumas simples</div>
<div class="d-flex mt-2 gap-2 gap-md-5 fs-7">
<span class="h-25 md-dice">1</span>
<span class="h-25 md-dice">2</span>
<span class="h-25 md-dice">3</span>
<span class="h-25 md-dice">4</span>
<span class="h-25 md-dice">5</span>
<span class="h-25 md-dice">6</span>
</div>
<div class="d-flex gap-2 gap-md-5">
<span class="md-dice dice-1"></span>
<span class="md-dice dice-2"></span>
<span class="md-dice dice-3"></span>
<span class="md-dice dice-4"></span>
<span class="md-dice dice-5"></span>
<span class="md-dice dice-6"></span>
</div>
<div class="d-flex gap-2 gap-md-5 fs-7 text-nowrap ">
<span class="md-dice">Negras</span>
<span class="md-dice">Rojas</span>
<span class="md-dice">Jota</span>
<span class="md-dice">Dama</span>
<span class="md-dice">Rey</span>
<span class="md-dice">As</span>
</div>
</div>
</li>
<li class="list-group-item d-flex justify-content-between align-items-start">
<div class="ms-2 me-auto">
<div class="fw-bold">Tocho</div>
Cras justo odio
</div>
</li>
<li class="list-group-item d-flex justify-content-between align-items-start">
<div class="ms-2 me-auto">
<div class="fw-bold">Parejas (dos iguales)</div>
Cras justo odio
</div>
</li>
<li class="list-group-item d-flex justify-content-between align-items-start">
<div class="ms-2 me-auto">
<div class="fw-bold">Kiriki</div>
Cras justo odio
</div>
</li>
</ol>
</div>
</div>
<div class="col fs-5 text-center my-4">
<button class="btn btn-primary" id="valueTableButton">Tabla de Valores
<i class="fa fa-caret-down"></i>
</button>
</div>
</div>

Expand Down Expand Up @@ -221,7 +165,7 @@ <h1 class="my-4 text-light">Es el turno de <span class="fst-italic" id="turnOf">
<div class="modal-content">
<div class="modal-header">
<h3 class="modal-title" id="whosLoser"></h3>
<button type="button" class="btn-close reloadData" data-bs-dismiss="modal"
<button type="button" class="btn-close" data-bs-dismiss="modal"
aria-label="Close"></button>
</div>
<div class="modal-body">
Expand All @@ -232,7 +176,7 @@ <h5 id="loserResult"></h5>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-danger reloadData" data-bs-dismiss="modal">Cerrar</button>
<button type="button" class="btn btn-danger" data-bs-dismiss="modal">Cerrar</button>
</div>
</div>
</div>
Expand Down Expand Up @@ -260,6 +204,74 @@ <h5 class="modal-title">Error!</h5>
</div>
</div>

<div class="modal fade" id="valueTableModal" tabindex="-1" data-bs-keyboard="false"
aria-labelledby="valueTableModal" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Valores</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body text-center fw-bold ">
<ol class="list-group list-group-numbered " id="valueTable">
<li class="list-group-item d-flex align-items-start bg-primary text-light">
<div class="ms-2 me-auto">
Sumas simples
<div class="d-flex mt-2 gap-1 gap-md-3 fs-7">
<span class="h-25 md-dice">1</span>
<span class="h-25 md-dice">2</span>
<span class="h-25 md-dice">3</span>
<span class="h-25 md-dice">4</span>
<span class="h-25 md-dice">5</span>
<span class="h-25 md-dice">6</span>
</div>
<div class="d-flex gap-1 gap-md-3">
<span class="md-dice dice-1"></span>
<span class="md-dice dice-2"></span>
<span class="md-dice dice-3"></span>
<span class="md-dice dice-4"></span>
<span class="md-dice dice-5"></span>
<span class="md-dice dice-6"></span>
</div>
<div class="d-flex gap-1 gap-md-3 fs-7 text-nowrap">
<span class="h-25 md-dice">Negras</span>
<span class="h-25 md-dice">Rojas</span>
<span class="h-25 md-dice">Jota</span>
<span class="h-25 md-dice">Dama</span>
<span class="h-25 md-dice">Rey</span>
<span class="h-25 md-dice">As</span>
</div>
</div>
</li>
<li class="list-group-item d-flex align-items-start bg-primary text-light">
<div class="ms-2 me-auto">
"Tocho", ladrillazo, ladrillo
<div class="d-flex mt-2 gap-1 gap-md-3">
<span class="md-dice dice-5"></span>
<span class="md-dice dice-6"></span>
</div>
</div>
</li>
<li class="list-group-item d-flex align-items-start bg-primary text-light">
<div class="ms-2 me-auto">
Parejas (dos iguales)
</div>
</li>
<li class="list-group-item d-flex align-items-start bg-primary text-light">
<div class="ms-2 me-auto">
Kiriki
<div class="d-flex mt-2 gap-1 gap-md-3">
<span class="md-dice dice-1"></span>
<span class="md-dice dice-2"></span>
</div>
</div>
</li>
</ol>
</div>
</div>
</div>
</div>

<!-- Optional JavaScript; choose one of the two! -->

<!-- Option 1: Bootstrap Bundle with Popper -->
Expand Down
Loading

0 comments on commit 626bb86

Please sign in to comment.