diff --git a/lib/classes/Icon.class.php b/lib/classes/Icon.class.php index 6f20f7ba11ccf265841cc1af245c5eb88e630ab7..38f979347d914ad67d58572c84daccb215a77bfd 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 8e3e2706e11d66c4b480211d6c64e6be035c6e69..446a84b7a50cfd2b2f9cb1b923a94eb1d0145db8 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 f03d7a2e8fbf2b997922fc53503244775548f0c8..a6c53ffd4a02cfc46fa3ba4351aa92917b7e7390 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 a08bdfaa475a4985cdb098281095415b25443561..efc79ddfef312da4b5df28b3475ec4926d5bc241 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 0507cfab7ceaf5cdf9623ed7e3c594994b143245..8d2aec0df7b7b73d61a7ac6f74988c4fd509a8bd 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>