chg: [ui:home] Nicer icons and layout

pull/72/head
Sami Mokaddem 2021-10-18 14:56:51 +02:00
parent d75170d69b
commit 97428a8892
No known key found for this signature in database
GPG Key ID: 164C473F627A06FA
3 changed files with 44 additions and 7 deletions

View File

@ -9,7 +9,7 @@ $bookmarks = !empty($loggedUser->user_settings_by_name['ui.bookmarks']['value'])
<?= __('Bookmarks') ?>
</h3>
<div class="row">
<? if (!empty($bookmarks)): ?>
<? if (!empty($bookmarks)) : ?>
<ul class="col-sm-12 col-md-10 col-l-8 col-xl-8 mb-3">
<?php foreach ($bookmarks as $bookmark) : ?>
<li class="list-group-item">
@ -20,7 +20,7 @@ $bookmarks = !empty($loggedUser->user_settings_by_name['ui.bookmarks']['value'])
</li>
<?php endforeach; ?>
</ul>
<?php else: ?>
<?php else : ?>
<p class="fw-light"><?= __('No bookmarks') ?></p>
<?php endif; ?>
</div>

View File

@ -2,18 +2,19 @@
$variationIcon = '';
$variationClass = '';
if ($variation == 0) {
$variationIcon = 'minus';
$variationIcon = $this->FontAwesome->getClass('minus');
} elseif ($variation > 0) {
$variationIcon = 'arrow-up';
$variationIcon = 'trends-arrow-up-white fs-6';
$variationClass = 'bg-success';
} else {
$variationIcon = 'arrow-down';
$variationIcon = 'trends-arrow-up-white fs-6 fa-rotate-180 fa-flip-vertical';
$variationClass = 'bg-danger';
}
$variationHtml = sprintf('<div class="badge %s fw-bold"><span class="%s me-2"></span>%s</div>',
$variationHtml = sprintf(
'<div class="badge %s fw-bold"><span class="%s me-2 align-middle"></span>%s</div>',
$variationClass,
$this->FontAwesome->getClass($variationIcon),
$variationIcon,
!empty($variation) ? h($variation) : ''
);

View File

@ -126,4 +126,40 @@ input[type="checkbox"]:disabled.change-cursor {
@keyframes slide-in {
50% { opacity: 0.3; }
100% { transform: translateX(0%); opacity: 1; }
}
.trends-arrow-up-black {
display: inline-flex;
min-width: 1em;
min-height: 0.71em;
position: relative;
}
.trends-arrow-up-black::before {
position: absolute;
width: 100%;
height: 100%;
content: " ";
background-size: contain;
background-repeat: no-repeat;
background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8' standalone='no'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' height='223.995' width='383.98752' viewBox='0 0 383.98752 223.995' role='img'%3E%3Cpath d='m 367.9975,0 h -118.06 c -21.38,0 -32.09,25.85 -16.97,40.97 l 32.4,32.4 -73.37,73.38 -73.37,-73.37 c -12.5,-12.5 -32.76,-12.5 -45.25,0 l -68.69,68.69 c -6.25,6.25 -6.25,16.38 0,22.63 l 22.62,22.62 c 6.25,6.25 16.38,6.25 22.63,0 l 46.06,-46.07 73.37,73.37 c 12.5,12.5 32.76,12.5 45.25,0 l 96,-96 32.4,32.4 c 15.12,15.12 40.97,4.41 40.97,-16.97 V 16 c 0.01,-8.84 -7.15,-16 -15.99,-16 z' /%3E%3C/svg%3E%0A");.97,-16.97 V 16 c 0.01,-8.84 -7.15,-16 -15.99,-16 z' /%3E%3C/svg%3E%0A");
}
.trends-arrow-up-white {
display: inline-flex;
min-width: 1em;
min-height: 0.71em;
position: relative;
}
.trends-arrow-up-white::before {
background-color: #fff;
position: absolute;
width: 100%;
height: 100%;
content: " ";
mask-size: contain;
mask-repeat: no-repeat;
mask-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8' standalone='no'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' height='223.995' width='383.98752' viewBox='0 0 383.98752 223.995' role='img'%3E%3Cpath d='m 367.9975,0 h -118.06 c -21.38,0 -32.09,25.85 -16.97,40.97 l 32.4,32.4 -73.37,73.38 -73.37,-73.37 c -12.5,-12.5 -32.76,-12.5 -45.25,0 l -68.69,68.69 c -6.25,6.25 -6.25,16.38 0,22.63 l 22.62,22.62 c 6.25,6.25 16.38,6.25 22.63,0 l 46.06,-46.07 73.37,73.37 c 12.5,12.5 32.76,12.5 45.25,0 l 96,-96 32.4,32.4 c 15.12,15.12 40.97,4.41 40.97,-16.97 V 16 c 0.01,-8.84 -7.15,-16 -15.99,-16 z' /%3E%3C/svg%3E%0A");
-webkit-mask-size: contain;
-webkit-mask-repeat: no-repeat;
-webkit-mask-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8' standalone='no'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' height='223.995' width='383.98752' viewBox='0 0 383.98752 223.995' role='img'%3E%3Cpath d='m 367.9975,0 h -118.06 c -21.38,0 -32.09,25.85 -16.97,40.97 l 32.4,32.4 -73.37,73.38 -73.37,-73.37 c -12.5,-12.5 -32.76,-12.5 -45.25,0 l -68.69,68.69 c -6.25,6.25 -6.25,16.38 0,22.63 l 22.62,22.62 c 6.25,6.25 16.38,6.25 22.63,0 l 46.06,-46.07 73.37,73.37 c 12.5,12.5 32.76,12.5 45.25,0 l 96,-96 32.4,32.4 c 15.12,15.12 40.97,4.41 40.97,-16.97 V 16 c 0.01,-8.84 -7.15,-16 -15.99,-16 z' /%3E%3C/svg%3E%0A");
}