HTML&CSS
Separate Header and footer from body.
adding bootstrap with a grid system.
master
Paulo Vieira 2017-10-31 17:52:31 +00:00
parent c48eae7e29
commit 59c27831e3
7 changed files with 73 additions and 8 deletions

BIN
.DS_Store vendored

Binary file not shown.

BIN
laravel/.DS_Store vendored

Binary file not shown.

Binary file not shown.

BIN
laravel/public/img/icon.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 691 B

View File

@ -1,10 +1,10 @@
<div>
<footer class="navbar fixed-bottom navbar-dark bg-dark">
<div class="container text-center">
<p>BadMemoryDad - Memory Game - © 2017</p>
<div class="container">
<p>BadMemoryDad Grupo 17 - Memory Game - © 2017</p>
</div>
</footer>
</div>
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.3/umd/popper.min.js" integrity="sha384-vFJXuSJphROIrBnz7yo7oB41mKfc8JzQZiCq4NCceLEaO4IHwicKwpJf9c9IpFgh" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/js/bootstrap.min.js" integrity="sha384-alpBpkh1PFOepccYVYDB4do5UnbKysX5WZXm3XxPqe5iKTfUKjNkCk9SaVuEZflJ" crossorigin="anonymous"></script>

View File

@ -9,11 +9,11 @@
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/css/bootstrap.min.css" integrity="sha384-PsH8R72JQ3SOdhVi3uxftmaW6Vc51MKb0q5P2rRUpPvrszuE4W1povHYgTpBfshb" crossorigin="anonymous">
<link href="{{ URL::asset('css/style.css') }}" rel="stylesheet">
</head>
<body>
<nav class="navbar fixed-top navbar-dark bg-dark">
<div>
<nav class="navbar static-top navbar-dark bg-dark">
<a class="navbar-brand" href="#">BadMemoryGame</a>
<form class="form-inline my-2 my-lg-0">
<li>
@ -22,3 +22,4 @@
</li>
</form>
</nav>
</div>

View File

@ -1,8 +1,72 @@
@include('header')
<div class="row justify-content-between">
<!--Div Esquerda-->
<div class="col-lg-4" style="border:10px solid green;">
<h4>LOBBY</h4>
</div>
<!--Div Direita-->
<div class="col-lg-8" style="border:10px solid black;">
<h4>TABULEIRO DE JOGO</h4>
<br>
<div class="form-group row">
<label for="nJogadores" class="col-6 col-form-label"><h5> de Jogadores (1 a 4):</h5></label>
<div class="col-4">
<select class="form-control" id="nJogadores">
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
</select>
</div>
</div>
<br>
<div class="form-group row">
<label for="nLinhas" class="col-6 col-form-label"><h5> de Linhas (Limite 6): </h5></label>
<div class="col-4">
<select class="form-control" id="nLinhas">
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
</select>
</div>
</div>
<br>
<div class="form-group row">
<label for="nColunas" class="col-6 col-form-label"><h5> de Colunas (Limite 6): </h5></label>
<div class="col-4">
<select class="form-control" id="nColunas">
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
</select>
</div>
</div>
<br>
<button type="button" class="btn btn-outline-success btn-block">Criar Jogo</button>
<br>
<br>
</div>
</div>
@include('footer')