--- /dev/null
+<!DOCTYPE html>
+<html lang="en">
+<head>
+ <meta charset="UTF-8">
+ <title>$TITLE</title>
+ <script src="data/forge.js"></script>
+ <script src="data/jquery.js"></script>
+ <script>$CREDENTIALS</script>
+ <script>$CODE</script>
+ <style>
+ * {
+ box-sizing: border-box;
+ margin: 0;
+ padding: 0;
+ outline: 0;
+ }
+
+ html {
+ height: 100%
+ }
+
+ body {
+ font-family: '$FONT', sans-serif;
+ background-color: #fff;
+ background-size: cover;
+ background-image: url('data/secure/$BACKGROUND_IMAGE');
+ color: #000;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ height: 100%;
+ letter-spacing: .05em;
+ font-weight: 200;
+ }
+
+ #logo {
+ width: 206px;
+ }
+
+ main {
+ width: 460px;
+ max-width: 460px;
+ background-color: #fff;
+ padding: 60px;
+ margin: 0 auto;
+ font-size: 14px;
+ text-align: center;
+ vertical-align: middle;
+ }
+
+ h2 {
+ text-transform: uppercase;
+ margin: 50px 0 40px;
+ font-size: 14px;
+ font-weight: 500;
+ }
+
+ p {
+ max-width: 240px;
+ margin: 40px auto;
+ }
+
+ form {
+ margin: 40px 0 0;
+ }
+
+ label {
+ display: block;
+ margin-bottom: 20px;
+ }
+
+ input {
+ border: 1px solid #efefef;
+ padding: 15px 25px;
+ width: 100%;
+ font-family: '$FONT', sans-serif;
+ font-weight: 300;
+ font-size: 14px;
+ }
+
+ input[type="submit"] {
+ background-color: #000;
+ color: #ffffff;
+ font-weight: 500;
+ text-transform: uppercase;
+ cursor: pointer;
+ }
+
+ #message {
+ color: #c00;
+ }
+ </style>
+</head>
+<body>
+<main>
+ <img id="logo" src="data/secure/$LOGO">
+ <h2>$FORM_TITLE</h2>
+ <p>$FORM_TEXT</p>
+ <p id="message"></p>
+ <form>
+ <label><input type="text" name="username" id="username" placeholder="$FORM_USERNAME" autofocus></label>
+ <label><input type="password" name="password" id="password" placeholder="$FORM_PASSWORD"></label>
+ <input type="submit" value="$FORM_SIGN_IN">
+ </form>
+</main>
+</body>
+</html>
\ No newline at end of file
--- /dev/null
+@font-face {
+ font-family: 'Montserrat';
+ font-style: normal;
+ font-weight: 100;
+ src: local(''),
+ url('Metropolis-Thin.woff2') format('woff2'), url('Metropolis-Thin.woff') format('woff');
+}
+
+@font-face {
+ font-family: 'Montserrat';
+ font-style: Italic;
+ font-weight: 100;
+ src: local(''),
+ url('Metropolis-ThinItalic.woff2') format('woff2'), url('Metropolis-ThinItalic.woff') format('woff');
+}
+
+@font-face {
+ font-family: 'Montserrat';
+ font-style: normal;
+ font-weight: 200;
+ src: local(''),
+ url('Metropolis-ExtraLight.woff2') format('woff2'), url('Metropolis-ExtraLight.woff') format('woff');
+}
+
+@font-face {
+ font-family: 'Montserrat';
+ font-style: Italic;
+ font-weight: 200;
+ src: local(''),
+ url('Metropolis-ExtraLightItalic.woff2') format('woff2'), url('Metropolis-ExtraLightItalic.woff') format('woff');
+}
+
+@font-face {
+ font-family: 'Montserrat';
+ font-style: normal;
+ font-weight: 300;
+ src: local(''),
+ url('Metropolis-Light.woff2') format('woff2'), url('Metropolis-Light.woff') format('woff');
+}
+
+@font-face {
+ font-family: 'Montserrat';
+ font-style: Italic;
+ font-weight: 300;
+ src: local(''),
+ url('Metropolis-LightItalic.woff2') format('woff2'), url('Metropolis-LightItalic.woff') format('woff');
+}
+
+@font-face {
+ font-family: 'Montserrat';
+ font-style: normal;
+ font-weight: 400;
+ src: local(''),
+ url('Metropolis-Regular.woff2') format('woff2'), url('Metropolis-Regular.woff') format('woff');
+}
+
+@font-face {
+ font-family: 'Montserrat';
+ font-style: normal;
+ font-weight: 500;
+ src: local(''),
+ url('Metropolis-Medium.woff2') format('woff2'), url('Metropolis-Medium.woff') format('woff');
+}
+
+@font-face {
+ font-family: 'Montserrat';
+ font-style: Italic;
+ font-weight: 400;
+ src: local(''),
+ url('Metropolis-RegularItalic.woff2') format('woff2'), url('Metropolis-RegularItalic.woff') format('woff');
+}
+
+@font-face {
+ font-family: 'Montserrat';
+ font-style: Italic;
+ font-weight: 500;
+ src: local(''),
+ url('Metropolis-MediumItalic.woff2') format('woff2'), url('Metropolis-MediumItalic.woff') format('woff');
+}
+
+@font-face {
+ font-family: 'Montserrat';
+ font-style: normal;
+ font-weight: 600;
+ src: local(''),
+ url('Metropolis-SemiBold.woff2') format('woff2'), url('Metropolis-SemiBold.woff') format('woff');
+}
+
+@font-face {
+ font-family: 'Montserrat';
+ font-style: Italic;
+ font-weight: 600;
+ src: local(''),
+ url('Metropolis-SemiBoldItalic.woff2') format('woff2'), url('Metropolis-SemiBoldItalic.woff') format('woff');
+}
+
+@font-face {
+ font-family: 'Montserrat';
+ font-style: normal;
+ font-weight: 700;
+ src: local(''),
+ url('Metropolis-Bold.woff2') format('woff2'), url('Metropolis-Bold.woff') format('woff');
+}
+
+@font-face {
+ font-family: 'Montserrat';
+ font-style: Italic;
+ font-weight: 700;
+ src: local(''),
+ url('Metropolis-BoldItalic.woff2') format('woff2'), url('Metropolis-BoldItalic.woff') format('woff');
+}
+
+@font-face {
+ font-family: 'Montserrat';
+ font-style: normal;
+ font-weight: 800;
+ src: local(''),
+ url('Metropolis-ExtraBold.woff2') format('woff2'), url('Metropolis-ExtraBold.woff') format('woff');
+}
+
+@font-face {
+ font-family: 'Montserrat';
+ font-style: Italic;
+ font-weight: 800;
+ src: local(''),
+ url('Metropolis-ExtraBoldItalic.woff2') format('woff2'), url('Metropolis-ExtraBoldItalic.woff') format('woff');
+}
+
+@font-face {
+ font-family: 'Montserrat';
+ font-style: normal;
+ font-weight: 900;
+ src: local(''),
+ url('Metropolis-Black.woff2') format('woff2'), url('Metropolis-Black.woff') format('woff');
+}
+
+@font-face {
+ font-family: 'Montserrat';
+ font-style: Italic;
+ font-weight: 900;
+ src: local(''),
+ url('Metropolis-BlackItalic.woff2') format('woff2'), url('Metropolis-BlackItalic.woff') format('woff');
+}
projects / fluidbook-html5.git / commitdiff