dark mode update

resources/js/views/Index/DynamicPage.vue

@@ -10,21 +10,11 @@
             <!--Headline-->
             <PageTitle
                     class="headline"
-                    title="Terms & Conditions"
+                    :title="page.data.attributes.title"
             ></PageTitle>
 
             <!--Content-->
-            <div class="page-content">
-                <p>Dominion, open bearing brought may dominion male beginning god land greater forth there fruit whose creepeth two their great there morning multiply Third image
-                    first. Waters waters. Which, moving place let said their saw, behold good appear of days very dominion called shall creeping creepeth subdue living, over set
-                    subdue above under form make appear blessed, given shall midst likeness midst days him fruit seasons void hath light it him and days gathering give itself his
-                    heaven fruitful fourth darkness bearing. Bring third a our gathered fruitful man sixth place.</p>
-                <p>Have give land may man together unto appear bring it is creature. Gathering abundantly. Beast night. Blessed be Lights, second brought. Yielding without set the
-                    open give one seed of fowl said living years said female. Second hath subdue, give dry which very there night is. Whales very seed heaven set image.</p>
-                <p>Was moved, air seas Without. Winged years third. Dry under upon very Light tree. Given be meat seed fish. Over earth was beast fruitful. Abundantly great female
-                    sixth. Which divide our days fly heaven seasons. Lights form created darkness third morning, and won't whales. Living fowl bearing saying dominion first female.
-                    That to lesser our doesn't morning place.</p>
-            </div>
+            <div class="page-content" v-html="page.data.attributes.content_formatted"></div>
         </div>
 
         <!--Footer-->
@@ -40,7 +30,7 @@
     import axios from 'axios'
 
     export default {
-        name: 'SaaSLandingPage',
+        name: 'DynamicPage',
         components: {
             PageFooter,
             Navigation,
@@ -52,10 +42,26 @@
         data() {
             return {
                 isLoading: false,
+                page: undefined,
+            }
+        },
+        watch: {
+            $route(to, from) {
+                this.getPage()
+            }
+        },
+        methods: {
+            getPage() {
+                axios.get('/api/page/' + this.$route.params.slug)
+                    .then(response => {
+                        this.page = response.data
+
+                        this.$scrollTop()
+                    })
             }
         },
         created() {
-            this.$scrollTop()
+            this.getPage()
         }
     }
 </script>
@@ -72,7 +78,7 @@
 
     .page-content {
 
-        p {
+        /deep/ p {
             @include font-size(20);
             font-weight: 500;
             line-height: 1.65;
@@ -84,7 +90,10 @@
 
     }
 
-    @media only screen and (max-width: 690px) {
-
+    @media only screen and (max-width: 960px) {
+        .headline {
+            padding-top: 50px;
+            padding-bottom: 30px;
+        }
     }
 </style>