From 3e6d7fd80c00ad8ed1724fdf79589162fd6fa76d Mon Sep 17 00:00:00 2001 From: Rasmus Fuhse <fuhse@data-quest.de> Date: Fri, 14 Jul 2023 22:23:43 +0200 Subject: [PATCH] reduce background images --- lib/classes/Icon.class.php | 4 ++-- lib/classes/sidebar/LinkElement.php | 3 ++- resources/assets/stylesheets/scss/sidebar.scss | 2 +- resources/vue/components/StudipIcon.vue | 7 +++++-- templates/sidebar/list-widget.php | 7 ------- 5 files changed, 10 insertions(+), 13 deletions(-) diff --git a/lib/classes/Icon.class.php b/lib/classes/Icon.class.php index 6f20f7ba11c..38f979347d9 100644 --- a/lib/classes/Icon.class.php +++ b/lib/classes/Icon.class.php @@ -112,7 +112,7 @@ class Icon return new self($shape, $role, $attributes); } - protected static $rendering_mode = self::RENDERING_MODE_IMG; + protected static $rendering_mode = self::RENDERING_MODE_USE; protected static $used_shapes = []; protected static $used_extras = []; @@ -435,7 +435,7 @@ class Icon $result['alt'] = ''; } - $classNames = 'icon-role-' . str_replace('_', '-', $this->role); + $classNames = 'studipicon icon-role-' . str_replace('_', '-', $this->role); if (!self::isStatic($this->shape)) { $classNames .= ' icon-shape-' . $this->shape; diff --git a/lib/classes/sidebar/LinkElement.php b/lib/classes/sidebar/LinkElement.php index 8e3e2706e11..446a84b7a50 100644 --- a/lib/classes/sidebar/LinkElement.php +++ b/lib/classes/sidebar/LinkElement.php @@ -211,9 +211,10 @@ class LinkElement extends WidgetElement implements ArrayAccess } return sprintf( - '<%1$s %2$s>%3$s</%1$s>', + '<%1$s %2$s>%3$s %4$s</%1$s>', $tag, arrayToHtmlAttributes($attributes), + $this->icon ? $this->icon->asImg(null, ['class' => 'text-bottom']) : '', htmlReady($this->label) ); } diff --git a/resources/assets/stylesheets/scss/sidebar.scss b/resources/assets/stylesheets/scss/sidebar.scss index f03d7a2e8fb..a6c53ffd4a0 100644 --- a/resources/assets/stylesheets/scss/sidebar.scss +++ b/resources/assets/stylesheets/scss/sidebar.scss @@ -120,7 +120,7 @@ ul.widget-list { background-repeat: no-repeat; background-position: 0 1px; background-size: 16px 16px; - padding-left: 20px; + padding-left: 2px; word-wrap: break-word; } } diff --git a/resources/vue/components/StudipIcon.vue b/resources/vue/components/StudipIcon.vue index a08bdfaa475..efc79ddfef3 100644 --- a/resources/vue/components/StudipIcon.vue +++ b/resources/vue/components/StudipIcon.vue @@ -9,7 +9,7 @@ v-bind="$attrs" v-on="$listeners" /> - <img v-else :src="url" :width="size" :height="size" v-bind="$attrs" v-on="$listeners" /> + <img v-else :src="url" :width="size" :height="size" :class="css_class" v-bind="$attrs" v-on="$listeners" /> </template> <script lang="ts"> @@ -32,7 +32,7 @@ export default Vue.extend({ name: { type: String, required: false, - }, + } }, computed: { url(): string { @@ -72,6 +72,9 @@ export default Vue.extend({ return 'blue'; } }, + css_class(): string { + return 'studipicon ' + this.$attrs.class; //TODO: is this correct? + } }, }); </script> diff --git a/templates/sidebar/list-widget.php b/templates/sidebar/list-widget.php index 0507cfab7ce..8d2aec0df7b 100644 --- a/templates/sidebar/list-widget.php +++ b/templates/sidebar/list-widget.php @@ -1,13 +1,6 @@ <ul class="<?= implode(' ', $css_classes) ?>" aria-label="<?= htmlReady($title) ?>"> <? foreach ($elements as $index => $element): ?> - <? if ($element instanceof LinkElement): ?> - <? $icon = $element->icon ?? null ?> - <? if ($icon && $element->isDisabled()): ?> - <? $icon = $icon->copyWithRole('inactive') ?> - <? endif ?> - <? endif ?> <li id="<?= htmlReady($index) ?>" - <?= isset($icon) ? 'style="' . $icon->asCSS() .'"' : '' ?> <?= !empty($element->active) ? 'class="active"' : '' ?>> <?= $element->render() ?> </li> -- GitLab