Skip to content

Commit 708180c

Browse files
codyjamesbrookscodyjamesbrooks
authored
home page template (279)
use website decorator to provide as much dynamic content as possible. use image place holders, and lorem ipsum, for rough content position add some comments to add context in code mirror editor.
1 parent 7321850 commit 708180c

File tree

5 files changed

+114
-2
lines changed

5 files changed

+114
-2
lines changed

‎app/assets/images/themes/default/image-placeholder.png

23.5 KB
Loading

‎app/controllers/staff/pages_controller.rb

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -70,7 +70,7 @@ def build_page
7070
Page.from_template(
7171
template,
7272
unpublished_body: render_to_string(
73-
"staff/pages/themes/#{current_website.theme}/splash",
73+
"staff/pages/themes/#{current_website.theme}/#{template}",
7474
layout: false
7575
),
7676
website: current_website

‎app/models/page.rb

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
class Page < ApplicationRecord
22
TEMPLATES = {
33
'splash' => { hide_header: true, hide_footer: true },
4+
'home' => { },
45
}
56

67
belongs_to :website

‎app/views/staff/pages/themes/default/home.html.erb

Lines changed: 111 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,111 @@
1+
<div class="pb-6 w-screen z-0 relative" style="background-image: url('<%= url_for(current_website.background) %>');" >
2+
<div class="pt-8 w-full flex flex-col items-center lg:items-start lg:flex-row lg:justify-between h-full max-w-5xl mx-auto">
3+
<div class="lg:w-1/2 pl-12 mb-6 lg:mb-0 lg:pt-8 z-10">
4+
<h2 class="text-3xl font-semibold mb-3">Maecenas faucibus mollis interdum. Etiam porta sem malesuada magna mollis euismod. Nulla vitae elit libero, a pharetra augue.</h2>
5+
<!-- Use for email collection -->
6+
<input class="w-3/5 p-3 mr-2 rounded-md" type="text" id="fname" name="fname" placeholder="Enter your email" /> <button class="py-3 px-4 bg-gray-200 rounded-md text-sm font-bold">Notify Me</button>
7+
</div>
8+
<%= image_tag 'themes/default/image-placeholder.png', class: "block w-3/4 lg:w-1/2 z-20 rounded-md" %>
9+
</div>
10+
</div>
11+
12+
<!-- Conference Stats -->
13+
<div class="flex px-6 py-6 gap-6 flex-wrap border border-grey-200 w-3/5 justify-around mx-auto relative -top-4 bg-white max-w-3xl mb-6">
14+
<div class="text-center"><span class="block text-5xl font-bold">00</span> <span>Adipiscing</span></div>
15+
<div class="text-center"><span class="block text-5xl font-bold">00</span> <span>Fringilla</span></div>
16+
<div class="text-center"><span class="block text-5xl font-bold">00</span> <span>Venenatis</span></div>
17+
<div class="text-center"><span class="block text-5xl font-bold">00</span> <span>Pharetra</span></div>
18+
</div>
19+
20+
<!-- Location Information-->
21+
<h4 class="text-center text-3xl font-bold tracking-wider mb-6">Meet you in <%= current_website.city %></h4>
22+
<div class="grid grid-cols-2 lg:grid-cols-3 grid-rows-2 gap-x-4 gap-y-3 max-w-5xl mx-auto mb-6">
23+
<div class="col-span-2 self-end">
24+
<%= image_tag 'themes/default/image-placeholder.png', class: "mx-auto" %>
25+
</div>
26+
<div class="col-span-2 lg:col-span-1 lg:row-span-2 flex lg:block items-center">
27+
<div class="p-3 w-1/3 lg:w-full">
28+
<div class="mb-3">
29+
<h6 class="text-xl font-bold mb-1">Hotel</h6>
30+
<span class="block bg-yellow-200">HOTEL NAME</span><span class="block bg-yellow-200">HOTEL ADDRESS</span> <span class="block bg-yellow-200">HOTEL CITY/ZIP</span>
31+
</div>
32+
<div class="mb-3">
33+
<h6 class="text-xl font-bold mb-1">Venue</h6>
34+
<span><%= current_website.location %></span>
35+
</div>
36+
<a class="mb-3 underline" href="<%= current_website.directions %>">Directions</a>
37+
</div>
38+
<div class="p-3 w-2/3 lg:w-full">
39+
<p class="mb-3 leading-5">Curabitur blandit tempus porttitor. Maecenas faucibus mollis interdum. Donec ullamcorper nulla non metus auctor fringilla. Nulla vitae elit libero, a pharetra augue. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nullam quis risus eget urna mollis ornare vel eu leo. Donec ullamcorper nulla non metus auctor fringilla.</p>
40+
<p class="mb-6 leading-5">Sed posuere consectetur est at lobortis. Nulla vitae elit libero, a pharetra augue. Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Maecenas sed diam eget risus varius blandit sit amet non magna. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Vestibulum id ligula porta felis euismod semper.</p>
41+
<a href="#" class="bg-gray-200 rounded-lg p-4 text-sm font-bold">Make a Reservation</a>
42+
</div>
43+
</div>
44+
<div class="self-center"><%= image_tag 'themes/default/image-placeholder.png', class: "mx-auto" %></div>
45+
<div class="self-center"><%= image_tag 'themes/default/image-placeholder.png', class: "mx-auto" %></div>
46+
</div>
47+
48+
<!-- Optional Contnent -->
49+
<h4 class="text-center text-3xl font-bold tracking-wider mb-6">Inceptos</h4>
50+
<div class="grid grid-cols-2 grid-rows-2 gap-x-3 gap-y-4 max-w-4xl mx-auto mb-6">
51+
<div class="self-end">
52+
<%= image_tag 'themes/default/image-placeholder.png', class: "mx-auto" %>
53+
</div>
54+
<div class="order-last lg:order-none">
55+
<%= image_tag 'themes/default/image-placeholder.png', class: "mx-auto" %>
56+
</div>
57+
<div class="row-span-2 lg:row-span-1 lg:col-span-2 lg:columns-3 flex flex-col justify-center">
58+
<p class="mb-3">Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec ullamcorper nulla non metus auctor fringilla. Nullam quis risus eget urna mollis ornare vel eu leo. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Donec sed odio dui. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
59+
<p class="mb-3">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras mattis consectetur purus sit amet fermentum. Etiam porta sem malesuada magna mollis euismod. Sed posuere consectetur est at lobortis. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Donec id elit non mi porta gravida at eget metus.</p>
60+
</div>
61+
</div>
62+
63+
<!-- CFP Component -->
64+
<h4 class="text-center text-3xl font-bold tracking-wider mb-6">Become A Speaker</h4>
65+
<div class="mb-6 flex flex-col lg:flex-row items-center lg:justify-center gap-4 max-w-5xl mx-auto mb-12">
66+
<div class="w-full flex flex-row justify-center lg:w-2/5 lg:flex-col">
67+
<%= image_tag 'themes/default/image-placeholder.png', class: "w-1/3 lg:w-full mr-3 block mb-4" %>
68+
<div>
69+
<h6 class="text-xl font-bold mb-3">Speak at <%= current_website.name %></h6>
70+
<p class="mb-3">Submit a proposal through our CFP application.<br/>
71+
Proposals must be submitted by <%= current_website.closes_at %></p>
72+
<%= link_to(
73+
'Apply',
74+
event_url(current_website.event),
75+
class: "py-3 px-4 bg-gray-200 rounded-md text-sm font-bold")
76+
%>
77+
</div>
78+
</div>
79+
<div class="w-full lg:w-2/5 flex flex-row justify-center lg:flex-col">
80+
<%= image_tag 'themes/default/image-placeholder.png', class: "w-1/3 h-1/3 lg:w-full lg:h-full block mr-4 mb-4" %>
81+
<%= image_tag 'themes/default/image-placeholder.png', class: "w-1/3 h-1/3 lg:w-full lg:h-full" %>
82+
</div>
83+
</div>
84+
85+
<!-- Optional Contnent -->
86+
<h4 class="text-center text-3xl font-bold tracking-wider mb-6">Adipiscing Elit</h4>
87+
<div class="mb-8 flex flex-col items-center lg:flex-row lg:items-start gap-8 max-w-4xl mx-auto">
88+
<div class="w-4/5 lg:w-full">
89+
<%= image_tag 'themes/default/image-placeholder.png', class: "mb-3" %>
90+
<h5 class="mb-2 font-bold text-xl">Ligula Purus Tortor</h5>
91+
<p class="mb-3">Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Cras mattis consectetur purus sit amet fermentum. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Curabitur blandit tempus porttitor. Curabitur blandit tempus porttitor.</p>
92+
<a class="px-4 py-3 font-bold text-sm bg-gray-200 rounded-lg">Apply</a></div>
93+
<div class="w-4/5 lg:w-full">
94+
<%= image_tag 'themes/default/image-placeholder.png', class: "mb-3" %>
95+
<h5 class="mb-2 font-bold text-xl">Commodo Parturient Vulputate</h5>
96+
<p class="mb-3">Cras justo odio, dapibus ac facilisis in, egestas eget quam. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Integer posuere erat a ante venenatis dapibus posuere velit aliquet. Nulla vitae elit libero, a pharetra augue. Donec ullamcorper nulla non metus auctor fringilla. Curabitur blandit tempus porttitor.</p>
97+
<a class="px-4 py-3 font-bold text-sm bg-gray-200 rounded-lg">Apply</a></div>
98+
</div>
99+
100+
<!-- Sponsors Footer -->
101+
<div class="flex flex-col items-center">
102+
<h4 class="text-3xl font-bold tracking-wider mb-6">Thank you to our Sponsors</h4>
103+
<p class="max-w-2xl mb-6">Interested in becoming a sponsor? Check out our
104+
<%= link_to(
105+
'Sponsorship Prospectus',
106+
current_website.prospectus_link)
107+
%>
108+
to learn about sponsorship opportunities.
109+
</p>
110+
<sponsors-footer></sponsors-footer>
111+
<div>

‎app/views/staff/websites/_form.html.haml

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@
99
- if website.background.attached?
1010
= f.label :background, "Current Background", class: "control-label"
1111
%div
12-
= image_tag(website.background)
12+
= image_tag(website.background, width: "200px")
1313
= f.input :background,
1414
label: website.background.attached? ? "Replace Background" : "Background"
1515
= f.input :city

0 commit comments

Comments
 (0)