Julian
GitHub
parent
25b6f069fe
commit
5c33d0d5c9
|
|
@ -0,0 +1,22 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Lume Web Extension Installer</title>
|
||||
<link rel="stylesheet" href="./css/reset.css" type="text/css" />
|
||||
<link rel="stylesheet" href="./css/style.css" type="text/css" />
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="content-container">
|
||||
|
||||
<img class="header-icon" src="/images/logo-lume-single.svg">
|
||||
<h1>Extension installed succesfully</h1>
|
||||
<div class="paragraph">
|
||||
<img src="images/icon-check.svg" /><p>All done, fully powered and ready to go!</p>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
|
||||
|
|
@ -0,0 +1,39 @@
|
|||
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
font-size: 100%;
|
||||
font: inherit;
|
||||
vertical-align: baseline;
|
||||
}
|
||||
|
||||
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
|
||||
display: block;
|
||||
}
|
||||
|
||||
body {
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
ol, ul {
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
blockquote, q {
|
||||
quotes: none;
|
||||
}
|
||||
|
||||
blockquote:before, blockquote:after {
|
||||
content: "";
|
||||
content: none;
|
||||
}
|
||||
|
||||
q:before, q:after {
|
||||
content: "";
|
||||
content: none;
|
||||
}
|
||||
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
border-spacing: 0;
|
||||
}
|
||||
|
|
@ -0,0 +1,290 @@
|
|||
/* Base preferences*/
|
||||
html {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
html *,
|
||||
html :before,
|
||||
html :after {
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
body {
|
||||
background-color: #F9F9F9;
|
||||
background-image: url('/images/background-lume-installer.png');
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
background-position: bottom;
|
||||
font-family: "Roboto", 'Arial', serif;
|
||||
margin: 120px 40px 40px 40px;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 480px) {
|
||||
body {
|
||||
margin: 60px 20px 40px 20px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/* Fonts */
|
||||
@font-face {
|
||||
src: url(../fonts/Roboto-Light.ttf) format("trueType");
|
||||
font-family: "Roboto", 'Arial', sans-serif;
|
||||
font-weight: 300;
|
||||
}
|
||||
@font-face {
|
||||
src: url(../fonts/Roboto-LightItalic.ttf) format("trueType");
|
||||
font-family: "Roboto", 'Arial', sans-serif;
|
||||
font-weight: 300;
|
||||
}
|
||||
@font-face {
|
||||
src: url(../fonts/Roboto-Regular.ttf) format("trueType");
|
||||
font-family: "Roboto", 'Arial', sans-serif;
|
||||
font-weight: 400;
|
||||
}
|
||||
@font-face {
|
||||
src: url(../Roboto-Italic.ttf) format("trueType");
|
||||
font-family: "Roboto", 'Arial', sans-serif;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
src: url(../fonts/Roboto-Medium.ttf) format("trueType");
|
||||
font-family: "Roboto", 'Arial', sans-serif;
|
||||
font-weight: 500;
|
||||
}
|
||||
@font-face {
|
||||
src: url(../fonts/Roboto-MediumItalic.ttf) format("trueType");
|
||||
font-family: "Roboto", 'Arial', sans-serif;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
src: url(../fonts/Roboto-Bold.ttf) format("trueType");
|
||||
font-family: "Roboto", 'Arial', sans-serif;
|
||||
font-weight: 600;
|
||||
}
|
||||
@font-face {
|
||||
src: url(../fonts/Roboto-BoldItalic.ttf) format("trueType");
|
||||
font-family: "Roboto", 'Arial', sans-serif;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: 22px;
|
||||
font-weight: 600;
|
||||
margin: 0 0 28px 0;
|
||||
color: #2A82DE;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 480px) {
|
||||
h1 {
|
||||
font-size: 20px;
|
||||
margin: 0 0 20px 0;
|
||||
line-height: 1.25;
|
||||
}
|
||||
}
|
||||
|
||||
.header-icon {
|
||||
width: 40px;
|
||||
margin: 0 0 10px -2px;
|
||||
}
|
||||
|
||||
strong {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
|
||||
/* Content container */
|
||||
.content-container {
|
||||
background-color: #fff;
|
||||
border: 0.5px solid rgba(16, 226, 96, 0.3);
|
||||
-webkit-box-shadow: 0px 0px 50px 15px rgba(16,226,96,0.10);
|
||||
box-shadow: 0px 0px 50px 15px rgba(16,226,96,0.10);
|
||||
border-radius: 8px;
|
||||
max-width: 600px;
|
||||
padding: 20px 50px 20px 50px;
|
||||
margin: 0 auto;
|
||||
position: center;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 480px) {
|
||||
.content-container {
|
||||
padding: 20px 20px 20px 30px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/* Notice message */
|
||||
.notice {
|
||||
background-color: #e7f2ff;
|
||||
border: 0.5px solid #2A82DE;
|
||||
border-left: 4px solid #2A82DE;
|
||||
border-radius: 4px;
|
||||
padding: 16px 20px 16px 22px;
|
||||
}
|
||||
|
||||
.notice-content {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.notice-content span {
|
||||
display: block;
|
||||
font-family: "Roboto", 'Arial', sans-serif;
|
||||
font-weight: 400;
|
||||
font-size: 14px;
|
||||
line-height: 1.4;
|
||||
color: #2A82DE;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 480px) {
|
||||
.notice {
|
||||
padding: 14px 12px 15px 16px;
|
||||
}
|
||||
|
||||
.notice-content img {
|
||||
width: 20px;
|
||||
margin: 0 8px 2px 0;
|
||||
}
|
||||
|
||||
.notice-content span {
|
||||
font-size: 13px;
|
||||
line-height: 1.35;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/* Paragraph */
|
||||
.paragraph {
|
||||
display: inline-block;
|
||||
margin-bottom: 22px;
|
||||
}
|
||||
|
||||
.paragraph p {
|
||||
font-family: "Roboto", 'Arial', sans-serif;
|
||||
font-weight: 400;
|
||||
font-size: 15px;
|
||||
line-height: 1.6;
|
||||
color: #151515;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.paragraph p + p {
|
||||
padding: 24px 0 0 0;
|
||||
}
|
||||
|
||||
.paragraph img {
|
||||
display: inline-block;
|
||||
width: 22px;
|
||||
vertical-align: middle;
|
||||
margin: 0 8px 2px 0;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 480px) {
|
||||
.paragraph p {
|
||||
font-size: 14px;
|
||||
line-height: 1.45;
|
||||
}
|
||||
|
||||
.paragraph p + p {
|
||||
padding: 20px 0 0 0;
|
||||
}
|
||||
|
||||
.paragraph img {
|
||||
width: 20px;
|
||||
margin: 0 8px 2px 0;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/* Buttons */
|
||||
.action-button {
|
||||
margin-top: 42px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 480px) {
|
||||
.action-button {
|
||||
margin-top: 38px;
|
||||
}
|
||||
}
|
||||
|
||||
.btn {
|
||||
display: inline-block;
|
||||
border: 0;
|
||||
border-radius: 4px;
|
||||
background: -webkit-gradient(linear, left top, right top, from(#10E260), color-stop(80%, #2A82DE));
|
||||
background: -o-linear-gradient(left, #10E260 0%, #2A82DE 80%);
|
||||
background: linear-gradient(to right, #10E260 0%, #2A82DE 80%);
|
||||
padding: 10px 30px 12px 30px;
|
||||
font-family: "Roboto", 'Arial', sans-serif;
|
||||
font-weight: 500;
|
||||
font-size: 16px;
|
||||
line-height: 1.6;
|
||||
color: #FFFFFF;
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
}
|
||||
.btn:hover {
|
||||
background: #10E260;
|
||||
color: #151515;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 379px) {
|
||||
.btn {
|
||||
padding: 8px 22px 10px 22px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/* Link style */
|
||||
.link {
|
||||
display: inline-block;
|
||||
margin: 0 0 0 16px;
|
||||
font-family: "Roboto", 'Arial', sans-serif;
|
||||
font-weight: 500;
|
||||
font-size: 14px;
|
||||
line-height: 1.6;
|
||||
color: #158AFF;
|
||||
text-decoration: none;
|
||||
}
|
||||
.link:hover {
|
||||
color: #8862F9;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 379px) {
|
||||
.link {
|
||||
margin: 0 0 0 8px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/* Rotating icon */
|
||||
@-webkit-keyframes rotating {
|
||||
from {
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
to {
|
||||
-webkit-transform: rotate(360deg);
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
@keyframes rotating {
|
||||
from {
|
||||
-ms-transform: rotate(0deg);
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
to {
|
||||
-ms-transform: rotate(360deg);
|
||||
-webkit-transform: rotate(360deg);
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
.rotating {
|
||||
-webkit-animation: rotating 2s linear infinite;
|
||||
animation: rotating 2s linear infinite;
|
||||
}
|
||||
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
|
After Width: | Height: | Size: 21 KiB |
|
|
@ -0,0 +1,12 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<!-- Generator: Adobe Illustrator 25.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
|
||||
viewBox="0 0 24 24" style="enable-background:new 0 0 24 24;" xml:space="preserve">
|
||||
<style type="text/css">
|
||||
.st0{fill:#3490DC;}
|
||||
</style>
|
||||
<path class="st0" d="M15.8,8.6l-5.6,5.6l-2.5-2.5c0,0,0,0,0,0c-0.2-0.2-0.5-0.2-0.7,0c-0.2,0.2-0.2,0.5,0,0.7l2.8,2.8
|
||||
c0.1,0.1,0.2,0.1,0.4,0.1c0.1,0,0.3-0.1,0.4-0.1l6-6c0,0,0,0,0,0c0.2-0.2,0.2-0.5,0-0.7C16.3,8.4,16,8.4,15.8,8.6z M12,2
|
||||
C6.5,2,2,6.5,2,12s4.5,10,10,10c5.5,0,10-4.5,10-10C22,6.5,17.5,2,12,2z M12,21c-5,0-9-4-9-9s4-9,9-9c5,0,9,4,9,9C21,17,17,21,12,21
|
||||
z"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 774 B |
|
|
@ -0,0 +1,22 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg width="166px" height="168px" viewBox="0 0 166 168" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<title>Artboard</title>
|
||||
<defs>
|
||||
<linearGradient x1="25.8795779%" y1="50%" x2="75.8279752%" y2="50%" id="linearGradient-1">
|
||||
<stop stop-color="#2F2F2F" offset="0%"></stop>
|
||||
<stop stop-color="#2F2F2F" offset="100%"></stop>
|
||||
</linearGradient>
|
||||
<linearGradient x1="8.640494%" y1="0%" x2="92.7816251%" y2="100%" id="linearGradient-2">
|
||||
<stop stop-color="#0FE35E" offset="0%"></stop>
|
||||
<stop stop-color="#2E77EE" offset="100%"></stop>
|
||||
</linearGradient>
|
||||
</defs>
|
||||
<g id="Artboard" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
||||
<g id="M" transform="translate(29.000000, 40.875000)">
|
||||
<path d="M81.1218467,0 C92.3176432,0 101.325755,8.75073746 101.325755,20.3325959 L101.324145,20.203 L101.325755,20.2039086 L101.325755,65.5018437 L89.4865222,65.5018437 L89.4865222,20.3325959 C89.4865222,15.3137906 85.7545901,11.5818584 81.1218467,11.5818584 C76.4891033,11.5818584 72.7571712,15.3137906 72.7571712,20.3325959 L72.7571712,20.3325959 L72.7571712,57.7806047 C72.7571712,69.2337758 63.8777464,78.4193671 52.68195,78.4193671 C41.4861535,78.4193671 32.6067287,69.2337758 32.6067287,57.7806047 L32.6067287,57.7806047 L32.6067287,20.3325959 C32.6067287,15.3137906 28.8747966,11.5818584 24.2420532,11.5818584 C19.6093098,11.5818584 15.8773777,15.3137906 15.8773777,20.3325959 L15.8773777,20.3325959 L15.8773777,42.8528761 L4.03814464,42.8528761 L4.03814464,20.2039086 C4.10528907,8.68566238 13.0879633,0 24.2420532,0 C35.4378497,0 44.4459618,8.75073746 44.4459618,20.3325959 L44.4459618,20.3325959 L44.4459618,57.7806047 C44.4459618,62.6707227 48.0492066,68.0519638 52.68195,68.0519638 C57.3146933,68.0519638 60.9179382,62.6707227 60.9179382,57.7806047 L60.9179382,57.7806047 L60.9179382,20.3325959 C60.9179382,8.75073746 69.9260502,0 81.1218467,0 Z" id="Combined-Shape" fill="url(#linearGradient-1)" fill-rule="nonzero"></path>
|
||||
<circle id="Oval" stroke="#2F2F2F" stroke-width="4" cx="9.78023599" cy="50.0593658" r="7.78023599"></circle>
|
||||
<circle id="Oval" stroke="#2F2F2F" stroke-width="4" cx="95.500236" cy="72.7083333" r="7.78023599"></circle>
|
||||
</g>
|
||||
<circle id="Oval" stroke="url(#linearGradient-2)" stroke-width="12" cx="83" cy="84" r="76"></circle>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.4 KiB |
|
|
@ -0,0 +1,31 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Lume Web Extension Installer</title>
|
||||
<link rel="stylesheet" href="./css/reset.css" type="text/css" />
|
||||
<link rel="stylesheet" href="./css/style.css" type="text/css" />
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="content-container">
|
||||
|
||||
<img class="header-icon" src="/images/logo-lume-single.svg"><h1>Lume Web Extension Installer</h1>
|
||||
<div class="paragraph">
|
||||
<p>Click install to load the Lume Web Extension into Chrome and Brave.</p>
|
||||
</div>
|
||||
|
||||
<div class="notice">
|
||||
|
||||
<div class="notice-content">
|
||||
<span>Please ensure your Chrome and/or Brave browser is <strong>completely closed</strong> before proceeding.</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="action-button">
|
||||
<a href="installer.html"><button class="btn">Install extension</button></a>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
|
|
@ -0,0 +1,22 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Lume Web Extension Installer</title>
|
||||
<link rel="stylesheet" href="./css/reset.css" type="text/css" />
|
||||
<link rel="stylesheet" href="./css/style.css" type="text/css" />
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="content-container">
|
||||
|
||||
<img class="header-icon rotating" src="/images/logo-lume-single.svg">
|
||||
<h1>Installing Extension</h1>
|
||||
<div class="paragraph">
|
||||
<p>Downloading your personal gateway into web3...</p>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
|
||||
Loading…
Reference in New Issue