resilient-labs / new-view-media

New View Media Jekyll Forestry Build

new-view-media

New View Media Jekyll Forestry Build

Data

/new-view-media/_data

• include any yml/json files here

Layouts

/new-view-media/_layouts

• include any page layouts, the default.html will hold all of our includes for a single page website

Includes

/new-view-media/_includes

• include html snippet includes here, use data from _data files and loop through

Running Locally

1. initiate the vagrant environment

vagrant up

2. jump into the vagrant environment

vagrant ssh

3. once in the vagrant environment, change into the directory below

cd /vagrant/new-view-media

4. run the bundle installer

bundle install

5. serve the files on the localhost and open in the browser at localhost:4000/

jekyll serve --host 0.0.0.0 --watch

new-view-media's Issues

Sticky Header

Top Navigation Stays with user as they scroll down the page

Contact Static Jekyll Layout

Background Video Hero Section

Footer Include

Testimonial 3 Video Containers

Under scrolling text testimonials, have three blocks for videos of specific clients (maybe modal
so the user can see all the content for those three clients)

Page.html _Layout

Get all content from Tom

Section with About Tom Dodge row and 2 Process rows

Forestry set up with Resilient-Labs/new-view-media repo

Add in real Portfolio data from Tom

Link CSS/JS/Dependencies in Head Include

Jekyll Install

Background Video behind Contact Form

Wants background video behind the form

Style the Collaborators Section

Default.html _Layout

Portfolio Dynamic Layout & portfolio YAMF Front Matter defaults

Our Process Include

Adding all CSS files to Jekyll Build

Formspree integration on Contact

config yml set up

Client Testimonials Section

Our History Row Section HTML

Filter Function in Portfolio

Single Pane Full Width for Collaborators

Single pane for each collaborator taking up the entire width of the page with fewer collaborators

Footer Include

Our Collaborators section with profile image, name and short sentence

Nav Menu HTML & CSS

The nav menu will link to different sections of this Single Page Template

Jekyll Environment Set up

Testimonial Carousel

Portfolio Card CSS

Use .card-portfolio class !

Our History Include

Hero Includes

Head Include

Portfolio Section

Post.html _Layout

Collaborators Section

Service Modal JS

When the user clicks on a specific service, it should open a modal with that information, video,
or content.

Our Process Row Section HTML

Who do we like to work with row section HTML

Footer HTML

Contact Form Section

Header Include

Fully Responsive Portfolio Section CSS

Portfolio HTML

Client Testimonials Slider

what we do section include (gradient)

Contact Include

Testimonial Dynamic Layout & testimonial YAMF Front Matter defaults

Our Package Gradient Row

Show question and description when opening Video Modal