ourworld_web/www_threefold_io
23
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

header fixed

Browse Source
This commit is contained in:
Ehab Hassan
2021-04-04 13:54:14 +02:00
parent 1215a36be0
commit fbc26b0b72
4 changed files with 31 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
src/assets/scss/main.scss
View File

@@ -139,6 +139,7 @@ button:focus {
.text-8xl { .text-8xl {
font-size: 5rem; font-size: 5rem;
line-height: 1; line-height: 1;
font-family: 'Lato', sans-serif !important;
} }
@media (min-width: 375px) { @media (min-width: 375px) {
.text-3xl { .text-3xl {

10
src/components/marketing/sections/cta-sections/Header.vue
View File

@@ -1,8 +1,8 @@
<template> <template>
<section class="py-12 px-4"> <section class="py-20 mb-10 px-4 lg:mx-40">
<div class="flex flex-wrap items-center text-center lg:text-left -mx-2"> <div class="flex flex-wrap text-center lg:text-left -mx-2">
<div class="lg:w-1/2 px-2 lg:pr-10 mt-10 lg:mt-0 order-1 lg:order-none"> <div class="lg:w-1/2 px-2 lg:pr-20 lg:mt-10 order-1 lg:order-none">
<h2 class="text-6xl mb-6 leading-none font-extrabold font-heading"> <h2 class="text-8xl mb-6 mt-20 leading-none font-extrabold font-heading">
<span class="text-blue-600">{{ slogan }}</span <span class="text-blue-600">{{ slogan }}</span
> {{ title }} > {{ title }}
</h2> </h2>
@@ -17,7 +17,7 @@
> >
<a <a
v-else v-else
class="nline-block bg-blue-900 text-sm learn-button hover:bg-blue-800 text-gray-100 px-12 py-2 mr-5 mb-4 rounded shadow rounded-full" class="nline-block bg-blue-900 text-md learn-button hover:bg-blue-800 text-gray-100 px-12 py-2 mr-5 mb-4 rounded shadow rounded-full"
:href="link" :href="link"
>{{ button }}</a >{{ button }}</a
> >

3
src/index.html
View File

@@ -5,6 +5,9 @@
${head} ${head}
<link rel="preconnect" href="https://fonts.gstatic.com" /> <link rel="preconnect" href="https://fonts.gstatic.com" />
<link href="https://fonts.googleapis.com/css2?family=Roboto:wght@300&display=swap" rel="stylesheet" /> <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@300&display=swap" rel="stylesheet" />
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Lato&family=Nunito:wght@700&display=swap" rel="stylesheet">
<script type="text/javascript"> <script type="text/javascript">
window.$crisp = []; window.$crisp = [];
window.CRISP_WEBSITE_ID = "1a5a5241-91cb-4a41-8323-5ba5ec574da0"; window.CRISP_WEBSITE_ID = "1a5a5241-91cb-4a41-8323-5ba5ec574da0";

27
src/pages/Index.vue
View File

@@ -1,11 +1,6 @@
<template> <template>
<Layout :hideHeader="true" :disableScroll="true"> <Layout :hideHeader="true" :disableScroll="true">
<div class="container sm:pxi-0 mx-auto overflow-x-hidden py-5"> <div class="container-fluid mx-20 sm:pxi-0 overflow-x-hidden">
<!-- <SolutionsHeader
v-if="$page.markdownPage.header"
:header="$page.markdownPage.header"
/> -->
<Header <Header
:title="$page.markdownPage.header_title" :title="$page.markdownPage.header_title"
:slogan="$page.markdownPage.header_slogan" :slogan="$page.markdownPage.header_slogan"
@@ -15,8 +10,17 @@
:button="$page.markdownPage.button" :button="$page.markdownPage.button"
:link="$page.markdownPage.link" :link="$page.markdownPage.link"
/> />
</div>
<div class="container sm:pxi-0 mx-auto overflow-x-hidden py-5">
<!-- <SolutionsHeader
v-if="$page.markdownPage.header"
:header="$page.markdownPage.header"
/> -->
<g-image class="m-auto w-2/4"
<g-image
class="m-auto w-2/4"
v-if="$page.markdownPage.solution_image2" v-if="$page.markdownPage.solution_image2"
:src="$page.markdownPage.solution_image2.src" :src="$page.markdownPage.solution_image2.src"
/> />
@@ -100,7 +104,8 @@
:signup="$page.markdownPage.signup" :signup="$page.markdownPage.signup"
/> --> /> -->
<g-image class="m-auto w-3/4" <g-image
class="m-auto w-3/4"
v-if="$page.markdownPage.solution_image" v-if="$page.markdownPage.solution_image"
:src="$page.markdownPage.solution_image.src" :src="$page.markdownPage.solution_image.src"
/> />
@@ -324,7 +329,11 @@ export default {
</script> </script>
<style scoped> <style scoped>
.container-fluid { .container-fluid {
max-width: 100% !important; width: 100%;
padding-right: 15px;
padding-left: 15px;
margin-right: auto;
margin-left: auto;
} }
</style> </style>