houdini/app/views/nonprofits/custom_campaign_layouts/safety_around_water.html.erb

<%= content_for(:title_prefix) { "#{@campaign.name} - #{@campaign.nonprofit.name} | ".html_safe } %>
<% content_for(:fixed_position_cta_hidden) {'hidden'} %>
<%= content_for(:meta_description) {raw @campaign.summary} %>
<% @brand_color = @nonprofit.brand_color ? @nonprofit.brand_color : nil %>

<%= content_for :javascripts do %>
	<script>
		app.campaign_id = <%= @campaign.id %>
    app.campaign = <%= raw(@campaign.to_json) %>
		app.header_image_url = '<%= @campaign_background_image %>'
    app.campaign_end_datetime = '<%= @campaign.end_datetime %>'
		app.timezone = '<%= @timezone %>'
    app.end_date_time = app.campaign_end_datetime
    app.hide_activities = <%= @campaign.hide_activity_feed %>
		app.days_remaining = '<%= @campaign.days_left %>'
		app.recurring_fund = <%= @campaign.recurring_fund? %>
    app.vimeo_id = "<%= @campaign.vimeo_video_id ? @campaign.vimeo_video_id : '' %>"
		app.current_campaign_editor = <%= current_campaign_editor? %>
		appl.def('has_video', <%= @campaign.video_url.present? %>)
    appl.def('campaign_is_deleted', <%= @campaign.deleted || false %>)
		appl.def('has_main_image', <%= @campaign.main_image.file.present? %>)
	</script>
  <%= render 'schema', campaign: @campaign, url: @url %>
	<%= render 'common/froala' if current_campaign_editor? %>

	<%= IncludeAsset.js '/client/js/campaigns/show/page.js' %>
<% end %>

<%= content_for :stylesheets do %>
	<%= stylesheet_link_tag 'campaigns/show/page' %>
	<%= stylesheet_link_tag 'campaigns/edit/page' %>
  <%= stylesheet_link_tag 'campaigns/custom_layout/safety_around_water' %>
  <style>
    .force-
    .ios-force-absolute-positioning {
      position: absolute !important;
    }
  </style>
<% end %>

<% content_for :head do %>
	<link rel="canonical" href='<%= @url %>' />
<% end %>

<%= content_for :facebook_tags do %>
	<meta property="og:title" content="<%= raw @campaign.name %>">
	<meta property="og:description" content="<%= @campaign.summary.present? ? raw(@campaign.summary) : raw(@campaign.name) %>">
	<meta property="og:image" content="<%= @campaign.main_image_url(:normal) %>">
<% end %>

<%= content_for :twitter_tags do %>
	<meta property="twitter:title" content="<%= raw @campaign.name %>">
	<meta property="twitter:description" content="<%= raw @campaign.summary %>">
	<meta property="twitter:image" content="<%= @campaign.main_image_url(:normal) %>">
<% end %>

<% if current_campaign_editor? %>
  <%= render 'admin_top_nav' %>
<% end %>

<%= render '/components/trial_bar' if QueryBillingSubscriptions.currently_in_trial?(@nonprofit.id) %>

<% hide_title = @campaign.hide_title && @campaign_background_image ? true : false %>
<% css_style = current_campaign_editor? ? "style='margin-top: 0'" : '' %>

<div class='ymca-banner'></div>

<main class="custom-campaign-layout" id="safety-around-water">

  <%= render 'components/fundraising_pages/header',
  	image_url: @campaign_background_image,
  	is_editor: current_campaign_editor?,
  	hide_title:  @campaign.hide_title && @campaign_background_image,
  	header_content_partial: 'header_content' %>

  <%= render 'components/preview_mode_notification' %>

  <div class="container <%=  @brand_color ? 'is-branded' : '' %>" data-id='<%= @campaign.id %>'>
    <section class='box'>
    	<%= render 'campaign_media' %>
    </section>

  	<section class='box-r'>

      <% if current_campaign_editor? %>
        <!-- Campaign editor gift option management modal -->
        <button class='button edit u-width--full u-marginBottom--15'>
          <!--= on 'click' (open_modal 'manageGiftOptionsModal') -->
          <i class='fa fa-gift'></i> Manage Gift Options
        </button>
      <% end %>

      <!-- flimflam gift options javascript gets rendered into this div: -->
      <div class='ff-sidebar'></div>

  		<aside class='u-marginTop--15 pastelBox--grey'>
  			<header>Promote This Campaign</header>
  			<div class='pastelBox-body'>
  				<%= render 'common/social_buttons' %>
  			</div>
  		</aside>

  	</section>

    <section class='box'>

      <section class="campaigner-profile">
        <figure>
          <div class="avatar">
            <img src=<%= @campaign.profile.get_profile_picture %> />
          </div>
          <figcaption>
            <p><%= @campaign.profile.name %></p>
            <p><%= @campaign.profile.city %></p>
          </figcaption>
        </figure>

        <section class='u-marginTop--15 u-marginBottom--15 pastelBox--grey'>
          <header>I am supporting the Y because…</header>
          <div class='pastelBox-body'>
            (customizable reason)
          </div>

          <% unless current_campaign_editor? %>
            <a class='button u-width--full' target='_blank' if-branded='background-color, dark' href='/peer-to-peer?campaign_id=<%= @campaign.id %>'>
              Start Your Own Campaign for <%= @nonprofit.name %>
            </a>
          <% end %>
        </section>
      </section>
    </section>

  	<section class='box'>
      <h1><%= @campaign.name %></h1>

  		<div id='js-campaignBody' class='editable' data-path='/nonprofits/<%= @nonprofit.id %>/campaigns/<%= @campaign.id %>.json' data-key='campaign[body]'>
  			<%= raw @campaign.body %>
  		</div>

  		<% unless @campaign.hide_activity_feed %>
  			<div class='u-marginTop--15 showWhenMobile'>
  				<%= render 'components/activity_feed' %>
  			</div>
  		<% end %>
  	</section>
  </div>
</main>

<% if current_campaign_editor? %>
	<%= render 'settings_modal' %>
	<%= render 'video_modal' %>
	<%= render 'donations/campaign_new_offline_modal' %>
	<%= render 'campaign_gift_options/manage_modal'%>
	<%= render 'campaign_gift_options/form_modal'%>
	<%= render 'components/upload_background_image',
		end_point: "/nonprofits/#{@nonprofit.id}/campaigns/#{@campaign.id}",
		image_url: @campaign_background_image,
		input_name: 'campaign[background_image]' %>
  <%= render 'components/custom_receipt_modal',
    title: 'Campaign Receipt Message',
    type: 'campaign',
    path: nonprofit_campaign_path(@nonprofit, @campaign),
    key: 'campaign[receipt_message]',
    text: @campaign.receipt_message %>
  <%= render 'components/duplicate_fundraiser_modal', type: 'campaign' %>
<% end %>

<%= render 'components/share_modal', name: @campaign.name, type: 'campaign' %>
<%= render 'common/email_share_modal', fundraiser: @campaign.name, fundraiser_url: @url  %>