From 933b0c2e9f96e2af0b658a1e65f34ceb6b64b30f Mon Sep 17 00:00:00 2001 From: Andreas Nedbal Date: Fri, 8 Apr 2022 21:55:05 +0200 Subject: [PATCH] WIP: new layout for frontpage --- app/views/static/front.haml | 159 ++++++++++++++++-------------------- 1 file changed, 70 insertions(+), 89 deletions(-) diff --git a/app/views/static/front.haml b/app/views/static/front.haml index 508f10bd..2630979c 100644 --- a/app/views/static/front.haml +++ b/app/views/static/front.haml @@ -1,9 +1,5 @@ - provide(:title, APP_CONFIG['site_name']) -.jumbotron.jumbotron--particles.jumbotron--frontpage - .jumbotron__scroller - %a{ href: '#content' } - %i.fa.fa-chevron-down - .jumbotron__particles#particles +.jumbotron .jumbotron__content .container = render 'layouts/messages' @@ -15,78 +11,72 @@ %small Already a member? = link_to 'Sign in', new_user_session_path -.container.text-center#content - %h1 - What is #{APP_CONFIG['site_name']}? - %p.lead - A - %abbr{ title: 'Question and Answer' } Q/A - based social network - %p - Most of the people already know how these sorts of networks already work. - You have a profile and other users (or even anonymous people without accounts) can ask you any question to find out more about - you, so can you do the same with others. Finding friends with the same interests, people that share your opinion (and people that probably don't), - you can find everything here! - %p.lead - But what makes - = APP_CONFIG['site_name'] - special? - %p - = APP_CONFIG['site_name'] - tries to take aspects from other popular or now gone platforms and combine them to get the best result possible. - Also, we take in the ideas and feedback of our community so we can build a service that's even closer to being exactly the service people want to use! - - - %h2 Awesome Features - .row - .col-md-4.col-sm-4.col-xs-12 - %h3 - %i.fa.fa-fw.fa-comments.text-primary - Discussion - %p - With + %svg{:viewbox => "0 0 1440 320", :xmlns => "http://www.w3.org/2000/svg"} + %path{:d => "M0,160L80,186.7C160,213,320,267,480,250.7C640,235,800,149,960,128C1120,107,1280,149,1360,170.7L1440,192L1440,0L1360,0C1280,0,1120,0,960,0C800,0,640,0,480,0C320,0,160,0,80,0L0,0Z", :fill => "var(--primary)", "fill-opacity" => "1"} +.container + .row.my-5 + .col-sm-6 + %h2.mb-4 Receive and ask questions + %p + After registering on = APP_CONFIG['site_name'] - you can ask and answer questions from other users as well as receive anonymous questions. - Want to know something? Keep the conversation alive with interactive comments." - .col-md-4.col-sm-4.col-xs-12 - %h3 - %i.fa.fa-fw.fa-user-plus.text-primary - Following + share your unique link to your profile and receive questions in your inbox to answer + them right away. + %p + You can of course also use your account to ask anyone else on the site + questions, and once you accumulated followers you can send out questions to all of them + at once. + .col-sm-6 + %i.fa.fa-envelope + + .row.my-5 + .col-sm-6 + %i.fa.fa-comments + .col-sm-6 + %h2.mb-4 Keep the discussion going %p - Following users allows you to get a personalized feed of all people you want to know more about. - You can also send a question to all your followers at once! - .col-md-4.col-sm-4.col-xs-12 - %h3 - %i.fa.fa-fw.fa-share-square-o.text-primary - Sharing - %p - Want to share your answer to a question so that more people read it? - With a simple click on the answer button, your answer is shared wherever you want! - .row - .col-md-4.col-sm-4.col-xs-12 - %h3 - %i.fa.fa-fw.fa-list.text-primary - Lists - %p - Want to keep an oversight of things? Organise users in Lists to create timelines of their answers. - .col-md-4.col-sm-4.col-xs-12 - %h3 - %i.fa.fa-fw.fa-image.text-primary - Images - %p - Express yourself with images and upload an avatar and a header of your liking. - And soon you'll be able to attach images to answers and questions as well! - .col-md-4.col-sm-4.col-xs-12 - %h3 - %i.fa.fa-fw.fa-paint-brush.text-primary - Themes - %p - Don't like the default purple or don't like light interfaces in general? On + Someone answered your question and maybe not everything is cleared up? Use comments! + On = APP_CONFIG['site_name'] - you can change every color aspect of the site with Themes! - .row - .col-md-4.col-sm-4.col-xs-12 - %h3 + you can leave comments on answers to keep the discussion going. + %p + Don't need to say anything, but still like the answer? Leave a smile (our form of likes) on an answer! + + .row.my-5 + .col-sm-6 + %h2.mb-4 Share your answers + %p + Want your followers on another platform to see your + = APP_CONFIG['site_name'] + answers? You can configure automatic sharing to your favorite platforms easily. + %p.text-muted + Not sure if it's a favorite, but at the moment only + %b Twitter + is supported. + .col-sm-6 + %i.fa.fa-share + + .row.my-5 + .col-sm-6 + %i.fa.fa-paint-brush + .col-sm-6 + %h2.mb-4 Customize your experience + %p + Make your + = APP_CONFIG['site_name'] + profile your own with the ability to set a custom profile picture and header image. + %p + Going a step further, you can customize all colors of + = APP_CONFIG['site_name'] + to your own liking. Don't like purple? Make it blue, red or green! + %p + For a quick demonstration, you can try this out here with a few presets: + +.container.text-center + %h2.mb-4 But wait, there's more! + .row.my-5 + .col-sm-4 + %h3.mb-3 %i.fa.fa-fw.fa-globe.text-primary Open Source %p @@ -94,18 +84,15 @@ = APP_CONFIG['site_name'] and all of it's core components are open source! Everyone can help and improve the service! - .col-md-4.col-sm-4.col-xs-12 - %h3 + .col-sm-4 + %h3.mb-3 %i.fa.fa-fw.fa-eye-slash.text-primary No Ads %p - We don't like them ourselves, really. - = APP_CONFIG['site_name'] - just runs with community funding over - %a{ href: 'https://patreon.com/retrospring' } Patreon - which is way better than displaying annoying stuff. - .col-md-4.col-sm-4.col-xs-12 - %h3 + We don't like them ourselves, really. They make websites slow and are + (for the most part) annoying. So there's none! + .col-sm-4 + %h3.mb-3 %i.fa.fa-fw.fa-user-secret.text-primary Your Data is yours %p @@ -113,12 +100,6 @@ = APP_CONFIG['site_name'] doesn't sell any data that is collected. It remains encrypted on our servers! - .card - .card-body - %p - Any questions? Ask us on - %a{ href: 'https://twitter.com/retrospring' } Twitter - %h2 What are you waiting for? %p Registering takes less than 5 minutes!