mirror of
https://github.com/slawkens/myaac.git
synced 2025-10-14 01:34:55 +02:00
Add a brand new charming installation (for version 0.9) (#144)
* Add a brand new charming installation * Fix alert position in setup requirements validation * Add some missing definitions * A distinction between bootstrap CSS classes and myaac classes For CSS-styled messages * Remove unused functions for messages Co-authored-by: slawkens <slawkens@gmail.com>
This commit is contained in:
Fernando Matos
@@ -1,299 +1,13 @@
|
||||
* {
|
||||
margin: 0; padding: 0;
|
||||
}
|
||||
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@100;300;400&display=swap');
|
||||
|
||||
body {
|
||||
text-align: center;
|
||||
font: 12px Verdana;
|
||||
color: #000000;
|
||||
background-color: #000000;
|
||||
}
|
||||
img {
|
||||
border: 0;
|
||||
font-family: 'Roboto', sans-serif;
|
||||
}
|
||||
|
||||
.break {
|
||||
font-size: 0;
|
||||
width: 0; height: 0;
|
||||
clear: both;
|
||||
}
|
||||
.alignleft {
|
||||
float: left;
|
||||
margin: 4px 10px 5px 0;
|
||||
}
|
||||
.alignright {
|
||||
float: right;
|
||||
margin: 4px 0 5px 10px;
|
||||
}
|
||||
.aligncenter {
|
||||
text-align: center;
|
||||
h1{
|
||||
font-weight: 100 !important;
|
||||
}
|
||||
|
||||
/** BEGIN wrapper **/
|
||||
#wrapper {
|
||||
background: #ffffff url(images/background.jpg) repeat-x 0 0;
|
||||
width: 980px;
|
||||
}
|
||||
|
||||
#header {
|
||||
margin-bottom: 10px;
|
||||
border-bottom: 1px solid #eee;
|
||||
padding-bottom: 15px;
|
||||
}
|
||||
|
||||
#footer {
|
||||
padding-top: 15px;
|
||||
border-top: 1px solid #eee;
|
||||
margin-top: 10px;
|
||||
text-align: right;
|
||||
color: #555;
|
||||
}
|
||||
|
||||
#header h1 {
|
||||
font-weight: bold;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
#header span {
|
||||
font-size: 25px;
|
||||
color: #000;
|
||||
font-weight: bold;
|
||||
padding-left: 40px;
|
||||
line-height: 80px;
|
||||
}
|
||||
|
||||
#version {
|
||||
float: right;
|
||||
color: #000;
|
||||
font-size: 17px;
|
||||
padding-top: 25px;
|
||||
padding-right: 5px;
|
||||
}
|
||||
|
||||
/** BEGIN body **/
|
||||
#body {
|
||||
background: url(images/wrapper.gif) repeat-y 0 0;
|
||||
}
|
||||
/** END body **/
|
||||
|
||||
/** BEGIN content **/
|
||||
#content {
|
||||
width: 642px;
|
||||
float: left;
|
||||
padding: 20px 18px 20px 20px;
|
||||
color: #434242;
|
||||
}
|
||||
|
||||
/** begin headers **/
|
||||
h1, h2, h3, h4, h5, h6 {
|
||||
font-family: Tahoma;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
h2, h3, h4, h5, h6 {
|
||||
margin-top: 30px;
|
||||
}
|
||||
h1 { font-size: 2em; }
|
||||
h2 { font-size: 1.6em; }
|
||||
h3 { font-size: 1.3em; }
|
||||
h4, h5, h6 { font-size: 1em; }
|
||||
/** end headers **/
|
||||
|
||||
/** begin messages **/
|
||||
.error, .success, .note, .warning {
|
||||
font-weight: bold;
|
||||
font-size: 0.9em;
|
||||
padding: 4px 10px 4px 24px;
|
||||
background-repeat: no-repeat;
|
||||
background-position: 5px 6px;
|
||||
border-style: solid;
|
||||
border-width: 1px;
|
||||
line-height: 1.6em;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.error {
|
||||
background-color: #FDD9D9;
|
||||
background-image: url(images/error.gif);
|
||||
border-color: #FBA3A3;
|
||||
color: #D80303;
|
||||
}
|
||||
.success {
|
||||
background-color: #E4FCD9;
|
||||
background-image: url(images/success.gif);
|
||||
border-color: #BFFDA3;
|
||||
color: #35A502;
|
||||
}
|
||||
.note {
|
||||
background-color: #DDEAFA;
|
||||
background-image: url(images/note.gif);
|
||||
border-color: #A3D8FD;
|
||||
color: #026DA5;
|
||||
}
|
||||
.warning {
|
||||
background-color: #FBF0B3;
|
||||
background-image: url(images/warning.gif);
|
||||
border-color: #FBBB95;
|
||||
color: #FD6002;
|
||||
}
|
||||
/** end messages **/
|
||||
|
||||
/** begin form **/
|
||||
form {
|
||||
border: 1px solid #DDDDDD;
|
||||
padding: 16px;
|
||||
}
|
||||
form .input {
|
||||
padding-top: 12px;
|
||||
clear: both;
|
||||
}
|
||||
form .first {
|
||||
padding-top: 0;
|
||||
}
|
||||
form .input p {
|
||||
margin-bottom: 7px !important;
|
||||
}
|
||||
form input {
|
||||
margin-right: 5px;
|
||||
}
|
||||
form label {
|
||||
margin-right: 10px;
|
||||
color: #8B8B8B;
|
||||
}
|
||||
form input.text, form textarea {
|
||||
border: 1px solid #BEBDBD;
|
||||
font-size: 1em;
|
||||
font-family: Verdana;
|
||||
background-color: #F3F3F3;
|
||||
color: #808080;
|
||||
padding: 2px;
|
||||
max-width: 100%;
|
||||
}
|
||||
.positive, .negative {
|
||||
font-size: 0.9em;
|
||||
font-weight: bold;
|
||||
padding: 1px 0 0 20px;
|
||||
background-repeat: no-repeat;
|
||||
background-position: 0 0;
|
||||
display: inline;
|
||||
margin-top: 2px;
|
||||
}
|
||||
.positive {
|
||||
background-image: url(images/positive.gif);
|
||||
color: #35A502;
|
||||
}
|
||||
.negative {
|
||||
background-image: url(images/negative.gif);
|
||||
color: #D80303;
|
||||
}
|
||||
form textarea {
|
||||
line-height: 1.6em;
|
||||
}
|
||||
form button, form input.button {
|
||||
font-size: 0.9em;
|
||||
font-family: Verdana;
|
||||
font-weight: bold;
|
||||
color: #ffffff;
|
||||
background: #B6B4B4 url(images/button.gif) repeat-x 0 0;
|
||||
border: 1px solid #B6B4B4;
|
||||
padding: 5px 10px;
|
||||
}
|
||||
/** end form **/
|
||||
|
||||
/** begin table **/
|
||||
table {
|
||||
|
||||
}
|
||||
table th {
|
||||
font-size: 0.9em;
|
||||
color: #ffffff;
|
||||
background-color: #679BC5;
|
||||
padding: 2px 4px;
|
||||
line-height: 1.6em;
|
||||
}
|
||||
table td {
|
||||
line-height: 1.6em;
|
||||
padding: 2px 4px;
|
||||
}
|
||||
table tr.odd td { background-color: #EEEEEE; }
|
||||
table tr.even td { background-color: #E5E5E5; }
|
||||
|
||||
/** end table **/
|
||||
|
||||
/** begin paragraphs, lists, etc. **/
|
||||
#content p {
|
||||
line-height: 1.6em;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
#content ul, #content ol {
|
||||
list-style-position: inside;
|
||||
}
|
||||
#content li {
|
||||
line-height: 1.6em;
|
||||
padding: 2px 0 2px 0;
|
||||
}
|
||||
a {
|
||||
color: #679BC5;
|
||||
}
|
||||
a:hover {
|
||||
color: #ff0000;
|
||||
text-decoration: none;
|
||||
}
|
||||
blockquote {
|
||||
padding: 10px;
|
||||
background-color: #eeeeee;
|
||||
line-height: 1.6em;
|
||||
border-width: 2px 0 1px;
|
||||
border-style: solid;
|
||||
border-color: #e0e0e0;
|
||||
}
|
||||
/** end paragraphs, lists, etc. **/
|
||||
|
||||
/** END content **/
|
||||
|
||||
/** BEGIN sidebar **/
|
||||
#sidebar {
|
||||
width: 300px;
|
||||
float: right;
|
||||
padding: 10px 0;
|
||||
}
|
||||
#sidebar h2 {
|
||||
background: green url(images/sidehead.gif) no-repeat 0 0;
|
||||
margin: 0 10px;
|
||||
font-size: 1em;
|
||||
color: #ffffff;
|
||||
padding: 7px 10px;
|
||||
}
|
||||
#sidebar ul {
|
||||
list-style-type: none;
|
||||
background: #E0E0E0 url(images/sidebody.gif) no-repeat 0 bottom;
|
||||
padding: 10px;
|
||||
margin: 0 10px 10px;
|
||||
}
|
||||
#sidebar ul li {
|
||||
padding: 4px 0 4px 14px;
|
||||
background: none;
|
||||
line-height: 1.6em;
|
||||
font-size: 0.9em;
|
||||
font-weight: bold;
|
||||
}
|
||||
#sidebar ul li a {
|
||||
color: #000000;
|
||||
text-decoration: none;
|
||||
}
|
||||
#sidebar ul li a:hover {
|
||||
text-decoration: none;
|
||||
color: #ff0000;
|
||||
}
|
||||
|
||||
#sidebar ul li a:active {
|
||||
text-decoration: none;
|
||||
color: #ff0000;
|
||||
}
|
||||
|
||||
#sidebar ul li current {
|
||||
text-decoration: none;
|
||||
color: #ff0000;
|
||||
}
|
||||
.current {
|
||||
text-decoration: none;
|
||||
color: #ff0000;
|
||||
}
|
||||
h3 {
|
||||
font-weight: 300 !important;
|
||||
}
|
||||
@@ -1,48 +1,74 @@
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml" dir="<?php echo $locale['direction']; ?>" lang="<?php echo $locale['lang']; ?>" xml:lang="<?php echo $locale['lang']; ?>">
|
||||
<!DOCTYPE html>
|
||||
<html dir="<?php echo $locale['direction']; ?>" lang="<?php echo $locale['lang']; ?>" xml:lang="<?php echo $locale['lang']; ?>">
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=<?php echo $locale['encoding']; ?>" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<title>MyAAC - <?php echo $locale['installation']; ?></title>
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-giJF6kkoqNQ00vy+HMDP7azOuL0xtbfIcaT9wjKHr8RbDVddVHyTfAAsrekwKmP1" crossorigin="anonymous">
|
||||
<link rel="stylesheet" type="text/css" href="template/style.css" />
|
||||
<script type="text/javascript" src="<?php echo BASE_URL; ?>tools/js/jquery.min.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="wrapper">
|
||||
<!--div class="buffer"-->
|
||||
<div id="header">
|
||||
<h1>MyAAC <?php echo $locale['installation']; ?></h1>
|
||||
</div>
|
||||
|
||||
<div id="body">
|
||||
<div id="body" class="container">
|
||||
|
||||
<header id="header" class="pt-5 pb-4 pb-sm-5">
|
||||
<h1>MyAAC <?php echo $locale['installation']; ?></h1>
|
||||
</header>
|
||||
|
||||
<div id="sidebar">
|
||||
<h2><?php echo $locale['steps']; ?></h2>
|
||||
<ul>
|
||||
<?php
|
||||
$i = 0;
|
||||
foreach($steps as $key => $value)
|
||||
echo '<li' . ($step == $value ? ' class="current"' : '') . '>' . ++$i . '. ' . $locale['step_' . $value] . '</li>';
|
||||
?>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="row">
|
||||
|
||||
<div id="content">
|
||||
<div id="sidebar" class="col-md-3">
|
||||
<h3><?php echo $locale['steps']; ?></h3>
|
||||
<ul class="list-group mt-4">
|
||||
<?php
|
||||
if(isset($locale['step_' . $step . '_title']))
|
||||
echo '<h1>' . $locale['step_' . $step . '_title'] . '</h1>';
|
||||
else
|
||||
echo '<h1>' . $locale['step_' . $step] . '</h1>';
|
||||
echo $content;
|
||||
$i = 0;
|
||||
foreach($steps as $key => $value){
|
||||
|
||||
if ($step == $value) {
|
||||
$progress = ($i == 6) ? 100 : $i * 16;
|
||||
}
|
||||
|
||||
echo '<li' . ($step == $value ? ' class="list-group-item active"' : ' class="list-group-item"') . '>' . ++$i . '. ' . $locale['step_' . $value] . '</li>';
|
||||
}
|
||||
|
||||
?>
|
||||
</div>
|
||||
|
||||
<div class="break"></div>
|
||||
</ul>
|
||||
</div>
|
||||
<!--/div-->
|
||||
|
||||
<div id="content" class="col-md-9">
|
||||
|
||||
<?php
|
||||
if(isset($locale['step_' . $step . '_title']))
|
||||
echo '<h3 class="mb-4 mt-4 mt-md-0">' . $locale['step_' . $step . '_title'] . '</h3>';
|
||||
else
|
||||
echo '<h3 class="mb-4 mt-4 mt-md-0">' . $locale['step_' . $step] . '</h3>';
|
||||
?>
|
||||
|
||||
<?php
|
||||
if(!isset($config['installed'])):
|
||||
?>
|
||||
<div class="row">
|
||||
<div class="col-md-12">
|
||||
<div class="progress mb-2">
|
||||
<div class="progress-bar progress-bar-striped progress-bar-animated" style="width: <?php echo $progress; ?>%" role="progressbar" aria-valuenow="<?php echo $progress; ?>" aria-valuemin="0" aria-valuemax="100"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
|
||||
<?php echo $content; ?>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<hr />
|
||||
|
||||
</div>
|
||||
|
||||
<div id="footer">
|
||||
<footer id="footer" class="p-4">
|
||||
<p style="text-align: center;"><?php echo base64_decode('UG93ZXJlZCBieSA8YSBocmVmPSJodHRwOi8vbXktYWFjLm9yZyIgdGFyZ2V0PSJfYmxhbmsiPk15QUFDLjwvYT4='); ?></p>
|
||||
</div>
|
||||
</footer>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user