dan/Nertivia-Client
1
0
Fork 0
mirror of https://github.com/danbulant/Nertivia-Client synced 2026-06-16 13:01:09 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

added desktop class and removed notify animation.

Browse source
This commit is contained in:
supertiger1234 2019-12-07 19:13:00 +00:00
parent ddf60b66d5
commit fa3aed1e3d
7 changed files with 18 additions and 137 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

26
src/components/app/FriendsList.vue
View file

@ -6,12 +6,12 @@
<div class="tabs">
<div
class="tab"
:class="{notifyAnimation: friendRequestExists, selected: currentTab === 0}"
:class="{notify: friendRequestExists, selected: currentTab === 0}"
@click="currentTab = 0"
><div class="material-icons">group</div>Friends</div>
<div
class="tab"
:class="{notifyAnimation: DMNotification, selected: currentTab === 1 }"
:class="{notify: DMNotification, selected: currentTab === 1 }"
@click="currentTab = 1"
><div class="material-icons">access_time</div>Recents</div>
</div>
@ -198,27 +198,11 @@ export default {
flex-shrink: 0;
}
.notifyAnimation {
animation: notifyAnime;
animation-duration: 1s;
animation-iteration-count: infinite;
animation-fill-mode: forwards;
}
@keyframes notifyAnime {
0% {
background: rgba(121, 3, 3, 0.541);
}
40% {
background: rgba(255, 0, 0, 0.568);
}
60% {
background: rgba(255, 0, 0, 0.568);
}
100% {
background: rgba(121, 3, 3, 0.541);
}
.notify {
background: rgba(255, 0, 0, 0.568);
}
@media (max-width: 600px) {
.content{
border-radius: 0;

19
src/components/app/MainNav.vue
View file

@ -344,28 +344,11 @@ export default {
right: 5px;
width: 20px;
height: 20px;
animation: notifyAnime;
animation-duration: 1s;
animation-iteration-count: infinite;
animation-fill-mode: forwards;
border-radius: 50%;
background: rgba(255, 23, 23, 0.753);
flex-shrink: 0;
}
@keyframes notifyAnime {
0% {
opacity: 0.2;
}
40% {
opacity: 1;
}
60% {
opacity: 1;
}
100% {
opacity: 0.2;
}
}
.tool-tip {
color: white;

19
src/components/app/Navigation.vue
View file

@ -366,28 +366,11 @@ export default {
right: 5px;
width: 20px;
height: 20px;
animation: notifyAnime;
animation-duration: 1s;
animation-iteration-count: infinite;
animation-fill-mode: forwards;
border-radius: 50%;
background: rgba(255, 23, 23, 0.753);
flex-shrink: 0;
}
@keyframes notifyAnime {
0% {
opacity: 0.2;
}
40% {
opacity: 1;
}
60% {
opacity: 1;
}
100% {
opacity: 0.2;
}
}
.tool-tip {
color: white;

23
src/components/app/ServerTemplate/ChannelTemplate.vue
View file

@ -1,7 +1,7 @@
<template>
<div
class="channel"
:class="{notifyAnimation: hasNotifications, selected: selectedChannelID === channelData.channelID}"
:class="{notify: hasNotifications, selected: selectedChannelID === channelData.channelID}"
>
<i class="material-icons">storage</i>
<div class="channel-name">{{ channelData.name }}</div>
@ -36,25 +36,8 @@ export default {
<style scoped>
.notifyAnimation {
animation: notifyAnime;
animation-duration: 1s;
animation-iteration-count: infinite;
animation-fill-mode: forwards;
}
@keyframes notifyAnime {
0% {
background: rgba(255, 0, 0, 0.198);
}
40% {
background: rgba(255, 0, 0, 0.411);
}
60% {
background: rgba(255, 0, 0, 0.411);
}
100% {
background: rgba(255, 0, 0, 0.198);
}
.notify {
background: rgba(255, 0, 0, 0.411);
}
.channel {

21
src/components/app/ServerTemplate/ServerTemplate.vue
View file

@ -116,7 +116,7 @@ export default {
background: #ffffffc5;
}
}
.notifyAnimation:before {
.notifyAnimation:after {
content: "!";
color: white;
display: flex;
@ -131,25 +131,8 @@ export default {
right: 5px;
width: 20px;
height: 20px;
animation: notifyAnime;
animation-duration: 1s;
animation-iteration-count: infinite;
animation-fill-mode: forwards;
border-radius: 50%;
background: rgba(255, 23, 23, 0.753);
}
@keyframes notifyAnime {
0% {
opacity: 1;
}
40% {
opacity: 0.9;
}
60% {
opacity: 1;
}
100% {
opacity: 0.2;
}
}
</style>

24
src/components/app/relationships/FriendsTemplate.vue
View file

@ -1,7 +1,7 @@
<template>
<div
class="friend"
:class="{selected: uniqueIDSelected, notifyAnimation: (notifications && notifications > 0), tree }"
:class="{selected: uniqueIDSelected, notify: (notifications && notifications > 0), tree }"
@click="openChat"
@mouseover="hover = true"
@mouseleave="hover = false"
@ -136,27 +136,11 @@ export default {
.tree {
padding-left: 22px;
}
.notifyAnimation {
animation: notifyAnime;
animation-duration: 1s;
animation-iteration-count: infinite;
animation-fill-mode: forwards;
}
@keyframes notifyAnime {
0% {
background: rgba(255, 0, 0, 0.198);
}
40% {
background: rgba(255, 0, 0, 0.411);
}
60% {
background: rgba(255, 0, 0, 0.411);
}
100% {
background: rgba(255, 0, 0, 0.198);
}
.notify {
background: rgba(255, 0, 0, 0.411);
}
.friend:hover {
background: #053c4c;
}

23
src/views/App.vue
View file

@ -1,5 +1,5 @@
<template>
<div id="app" ref="app">
<div id="app" ref="app" :class="{desktop: isElectron}">
<vue-headful :title="title" description="Nertivia Chat Client" />
<div class="background-image"></div>
<transition name="fade-between-two" appear>
@ -238,32 +238,13 @@ export default {
height: 100%;
}
.notifyAnimation {
animation: notifyAnime;
animation-duration: 1s;
animation-iteration-count: infinite;
animation-fill-mode: forwards;
}
.box {
display: flex;
flex-direction: column;
height: 100%;
width: 100%;
}
@keyframes notifyAnime {
0% {
background: rgba(121, 3, 3, 0.541);
}
40% {
background: rgba(255, 0, 0, 0.568);
}
60% {
background: rgba(255, 0, 0, 0.568);
}
100% {
background: rgba(121, 3, 3, 0.541);
}
}
.coming-soon {
display: flex;