EchedeyLR
/
DSW


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133
							<!DOCTYPE html>
<!--
Copyright (C) 2021 echedey

This program is free software: you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.

This program is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
GNU General Public License for more details.

You should have received a copy of the GNU General Public License
along with this program.  If not, see <http://www.gnu.org/licenses/>.
-->
<html lang="es">
    <head>
        <meta charset="UTF-8" />
        <meta http-equiv="X-UA-Compatible" content="IE=edge" />
        <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
        <meta name="author" content="Echedey López Romero" />
        <title>Calculadora Aritmética</title>
        <link rel="stylesheet" href="./bootstrap/css/bootstrap.min.css" />
        <script src="./jquery/jquery-3.5.1.slim.min.js"></script>
        <script src="./bootstrap/js/bootstrap.bundle.min.js"></script>
        <style>
            .centro {
                text-align: center;
            }

            .derecha {
                text-align: right;
            }

            /* Chrome, Safari, Edge, Opera */
            input::-webkit-outer-spin-button,
            input::-webkit-inner-spin-button {
                -webkit-appearance: none;
                margin: 0;
            }

            /* Firefox */
            input[type=number] {
                -moz-appearance: textfield;
            }
        </style>
        <script>
            function Limpiar() {
                let Operadores = document.getElementsByTagName("input");

                for (let Pos = 0; Pos < Operadores.length; Pos++) {
                    Operadores[Pos].setAttribute("value", "");
                }

                let ResultadoTitle = document.getElementById("resultadotitle");
                let Resultado = document.getElementById("resultado");

                ResultadoTitle.textContent = "Resultado";
                Resultado.textContent = "--";
            }
        </script>
    </head>
    <body class="container">
        <div class="row my-3">
            <div class="col-lg-3 col-md-2 col-sm-1"></div>
            <div class="col-lg-6 col-md-8 col-sm-10 col-xs-12 border border-primary rounded p-3">
                <h1 class="centro">Calculadora Aritmética</h1>
                <form action="./index.php" method="POST" class="mb-2">
                    <div class="form-group">
                        <label class="d-block centro" for="operadorprimario">Primer número</label>
                        <input type="number" name="operadorprimario" id="operadorprimario" 
                               value="<?php echo($OperadorPrimario) ?>" placeholder="0" step="0.1" 
                               required class="form-control form-control-lg derecha" />
                    </div>
                    <div class="form-group">
                        <label class="d-block centro" for="operadorsecundario">Segundo número</label>
                        <input type="number" name="operadorsecundario" id="operadorsecundario" 
                               value="<?php echo($OperadorSecundario) ?>" placeholder="0" step="0.1" 
                               required class="form-control form-control-lg derecha" />
                    </div>
                    <span id="resultadotitle" class="d-block mb-2 centro"><?php echo($ResultadoTitle) ?></span>
                    <p id="resultado" class="border border-secondary rounded p-2 centro"><?php echo($Resultado) ?></p>
                    <div class="container">
                        <div class="row">
                            <div class="col-lg-8 col-md-12 p-0 pr-lg-2 mb-2 mb-lg-0">
                                <div class="container">
                                    <div class="row mb-2">
                                        <div class="col-6 p-0 pr-2">
                                            <button type="submit" name="operacion" value="sumar" 
                                                    class="btn btn-primary btn-lg btn-block">Sumar</button>
                                        </div>
                                        <div class="col-6 p-0">
                                            <button type="submit" name="operacion" value="restar" 
                                                    class="btn btn-primary btn-lg btn-block">Restar</button>
                                        </div>
                                    </div>
                                    <div class="row mb-2">
                                        <div class="col-6 p-0 pr-2">
                                            <button type="submit" name="operacion" value="multiplicar" 
                                                    class="btn btn-primary btn-lg btn-block">Multiplicar</button>
                                        </div>
                                        <div class="col-6 p-0">
                                            <button type="submit" name="operacion" value="dividir" 
                                                    class="btn btn-primary btn-lg btn-block">Dividir</button>
                                        </div>
                                    </div>
                                    <div class="row">
                                        <div class="col-6 p-0 pr-2">
                                            <button type="submit" name="operacion" value="potencia" 
                                                    class="btn btn-primary btn-lg btn-block">Potencia</button>
                                        </div>
                                        <div class="col-6 p-0">
                                            <button type="submit" name="operacion" value="raiz" 
                                                    class="btn btn-primary btn-lg btn-block">Raíz</button>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-lg-4 col-md-12 p-0">
                                <button type="reset" style="height: 100%"
                                        class="btn btn-danger btn-lg btn-block"
                                        onclick="Limpiar()">Limpiar</button>
                            </div>
                        </div>
                    </div>
                </form>
            </div>
            <div class="col-lg-3 col-md-2 col-sm-1"></div>
        </div>
    </body>
</html>