<section class="flex h-64 hero-banner p-4">
  <section class="flex items-center mx-auto">
    <h2 class="uppercase">
      <%= @course.title %>
    </h2>
  </section>
</section>

<section class="pt-4 px-4">
  <section class="w-full">
    <section class="rounded overflow-hidden shadow">
      <section style="padding: 56.25% 0 0 0; position: relative;">
        <iframe src="https://player.vimeo.com/video/<%= @course.trailer %>" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%;" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
      </section>
    </section>
  </section>

  <section class="flex flex-wrap -mx-4">
    <section class="w-full lg:w-3/4 p-4">
      <section class="bg-grey-lightest shadow text-grey-darker p-4">
        <h2 class="font-normal mb-4">Course description</h2>
        <p class="font-normal whitespace-pre-wrap"><%= @course.description %></p>
      </section>
    </section>
    <section class="w-full lg:w-1/4 p-4">
      <section class="bg-grey-lightest shadow text-grey-darker p-4 mb-4">
        <h3 class="font-normal mb-4">Course Price</h3>
        <p class="font-bold text-3xl text-green">£<%= @course.price %></p>
      </section>

      <%= button_to "Buy now", "#", class: "bg-blue hover:bg-blue-dark w-full text-white font-semibold py-3 px-4 border-2 rounded-sm border-blue-dark shadow outline-none" %>

      <section class="bg-grey-lightest shadow text-grey-darker py-4 px-4 mt-4">
        <h3 class="font-normal mb-4">Course Modules</h3>
          <% @course_modules.each do |course_module| %>
            <section class="py-2 border-b-2 border-light modules">
              <%= course_module.title %>
            </section>
        <% end %>
      </section>
    </section>
  </section>
</section>

def show
  @course_modules = CourseModule.all
end

class Course < ApplicationRecord
  has_many :course_modules

  validates :title, :summary, :description, :trailer, :price, presence: true
end

class CourseModule < ApplicationRecord
  belongs_to :course
end

create_table "course_modules", force: :cascade do |t|
    t.string "title"
    t.integer "course_id"
    t.datetime "created_at", null: false
    t.datetime "updated_at", null: false
    t.index ["course_id"], name: "index_course_modules_on_course_id"
  end

  create_table "courses", force: :cascade do |t|
    t.string "title"
    t.text "summary"
    t.text "description"
    t.string "trailer"
    t.integer "price"
    t.datetime "created_at", null: false
    t.datetime "updated_at", null: false
  end