Forked from - 20220126 Ticket - Snippet

xxxxxxxxxx
 
​
​
<!DOCTYPE HTML>
<html>
    <head>
    <!-- IMPORTÁLÁS -->
​
<!-- Font Awesome -->
​
<!-- Google Fonts -->
​
<!-- BETŰTÍPUSOK -->
​
<!-- FAVICONOK -->
<script src="https://kit.fontawesome.com/51401f08b3.js" crossorigin="anonymous"></script>
    <!-- META -->
    <meta charset="UTF-8">
    <meta name="description" content="ADOM KSR">
    <meta name="keywords" content="">
    <meta name="author" content="ADOM Dm. - Bozai Ákos">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
​
    <!-- ÁLTALÁNOS -->
    <title>Igazolások @ ADOM KSR</title>
    <link rel="shortcut icon" href="http://rasp.bozaiakos.hu/lib/assets/images/favicon.ico" type="image/x-icon">
</head>
    <body id="htmlBody">
​
<nav id="sidebar" class="sidebar">
  <div id="helloCard">
    <a class="nmi">
      <div class="menuPicture" style="background-image:url('https://www.gravatar.com/avatar/43b66b32118b22debe3067528a484596?d=http%3A%2F%2Frasp.bozaiakos.hu%2Flib%2Fassets%2Fimages%2Flogo.png&s=150');">
        <span onclick="redirect('profil');" class="clickEvent" href="http://rasp.bozaiakos.hu/oldal/profil">
          <i class="fa fa-user"></i>
        </span>
        <img src="http://rasp.bozaiakos.hu/lib/assets/images/logo.png" class="logo">
      </div>
      <b>Admin Admin</b><br>
      <span class="sitetitle">ADOM KSR</span>
    </a>
  </div>
​
  <a href="http://rasp.bozaiakos.hu/oldal"><i class="fa fa-home" aria-hidden="true"></i> Kezdőlap</a>
  <a href="http://rasp.bozaiakos.hu/oldal/szervezo/iskolak"><i class="fa fa-school" aria-hidden="true"></i> Iskolalista</a><a href="http://rasp.bozaiakos.hu/oldal/szervezo/onkentesek"><i class="fa fa-hands-helping" aria-hidden="true"></i> Önkéntesek</a><a href="http://rasp.bozaiakos.hu/oldal/szervezo/feladatok"><i class="fa fa-file" aria-hidden="true"></i> Dokumentáció</a><a href="http://rasp.bozaiakos.hu/oldal/szervezo/igazolas"><i class="fa fa-feather" aria-hidden="true"></i> Igazolások</a>
  <div class="smallButtons">
    <a href="http://rasp.bozaiakos.hu/oldal/admin/beallitasok" class="smallBtn"><i class="fa fa-cog" aria-hidden="true"></i></a><a href="http://rasp.bozaiakos.hu/oldal/tarhely" class="smallBtn"><i class="fa fa-hdd" aria-hidden="true"></i></a>
    <a href="http://rasp.bozaiakos.hu/belepes/kilepes" class="smallBtn text-danger"><i class="fa fa-sign-out"></i></a>
  </div>
</nav>
​
<div id="loader-out"><div id="loader" class="lds-ripple"><div></div><div></div></div>
</div></div>
        <div id="main">
            <h1>Igazolások</h1>
            
            <div class="card">
                <div class="card-header">
                    <h5 class="card-title">
                        Igazolások kiállítása
                    </h5>
                </div>
                <div class="card-body">
                    <form action="igazolasok/kiallit" class="needs-validation" novalidate method="post">
                    <div class="row">
                        <div class="col col-md-4">
                                    <select name="month" required id="month" class="form-control active">
                                        <option value="január">Január</option>
                                        <option value="február">Február</option>
                                        <option value="március">Március</option>
                                        <option value="április">Április</option>
                                        <option value="május">Május</option>
                                        <option value="június">Június</option>
                                        <option value="július">Július</option>
                                        <option value="augusztus">Augusztus</option>
                                        <option value="szeptember">Szeptember</option>
                                        <option value="október">Október</option>
                                        <option value="november">November</option>
                                        <option value="december">December</option>
                                    </select>
                                    <label for="month" class="form-label">Hónap</label>
                            </div>
                            <div class="col col-md-2">
                                <button type="submit" class="btn btn-primary"><i class="fa fa-check"></i> Kiállítás</button>
                            </div>
                            <div class="col">
                                <a href="igazolasok/archival"><button type="button" class="btn btn-outline-danger"><i class="fa fa-archive"></i> Órák archiválása</button></a>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
            <div class="card">
                <div class="card-header">
                    <h5 class="card-title">
                        Igazolás feltöltése
                    </h5>
                </div>
                <div class="card-body">
                    <form action="igazolasok/feltolt.php" method="post" class="needs-validation" novalidate>
                    <div class="row">
                            <div class="col">
                                <div class="form-outline">
                                    <input type="text" id="volunteer" class="form-control">
                                    <label for="volunteer" class="form-label">Önkéntes</label>
                                </div>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
        <script>
            document.querySelectorAll('.form-outline').forEach((formOutline) => {
                new mdb.Input(formOutline).init();
            });
        </script>
        
<script>
​
function loader() {
  setTimeout(() => {
            document.getElementById("loader-out").style.display = "block";
            document.getElementById("loader").style.display = "block";
            document.getElementById("htmlBody").style.overflow = "hidden";
          }, 500)
}
​
(function() {
  'use strict';
  window.addEventListener('load', function() {
    var forms = document.getElementsByClassName('needs-validation');
    var validation = Array.prototype.filter.call(forms, function(form) {
      form.addEventListener('submit', function(event) {
        if (form.checkValidity() === false) {
          event.preventDefault();
          event.stopPropagation();
        } else {
        setTimeout(() => {
            document.getElementById("loader-out").style.display = "block";
            document.getElementById("loader").style.display = "block";
            document.getElementById("htmlBody").style.overflow = "hidden";
          }, 500)
        }
        form.classList.add('was-validated');
      }, false);
    });
  }, false);
})();
console.clear();
console.log("A konzol egy fejlesztői eszköz. Körültekintően használd!")
</script>    </body>
</html>

xxxxxxxxxx
 
@charset "UTF-8";
body {
  vertical-align: baseline !important;
  font-family: "Source Sans Pro", sans-serif;
}
​
.mobileBreaker {
  display: none;
}
​
#loader-out {
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 1;
  text-align: center;
  display: none;
}
​
.lds-ripple {
  left: 45%;
  top: 45%;
  display: inline-block;
  position: relative;
  width: 80px;
  height: 80px;
}
​
.lds-ripple div {
  position: absolute;
  border: 4px solid white;
  opacity: 1;
  border-radius: 50%;
  -webkit-animation: lds-ripple 1s cubic-bezier(0, 0.2, 0.8, 1) infinite;
  animation: lds-ripple 1s cubic-bezier(0, 0.2, 0.8, 1) infinite;
}
​
.lds-ripple div:nth-child(2) {
  -webkit-animation-delay: -0.5s;
  animation-delay: -0.5s;
}
​
@-webkit-keyframes lds-ripple {
  0% {
    top: 36px;
    left: 36px;
    width: 0;
    height: 0;
    opacity: 1;
  }
  100% {
    top: 0px;
    left: 0px;
    width: 72px;
    height: 72px;
    opacity: 0;
  }
}
@keyframes lds-ripple {
  0% {
    top: 36px;
    left: 36px;
    width: 0;
    height: 0;
    opacity: 1;
  }
  100% {
    top: 0px;
    left: 0px;
    width: 72px;
    height: 72px;
    opacity: 0;
  }
}
.sidebar {
  top: -0.1%;
  margin: 1%;
  padding: 0;
  width: 200px;
  background-color: #003670;
  position: fixed;
  height: 96%;
  border-radius: 10px;
  overflow: auto;
  color: white;
}
.sidebar .smallButtons {
  position: absolute;
  right: 5%;
  bottom: 2%;
}
.sidebar .smallBtn {
  color: white;
  padding-right: 5px;
}
.sidebar .smallBtn:hover {
  color: #d35d5f;
}
.sidebar .menuPicture {
  height: 150px;
  width: 150px;
  margin: 10px;
  border-radius: 50%;
}
.sidebar .menuPicture .logo {
  height: 50px;
  width: 50px;
  position: relative;
  top: 100px;
  left: 40px;
}
.sidebar .menuPicture .clickEvent {
  width: 150px;
  height: 150px;
  margin-left: -50px;
  border-radius: 50%;
  position: absolute;
  transition: 0.5s;
}
.sidebar .menuPicture .clickEvent i {
  color: rgba(0, 0, 0, 0);
  padding: 35%;
  font-size: 50px;
  transition: 0.5s;
}
.sidebar .menuPicture .clickEvent:hover {
  background-color: #d35d5f91;
  transition: 0.5s;
  cursor: pointer;
}
.sidebar .menuPicture .clickEvent:hover i {
  color: white;
  transition: 0.5s;
}
.sidebar .highlightElement {
  background-color: #d35d5f;
}
@media screen and (max-width: 700px) {
  .sidebar .sitetitle {
    display: none;
  }
  .sidebar .mobileBreaker {
    display: block;
  }
}
​
.sidebar a:not(.smallBtn) {
  display: block;
  color: white;
  padding: 10px;
  text-decoration: none;
  margin: 0 !important;
}
.sidebar a:not(.smallBtn) i {
  padding-right: 5px;
}
​
.sidebar a:not(.smallBtn, .nmi):hover {
  background-color: #216585;
  color: white;
  text-decoration: none;
  border-left: white 4px solid;
}
​
@media screen and (max-width: 700px) {
  .sidebar a:hover {
    border-left: none;
  }
}
.sidebar a.nmi {
  background-color: unset;
  border-left: none;
  margin-bottom: 5px;
  border-bottom: 3px solid white;
  color: white;
}
​
.sidebar a.nmi:hover {
  color: white;
}
​
#helloCard {
  text-align: center;
}
​
div#main {
  margin-left: 210px;
  padding: 1px 16px;
  padding-top: 0;
  padding-bottom: 30px !important;
}
div#main h1 {
  background-color: #003670;
  color: white;
  padding: 10px;
  margin: 1%;
  position: relative;
  border-radius: 10px;
  text-align: center;
  text-transform: uppercase;
  font-weight: 900;
  line-height: 50px;
  font-family: "Mont";
  font-weight: 900;
}
​
@media screen and (max-width: 700px) {
  .sidebar {
    width: 100%;
    height: auto;
    position: relative;
    margin: 0;
    border-radius: 0;
  }
​
  .sidebar a.nmi {
    margin: 0;
    border-bottom: 3px solid white;
  }
​
  div#main {
    margin-left: 0;
  }
​
  .smallButtons {
    position: absolute;
    top: 1%;
    right: 3%;
  }
​
  .nmi .menuPicture {
    height: auto;
    margin: 0 auto;
    position: relative;
    height: 150px;
    width: 150px;
    margin-bottom: 2%;
  }
​
  .sidebar a {
    text-align: center;
    float: none;
  }
}
.profilePicContainer {
  width: 100%;
}
​
.profilePic {
  height: 100%;
  padding-top: 100%;
  background-position: center center;
  background-size: cover;
  border-radius: 10px;
}
.profilePic .profilePicEditBtn {
  position: relative;
  bottom: 10px;
  left: 10px;
}
​
@media screen and (max-width: 700px) {
  .profPic {
    margin-top: 10px;
  }
}
.settingsrow {
  margin-bottom: 5px;
}
​
.submitDiv {
  float: right;
}
​
h5 {
  margin-bottom: 0 !important;
}
​
.card {
  margin-bottom: 10px;
}
​
table > * {
  cursor: default;
  align-items: center;
  vertical-align: middle !important;
  text-align: center !important;
}
table > * a {
  cursor: pointer;
}
​
a {
  text-decoration: none;
  color: #003670;
}
​
a:hover {
  text-decoration: none;
  color: #d35d5f;
}
​
a:active {
  text-decoration: none;
}
​
.card {
  border-radius: 10px;
}
​
.modalopener {
  color: #003670;
  cursor: pointer;
}
​
/* HIBAOLDAL */
body#errorBody {
  background-color: #003670;
  height: 100vh;
  width: 100vw;
  overflow-y: hidden;
  overflow-x: hidden;
}
body#errorBody .errorbox {
  margin: 0;
  position: absolute;
  top: 30%;
  left: 12.5%;
  background-color: white;
  width: 75%;
  height: 42%;
  border: 5px solid black;
  border-radius: 10px;
  text-align: center;
  padding: 3%;
  color: black;
}
body#errorBody .errorbox h1 {
  margin-bottom: 0;
}
body#errorBody .errorbox h2 {
  margin-bottom: 5%;
}
@media screen and (max-width: 700px) {
  body#errorBody .errorbox {
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    border: none;
    border-radius: 0;
    padding-top: 30%;
  }
}
​
/* FÁJLOK */
#files {
  margin-top: 10px;
  padding-top: 10px;
  overflow: hidden;
}
#files .file {
  float: left;
  margin-right: 10px;
  margin-bottom: 10px;
  border: 1px solid black;
  border-radius: 5px;
  width: calc(15vw + 40px);
  padding: 10px;
  box-shadow: 2px 2px 5px grey;
  cursor: pointer;
  transition-duration: 0.3s;
}
#files .file:hover {
  background-color: #e4e4e4;
  transition-duration: 0.3s;
}
#files .file-image {
  height: 100px;
  width: 100px;
  display: block;
  padding-bottom: 5px;
  margin-left: 30%;
}
#files hr {
  background-color: black;
  height: 3px;
}
#files .file-icon {
  float: right;
  padding-right: 5%;
  padding-top: 5px;
}
#files .file-text {
  font-weight: 500;
}
​
#fileInfo .file-info-image {
  width: 100%;
}
​
.fileSelectorRadioGroup {
  text-align: center;
}
.fileSelectorRadioGroup label {
  width: 20%;
  box-shadow: 2px 2px 5px grey;
  margin: 10px;
  border-radius: 5px;
}
.fileSelectorRadioGroup label:hover {
  background-color: #e4e4e4;
}
.fileSelectorRadioGroup .card-input-element {
  display: none;
}
.fileSelectorRadioGroup .card-input {
  margin: 10px;
  padding: 5px;
  border-radius: 5px;
}
.fileSelectorRadioGroup .card-input:hover {
  cursor: pointer;
}
.fileSelectorRadioGroup .card-input-element:checked + .card-input {
  background-color: #e4e4e4;
}
​
.taskFileInfoCard {
  display: block;
  padding: 25% 0;
  width: 50%;
  margin-left: 25%;
  cursor: pointer;
  background-image: url("../images/file.png");
  background-size: cover;
  border-radius: 15px;
}/*# sourceMappingURL=style.css.map */

​

Console errors: 0