full ads width use with small devices

backend/src/config/index.js

@@ -19,7 +19,11 @@ const {
   GRAPHQL_URI = 'http://localhost:4000',
 } = process.env
 
-export const requiredConfigs = { MAPBOX_TOKEN, JWT_SECRET, PRIVATE_KEY_PASSPHRASE }
+export const requiredConfigs = {
+  MAPBOX_TOKEN,
+  JWT_SECRET,
+  PRIVATE_KEY_PASSPHRASE,
+}
 export const smtpConfigs = {
   SMTP_HOST,
   SMTP_PORT,
@@ -27,8 +31,16 @@ export const smtpConfigs = {
   SMTP_USERNAME,
   SMTP_PASSWORD,
 }
-export const neo4jConfigs = { NEO4J_URI, NEO4J_USERNAME, NEO4J_PASSWORD }
-export const serverConfigs = { GRAPHQL_PORT, CLIENT_URI, GRAPHQL_URI }
+export const neo4jConfigs = {
+  NEO4J_URI,
+  NEO4J_USERNAME,
+  NEO4J_PASSWORD,
+}
+export const serverConfigs = {
+  GRAPHQL_PORT,
+  CLIENT_URI,
+  GRAPHQL_URI,
+}
 
 export const developmentConfigs = {
   DEBUG: process.env.NODE_ENV !== 'production' && process.env.DEBUG === 'true',

webapp/assets/styles/main.scss

@@ -24,9 +24,11 @@ $easeOut: cubic-bezier(0.19, 1, 0.22, 1);
   transition: opacity 80ms ease-out;
   transition-delay: 80ms;
 }
+
 .layout-leave-active {
   transition: opacity 80ms ease-in;
 }
+
 .layout-enter,
 .layout-leave-active {
   opacity: 0;
@@ -39,6 +41,7 @@ $easeOut: cubic-bezier(0.19, 1, 0.22, 1);
   opacity: 1;
   transform: translate3d(0, 0, 0);
 }
+
 .slide-up-enter,
 .slide-up-leave-active {
   opacity: 0;
@@ -66,7 +69,8 @@ blockquote {
   border-left: 3px dotted $color-neutral-70;
 
   &::before {
-    content: '\201C'; /*Unicode for Left Double Quote*/
+    content: '\201C';
+    /*Unicode for Left Double Quote*/
 
     /*Font*/
     font-size: $font-size-xxxx-large;
@@ -83,6 +87,7 @@ blockquote {
     margin-top: 0;
   }
 }
+
 .main-navigation {
   box-shadow: $box-shadow-base;
   position: fixed;
@@ -105,6 +110,7 @@ hr {
 [class$='menu-trigger'] {
   user-select: none;
 }
+
 [class$='menu-popover'] {
   display: inline-block;
 

webapp/layouts/default.vue

@@ -88,7 +88,7 @@
     </div>
 
     <ds-container>
-      <div style="padding: 6rem 2rem 5rem;">
+      <div :width="{ base: '100%', md: '95%' }">
         <nuxt />
       </div>
     </ds-container>