commit: 051b9703dffa785eb3b0fde29d2ceab3fe1255ba
parent: c7376b83256a181ce61164ea952229da10433158
Author: feld <feld@feld.me>
Date: Thu, 12 Dec 2019 19:15:14 +0000
Merge branch 'nav-icons' into 'develop'
Add icons to nav panel
See merge request pleroma/pleroma-fe!1016
Diffstat:
3 files changed, 59 insertions(+), 21 deletions(-)
diff --git a/src/components/nav_panel/nav_panel.vue b/src/components/nav_panel/nav_panel.vue
@@ -4,22 +4,22 @@
<ul>
<li v-if="currentUser">
<router-link :to="{ name: 'friends' }">
- {{ $t("nav.timeline") }}
+ <i class="button-icon icon-home-2" /> {{ $t("nav.timeline") }}
</router-link>
</li>
<li v-if="currentUser">
<router-link :to="{ name: 'interactions', params: { username: currentUser.screen_name } }">
- {{ $t("nav.interactions") }}
+ <i class="button-icon icon-bell-alt" /> {{ $t("nav.interactions") }}
</router-link>
</li>
<li v-if="currentUser">
<router-link :to="{ name: 'dms', params: { username: currentUser.screen_name } }">
- {{ $t("nav.dms") }}
+ <i class="button-icon icon-mail-alt" /> {{ $t("nav.dms") }}
</router-link>
</li>
<li v-if="currentUser && currentUser.locked">
<router-link :to="{ name: 'friend-requests' }">
- {{ $t("nav.friend_requests") }}
+ <i class="button-icon icon-user-plus" /> {{ $t("nav.friend_requests") }}
<span
v-if="followRequestCount > 0"
class="badge follow-request-count"
@@ -30,17 +30,17 @@
</li>
<li>
<router-link :to="{ name: 'public-timeline' }">
- {{ $t("nav.public_tl") }}
+ <i class="button-icon icon-users" /> {{ $t("nav.public_tl") }}
</router-link>
</li>
<li>
<router-link :to="{ name: 'public-external-timeline' }">
- {{ $t("nav.twkn") }}
+ <i class="button-icon icon-globe" /> {{ $t("nav.twkn") }}
</router-link>
</li>
<li>
<router-link :to="{ name: 'about' }">
- {{ $t("nav.about") }}
+ <i class="button-icon icon-info-circled" /> {{ $t("nav.about") }}
</router-link>
</li>
</ul>
@@ -113,4 +113,8 @@
}
}
}
+
+.nav-panel .button-icon:before {
+ width: 1.1em;
+}
</style>
diff --git a/src/components/side_drawer/side_drawer.vue b/src/components/side_drawer/side_drawer.vue
@@ -36,7 +36,7 @@
@click="toggleDrawer"
>
<router-link :to="{ name: 'login' }">
- {{ $t("login.login") }}
+ <i class="button-icon icon-login" /> {{ $t("login.login") }}
</router-link>
</li>
<li
@@ -44,7 +44,7 @@
@click="toggleDrawer"
>
<router-link :to="{ name: 'dms', params: { username: currentUser.screen_name } }">
- {{ $t("nav.dms") }}
+ <i class="button-icon icon-mail-alt" /> {{ $t("nav.dms") }}
</router-link>
</li>
<li
@@ -52,7 +52,7 @@
@click="toggleDrawer"
>
<router-link :to="{ name: 'interactions', params: { username: currentUser.screen_name } }">
- {{ $t("nav.interactions") }}
+ <i class="button-icon icon-bell-alt" /> {{ $t("nav.interactions") }}
</router-link>
</li>
</ul>
@@ -62,7 +62,7 @@
@click="toggleDrawer"
>
<router-link :to="{ name: 'friends' }">
- {{ $t("nav.timeline") }}
+ <i class="button-icon icon-home-2" /> {{ $t("nav.timeline") }}
</router-link>
</li>
<li
@@ -70,7 +70,7 @@
@click="toggleDrawer"
>
<router-link to="/friend-requests">
- {{ $t("nav.friend_requests") }}
+ <i class="button-icon icon-user-plus" /> {{ $t("nav.friend_requests") }}
<span
v-if="followRequestCount > 0"
class="badge follow-request-count"
@@ -81,12 +81,12 @@
</li>
<li @click="toggleDrawer">
<router-link to="/main/public">
- {{ $t("nav.public_tl") }}
+ <i class="button-icon icon-users" /> {{ $t("nav.public_tl") }}
</router-link>
</li>
<li @click="toggleDrawer">
<router-link to="/main/all">
- {{ $t("nav.twkn") }}
+ <i class="button-icon icon-globe" /> {{ $t("nav.twkn") }}
</router-link>
</li>
<li
@@ -94,14 +94,14 @@
@click="toggleDrawer"
>
<router-link :to="{ name: 'chat' }">
- {{ $t("nav.chat") }}
+ <i class="button-icon icon-chat" /> {{ $t("nav.chat") }}
</router-link>
</li>
</ul>
<ul>
<li @click="toggleDrawer">
<router-link :to="{ name: 'search' }">
- {{ $t("nav.search") }}
+ <i class="button-icon icon-search" /> {{ $t("nav.search") }}
</router-link>
</li>
<li
@@ -109,17 +109,17 @@
@click="toggleDrawer"
>
<router-link :to="{ name: 'who-to-follow' }">
- {{ $t("nav.who_to_follow") }}
+ <i class="button-icon icon-user-plus" /> {{ $t("nav.who_to_follow") }}
</router-link>
</li>
<li @click="toggleDrawer">
<router-link :to="{ name: 'settings' }">
- {{ $t("settings.settings") }}
+ <i class="button-icon icon-cog" /> {{ $t("settings.settings") }}
</router-link>
</li>
<li @click="toggleDrawer">
<router-link :to="{ name: 'about'}">
- {{ $t("nav.about") }}
+ <i class="button-icon icon-info-circled" /> {{ $t("nav.about") }}
</router-link>
</li>
<li
@@ -130,7 +130,7 @@
href="/pleroma/admin/#/login-pleroma"
target="_blank"
>
- {{ $t("nav.administration") }}
+ <i class="button-icon icon-gauge" /> {{ $t("nav.administration") }}
</a>
</li>
<li
@@ -141,7 +141,7 @@
href="#"
@click="doLogout"
>
- {{ $t("login.logout") }}
+ <i class="button-icon icon-logout" /> {{ $t("login.logout") }}
</a>
</li>
</ul>
@@ -215,6 +215,10 @@
box-shadow: var(--panelShadow);
background-color: $fallback--bg;
background-color: var(--bg, $fallback--bg);
+
+ .button-icon:before {
+ width: 1.1em;
+ }
}
.side-drawer-logo-wrapper {
diff --git a/static/fontello.json b/static/fontello.json
@@ -303,6 +303,36 @@
"css": "gauge",
"code": 61668,
"src": "fontawesome"
+ },
+ {
+ "uid": "31972e4e9d080eaa796290349ae6c1fd",
+ "css": "users",
+ "code": 59421,
+ "src": "fontawesome"
+ },
+ {
+ "uid": "e82cedfa1d5f15b00c5a81c9bd731ea2",
+ "css": "info-circled",
+ "code": 59423,
+ "src": "fontawesome"
+ },
+ {
+ "uid": "w3nzesrlbezu6f30q7ytyq919p6gdlb6",
+ "css": "home-2",
+ "code": 59425,
+ "src": "typicons"
+ },
+ {
+ "uid": "dcedf50ab1ede3283d7a6c70e2fe32f3",
+ "css": "chat",
+ "code": 59422,
+ "src": "fontawesome"
+ },
+ {
+ "uid": "3a00327e61b997b58518bd43ed83c3df",
+ "css": "login",
+ "code": 59424,
+ "src": "fontawesome"
}
]
}
\ No newline at end of file