diff --git a/src/renderer/components/ft-profile-bubble/ft-profile-bubble.css b/src/renderer/components/ft-profile-bubble/ft-profile-bubble.css
index 1208867b..9f832bd0 100644
--- a/src/renderer/components/ft-profile-bubble/ft-profile-bubble.css
+++ b/src/renderer/components/ft-profile-bubble/ft-profile-bubble.css
@@ -1,7 +1,7 @@
.bubblePadding {
width: 100px;
height: 115px;
- padding: 10px;
+ padding: 10px 10px 30px 10px;
cursor: pointer;
-webkit-transition: background 0.2s ease-out;
-moz-transition: background 0.2s ease-out;
@@ -17,25 +17,23 @@
}
.bubble {
- width: 50px;
- height: 50px;
- margin-top: 20px;
- margin-bottom: 5px;
- margin-left: 25px;
- border-radius: 200px 200px 200px 200px;
- -webkit-border-radius: 200px 200px 200px 200px;
+ width: 70px;
+ height: 70px;
+ margin: 20px auto 5px auto;
+ border-radius: 50%;
+ -webkit-border-radius: 50%;
}
.initial {
- font-size: 25px;
+ font-size: 35px;
+ line-height: 1em;
text-align: center;
- position: relative;
- top: 12px;
+ padding: 17.5px 0;
}
.profileName {
- font-size: 13px;
- height: 60px;
+ font-size: 14px;
+ line-height: 1.5em;
overflow: hidden;
text-align: center;
}
diff --git a/src/renderer/components/ft-profile-bubble/ft-profile-bubble.vue b/src/renderer/components/ft-profile-bubble/ft-profile-bubble.vue
index 27ff2e01..6879570d 100644
--- a/src/renderer/components/ft-profile-bubble/ft-profile-bubble.vue
+++ b/src/renderer/components/ft-profile-bubble/ft-profile-bubble.vue
@@ -7,9 +7,9 @@
class="bubble"
:style="{ background: backgroundColor, color: textColor }"
>
-
+
{{ profileInitial }}
-
+
{{ profileName }}
diff --git a/src/renderer/components/ft-profile-edit/ft-profile-edit.css b/src/renderer/components/ft-profile-edit/ft-profile-edit.css
index c7c669cc..bc8956a1 100644
--- a/src/renderer/components/ft-profile-edit/ft-profile-edit.css
+++ b/src/renderer/components/ft-profile-edit/ft-profile-edit.css
@@ -27,15 +27,15 @@
height: 100px;
margin: 10px;
cursor: pointer;
- border-radius: 200px 200px 200px 200px;
- -webkit-border-radius: 200px 200px 200px 200px;
+ border-radius: 50%;
+ -webkit-border-radius: 50%;
}
.initial {
font-size: 50px;
+ line-height: 1em;
text-align: center;
- position: relative;
- bottom: 27px;
+ padding: 25px 0;
}
@media only screen and (max-width: 680px) {
diff --git a/src/renderer/components/ft-profile-edit/ft-profile-edit.vue b/src/renderer/components/ft-profile-edit/ft-profile-edit.vue
index 1d893f4a..bd2c0d5b 100644
--- a/src/renderer/components/ft-profile-edit/ft-profile-edit.vue
+++ b/src/renderer/components/ft-profile-edit/ft-profile-edit.vue
@@ -53,11 +53,11 @@
:style="{ background: profileBgColor, color: profileTextColor }"
style="cursor: default"
>
-
{{ profileInitial }}
-
+
diff --git a/src/renderer/components/ft-profile-selector/ft-profile-selector.css b/src/renderer/components/ft-profile-selector/ft-profile-selector.css
index 8ed7427e..3034f65f 100644
--- a/src/renderer/components/ft-profile-selector/ft-profile-selector.css
+++ b/src/renderer/components/ft-profile-selector/ft-profile-selector.css
@@ -3,15 +3,15 @@
height: 40px;
margin: 10px;
cursor: pointer;
- border-radius: 200px 200px 200px 200px;
- -webkit-border-radius: 200px 200px 200px 200px;
+ border-radius: 50%;
+ -webkit-border-radius: 50%;
}
.initial {
font-size: 20px;
+ line-height: 1em;
text-align: center;
- position: relative;
- bottom: 30px;
+ padding: 10px 0;
}
#profileList {
diff --git a/src/renderer/components/ft-profile-selector/ft-profile-selector.vue b/src/renderer/components/ft-profile-selector/ft-profile-selector.vue
index a263f8ae..e2160877 100644
--- a/src/renderer/components/ft-profile-selector/ft-profile-selector.vue
+++ b/src/renderer/components/ft-profile-selector/ft-profile-selector.vue
@@ -5,11 +5,11 @@
:style="{ background: profileList[activeProfile].bgColor, color: profileList[activeProfile].textColor }"
@click="toggleProfileList"
>
-
{{ profileInitials[activeProfile] }}
-
+
-
{{ profileInitials[index] }}
-
+