Style installation report

refs #7163
This commit is contained in:
Johannes Meyer 2014-10-17 09:18:10 +02:00
parent d4acbeb061
commit 223502c314
2 changed files with 57 additions and 33 deletions

View File

@ -1,14 +1,21 @@
<div class="report">
<?php foreach ($report as $entry): ?>
<p class="<?= $entry->state ? 'ok' : 'failure'; ?>">
<?= $entry->message; ?>
</p>
<?php endforeach ?>
</div>
<div class="buttons">
<?php if ($success): ?>
<a href="<?= $this->href('authentication/login'); ?>" class="button-like login"><?= t('Login to Icinga Web 2'); ?></a>
<?php else: ?>
<a href="<?= $this->href(); ?>" class="button-like"><?= t('Back'); ?></a>
<?php endif ?>
<div id="installer">
<div class="report">
<?php foreach ($report as $entry): ?>
<p<?= false === $entry->state ? ' class="error"' : ''; ?>>
<?= $entry->message; ?>
</p>
<?php endforeach ?>
<?php if ($success): ?>
<p class="success"><?= t('Congratulations! The installation of Icinga Web 2 was successfully completed.'); ?></p>
<?php else: ?>
<p class="failure"><?= t('Sorry! The installation of Icinga Web 2 has failed.'); ?></p>
<?php endif ?>
</div>
<div class="buttons">
<?php if ($success): ?>
<a href="<?= $this->href('authentication/login'); ?>" class="button-like login"><?= t('Login to Icinga Web 2'); ?></a>
<?php else: ?>
<a href="<?= $this->href(); ?>" class="button-like"><?= t('Back'); ?></a>
<?php endif ?>
</div>
</div>

View File

@ -118,25 +118,15 @@
background-color: #333;
}
&.install {
&.install, &.login {
width: 25em;
color: #fffafa;
background: #aaa;
&:hover {
&:hover, &:focus {
background: #888;
}
}
&.login {
width: 25em;
color: #333;
background: #9e4;
&:hover {
background: #7c2;
}
}
}
a.button-like {
@ -234,16 +224,43 @@
}
}
#setup div.report {
p {
margin: 1em;
.conspicuous-state-notification {
width: 66%;
margin: 0 auto;
padding: 0.5em;
color: white;
font-weight: bold;
border-radius: 1em;
}
&.ok {
color: green;
}
#installer {
div.report {
padding: 1em;
border-radius: 2em;
background-color: #eee;
&.failure {
color: red;
p {
margin: 1em;
color: #444;
text-align: center;
&.error {
color: red;
}
&.failure {
.conspicuous-state-notification;
background-color: @colorCritical;
}
&.success {
.conspicuous-state-notification;
background-color: @colorOk;
}
}
}
div.buttons {
text-align: center;
}
}