Solucionado (ver solução)
Solucionado
(ver solução)
2
respostas

O modal está aparecendo abaixo da lista

Boa noite, acho que me perdi em algum lugar. O meu App quando clico em "done", aparece abaixo da lista e não sobre a tela inteira, como deve ser.

Alguém tem alguma idéia, ou o código inteiro do projeto funcionando?

<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Security-Policy" 
              content="default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *">
        <meta name="format-detection" content="telephone=no">
        <meta name="msapplication-tap-highlight" content="no">
        <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width">
         <link rel="stylesheet" href="icons/material.css">
    <link rel="stylesheet" href="css/materialize.min.css">
    <link rel="stylesheet" type="text/css" href="css/estilos.css">
        <title>Cardápio FatGuys</title>
    </head>
    <body>

    <div class="topo-fixo z-depth-1">    
        <div class="yellow darken-4 white-text valign-wrapper">
            <h5 class="titulo">Só de Cenoura</h5>

            <div>
            <i data-activates="submenu" data-gutter="5"
    data-contrainwidth="false"
class="material-icons waves-effect waves-light waves-circle dropdown-button"
>more_vert</i>
                <ul class="dropdown-content" id="submenu">
<li> <a class="black-text acao-limpar">Limpar</a></li>
</ul>
            </div>
        </div>

        <ul class="tabs yellow darken-4">
            <li class="tab"><a href="#bolos" class="white-text waves-effect waves-ligth">Bolos</a></li>
            <li class="tab"><a href="#bebidas" class="white-text waves-effect waves-light">Bebidas</a></li>
        </ul>
</div>


    <div class="section" id="bolos">
    <h6 class="container  brown-text">Em pedaços</h6>
    <div class="collection">
        <a class="collection-item waves-effect black-text">Só de Cenoura</a>
        <a class="collection-item waves-effect black-text">Com Nutella</a>
        <a class="collection-item waves-effect black-text">De Brigadeiro</a>
        <a class="collection-item waves-effect black-text">Açucarado</a>
    </div>

    <h6 class="container">Inteiro</h6>
    <div class="collection">
        <a class="collection-item waves-effect black-text">Só de Cenoura inteiro</a>
        <a class="collection-item waves-effect black-text">Com Nutella inteiro</a>
        <a class="collection-item waves-effect black-text">De Brigadeiro inteiro</a>
        <a class="collection-item waves-effect black-text">Açucarado inteiro</a>
    </div>
</div>

    <div class="section" id="bebidas">
    <h6 class="container brown-text">Cafés</h6>
        <div class="collection">
        <a class="collection-item waves-effect black-text">Espresso</a>
        <a class="collection-item waves-effect black-text">Capuccino</a>
        <a class="collection-item waves-effect black-text">Mocaccino</a>
    </div>

    <h6 class="container brown-text">Refrigerantes</h6>
        <div class="collection">
        <a class="collection-item waves-effect black-text">Coca</a>
        <a class="collection-item waves-effect black-text">Soda</a>
        <a class="collection-item waves-effect black-text">Guaraná</a>
    </div>
</div>



    <div class="fixed-action-btn">
        <a href="#confirmacao" class="btn-floating btn-large waves-effect waves-light brown modal-trigger">
             <i class="material-icons">done</i>
        </a>
   </div>

   <div class="moda modal-fixed-footer" id="confirmacao">
        <div class="modal-content">
            <h5>Resumo do pedido</h5>
            <input type="number" class="validate" placeholder="Número da mesa" id="numero-mesa">
            <blockquote id="resumo"></blockquote>
        </div>
        <div class="modal-footer">
             <button class="btn deep-orange waves-effect waves-light modal-close">
             Pedir
            </button>

            <button class="acao-limpar btn-flat waves-effect waves-red modal-close">
             Cancelar
            </button>
        </div>
</div>


        <script type="text/javascript" src="cordova.js"></script>
        <script src="js/jquery.min.js"></script>
        <script src="js/materialize.min.js"></script>
        <script src="js/app.js"></script>
    </body>
</html>
2 respostas
solução!

Ivan, o código completo do curso você pode ver aqui e conferir com o seu!

https://github.com/alura-cursos/cordova-phonegap

Vou olhar.

Obrigado!