diff --git a/server/static/css/main.css b/server/static/css/main.css index c1b76d4..f2abe06 100644 --- a/server/static/css/main.css +++ b/server/static/css/main.css @@ -40,6 +40,7 @@ body color: #333; text-align: center; margin: 1rem; + font-size: 1.2rem; } .primeblue { @@ -47,12 +48,20 @@ body } .title { - font-size: 5rem; + font-size: 3rem; font-weight: bold; text-align: center; margin: 1rem; } +.whiteblock { + display: flex; + background-color: #fff; + align-items: center; + justify-content: center; + margin-left: 10rem; + margin-right: 10rem; +} .grayblock { background-color: #ddd; align-items: center; @@ -67,6 +76,28 @@ body display: flex; flex-wrap: wrap; } +.vertical { + font-size: 1.5rem; + display: flex; + flex-direction: column; + text-align: left; +} +.vertical .content { + display: flex; + flex-wrap: wrap; + justify-content: center; + align-items: center; + margin: 2rem +} + +.vertical .content .image { + width: 25rem; +} + +.vertical .content .text { + margin-left: 2rem; + width: 26rem; +} .horizontal .content { font-size: 2rem; @@ -77,7 +108,7 @@ body margin: 1rem; margin-left: 4rem; margin-right: 4rem; - height: 30rem; + height: 20rem; border-radius: 1rem; width: auto; } diff --git a/server/static/res/connect_calendar.svg b/server/static/res/connect_calendar.svg new file mode 100755 index 0000000..fb994ae --- /dev/null +++ b/server/static/res/connect_calendar.svg @@ -0,0 +1,70 @@ + + + + + Artboard 1 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/server/static/res/connect_device.svg b/server/static/res/connect_device.svg new file mode 100755 index 0000000..d8316f3 --- /dev/null +++ b/server/static/res/connect_device.svg @@ -0,0 +1,133 @@ + + + + + Artboard 1 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/server/static/res/personalize_view.svg b/server/static/res/personalize_view.svg new file mode 100755 index 0000000..668ec97 --- /dev/null +++ b/server/static/res/personalize_view.svg @@ -0,0 +1,100 @@ + + + + + Artboard 1 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/server/template/base_navigation.html b/server/template/base_navigation.html index 2a0fd6e..2c5c4ed 100644 --- a/server/template/base_navigation.html +++ b/server/template/base_navigation.html @@ -1,6 +1,6 @@ - +
+
+ +
1, Connect your Calendar Service to Longitude
+
+
+ +
2, Connect the Longitude Watch app to Longitude Web
+
+
+ +
3, Customize your Content and Style
+
+