Sept 8 fixes (#9028)

* Added task sync after joining challenge

* Added gem purchasing

* Updated member modal style

* Added community guidelines to all groups

* Added group plans redirect

* Began add new front page design

* Fixed challenge loading on mount

* Fixed upgrade

* Added default summary

* Fixed small nav bar styles

* Added more unlock options to avatar editor

* Added more home page finishes

website/client/components/groups/membersModal.vue

@@ -1,6 +1,6 @@
 <template lang="pug">
 div
-  b-modal#members-modal(:title="$t('createGuild')", size='lg')
+  b-modal#members-modal(:title="$t('createGuild')", size='md')
     .header-wrap(slot="modal-header")
       .row
         .col-6
@@ -11,15 +11,16 @@ div
       .row
         .form-group.col-6
           input.form-control.search(type="text", :placeholder="$t('search')", v-model='searchTerm')
-        .col-4.offset-2
+        .col-5.offset-1
           span.dropdown-label {{ $t('sortBy') }}
           b-dropdown(:text="$t('sort')", right=true)
             b-dropdown-item(v-for='sortOption in sortOptions', @click='sort(sortOption.value)', :key='sortOption.value') {{sortOption.text}}
     .row(v-for='member in sortedMembers')
-      .col-8.offset-1
+      .col-11.no-padding-left
         member-details(:member='member')
-      .col-3.actions
-        b-dropdown(text="...", right=true)
+      .col-1.actions
+        b-dropdown(right=true)
+          .svg-icon.inline.dots(slot='button-content', v-html="icons.dots")
           b-dropdown-item(@click='sort(option.value)', v-if='isLeader')
             span.dropdown-icon-item
               .svg-icon.inline(v-html="icons.removeIcon", v-if='isLeader')
@@ -43,6 +44,26 @@ div
     .row.gradient(v-if='members.length > 3')
 </template>
 
+<style lang='scss'>
+  #members-modal {
+    .small-text, .character-name {
+      color: #878190;
+    }
+
+    .no-padding-left, .modal-body {
+      padding-left: 0;
+    }
+
+    .member-details {
+      margin: 0;
+    }
+
+    .actions .dropdown-toggle::after {
+      content: none !important;
+    }
+  }
+</style>
+
 <style lang='scss' scoped>
   header {
     background-color: #edecee;
@@ -60,6 +81,16 @@ div
   .actions {
     padding-top: 5em;
 
+    .dots {
+      height: 16px;
+      width: 4px;
+    }
+
+    .btn-group {
+      margin-left: -2em;
+      margin-top: -2em;
+    }
+
     .action-icon {
       margin-right: 1em;
     }
@@ -110,6 +141,7 @@ import MemberDetails from '../memberDetails';
 import removeIcon from 'assets/members/remove.svg';
 import messageIcon from 'assets/members/message.svg';
 import starIcon from 'assets/members/star.svg';
+import dots from 'assets/svg/dots.svg';
 
 export default {
   props: ['hideBadge'],
@@ -148,6 +180,7 @@ export default {
         removeIcon,
         messageIcon,
         starIcon,
+        dots,
       }),
       userIdToMessage: '',
     };