1
0
mirror of https://github.com/Luzifer/password.git synced 2024-09-19 10:22:56 +00:00

Port application to Bootstrap 4

Signed-off-by: Knut Ahlers <knut@ahlers.me>
This commit is contained in:
Knut Ahlers 2019-01-01 14:37:21 +01:00
parent da8ee1b21c
commit 7cce1357fe
Signed by: luzifer
GPG Key ID: DC2729FDD34BE99E
6 changed files with 3624 additions and 6786 deletions

10253
bindata.go

File diff suppressed because it is too large Load Diff

View File

@ -2,72 +2,70 @@
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="utf-8"> <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="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<title>Secure Password</title> <title>Secure Password</title>
<!-- Load app script early to prevent blank HTML without styling --> <!-- Load app script early to prevent blank HTML without styling -->
<script src="assets/bundle.js"></script> <script src="assets/bundle.js"></script>
</head> </head>
<body> <body>
<nav class="navbar navbar-default"> <nav class="navbar navbar-expand-lg navbar-light bg-light">
<div class="container-fluid"> <a class="navbar-brand" href="#">Secure Password</a>
<!-- Brand and toggle get grouped for better mobile display --> <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<div class="navbar-header"> <span class="navbar-toggler-icon"></span>
<button type="button" class="navbar-toggle" data-toggle="modal" data-target="#settingsModal"> </button>
<span class="glyphicon glyphicon-cog" aria-hidden="true"></span>
</button> <div class="collapse navbar-collapse" id="navbarSupportedContent">
<a class="navbar-brand" href="#">Secure Password</a> <ul class="navbar-nav mr-auto">
</div> <li class="nav-item">
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"> <a class="nav-link" href="https://github.com/Luzifer/password#via-alfred">Alfred Extension</a>
<ul class="nav navbar-nav"> </li>
<li><a href="https://github.com/Luzifer/password#via-alfred"> <li class="nav-item">
Alfred Extension</a></li> <a class="nav-link" href="https://github.com/Luzifer/password#via-api">API Documentation</a>
<li><a href="https://github.com/Luzifer/password#via-api"> </li>
API Documentation</a></li> </ul>
</ul>
<ul class="nav navbar-nav navbar-right"> <ul class="navbar-nav">
<li> <li class="nav-item">
<button type="button" class="btn btn-default navbar-btn" data-toggle="modal" data-target="#settingsModal"> <button type="button" class="btn btn-default navbar-btn" data-toggle="modal" data-target="#settingsModal">
<span class="glyphicon glyphicon-cog" aria-hidden="true"></span> Settings <i class="fas fa-cog" aria-hidden="true"></i> Settings
</button> </button>
</li> </li>
</ul> </ul>
</div>
</div> </div>
</nav> </nav>
<div class="container"> <div class="container mt-4">
<div class="row"> <div class="row justify-content-md-center">
<div class="col-xs-12 col-sm-8 col-sm-offset-2 col-md-6 col-md-offset-3"> <div class="col-xs-12 col-sm-8 col-md-6">
<div class="jumbotron"> <div class="jumbotron">
<p class="center"> <p class="lead center">
I will generate a new secure password every 30 seconds. Just click the password to keep the current one. I will generate a new secure password every 30 seconds. Just click the password to keep the current one.
</p> </p>
</div> </div>
<div class="panel panel-default"> <div class="card mb-3">
<div class="panel-heading"> <div class="card-header">
Your password Your password
</div> </div>
<div class="panel-body"> <div class="card-body">
<div class="form-group"> <div class="form-group">
<input class="form-control center" id="focusedInput" type="text" value="..."> <input class="form-control center" id="focusedInput" type="text" value="...">
</div> </div>
</div> </div>
<div class="panel-footer"> <div class="card-footer">
<div class="progress"> <div class="progress">
<div class="progress-bar" style="width: 100%;"></div> <div class="progress-bar" style="width: 100%;"></div>
</div> </div>
</div> </div>
</div> </div>
<div class="panel panel-default"> <div class="card">
<div class="panel-heading"> <div class="card-header">
FAQ FAQ
</div> </div>
<div class="panel-body"> <div class="card-body">
<ul> <ul>
<li><strong>Do you store my password?</strong><br> <li><strong>Do you store my password?</strong><br>
You decide which one to take and we will not store any of the generated passwords. That way you can be sure only you know which password you chose. You decide which one to take and we will not store any of the generated passwords. That way you can be sure only you know which password you chose.
@ -86,12 +84,12 @@
</div> </div>
</div> </div>
<div class="modal" id="settingsModal"> <div class="modal" id="settingsModal" role="dialog">
<div class="modal-dialog"> <div class="modal-dialog" role="document">
<div class="modal-content"> <div class="modal-content">
<div class="modal-header"> <div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h4 class="modal-title">Settings</h4> <h4 class="modal-title">Settings</h4>
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
</div> </div>
<div class="modal-body"> <div class="modal-body">
<div class="form-group"> <div class="form-group">

View File

@ -4,6 +4,8 @@
"devDependencies": { "devDependencies": {
"@babel/core": "^7.2.2", "@babel/core": "^7.2.2",
"@babel/preset-env": "^7.2.3", "@babel/preset-env": "^7.2.3",
"@fortawesome/fontawesome-svg-core": "^1.2.12",
"@fortawesome/free-solid-svg-icons": "^5.6.3",
"babel-loader": "^8.0.4", "babel-loader": "^8.0.4",
"css-loader": "^2.1.0", "css-loader": "^2.1.0",
"file-loader": "^3.0.1", "file-loader": "^3.0.1",
@ -12,11 +14,11 @@
"webpack-cli": "^3.1.2" "webpack-cli": "^3.1.2"
}, },
"dependencies": { "dependencies": {
"bootstrap": "^3.3.7", "bootstrap": "^4.1.2",
"bootstrap-sass": "^3.3.7", "bootswatch": "^4.1.2",
"bootswatch": "^3.3.7",
"jquery": "^3.3.1", "jquery": "^3.3.1",
"node-sass": "^4.11.0", "node-sass": "^4.11.0",
"popper.js": "^1.14.6",
"sass-loader": "^7.1.0", "sass-loader": "^7.1.0",
"typeface-roboto": "^0.0.54" "typeface-roboto": "^0.0.54"
} }

View File

@ -1,8 +1,22 @@
import 'jquery' // Libraries
import 'bootstrap' import 'bootstrap'
// Styles
import './style.scss' import './style.scss'
// FontAwesome 5
import {
library,
dom
} from '@fortawesome/fontawesome-svg-core'
import {
faCog
} from '@fortawesome/free-solid-svg-icons'
library.add(faCog)
dom.watch()
// Application code
import storage from './storage.js' import storage from './storage.js'
let now = () => { let now = () => {

View File

@ -1,9 +1,9 @@
$icon-font-path: "~bootstrap-sass/assets/fonts/bootstrap/"; $font-size-base: 0.95rem;
$web-font-path: '~typeface-roboto/index.css'; $web-font-path: '~typeface-roboto/index.css';
@import '~bootswatch/paper/_variables.scss'; @import '~bootswatch/dist/materia/_variables.scss';
@import "~bootstrap-sass/assets/stylesheets/bootstrap"; @import "~bootstrap/scss/bootstrap";
@import '~bootswatch/paper/_bootswatch.scss'; @import '~bootswatch/dist/materia/_bootswatch.scss';
body { body {
background-color: #e2e2e2; background-color: #e2e2e2;

View File

@ -583,6 +583,25 @@
lodash "^4.17.10" lodash "^4.17.10"
to-fast-properties "^2.0.0" to-fast-properties "^2.0.0"
"@fortawesome/fontawesome-common-types@^0.2.12":
version "0.2.12"
resolved "https://registry.yarnpkg.com/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-0.2.12.tgz#42baa71f97ca06faeb0b6718fa5ed20c5eefdf07"
integrity sha512-ISLNpEx6fhJTYYkvBeo/4DHeL5EIA+VybJoOOnH67m6uXt6V6VFizdEN4qchHagNIeZfzI0LnA22gk0wbVPv/g==
"@fortawesome/fontawesome-svg-core@^1.2.12":
version "1.2.12"
resolved "https://registry.yarnpkg.com/@fortawesome/fontawesome-svg-core/-/fontawesome-svg-core-1.2.12.tgz#9732617b1e484435f6946645d7f9ad248f12c437"
integrity sha512-cqTfa3vZ+Z9UYQnmLfCOwyLnf0Xcoxkmm/BSaI29Yikzu9zIeD4es7lBZMDqLOXYSEQC+rCr8caxFlGJcJVA+w==
dependencies:
"@fortawesome/fontawesome-common-types" "^0.2.12"
"@fortawesome/free-solid-svg-icons@^5.6.3":
version "5.6.3"
resolved "https://registry.yarnpkg.com/@fortawesome/free-solid-svg-icons/-/free-solid-svg-icons-5.6.3.tgz#1d7f6669ccd6a1ea673699e41f7e32c81401a260"
integrity sha512-ld8Gfp1KrncOpFRheThUDlD6/Ro9ZJGqfCEMXlO/x1Cg7ltLc5iYDG7yxDowLcmFY2BGSmxIIU3ZMW5FVTrfwQ==
dependencies:
"@fortawesome/fontawesome-common-types" "^0.2.12"
"@webassemblyjs/ast@1.7.11": "@webassemblyjs/ast@1.7.11":
version "1.7.11" version "1.7.11"
resolved "https://registry.yarnpkg.com/@webassemblyjs/ast/-/ast-1.7.11.tgz#b988582cafbb2b095e8b556526f30c90d057cace" resolved "https://registry.yarnpkg.com/@webassemblyjs/ast/-/ast-1.7.11.tgz#b988582cafbb2b095e8b556526f30c90d057cace"
@ -976,20 +995,15 @@ bn.js@^4.0.0, bn.js@^4.1.0, bn.js@^4.1.1, bn.js@^4.4.0:
resolved "https://registry.yarnpkg.com/bn.js/-/bn.js-4.11.8.tgz#2cde09eb5ee341f484746bb0309b3253b1b1442f" resolved "https://registry.yarnpkg.com/bn.js/-/bn.js-4.11.8.tgz#2cde09eb5ee341f484746bb0309b3253b1b1442f"
integrity sha512-ItfYfPLkWHUjckQCk8xC+LwxgK8NYcXywGigJgSwOP8Y2iyWT4f2vsZnoOXTTbo+o5yXmIUJ4gn5538SO5S3gA== integrity sha512-ItfYfPLkWHUjckQCk8xC+LwxgK8NYcXywGigJgSwOP8Y2iyWT4f2vsZnoOXTTbo+o5yXmIUJ4gn5538SO5S3gA==
bootstrap-sass@^3.3.7: bootstrap@^4.1.2:
version "3.4.0" version "4.2.1"
resolved "https://registry.yarnpkg.com/bootstrap-sass/-/bootstrap-sass-3.4.0.tgz#b1c330a56782347f626d31d497fa4aea16b3f99b" resolved "https://registry.yarnpkg.com/bootstrap/-/bootstrap-4.2.1.tgz#8f8bdca024dbf0e8644da32e918c8a03a90a5757"
integrity sha512-qdUyw4KmNNPSIdBadn+eyuuQFH0LsZlRCs6tor1zN8sQas7mnY5JNfemauraOdNPiFQd2gFeeo3gZjZZCuohZg== integrity sha512-tt/7vIv3Gm2mnd/WeDx36nfGGHleil0Wg8IeB7eMrVkY0fZ5iTaBisSh8oNANc2IBsCc6vCgCNTIM/IEN0+50Q==
bootstrap@^3.3.7: bootswatch@^4.1.2:
version "3.4.0" version "4.2.1"
resolved "https://registry.yarnpkg.com/bootstrap/-/bootstrap-3.4.0.tgz#f8d77540dd3062283d2ae7687e21c1e691961640" resolved "https://registry.yarnpkg.com/bootswatch/-/bootswatch-4.2.1.tgz#be402aeb8f9920c008c62f8a77c29a91a11b4c8a"
integrity sha512-F1yTDO9OHKH0xjl03DsOe8Nu1OWBIeAugGMhy3UTIYDdbbIPesQIhCEbj+HEr6wqlwweGAlP8F3OBC6kEuhFuw== integrity sha512-2UV3a/3sleGVsOa8q3t5O4+u+ONfQvscMTKwqMVd0tkcypGhiLeE3W461qJ4uZzo6AzCSuYBTzGmOSdel0g9/A==
bootswatch@^3.3.7:
version "3.4.0"
resolved "https://registry.yarnpkg.com/bootswatch/-/bootswatch-3.4.0.tgz#712ecbda714fe365e7310a0e20f89829eaea0ffa"
integrity sha512-eCMWAa3/vYkT7bKDbffcgmbfy8keGSETMY0ECt+vAnKf2nKtgJUlr99x5OGFp3ZKW4hQrsSR9mPhNqFQRl4PXw==
brace-expansion@^1.1.7: brace-expansion@^1.1.7:
version "1.1.11" version "1.1.11"
@ -3436,6 +3450,11 @@ pkg-dir@^3.0.0:
dependencies: dependencies:
find-up "^3.0.0" find-up "^3.0.0"
popper.js@^1.14.6:
version "1.14.6"
resolved "https://registry.yarnpkg.com/popper.js/-/popper.js-1.14.6.tgz#ab20dd4edf9288b8b3b6531c47c361107b60b4b0"
integrity sha512-AGwHGQBKumlk/MDfrSOf0JHhJCImdDMcGNoqKmKkU+68GFazv3CQ6q9r7Ja1sKDZmYWTckY/uLyEznheTDycnA==
posix-character-classes@^0.1.0: posix-character-classes@^0.1.0:
version "0.1.1" version "0.1.1"
resolved "https://registry.yarnpkg.com/posix-character-classes/-/posix-character-classes-0.1.1.tgz#01eac0fe3b5af71a2a6c02feabb8c1fef7e00eab" resolved "https://registry.yarnpkg.com/posix-character-classes/-/posix-character-classes-0.1.1.tgz#01eac0fe3b5af71a2a6c02feabb8c1fef7e00eab"