lib2.ftd

-- boolean mobile: true

-- ftd.column page:
width: fill
open: content

--- header:
logo: https://i.imgur.com/aijdJIB.png
nav1anchor: Home
nav1link: #
nav2anchor: Docs
nav2link: #
nav3anchor: Resources
nav3link: #
nav4anchor: Showcase
nav4link: #
nav5anchor: News
nav5link: #
github-image: https://i.imgur.com/HPx4FkW.png
github-link: #
menu-icon: https://i.imgur.com/sbTot16.png

--- ftd.column:
id: content

--- container: ftd.main

--- footer:
col1text: FPM is lovingly maintained by the core team of volunteers
col3text: Proudly hosted by
col3image: https://i.imgur.com/MpRa7Hs.png
col2text: The contents of this website are © 2021 under the terms of the BSE License
col4text: FPM  is funded, thanks to its sponsors!

-- ftd.row header:
string logo:
string nav1anchor:
string nav1link:
string nav2anchor:
string nav2link:
string nav3anchor:
string nav3link:
string nav4anchor:
string nav4link:
string nav5anchor:
string nav5link:
string github-image:
string github-link:
string menu-icon:
width: fill
padding: 20
background-color: \#151E4F

--- ftd.image:
src: $logo
link: #
width: 180
margin-left: 120

--- ftd.column:
align: right
width: 650

--- ftd.image:
if: $mobile
src: $menu-icon
width: 40
align: right
margin-right: 16

--- ftd.row:
if: not $mobile
spacing: 40

--- ftd.text: $nav1anchor
link: $nav1link
color: white
size: 20
style: bold
align: center

--- ftd.text: $nav2anchor
link: $nav2link
color: white
size: 20
style: bold
align: center

--- ftd.text: $nav3anchor
link: $nav3link
color: white
size: 20
style: bold
align: center

--- ftd.text: $nav4anchor
link: $nav4link
color: white
size: 20
style: bold
align: center

--- ftd.text: $nav5anchor
link: $nav5link
color: white
size: 20
style: bold
align: center

--- ftd.image:
src: $github-image
link: $github-link
width: 50                       
align: center

-- ftd.row hero:
string title:
string intro:
string image:
string button:
string button-link:
width: fill
background-color: \#F6F7FB
padding-vertical: 80
padding-horizontal: 120

--- ftd.column:e
align: left

--- ftd.text: $title
style: bold
size: 70
margin-bottom: 20
color: \#151E4F

--- ftd.text: $intro
size: 36
margin-bottom: 40

--- ftd.text: $button
link: $button-link
padding-horizontal: 25
padding-vertical: 20
background-color: \#4540D9
color: white
size: 42
font: bold
border-radius: 10

--- container: ftd.main

--- ftd.column:
align: right

--- ftd.image:
src: $image

--- container: ftd.main

-- ftd.column features:
open: inner-row
caption title:
width: fill
align: center
background-color: \#F6F7FB
padding-vertical: 90

--- ftd.text: $title
style: bold
align: center
size: 64

--- ftd.row:
id: inner-row
width: fill
padding: 10
spacing: space-around
align: center
padding-top: 50

-- ftd.column feature-item:
string image:
caption title:
body intro:
width: percent 30
padding: 30
background-color: white

--- ftd.image:
src: $image
width: 55
margin-bottom: 50

--- ftd.text: $title
size: 32
style: bold

--- ftd.text:

$intro

-- ftd.row footer:
string col1text:
string col2text:
string col3image:
string col3text:
string col4text:
width: fill
padding-vertical: 90
padding-horizontal: 120
background-color: \#151E4F

--- ftd.column:
align: left

--- ftd.text: $col1text
color: white
size: 30
width: 500
margin-bottom: 40

--- ftd.text: $col2text
color: white
size: 30

--- container: ftd.main

--- ftd.column:
align: right
id: column2

--- ftd.row:
spacing: 10

--- ftd.text: $col3text
color: white
align: center
size: 30

--- ftd.image:
src: $col3image
width: 240
align: center

--- container: column2

--- ftd.text: $col4text
color: white
size: 30
margin-top: 40