diff --git a/app/assets/stylesheets/application.scss b/app/assets/stylesheets/application.scss index 0a767774..646962e8 100644 --- a/app/assets/stylesheets/application.scss +++ b/app/assets/stylesheets/application.scss @@ -21,3 +21,10 @@ .navbar { background-color: lightyellow; } + + @media (max-width: 1024px) { + .reverse-columns { + flex-direction: column-reverse; + display: flex; + } + } diff --git a/app/controllers/home_controller.rb b/app/controllers/home_controller.rb index 95f29929..6daa87af 100644 --- a/app/controllers/home_controller.rb +++ b/app/controllers/home_controller.rb @@ -1,4 +1,5 @@ class HomeController < ApplicationController def index + @pocket_money_reasons = YAML.load_file(Rails.root.join('config', 'pocket_money_reasons.yml'))['reasons'] end end diff --git a/app/views/devise/sessions/new.html.slim b/app/views/devise/sessions/new.html.slim index e4c2519b..36cf3a0b 100644 --- a/app/views/devise/sessions/new.html.slim +++ b/app/views/devise/sessions/new.html.slim @@ -1,6 +1,6 @@ .columns.is-centered .column.is-one-third - h2.title.is-4.has-text-centered = t('.sign_up') + h2.title.is-4.has-text-centered = t('.log_in') = form_for(resource, as: resource_name, url: session_path(resource_name)) do |f| .field = f.email_field :email, autofocus: true, autocomplete: "email", placeholder: "email" diff --git a/app/views/home/index.html.erb b/app/views/home/index.html.erb new file mode 100644 index 00000000..53e40398 --- /dev/null +++ b/app/views/home/index.html.erb @@ -0,0 +1,115 @@ +
+
+
+
+
+

+ Children wallet +

+
+
+ <%= link_to 'Go!', my_account_path, class: 'button is-primary is-fullwidth' %> +
+
+
+
+
+ <%= image_tag('hero.jpg', alt: 'Children wallet') %> +
+
+
+
+
+
+<% @pocket_money_reasons.each_slice(2) do |reason| %> +
+
+
+
+
+
+ <%= image_tag(reason[0]['image'], alt: reason[0]['name']) %> +
+
+
+

+ <%= reason[0]['name']%> +

+

<%= reason[0]['explanation']%>

+
+
+
+
+
+
+
+
+
+
+

+ <%= reason[1]['name']%> +

+

<%= reason[1]['explanation']%>

+
+
+
+ <%= image_tag(reason[1]['image'], alt: reason[1]['name']) %> +
+
+
+
+
+
+<% end %> +
+
+
+
+
+
+
+
+ <%= link_to "Let's go!", my_account_path, class: 'button is-primary is-fullwidth' %> +
+
+
+
+
+
+
+
diff --git a/app/views/home/index.html.slim b/app/views/home/index.html.slim deleted file mode 100644 index 3337f4f1..00000000 --- a/app/views/home/index.html.slim +++ /dev/null @@ -1,15 +0,0 @@ -.columns - .column.is-fullwidth - .main-banner - .hero - .hero-body - .title Children wallet - .subtitle - ul - li Track pocket money of your kids - li Allow them buying what they want - li Save nerves - li Save your budget and time - .subtitle.go - = link_to 'Go!', my_account_path, class: 'button is-success' - diff --git a/app/views/layouts/application.html.erb b/app/views/layouts/application.html.erb index 77d7e86a..08cad73a 100644 --- a/app/views/layouts/application.html.erb +++ b/app/views/layouts/application.html.erb @@ -5,6 +5,8 @@ <%= csrf_meta_tags %> <%= csp_meta_tag %> + + <%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %> <%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %> diff --git a/config/pocket_money_reasons.yml b/config/pocket_money_reasons.yml new file mode 100644 index 00000000..74ca01e2 --- /dev/null +++ b/config/pocket_money_reasons.yml @@ -0,0 +1,24 @@ +reasons: + - name: Convenience + explanation: An allowance app makes it easy for parents to manage their children's allowances from their smartphones, without having to carry cash or remember to make payments manually + image: hero.jpg + + - name: Tracking + explanation: A kids' allowance app allows parents to track how much money their children receive and spend, helping them to monitor their kids' spending habits and teach them financial responsibility + image: hero.jpg + + - name: Budgeting + explanation: Parents can use an allowance app to set up a budget for their children, which can help kids learn how to manage money and make wise spending decisions + image: hero.jpg + + - name: Teaching financial literacy + explanation: An allowance app can be a useful tool for parents to teach their children about money management and financial literacy + image: hero.jpg + + - name: Encouraging responsibility + explanation: By using an allowance app, parents can encourage their children to take responsibility for their own spending and saving, which can help kids develop important life skills + image: hero.jpg + + - name: Overall + explanation: A kids' allowance app can be a useful tool for parents to help their children learn about money and develop good financial habits that will serve them well in the future + image: hero.jpg