file-cms.git - Ulrich Hilger Code Repository

parent: 96a10fcf | patch | commit | ignore whitespace

Startseite, Anmeldung und Abmeldung umgestellt auf neue Bedienoberflaeche u...

ulrich

2021-01-17 d9cdb1ac342ae2c867489ad4220bb2c81043f353

Startseite, Anmeldung und Abmeldung umgestellt auf neue Bedienoberflaeche und neue Stile, Verweis auf Font bei Google entfernt

4 files modified

1 files added

1 files renamed

	web/index.html	3 ●●●●● patch \| view \| raw \| blame \| history
	web/login_form.html	81 ●●●●● patch \| view \| raw \| blame \| history
	web/logout.html	4 ●●●●● patch \| view \| raw \| blame \| history
	web/stile.css	166 ●●●●● patch \| view \| raw \| blame \| history
	web/ui2/index.html	1 ●●●●● patch \| view \| raw \| blame \| history
	web/ui2/stile.css	12 ●●●●● patch \| view \| raw \| blame \| history

 web/index.html

File was renamed from web/index.jsp
@@ -1,4 +1,3 @@
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
  <head>
@@ -7,6 +6,6 @@
  </head>
  <body>
    <h1>Dateiverwaltung</h1>
    <p><a href="ui">Anmeldung</a></p>
    <p><a href="ui2">Anmeldung</a></p>
  </body>
</html>

 web/login_form.html

@@ -2,92 +2,21 @@
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalabe=no">
    <meta name="description" content="">
    <meta name="author" content="">
    <!--<link rel="icon" href="../../favicon.ico">-->

    <link rel="stylesheet" type="text/css" href="stile.css">    
    <title>Anmeldung Dateiverwaltung</title>

    <!-- Bootstrap core CSS -->
    <link rel="stylesheet" href="/jslib/bootstrap/css/bootstrap.min.css">

    <!-- Custom styles for this template -->
    <!--<link href="signin.css" rel="stylesheet">-->
    <style type="text/css">
      body {
        padding-top: 40px;
        padding-bottom: 40px;
        background-color: #eee;
      }
      
      .form-signin {
        max-width: 330px;
        padding: 15px;
        margin: 0 auto;
      }
      .form-signin .form-signin-heading,
      .form-signin .checkbox {
        margin-bottom: 10px;
      }
      .form-signin .checkbox {
        font-weight: normal;
      }
      .form-signin .form-control {
        position: relative;
        height: auto;
        -webkit-box-sizing: border-box;
           -moz-box-sizing: border-box;
                box-sizing: border-box;
        padding: 10px;
        font-size: 16px;
      }
      .form-signin .form-control:focus {
        z-index: 2;
      }
      .form-signin input[type="text"] {
        margin-bottom: -1px;
        border-bottom-right-radius: 0;
        border-bottom-left-radius: 0;
      }
      .form-signin input[type="password"] {
        margin-bottom: 10px;
        border-top-left-radius: 0;
        border-top-right-radius: 0;
      }
      .backlink {
        margin-top: 2em;
      }
    </style>

    <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
      <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->
  </head>

  <body>

    <div class="container">

      <form class="form-signin" role="form" method="POST" action="j_security_check" name="loginform">
        <h2 class="form-signin-heading">Anmeldung Dateiverwaltung</h2>
        <input  name="j_username" type="text" class="form-control" placeholder="Benutzerkennung" required autofocus>
        <input name="j_password" type="password" class="form-control" placeholder="Kennwort" required>
        <!--
        <label class="checkbox">
          <input type="checkbox" value="remember-me"> Remember me
        </label>
        -->
        <button class="btn btn-lg btn-primary btn-block" type="submit">Senden</button>
        <p class="backlink"><a href="/">zurück zur Hauptseite</a></p>
        <button class="btn btn-lg button-primary btn-block" type="submit">Senden</button>
        <p class="backlink"><a href="/">zur&uuml;ck zur Hauptseite</a></p>
      </form>
      
      

    </div> <!-- /container -->

    </div>
  </body>
</html>

 web/logout.html

@@ -3,14 +3,14 @@
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" type="text/css" href="/jslib/bootstrap/css/bootstrap.min.css">
    <link rel="stylesheet" type="text/css" href="stile.css">    
    <title>Abgemeldet</title>
  </head>
  <body>
      <div style="margin: 20px;">
        <h3>Abmeldung</h3>
        <p>Sie haben sich erfolgreich abgemeldet.</p>
        <p>zur&uuml;ck zur <a href="ui/">Anmeldung</a> &bull; <a href="/">Hauptseite</a></p>
        <p>zur&uuml;ck zur <a href="ui2">Anmeldung</a> &bull; <a href="/">Startseite</a></p>
      </div>
  </body>
</html>

 web/stile.css

New file
@@ -0,0 +1,166 @@

html, body {
  margin: 0;
  padding: 0;
  height: 100%; /* Anmerkung 2 */
  font-size: larger;
  font-family: 'Roboto Condensed';
    -webkit-text-size-adjust: none;
}

.form-signin {
  text-align: center;
  display: flex;
  flex-flow: column;
  align-items: center;
  margin: 0 5% 0 5%;
}

.form-signin input {
  margin: 0.5em 0 0.5em 0;
  font-size: large;
}

.form-signin button {
  margin: 1.5em 0 0.5em 0;
}

@media (min-width: 600px) {
  .form-signin {
    margin: 0 20% 0 20%;
  }
}

@font-face {
  font-family: 'Roboto Condensed';
  src: url('/lib/fonts/Roboto_Condensed/RobotoCondensed-Regular.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}


/* von Skeleton */

/* Buttons
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.button,
button,
input[type="submit"],
input[type="reset"],
input[type="button"] {
  display: inline-block;
  height: 38px;
  padding: 0 30px;
  color: #555;
  text-align: center;
  font-size: 11px;
  font-weight: 600;
  line-height: 38px;
  letter-spacing: .1rem;
  text-transform: uppercase;
  text-decoration: none;
  white-space: nowrap;
  background-color: transparent;
  border-radius: 4px;
  border: 1px solid #bbb;
  cursor: pointer;
  box-sizing: border-box; }
.button:hover,
button:hover,
input[type="submit"]:hover,
input[type="reset"]:hover,
input[type="button"]:hover,
.button:focus,
button:focus,
input[type="submit"]:focus,
input[type="reset"]:focus,
input[type="button"]:focus {
  color: #333;
  border-color: #888;
  outline: 0; }
.button.button-primary,
button.button-primary,
input[type="submit"].button-primary,
input[type="reset"].button-primary,
input[type="button"].button-primary {
  color: #FFF;
  background-color: #33C3F0;
  border-color: #33C3F0; }
.button.button-primary:hover,
button.button-primary:hover,
input[type="submit"].button-primary:hover,
input[type="reset"].button-primary:hover,
input[type="button"].button-primary:hover,
.button.button-primary:focus,
button.button-primary:focus,
input[type="submit"].button-primary:focus,
input[type="reset"].button-primary:focus,
input[type="button"].button-primary:focus {
  color: #FFF;
  background-color: #1EAEDB;
  border-color: #1EAEDB; }


/* Forms
–––––––––––––––––––––––––––––––––––––––––––––––––– */
input[type="email"],
input[type="number"],
input[type="search"],
input[type="text"],
input[type="tel"],
input[type="url"],
input[type="password"],
textarea,
select {
  height: 38px;
  padding: 6px 10px; /* The 6px vertically centers text on FF, ignored by Webkit */
  background-color: #fff;
  border: 1px solid #D1D1D1;
  border-radius: 4px;
  box-shadow: none;
  box-sizing: border-box; }
/* Removes awkward default styles on some inputs for iOS */
input[type="email"],
input[type="number"],
input[type="search"],
input[type="text"],
input[type="tel"],
input[type="url"],
input[type="password"],
textarea {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none; }
textarea {
  min-height: 65px;
  padding-top: 6px;
  padding-bottom: 6px; }
input[type="email"]:focus,
input[type="number"]:focus,
input[type="search"]:focus,
input[type="text"]:focus,
input[type="tel"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
textarea:focus,
select:focus {
  border: 1px solid #33C3F0;
  outline: 0; }
label,
legend {
  display: block;
  margin-bottom: .5rem;
  font-weight: 600; }
fieldset {
  padding: 0;
  border-width: 0; }
input[type="checkbox"],
input[type="radio"] {
  display: inline; }
label > .label-body {
  display: inline-block;
  margin-left: .5rem;
  font-weight: normal; }




 web/ui2/index.html

@@ -5,7 +5,6 @@
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <link href="https://fonts.googleapis.com/css?family=Roboto+Condensed" rel="stylesheet">
    <link rel="stylesheet" href="/jslib/codemirror/lib/codemirror.css">        
    <link rel="stylesheet" type="text/css" href="stile.css">
  </head>

 web/ui2/stile.css

@@ -35,7 +35,8 @@
  height: 2em;
  align-items: center;
  margin: 0;
  padding: 0;
  padding: 0;  
  justify-content:space-between;  
}
.sued {
  height: 1.5em;
@@ -408,6 +409,15 @@
  transition-delay: 0.075s;
}

/* Fonts */

@font-face {
  font-family: 'Roboto Condensed';
  src: url('/lib/fonts/Roboto_Condensed/RobotoCondensed-Regular.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}

/* Font für Piktogramme mit Fontello aus FontAwesome erzeugt */

@font-face {

File was renamed from web/index.jsp
			@@ -1,4 +1,3 @@
			<%@page contentType="text/html" pageEncoding="UTF-8"%>
			<!DOCTYPE html>
			<html>
			<head>
			@@ -7,6 +6,6 @@
			</head>
			<body>
			<h1>Dateiverwaltung</h1>
			<p><a href="ui">Anmeldung</a></p>
			<p><a href="ui2">Anmeldung</a></p>
			</body>
			</html>

			@@ -2,92 +2,21 @@
			<html lang="en">
			<head>
			<meta charset="utf-8">
			<meta http-equiv="X-UA-Compatible" content="IE=edge">
			<meta name="viewport" content="width=device-width, initial-scale=1">
			<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalabe=no">
			<meta name="description" content="">
			<meta name="author" content="">
			<!--<link rel="icon" href="../../favicon.ico">-->

			<link rel="stylesheet" type="text/css" href="stile.css">
			<title>Anmeldung Dateiverwaltung</title>

			<!-- Bootstrap core CSS -->
			<link rel="stylesheet" href="/jslib/bootstrap/css/bootstrap.min.css">

			<!-- Custom styles for this template -->
			<!--<link href="signin.css" rel="stylesheet">-->
			<style type="text/css">
			body {
			padding-top: 40px;
			padding-bottom: 40px;
			background-color: #eee;
			}

			.form-signin {
			max-width: 330px;
			padding: 15px;
			margin: 0 auto;
			}
			.form-signin .form-signin-heading,
			.form-signin .checkbox {
			margin-bottom: 10px;
			}
			.form-signin .checkbox {
			font-weight: normal;
			}
			.form-signin .form-control {
			position: relative;
			height: auto;
			-webkit-box-sizing: border-box;
			-moz-box-sizing: border-box;
			box-sizing: border-box;
			padding: 10px;
			font-size: 16px;
			}
			.form-signin .form-control:focus {
			z-index: 2;
			}
			.form-signin input[type="text"] {
			margin-bottom: -1px;
			border-bottom-right-radius: 0;
			border-bottom-left-radius: 0;
			}
			.form-signin input[type="password"] {
			margin-bottom: 10px;
			border-top-left-radius: 0;
			border-top-right-radius: 0;
			}
			.backlink {
			margin-top: 2em;
			}
			</style>

			<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
			<!--[if lt IE 9]>
			<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
			<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
			<![endif]-->
			</head>

			<body>

			<div class="container">

			<form class="form-signin" role="form" method="POST" action="j_security_check" name="loginform">
			<h2 class="form-signin-heading">Anmeldung Dateiverwaltung</h2>
			<input name="j_username" type="text" class="form-control" placeholder="Benutzerkennung" required autofocus>
			<input name="j_password" type="password" class="form-control" placeholder="Kennwort" required>
			<!--
			<label class="checkbox">
			<input type="checkbox" value="remember-me"> Remember me
			</label>
			-->
			<button class="btn btn-lg btn-primary btn-block" type="submit">Senden</button>
			<p class="backlink"><a href="/">zurück zur Hauptseite</a></p>
			<button class="btn btn-lg button-primary btn-block" type="submit">Senden</button>
			<p class="backlink"><a href="/">zurück zur Hauptseite</a></p>
			</form>



			</div> <!-- /container -->

			</div>
			</body>
			</html>

			@@ -3,14 +3,14 @@
			<head>
			<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
			<meta name="viewport" content="width=device-width, initial-scale=1.0">
			<link rel="stylesheet" type="text/css" href="/jslib/bootstrap/css/bootstrap.min.css">
			<link rel="stylesheet" type="text/css" href="stile.css">
			<title>Abgemeldet</title>
			</head>
			<body>
			<div style="margin: 20px;">
			<h3>Abmeldung</h3>
			<p>Sie haben sich erfolgreich abgemeldet.</p>
			<p>zurück zur <a href="ui/">Anmeldung</a> • <a href="/">Hauptseite</a></p>
			<p>zurück zur <a href="ui2">Anmeldung</a> • <a href="/">Startseite</a></p>
			</div>
			</body>
			</html>

New file
			@@ -0,0 +1,166 @@

			html, body {
			margin: 0;
			padding: 0;
			height: 100%; /* Anmerkung 2 */
			font-size: larger;
			font-family: 'Roboto Condensed';
			-webkit-text-size-adjust: none;
			}

			.form-signin {
			text-align: center;
			display: flex;
			flex-flow: column;
			align-items: center;
			margin: 0 5% 0 5%;
			}

			.form-signin input {
			margin: 0.5em 0 0.5em 0;
			font-size: large;
			}

			.form-signin button {
			margin: 1.5em 0 0.5em 0;
			}

			@media (min-width: 600px) {
			.form-signin {
			margin: 0 20% 0 20%;
			}
			}

			@font-face {
			font-family: 'Roboto Condensed';
			src: url('/lib/fonts/Roboto_Condensed/RobotoCondensed-Regular.ttf') format('truetype');
			font-weight: normal;
			font-style: normal;
			}


			/* von Skeleton */

			/* Buttons
			–––––––––––––––––––––––––––––––––––––––––––––––––– */
			.button,
			button,
			input[type="submit"],
			input[type="reset"],
			input[type="button"] {
			display: inline-block;
			height: 38px;
			padding: 0 30px;
			color: #555;
			text-align: center;
			font-size: 11px;
			font-weight: 600;
			line-height: 38px;
			letter-spacing: .1rem;
			text-transform: uppercase;
			text-decoration: none;
			white-space: nowrap;
			background-color: transparent;
			border-radius: 4px;
			border: 1px solid #bbb;
			cursor: pointer;
			box-sizing: border-box; }
			.button:hover,
			button:hover,
			input[type="submit"]:hover,
			input[type="reset"]:hover,
			input[type="button"]:hover,
			.button:focus,
			button:focus,
			input[type="submit"]:focus,
			input[type="reset"]:focus,
			input[type="button"]:focus {
			color: #333;
			border-color: #888;
			outline: 0; }
			.button.button-primary,
			button.button-primary,
			input[type="submit"].button-primary,
			input[type="reset"].button-primary,
			input[type="button"].button-primary {
			color: #FFF;
			background-color: #33C3F0;
			border-color: #33C3F0; }
			.button.button-primary:hover,
			button.button-primary:hover,
			input[type="submit"].button-primary:hover,
			input[type="reset"].button-primary:hover,
			input[type="button"].button-primary:hover,
			.button.button-primary:focus,
			button.button-primary:focus,
			input[type="submit"].button-primary:focus,
			input[type="reset"].button-primary:focus,
			input[type="button"].button-primary:focus {
			color: #FFF;
			background-color: #1EAEDB;
			border-color: #1EAEDB; }


			/* Forms
			–––––––––––––––––––––––––––––––––––––––––––––––––– */
			input[type="email"],
			input[type="number"],
			input[type="search"],
			input[type="text"],
			input[type="tel"],
			input[type="url"],
			input[type="password"],
			textarea,
			select {
			height: 38px;
			padding: 6px 10px; /* The 6px vertically centers text on FF, ignored by Webkit */
			background-color: #fff;
			border: 1px solid #D1D1D1;
			border-radius: 4px;
			box-shadow: none;
			box-sizing: border-box; }
			/* Removes awkward default styles on some inputs for iOS */
			input[type="email"],
			input[type="number"],
			input[type="search"],
			input[type="text"],
			input[type="tel"],
			input[type="url"],
			input[type="password"],
			textarea {
			-webkit-appearance: none;
			-moz-appearance: none;
			appearance: none; }
			textarea {
			min-height: 65px;
			padding-top: 6px;
			padding-bottom: 6px; }
			input[type="email"]:focus,
			input[type="number"]:focus,
			input[type="search"]:focus,
			input[type="text"]:focus,
			input[type="tel"]:focus,
			input[type="url"]:focus,
			input[type="password"]:focus,
			textarea:focus,
			select:focus {
			border: 1px solid #33C3F0;
			outline: 0; }
			label,
			legend {
			display: block;
			margin-bottom: .5rem;
			font-weight: 600; }
			fieldset {
			padding: 0;
			border-width: 0; }
			input[type="checkbox"],
			input[type="radio"] {
			display: inline; }
			label > .label-body {
			display: inline-block;
			margin-left: .5rem;
			font-weight: normal; }

			@@ -5,7 +5,6 @@
			<meta charset="UTF-8">
			<meta name="viewport" content="width=device-width, initial-scale=1.0">
			<meta name="apple-mobile-web-app-capable" content="yes" />
			<link href="https://fonts.googleapis.com/css?family=Roboto+Condensed" rel="stylesheet">
			<link rel="stylesheet" href="/jslib/codemirror/lib/codemirror.css">
			<link rel="stylesheet" type="text/css" href="stile.css">
			</head>

			@@ -35,7 +35,8 @@
			height: 2em;
			align-items: center;
			margin: 0;
			padding: 0;
			padding: 0;
			justify-content:space-between;
			}
			.sued {
			height: 1.5em;
			@@ -408,6 +409,15 @@
			transition-delay: 0.075s;
			}

			/* Fonts */

			@font-face {
			font-family: 'Roboto Condensed';
			src: url('/lib/fonts/Roboto_Condensed/RobotoCondensed-Regular.ttf') format('truetype');
			font-weight: normal;
			font-style: normal;
			}

			/* Font für Piktogramme mit Fontello aus FontAwesome erzeugt */

			@font-face {