diff --git a/src/components/LinkItems/Item.vue b/src/components/LinkItems/Item.vue
index 864dc61a..1b932f84 100644
--- a/src/components/LinkItems/Item.vue
+++ b/src/components/LinkItems/Item.vue
@@ -68,8 +68,8 @@ export default {
manageTitleEllipse() {
const tileElem = document.getElementById(`tile-${this.getId}`);
if (tileElem) {
- const isOverflowing = tileElem.scrollHeight > tileElem.clientHeight
- || tileElem.scrollWidth > tileElem.clientWidth;
+ const isOverflowing = (tileElem.scrollHeight > tileElem.clientHeight
+ || tileElem.scrollWidth > tileElem.clientWidth) && this.title.length > 12;
if (isOverflowing) tileElem.className += ' is-overflowing';
} // Note from present me to past me: WTF?!
},
@@ -107,6 +107,7 @@ export default {
border-radius: var(--curve-factor);
box-shadow: var(--item-shadow);
cursor: pointer;
+ text-decoration: none;
&:hover {
box-shadow: var(--item-hover-shadow);
background: var(--item-background-hover);
@@ -176,7 +177,7 @@ export default {
opacity: 0;
}
span.text {
- transform: translateX(calc(120px - 100%));
+ transform: translateX(calc(100px - 100%));
}
}
diff --git a/src/components/LinkItems/ItemIcon.vue b/src/components/LinkItems/ItemIcon.vue
index 355f818e..ce9149d0 100644
--- a/src/components/LinkItems/ItemIcon.vue
+++ b/src/components/LinkItems/ItemIcon.vue
@@ -54,7 +54,8 @@ export default {
/* Checks if the icon is from a local image, remote URL, SVG or font-awesome */
determineImageType(img) {
let imgType = '';
- if (this.isUrl(img)) imgType = 'url';
+ if (!img) imgType = 'none';
+ else if (this.isUrl(img)) imgType = 'url';
else if (this.isImage(img)) imgType = 'img';
else if (img.substr(4) === ('.svg' || '.SVG')) imgType = 'svg';
else if (img.includes('fa-')) imgType = 'font-awesome';
diff --git a/src/components/Settings/SearchBar.vue b/src/components/Settings/SearchBar.vue
index 588ebcaf..a8e15462 100644
--- a/src/components/Settings/SearchBar.vue
+++ b/src/components/Settings/SearchBar.vue
@@ -55,6 +55,8 @@ export default {
diff --git a/src/components/Settings/SettingsContainer.vue b/src/components/Settings/SettingsContainer.vue
index 0975d14f..25f96589 100644
--- a/src/components/Settings/SettingsContainer.vue
+++ b/src/components/Settings/SettingsContainer.vue
@@ -65,6 +65,8 @@ export default {
diff --git a/src/styles/color-themes.scss b/src/styles/color-themes.scss
index e5ea5c35..8017ad92 100644
--- a/src/styles/color-themes.scss
+++ b/src/styles/color-themes.scss
@@ -29,11 +29,11 @@ html[data-theme='dracula'] {
--item-hover-shadow: none;
--settings-text-color: #98ace9;
--primary: #6272a4;
- .collapsable:nth-child(1n) { background: #8be9fd; .item { border: 1px solid #8be9fd; span {color: #8be9fd; }}}
- .collapsable:nth-child(2n) { background: #50fa7b; .item { border: 1px solid #50fa7b; span {color: #50fa7b; }}}
- .collapsable:nth-child(3n) { background: #ffb86c; .item { border: 1px solid #ffb86c; span {color: #ffb86c; }}}
- .collapsable:nth-child(4n) { background: #ff79c6; .item { border: 1px solid #ff79c6; span {color: #ff79c6; }}}
- .collapsable:nth-child(4n) { background: #bd93f9; .item { border: 1px solid #bd93f9; span {color: #bd93f9; }}}
+ .collapsable:nth-child(1n) { background: #8be9fd; .item { border: 1px solid #8be9fd; color: #8be9fd; }}
+ .collapsable:nth-child(2n) { background: #50fa7b; .item { border: 1px solid #50fa7b; color: #50fa7b; }}
+ .collapsable:nth-child(3n) { background: #ffb86c; .item { border: 1px solid #ffb86c; color: #ffb86c; }}
+ .collapsable:nth-child(4n) { background: #ff79c6; .item { border: 1px solid #ff79c6; color: #ff79c6; }}
+ .collapsable:nth-child(4n) { background: #bd93f9; .item { border: 1px solid #bd93f9; color: #bd93f9; }}
}
html[data-theme='bee'] {
diff --git a/src/styles/media-queries.scss b/src/styles/media-queries.scss
index ba5b6ef5..91461af7 100644
--- a/src/styles/media-queries.scss
+++ b/src/styles/media-queries.scss
@@ -38,7 +38,6 @@ $extra-large: 2800px;
}
}
-
@mixin tablet-up {
@media (min-width: #{$small}) {
@content;