Settings

Base

Components

Patterns

FRONT-END STYLE GUIDE

Settings
Colors and sizes.

COLORS
PRIMARY
#F7323F

DARKEN PRIMARY
#D12A35

DARK
#000

DARKEN BLACK
#1C1C1C

LIGHT GREY
#F4F4F4

DARK GREY
#EBEBEB

ERROR COLOR
#FFEDEE

SIZES
BREAKPOINTS

Mobile: 320px - 479px

Phablet: 480px - 599px
Small Tablet: 600px - 719px
Tablet: 720px - 1023px

http://localhost/style-guide/[6/26/16, 3:54:43 PM]

Laptop: 1024px - 1159px

Desktop: 1160px - 1339px
Wide: > 1340px

Base
Your base elements are text and form items.

HEADINGS
H1-H4 tags.
Colors can be specified by adding the dark, white, or primary class names.

HEADING 1

SUBTITLE

PARAGRAPHS

Body Copy
Sub-Copy

SMALL TEXT

BUTTONS
DEFAULT SIZE

DEFAULT

APPLY NOW
Apply
Now

APPLY NOW
Apply
Now
FULL WIDTH

DARK

APPLY NOW

http://localhost/style-guide/[6/26/16, 3:54:43 PM]

APPLY NOW

Apply Now

Apply Now

FILTER LIST

HOLLOW

CLASS VIEW
Class
View

APPLY NOW
Apply
Now
HOLLOW DARK

APPLY NOW
Apply
Now

CHECKBOXES/RADIOS
CHECKBOX
WRITER

CHECKBOX CHECKED

CHECKBOX ERROR CHECKED

WRITER

INPUTS
INPUT
EMAIL *

example@test.co
INPUT ERROR
EMAIL *

jane@test.co
INPUT DISABLED
EMAIL *

jane@test.co

http://localhost/style-guide/[6/26/16, 3:54:43 PM]

WRITER

CHECKBOX ERROR
WRITER

INPUT DISABLED ERROR

EMAIL *

jane@test.co

ICONS

Components
Components are groups of base elements that usually have some sort of functionality
associated with it.

MAIN PAGE BANNER

Must follow the Header pattern as a sibling component.
The 'margin-top' property is adjusted to match the Header's height when responding

http://localhost/style-guide/[6/26/16, 3:54:43 PM]

CELEBRATING 40 YEARS OF CULINARY

EXCELLENCE
APPLY NOW

PAGE BANNER SUB (MODIDIED)

Must follow the Header pattern as a sibling component.
The 'margin-top' property is adjusted to match the Header's height when responding

ABOUT

HEADER SUB NAVIGATION BAR

Child element inside Header pattern
Shows only on Academic and Admission pages
Window must be > 720px

http://localhost/style-guide/[6/26/16, 3:54:43 PM]

OVERVIEW

CULINARY

PASTRY

FACULTY

FOOTER CTA
FOOTER CTA #1

NOT SURE YOU CAN AFFORD

SCHOOL?
Dont let money stand between you and your career goals. Contact our enrollment and fnancial aid team at
800-664-CHEF or enrollment@lacademie.com.

LEARN MORE ABOUT FINANCIAL AID

FOOTER CTA #2

BECOME A GREAT CHEF

EARN THE HAT

APPLY NOW

http://localhost/style-guide/[6/26/16, 3:54:43 PM]

VETERAN

Culinary Arts, 2012

Military Service: U.S. Marine Corps
Apprenticeship: Magnolias at the Mill

FACULTY FILTER
FILTER

REQUIRMENT
Application for Admission
$50 Application fee

500 word personal statement explaining your

career goals and why you wish to attend culinary
school
Current Resume

One letter of recommendation (professional or

educational, signed, with contact information)

JOB

Private golf club in the suburbs Montgomery County, seeks an

http://localhost/style-guide/[6/26/16, 3:54:43 PM]


Restaurant:

Roses Luxury

Location:

Washington, DC

experienced, full-time sous chef for a members-only fne

dining, bar, grill, and banquet services that serves breakfast,
lunch and dinner.

Minimum of 5 years previous sous chef experience required and

2+ years management experience with a culinary degree

Published:

preferred. Wages are commensurate with experience. Possess

May 8 2016

strong leadership, communications, organization and

motivational skills. Spanish helpful. Must be willing to work

APPLY ONLINE

weekends and some holidays. Flexibility with schedule

mandatory. Workplace is smoke-free.

Please email resume and cover letter to

kristinconforti@fourstreams.com.

JOB BOARD LABELS

JOB POSTINGS

LOCATION

DATE

JOB BOARD ITEMS

Roses Luxury

Washington, DC

May 8

Washington, DC

May 8

Washington, DC

May 8

HEAD CHEF

Roses Luxury
HEAD CHEF

Roses Luxury
HEAD CHEF

http://localhost/style-guide/[6/26/16, 3:54:43 PM]

Roses Luxury

Washington, DC

HEAD CHEF

FACULTY MEMBER
FACULTY MEMBER

CULINARY
INSTRUCTOR

CHEF MICHEL
PRADLER

Chef Michel has been a chef for over 30 years

cooking at some of Washingtons fnest
restaurants. For over twenty years he was

FACULTY MEMBER HEAD (MODIFIED)

http://localhost/style-guide/[6/26/16, 3:54:43 PM]

May 8

FOUNDER &
DIRECTOR

CHEF FRANCOIS
DIONOT

A native of Reims, France, Chef Dionot was educated at LEcole Hoteliere de la Societe Suisse de
Hoteliers in Lausanne, Switzerland, where he earned a diploma in hotel and restaurant service,
management and all phases of food preparation. Chef Dionot then worked in several, highly
acclaimed kitchens in Switzerland, France, Washington, D.C. and New York. He remains an integral
part of LADC, handling day-to-day operations as school director and instructor for the theoretical
portions of the schools professional programs. He also teaches avocational French cuisine classes,
conducts master classes on specialized food subjects around the country and serves as a food
consultant for various professional groups.

PROGRAM INFO

Culinary Arts Daytime Programs - 50 weeks

March 28, 2016
July 2016
September 2016
Culinary Arts Evening Program - 62 weeks
October, 2016

TESTIMONIAL

http://localhost/style-guide/[6/26/16, 3:54:43 PM]

You learn from professionals, people who have actually worked in

restaurantsI have a sense of confdence that I think I got from
L'Academie de Cuisine and no one can take that away from me. Im so
proud.
Carla Hall, L'Academie de Cuisine Alumna, 1996

FAQ
Will I be a Chef when I graduate?
Does LADC only teach French cooking?

FOOTER

FAQ

CONTACT US

BLOG

Patterns
Patterns are larger pieces of the UI usually composed of both base elements and
components.

HEADER

http://localhost/style-guide/[6/26/16, 3:54:43 PM]

http://localhost/style-guide/[6/26/16, 3:54:43 PM]