From c83c5513dfb8688ee7aa79f1a5d5d1677f7a94a7 Mon Sep 17 00:00:00 2001
From: Niels Simenon <niels.simenon@gmail.com>
Date: Sun, 26 Jan 2020 23:10:08 +0100
Subject: [PATCH] Fixed compact actor view and gender icon size.

---
 assets/components/actors/actor.vue  | 25 +++++++++++++------------
 assets/components/actors/gender.vue |  5 ++++-
 2 files changed, 17 insertions(+), 13 deletions(-)

diff --git a/assets/components/actors/actor.vue b/assets/components/actors/actor.vue
index 82d54302..717a6997 100644
--- a/assets/components/actors/actor.vue
+++ b/assets/components/actors/actor.vue
@@ -289,6 +289,13 @@ export default {
 };
 </script>
 
+<style lang="scss">
+.header-gender .icon {
+    width: 1.25rem;
+    height: 1.25rem;
+}
+</style>
+
 <style lang="scss" scoped>
 @import 'theme';
 
@@ -313,11 +320,6 @@ export default {
     display: inline-block;
     margin: 0 0 0 .5rem;
     transform: translate(0, .1rem);
-
-    .icon {
-        width: 1.25rem;
-        height: 1.25rem;
-    }
 }
 
 .header-social {
@@ -326,13 +328,6 @@ export default {
     margin: 0 1rem 0 0;
 }
 
-.header-gender {
-    .icon {
-        width: 1.25rem;
-        height: 1.25rem;
-    }
-}
-
 .actor-inner {
     height: 100%;
     display: flex;
@@ -558,9 +553,15 @@ export default {
 @media(max-width: $breakpoint) {
     .profile {
         height: auto;
+        max-height: none;
         flex-direction: column;
         padding: 0 0 .5rem 0;
 
+        &.with-avatar {
+            height: auto;
+            max-height: none;
+        }
+
         &:not(.expanded) .hideable {
             display: none;
         }
diff --git a/assets/components/actors/gender.vue b/assets/components/actors/gender.vue
index 1bca0acd..a3de1652 100644
--- a/assets/components/actors/gender.vue
+++ b/assets/components/actors/gender.vue
@@ -23,16 +23,19 @@ export default {
 .gender {
     &.female .icon {
         fill: $female;
+        filter: drop-shadow(0 0 1px $shadow);
     }
 
     &.male .icon {
         fill: $male;
+        filter: drop-shadow(0 0 1px $shadow);
     }
 
     &.transsexual .icon {
         fill: $text-contrast;
         filter: drop-shadow(1px 0 0 $female) drop-shadow(-1px 0 0 $female) drop-shadow(0 1px 0 $female) drop-shadow(0 -1px 0 $female)
-            drop-shadow(1px 0 0 $male) drop-shadow(-1px 0 0 $male) drop-shadow(0 1px 0 $male) drop-shadow(0 -1px 0 $male);
+            drop-shadow(1px 0 0 $male) drop-shadow(-1px 0 0 $male) drop-shadow(0 1px 0 $male) drop-shadow(0 -1px 0 $male)
+            drop-shadow(0 0 1px $shadow)
     }
 }
 </style>