fix About page

js/src/components/Settings/SettingMenuItem.vue

@@ -32,8 +32,6 @@ export default class SettingMenuItem extends Vue {
 <style lang="scss" scoped>
 li.setting-menu-item {
   font-size: 1.05rem;
-  background-color: #fff1de;
-  color: $background-color;
   margin: auto;
 
   span {
@@ -49,7 +47,6 @@ li.setting-menu-item {
   &:hover,
   &.active {
     cursor: pointer;
-    background-color: lighten(#fea72b, 10%);
   }
 }
 </style>

js/src/views/About.vue

@@ -1,6 +1,7 @@
 <template>
   <div class="container content">
-    <div class="hero intro is-small is-primary">
+    <main>
+      <div class="hero intro has-background-primary has-text-primary-dark">
         <div class="hero-body">
           <div class="container">
             <h1 class="title">{{ $t("About Mobilizon") }}</h1>
@@ -22,8 +23,8 @@
           </div>
         </div>
       </div>
-    <main class="container">
-      <div class="columns">
+
+      <div class="columns main-section">
         <div class="column is-one-quarter-desktop">
           <aside class="menu">
             <p class="menu-list">
@@ -65,9 +66,9 @@
     </main>
 
     <!-- We hide the "Find an instance button until https://joinmobilizon.org gets a instance picker -->
-    <div class="hero register is-primary is-medium">
+    <div class="hero register has-background-black">
       <div class="hero-body">
-        <div class="container has-text-centered">
+        <div class="has-text-centered">
           <div class="columns">
             <div class="column" v-if="config && config.registrationsOpen">
               <h2 class="title">{{ $t("Register on this instance") }}</h2>
@@ -118,7 +119,8 @@ export default class About extends Vue {
 
 <style lang="scss" scoped>
 .hero.is-primary {
-  background: $background-color;
+  background: $primary;
+  margin: 0;
 
   .title {
     margin: 30px auto 1rem auto;
@@ -149,4 +151,12 @@ aside.menu {
 ul.menu-list > li > a {
   text-decoration: none;
 }
+
+.hero {
+  margin: 1em 0;
+}
+
+.main-section {
+  margin: 1em 0;
+}
 </style>

js/src/views/About/AboutInstance.vue

@@ -1,6 +1,6 @@
 <template>
   <div v-if="config">
-    <section class="hero is-primary">
+    <section class="hero has-background-dark">
       <div class="hero-body">
         <div class="container">
           <h2 class="title">{{ config.name }}</h2>

js/src/views/Search.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="section container">
-    <h1 class="title">{{ $t("Explore") }} IN DEV MODE</h1>
+    <h1 class="title">{{ $t("Explore") }}</h1>
     <section v-if="tag">
       <i18n path="Events tagged with {tag}">
         <b-tag slot="tag" type="is-light">{{ $t("#{tag}", { tag }) }}</b-tag>
@@ -370,6 +370,9 @@ export default class Search extends Vue {
   }
 
   get geohash(): string | undefined {
+    if (!this.location) {
+      return undefined;
+    }
     console.info("geohash location", this.location);
 
     if (this.location && this.location.geom) {