From bd9a50e9c824e89d8a91fd54c8bc838cdfa796f6 Mon Sep 17 00:00:00 2001 From: Darin Dimitroff Date: Sun, 1 Jan 2017 16:39:14 +0200 Subject: Initial commit --- gulpfile.babel.js | 24 +- package.json | 4 + site/content/about.md | 5 + site/content/contact.md | 5 + site/content/post/brewing-chemex.md | 18 + site/content/post/jamaica-blue.md | 20 ++ site/content/post/making-sense.md | 18 + site/content/products.md | 5 + site/layouts/_default/li.html | 3 + site/layouts/_default/single.html | 5 + site/layouts/about/single.html | 16 + site/layouts/contact/single.html | 60 ++++ site/layouts/index.html | 12 +- site/layouts/indexes/post.html | 16 + site/layouts/partials/2-up.html | 24 ++ site/layouts/partials/4-up.html | 36 ++ site/layouts/partials/about.html | 21 ++ site/layouts/partials/blockquote.html | 6 + site/layouts/partials/blog.html | 22 ++ site/layouts/partials/footer.html | 56 +++ site/layouts/partials/header.html | 7 +- site/layouts/partials/image-grid.html | 17 + site/layouts/partials/jumbotron.html | 18 + site/layouts/partials/media-block-reverse.html | 12 + site/layouts/partials/media-block.html | 12 + site/layouts/partials/nav.html | 12 + site/layouts/partials/pricing-card.html | 27 ++ site/layouts/partials/short-text.html | 6 + site/layouts/partials/social-icon.html | 7 + site/layouts/partials/svg.html | 5 + site/layouts/partials/table.html | 25 ++ site/layouts/post/li.html | 6 + site/layouts/post/list.html | 14 + site/layouts/post/single.html | 13 + site/layouts/products/single.html | 29 ++ site/static/admin/config.yml | 26 ++ site/static/admin/index.html | 19 + site/static/img/about/direct-sourcing.jpg | Bin 0 -> 194683 bytes site/static/img/about/jumbotron.jpg | Bin 0 -> 167854 bytes site/static/img/about/reinvest-profits.jpg | Bin 0 -> 161713 bytes site/static/img/about/shade-grown.jpg | Bin 0 -> 108493 bytes site/static/img/about/single-origin.jpg | Bin 0 -> 116457 bytes site/static/img/about/sustainable-farming.jpg | Bin 0 -> 196653 bytes site/static/img/blog posts/chemex.jpg | Bin 0 -> 146657 bytes site/static/img/blog posts/flavor wheel.jpg | Bin 0 -> 60110 bytes site/static/img/blog-index.jpg | Bin 0 -> 164829 bytes site/static/img/home/about-section.jpg | Bin 0 -> 196603 bytes site/static/img/home/jumbotron.jpg | Bin 0 -> 141447 bytes site/static/img/icon.svg | 42 +++ site/static/img/icons/500px.svg | 1 + site/static/img/icons/Airbnb.svg | 1 + site/static/img/icons/Amazon.svg | 1 + site/static/img/icons/Facebook.svg | 1 + site/static/img/illustrations/coffee-gear.svg | 1 + site/static/img/illustrations/coffee.svg | 1 + site/static/img/illustrations/meeting-space.svg | 1 + site/static/img/illustrations/tutorials.svg | 1 + site/static/img/logo.svg | 1 + site/static/img/products/jumbotron.jpg | Bin 0 -> 136554 bytes site/static/img/products/products-full-width.jpg | Bin 0 -> 217443 bytes site/static/img/products/products-grid1.jpg | Bin 0 -> 329208 bytes site/static/img/products/products-grid2.jpg | Bin 0 -> 166193 bytes site/static/img/products/products-grid3.jpg | Bin 0 -> 149603 bytes src/css/imports/_border-colors.css | 103 ++---- src/css/imports/_border-radius.css | 24 +- src/css/imports/_buttons.css | 13 + src/css/imports/_cms.css | 13 + src/css/imports/_colors.css | 162 +++++---- src/css/imports/_font-family.css | 3 +- src/css/imports/_forms.css | 66 +++- src/css/imports/_hovers.css | 71 +--- src/css/imports/_links.css | 3 +- src/css/imports/_media-queries.css | 35 +- src/css/imports/_normalize.css | 422 ----------------------- src/css/imports/_reset.css | 67 ++++ src/css/imports/_spacing.css | 18 +- src/css/imports/_styles.css | 3 + src/css/imports/_svg.css | 7 + src/css/imports/_type-scale.css | 19 + src/css/imports/_typography.css | 7 +- src/css/imports/_utilities.css | 21 ++ src/css/imports/_variables.css | 3 + src/css/main.css | 15 +- src/site/static/img/icons/svg.html | 0 84 files changed, 1059 insertions(+), 698 deletions(-) create mode 100644 site/content/about.md create mode 100644 site/content/contact.md create mode 100644 site/content/post/brewing-chemex.md create mode 100644 site/content/post/jamaica-blue.md create mode 100644 site/content/post/making-sense.md create mode 100644 site/content/products.md create mode 100644 site/layouts/_default/li.html create mode 100644 site/layouts/_default/single.html create mode 100644 site/layouts/about/single.html create mode 100644 site/layouts/contact/single.html create mode 100644 site/layouts/indexes/post.html create mode 100644 site/layouts/partials/2-up.html create mode 100644 site/layouts/partials/4-up.html create mode 100644 site/layouts/partials/about.html create mode 100644 site/layouts/partials/blockquote.html create mode 100644 site/layouts/partials/blog.html create mode 100644 site/layouts/partials/image-grid.html create mode 100644 site/layouts/partials/jumbotron.html create mode 100644 site/layouts/partials/media-block-reverse.html create mode 100644 site/layouts/partials/media-block.html create mode 100644 site/layouts/partials/nav.html create mode 100644 site/layouts/partials/pricing-card.html create mode 100644 site/layouts/partials/short-text.html create mode 100644 site/layouts/partials/social-icon.html create mode 100644 site/layouts/partials/svg.html create mode 100644 site/layouts/partials/table.html create mode 100644 site/layouts/post/li.html create mode 100644 site/layouts/post/list.html create mode 100644 site/layouts/post/single.html create mode 100644 site/layouts/products/single.html create mode 100644 site/static/admin/config.yml create mode 100644 site/static/admin/index.html create mode 100755 site/static/img/about/direct-sourcing.jpg create mode 100644 site/static/img/about/jumbotron.jpg create mode 100755 site/static/img/about/reinvest-profits.jpg create mode 100755 site/static/img/about/shade-grown.jpg create mode 100755 site/static/img/about/single-origin.jpg create mode 100755 site/static/img/about/sustainable-farming.jpg create mode 100755 site/static/img/blog posts/chemex.jpg create mode 100755 site/static/img/blog posts/flavor wheel.jpg create mode 100755 site/static/img/blog-index.jpg create mode 100755 site/static/img/home/about-section.jpg create mode 100644 site/static/img/home/jumbotron.jpg create mode 100644 site/static/img/icon.svg create mode 100644 site/static/img/icons/500px.svg create mode 100644 site/static/img/icons/Airbnb.svg create mode 100644 site/static/img/icons/Amazon.svg create mode 100644 site/static/img/icons/Facebook.svg create mode 100644 site/static/img/illustrations/coffee-gear.svg create mode 100644 site/static/img/illustrations/coffee.svg create mode 100644 site/static/img/illustrations/meeting-space.svg create mode 100644 site/static/img/illustrations/tutorials.svg create mode 100644 site/static/img/logo.svg create mode 100755 site/static/img/products/jumbotron.jpg create mode 100644 site/static/img/products/products-full-width.jpg create mode 100755 site/static/img/products/products-grid1.jpg create mode 100755 site/static/img/products/products-grid2.jpg create mode 100755 site/static/img/products/products-grid3.jpg create mode 100644 src/css/imports/_buttons.css create mode 100644 src/css/imports/_cms.css delete mode 100755 src/css/imports/_normalize.css create mode 100755 src/css/imports/_reset.css create mode 100644 src/css/imports/_svg.css create mode 100644 src/css/imports/_variables.css create mode 100644 src/site/static/img/icons/svg.html diff --git a/gulpfile.babel.js b/gulpfile.babel.js index 8aafe62..fd93ae4 100644 --- a/gulpfile.babel.js +++ b/gulpfile.babel.js @@ -7,6 +7,9 @@ import cssnext from "postcss-cssnext"; import BrowserSync from "browser-sync"; import webpack from "webpack"; import webpackConfig from "./webpack.conf"; +import svgstore from "gulp-svgstore"; +import svgmin from "gulp-svgmin"; +import inject from "gulp-inject"; const browserSync = BrowserSync.create(); const hugoBin = "hugo"; @@ -39,7 +42,24 @@ gulp.task("js", (cb) => { }); }); -gulp.task("server", ["hugo", "css", "js"], () => { +gulp.task('svg', () => { + const svgs = gulp + .src('site/static/img/icons/*.svg') + .pipe(svgmin()) + .pipe(svgstore({ inlineSvg: true })); + + function fileContents(filePath, file) { + return file.contents.toString(); + } + + return gulp + .src('site/layouts/partials/svg.html') + .pipe(inject(svgs, { transform: fileContents })) + .pipe(gulp.dest('site/layouts/partials/')); + browserSync.reload(); +}); + +gulp.task("server", ["hugo", "css", "js", "svg"], () => { browserSync.init({ server: { baseDir: "./dist" @@ -55,7 +75,7 @@ function buildSite(cb, options) { return cp.spawn(hugoBin, args, {stdio: "inherit"}).on("close", (code) => { if (code === 0) { - browserSync.reload(); + browserSync.reload("notify:false"); cb(); } else { browserSync.notify("Hugo build failed :("); diff --git a/package.json b/package.json index f82f02b..82c6bfb 100644 --- a/package.json +++ b/package.json @@ -40,5 +40,9 @@ "url-loader": "^0.5.7", "webpack": "^1.13.1", "whatwg-fetch": "^1.0.0" + }, + "devDependencies": { + "gulp-svgstore": "^6.1.0", + "svg-sprite-loader": "^0.1.2" } } diff --git a/site/content/about.md b/site/content/about.md new file mode 100644 index 0000000..df221a8 --- /dev/null +++ b/site/content/about.md @@ -0,0 +1,5 @@ ++++ +title = "Another Hugo Post" +type = "about" +page="/about.html" ++++ diff --git a/site/content/contact.md b/site/content/contact.md new file mode 100644 index 0000000..d0e0e10 --- /dev/null +++ b/site/content/contact.md @@ -0,0 +1,5 @@ ++++ +title = "Another Hugo Post" +type = "contact" +page="/contact.html" ++++ diff --git a/site/content/post/brewing-chemex.md b/site/content/post/brewing-chemex.md new file mode 100644 index 0000000..ba0ac68 --- /dev/null +++ b/site/content/post/brewing-chemex.md @@ -0,0 +1,18 @@ ++++ +title = "A beginners’ guide to brewing with Chemex" +type = "post" ++++ + +Brewing with a Chemex probably seems like a complicated, time-consuming ordeal, but once you get used to the process, it becomes a soothing ritual that’s worth the effort every time. + + + +This [week](/wdwdw) we’ll take a look at all the steps required to make astonishing coffee with a Chemex at home. The Chemex Coffeemaker is a manual, pour-over style glass-container coffeemaker that Peter Schlumbohm invented in 1941, and which continues to be manufactured by the Chemex Corporation in Chicopee, Massachusetts. + +In 1958, designers at the Illinois Institute of Technology said that the Chemex Coffeemaker is "one of the best-designed products of modern times", and so is included in the collection of the Museum of Modern Art in New York City. + +The Chemex Coffeemaker consists of an hourglass-shaped glass flask with a conical funnel-like neck (rather than the cylindrical neck of an Erlenmeyer flask) and uses proprietary filters, made of bonded paper (thicker-gauge paper than the standard paper filters for a drip-method coffeemaker) that removes most of the coffee oils, brewing coffee with a taste that is different than coffee brewed in other coffee-making systems; also, the thicker paper of the Chemex coffee filters may assist in removing cafestol, a cholesterol-containing compound found in coffee oils. + +The most visually distinctive feature of the Chemex is the heatproof wooden collar around the neck, allowing it to be handled and poured when full of hot water. This is turned, then split in two to allow it to fit around the glass neck. The two pieces are held loosely in place by a tied leather thong. The pieces are not tied tightly and can still move slightly, retained by the shape of the conical glass. + +For a design piece that became popular post-war at a time of Modernism and precision manufacture, this juxtaposition of natural wood and the organic nature of a hand-tied knot with the laboratory nature of glassware was a distinctive feature of its appearance. diff --git a/site/content/post/jamaica-blue.md b/site/content/post/jamaica-blue.md new file mode 100644 index 0000000..7d932ae --- /dev/null +++ b/site/content/post/jamaica-blue.md @@ -0,0 +1,20 @@ ++++ +title = "Just in: small batch of Jamaica Blue Mountain in store next week" +type = "post" ++++ + +We’re proud to announce that we’ll be offering a small batch of Jamaica Blue Mountain coffee beans in our store next week. + + + +We expect the shipment of a limited quantity of green beans next Monday. We’ll be offering the roasted beans from Tuesday, but quantities are limited, so be quick. + +Blue Mountain Peak is the highest mountain in Jamaica and one of the highest peaks in the Caribbean at 7,402 ft. It is the home of Blue Mountain coffee and their famous tours. It is located on the border of the Portland and Saint Thomas parishes of Jamaica. + +The Blue Mountains are considered by many to be a hiker's and camper's paradise. The traditional Blue Mountain trek is a 7-mile hike to the peak and consists of a 3,000-foot increase in elevation. Jamaicans prefer to reach the peak at sunrise, thus the 3–4 hour hike is usually undertaken in darkness. Since the sky is usually very clear in the mornings, Cuba can be seen in the distance. Some of the plants found on the Blue Mountain cannot be found anywhere else in the world and they are often of a dwarfed sort. This is mainly due to the cold climate which inhibits growth. The small coffee farming communities of Claverty Cottage and Hagley Gap are located near the peak. + +Jamaican Blue Mountain Coffee or Jamaica Blue Mountain Coffee is a classification of coffee grown in the Blue Mountains of Jamaica. The best lots of Blue Mountain coffee are noted for their mild flavor and lack of bitterness. Over the past few decades, this coffee has developed a reputation that has made it one of the most expensive and sought-after coffees in the world. Over 80% of all Jamaican Blue Mountain Coffee is exported to Japan.[1] In addition to its use for brewed coffee, the beans are the flavor base of Tia Maria coffee liqueur. + +Jamaican Blue Mountain Coffee is a globally protected certification mark, meaning only coffee certified by the Coffee Industry Board of Jamaica can be labeled as such. It comes from a recognized growing region in the Blue Mountain region of Jamaica, and its cultivation is monitored by the Coffee Industry Board of Jamaica. + +The Blue Mountains are generally located between Kingston to the south and Port Antonio to the north. Rising 7,402 ft, they are some of the highest mountains in the Caribbean. The climate of the region is cool and misty with high rainfall. The soil is rich, with excellent drainage. This combination of climate and soil is considered ideal for coffee. diff --git a/site/content/post/making-sense.md b/site/content/post/making-sense.md new file mode 100644 index 0000000..eb788b7 --- /dev/null +++ b/site/content/post/making-sense.md @@ -0,0 +1,18 @@ ++++ +title = "Making sense of the SCAA’s new Flavor Wheel" +type = "post" ++++ + +The Coffee Taster’s Flavor Wheel, the official resource used by coffee tasters, has been revised for the first time this year. + + + +The SCAA updated the wheel to reflect the finer nuances needed to describe flavors more precisely. The new descriptions are more detailed and hence allow cuppers to distinguish between more flavors. + +While this is going to be a big change for professional coffee tasters, it means a lot to you as a consumer as well. We’ll explain how the wheel came to be, how pros use it and what the flavors actually mean. + +The Specialty Coffee Association of America (SCAA), founded in 1982, is a non-profit trade organization for the specialty coffee industry. With members located in more than 40 countries, SCAA represents every segment of the specialty coffee industry, including producers, roasters, importers/exporters, retailers, manufacturers, baristas and other industry professionals. For over 30 years, SCAA has been dedicated to creating a vibrant specialty coffee community by recognizing, developing and promoting specialty coffee. SCAA sets and maintains quality standards for the industry, conducts market research, and provides education, training, resources, and business services for its members. + +Coffee cupping, or coffee tasting, is the practice of observing the tastes and aromas of brewed coffee. It is a professional practice but can be done informally by anyone or by professionals known as "Q Graders". A standard coffee cupping procedure involves deeply sniffing the coffee, then loudly slurping the coffee so it spreads to the back of the tongue. + +The coffee taster attempts to measure aspects of the coffee's taste, specifically the body (the texture or mouthfeel, such as oiliness), sweetness, acidity (a sharp and tangy feeling, like when biting into an orange), flavour (the characters in the cup), and aftertaste. Since coffee beans embody telltale flavours from the region where they were grown, cuppers may attempt to identify the coffee's origin. diff --git a/site/content/products.md b/site/content/products.md new file mode 100644 index 0000000..1f41f10 --- /dev/null +++ b/site/content/products.md @@ -0,0 +1,5 @@ ++++ +title = "Another Hugo Post" +type = "products" +page="/products.html" ++++ diff --git a/site/layouts/_default/li.html b/site/layouts/_default/li.html new file mode 100644 index 0000000..d521ea0 --- /dev/null +++ b/site/layouts/_default/li.html @@ -0,0 +1,3 @@ +
  • + Hello +
  • diff --git a/site/layouts/_default/single.html b/site/layouts/_default/single.html new file mode 100644 index 0000000..124e30d --- /dev/null +++ b/site/layouts/_default/single.html @@ -0,0 +1,5 @@ +{{ partial "header" . }} +{{ partial "nav" . }} +{{ partial "jumbotron" (dict "imageUrl" "/img/7.jpg" "title" "This is where the heading goes" "subtitle" "This is where the subtitle goes") }} + {{ .Content }} +{{ partial "footer" . }} diff --git a/site/layouts/about/single.html b/site/layouts/about/single.html new file mode 100644 index 0000000..ddcdd5f --- /dev/null +++ b/site/layouts/about/single.html @@ -0,0 +1,16 @@ +{{ partial "header" . }} +{{ partial "nav" . }} +{{ partial "jumbotron" (dict "imageUrl" "/img/about/jumbotron.jpg" "title" "About us" "subtitle" "Our values") }} + +
    + + {{ partial "media-block" (dict "heading" "Shade-grown coffee" "text" "Coffee is a small tree or shrub that grows in the forest understory in its wild form, and traditionally was grown commercially under other trees that provided shade. The forest-like structure of shade coffee farms provides habitat for a great number of migratory and resident species." "imageUrl" "/img/about/direct-sourcing.jpg") }} + + {{ partial "media-block-reverse" (dict "heading" "Shade-grown coffee" "text" "Coffee is a small tree or shrub that grows in the forest understory in its wild form, and traditionally was grown commercially under other trees that provided shade. The forest-like structure of shade coffee farms provides habitat for a great number of migratory and resident species." "imageUrl" "/img/about/reinvest-profits.jpg") }} + + {{ partial "media-block" (dict "heading" "Shade-grown coffee" "text" "Coffee is a small tree or shrub that grows in the forest understory in its wild form, and traditionally was grown commercially under other trees that provided shade. The forest-like structure of shade coffee farms provides habitat for a great number of migratory and resident species." "imageUrl" "/img/about/shade-grown.jpg") }} + + {{ partial "media-block-reverse" (dict "heading" "Shade-grown coffee" "text" "Coffee is a small tree or shrub that grows in the forest understory in its wild form, and traditionally was grown commercially under other trees that provided shade. The forest-like structure of shade coffee farms provides habitat for a great number of migratory and resident species." "imageUrl" "/img/about/single-origin.jpg") }} +
    + +{{ partial "footer" . }} diff --git a/site/layouts/contact/single.html b/site/layouts/contact/single.html new file mode 100644 index 0000000..e98f8d1 --- /dev/null +++ b/site/layouts/contact/single.html @@ -0,0 +1,60 @@ +{{ partial "header" . }} + +{{ partial "nav" . }} + +
    +
    + +

    We’d love to get in touch with you and hear your ideas and questions. We strive to grow and improve constantly and your feedback is valuable for us.

    +

    How can I get…?

    +

    You can also use the form below for any inquiries about coffee availability, monthly subscriptions and scheduling a 1-on-1 session with our baristas. Don’t be shy, drop us a line!

    + +
    +
    +

    Location

    +

    3153 Lynn Avenue, South San Francisco, California 94080

    +
    + +
    +

    Working hours

    +

    Monday – Saturday: 9AM – 7PM We’re closed on Sundays

    +
    +
    + + +
    +

    Drop us a line below

    + +
    +
    + +
    +
    + + +
    +
    + +
    +
    + + +
    +
    +
    + + +
    + + +
    + +
    + +
    +
    +
    +
    +
    + +{{ partial "footer" . }} diff --git a/site/layouts/index.html b/site/layouts/index.html index 225c92b..fa1b5cb 100644 --- a/site/layouts/index.html +++ b/site/layouts/index.html @@ -1,5 +1,15 @@ {{ partial "header" . }} -

    Hugo with Gulp, PostCSS and Webpack

    +{{ partial "nav" . }} + +{{ partial "jumbotron" (dict "imageUrl" "/img/home/jumbotron.jpg" "title" "Great coffee with a conscience" "subtitle" "Support sustainable farming while enjoying a cup") }} + +{{ partial "short-text" (dict "heading" "Why Kaldi?" "text" "Kaldi is the coffee store for everyone who believes that great coffee shouldn't just taste good, it should do good too. We source all of our beans directly from small scale sustainable farmers and make sure part of the profits are reinvested in their communities.")}} + +{{ partial "2-up" (dict "heading" "What we offer" "description" "Kaldi is the ultimate spot for coffee lovers who want to learn about their java’s origin and support the farmers that grew it. We take coffee production, roasting and brewing seriously and we’re glad to pass that knowledge to anyone." "svg1" "img/illustrations/coffee.svg" "text1" "We sell green and roasted coffee beans that are sourced directly from independent farmers and farm cooperatives. We’re proud to offer a variety of coffee beans grown with great care for the environment and local communities. Check our post or contact us directly for current availability." "svg2" "/img/illustrations/coffee-gear.svg" "text2" "We offer a small, but carefully curated selection of brewing gear and tools for every taste and experience level. No matter if you roast your own beans or just bought your first french press, you’ll find a gadget to fall in love with in our shop." "buttonText" "See all products" ) }} + +{{ partial "about" (dict "heading" "Our values" "text" "Coffee is an amazing part of human culture but it has a dark side too – one of colonialism and mindless abuse of natural resources and human lives. We want to turn this around and return the coffee trade to the drink’s exhilarating, empowering and unifying nature." "buttonText" "Read more") }} + +{{ partial "post" . }} {{ partial "footer" . }} diff --git a/site/layouts/indexes/post.html b/site/layouts/indexes/post.html new file mode 100644 index 0000000..a60f513 --- /dev/null +++ b/site/layouts/indexes/post.html @@ -0,0 +1,16 @@ +{{ partial "header" . }} +{{ partial "nav" . }} + +{{ partial "jumbotron" (dict "imageUrl" "/img/post-index.jpg" "title" "post") }} + +
    + +
    + +{{ partial "footer" . }} diff --git a/site/layouts/partials/2-up.html b/site/layouts/partials/2-up.html new file mode 100644 index 0000000..d4f30fe --- /dev/null +++ b/site/layouts/partials/2-up.html @@ -0,0 +1,24 @@ +
    +
    +

    {{.heading}}

    +

    {{.description}}

    + +
    +
    + +

    {{.text1}}

    +
    + +
    + +

    {{.text2}}

    +
    +
    + + {{ if .buttonText }} + + {{ end }} +
    +
    diff --git a/site/layouts/partials/4-up.html b/site/layouts/partials/4-up.html new file mode 100644 index 0000000..dff48b4 --- /dev/null +++ b/site/layouts/partials/4-up.html @@ -0,0 +1,36 @@ +
    +
    +

    {{.heading}}

    +

    {{.description}}

    + +
    + +
    + +

    {{.text1}}

    +
    + +
    + +

    {{.text2}}

    +
    + +
    + +

    {{.text3}}

    +
    + +
    + +

    {{.text4}}

    +
    + +
    + + {{ if .buttonText }} + + {{ end }} +
    +
    diff --git a/site/layouts/partials/about.html b/site/layouts/partials/about.html new file mode 100644 index 0000000..657aead --- /dev/null +++ b/site/layouts/partials/about.html @@ -0,0 +1,21 @@ +
    +
    + +
    +
    +

    {{.heading}}

    + +

    {{.text}}

    +
    + +
    + +
    +
    + + + +
    +
    diff --git a/site/layouts/partials/blockquote.html b/site/layouts/partials/blockquote.html new file mode 100644 index 0000000..6f432bd --- /dev/null +++ b/site/layouts/partials/blockquote.html @@ -0,0 +1,6 @@ +
    +
    +

    {{.quote}}

    + {{.author}} +
    +
    diff --git a/site/layouts/partials/blog.html b/site/layouts/partials/blog.html new file mode 100644 index 0000000..c8f5ff1 --- /dev/null +++ b/site/layouts/partials/blog.html @@ -0,0 +1,22 @@ +
    +
    + +

    post section

    + + +
    + + {{ range where .Data.Pages "Type" "post" }} +
    + {{ .Render "li" }} +
    + {{ end }} + +
    + +
    + Read more +
    + +
    +
    diff --git a/site/layouts/partials/footer.html b/site/layouts/partials/footer.html index 310a610..629e288 100644 --- a/site/layouts/partials/footer.html +++ b/site/layouts/partials/footer.html @@ -1,3 +1,59 @@ + + +{{ partial "svg" . }} + + + diff --git a/site/layouts/partials/header.html b/site/layouts/partials/header.html index c84dc6e..c9268c2 100644 --- a/site/layouts/partials/header.html +++ b/site/layouts/partials/header.html @@ -3,5 +3,10 @@ Hugo with Gulp and Webpack + + + + + - + diff --git a/site/layouts/partials/image-grid.html b/site/layouts/partials/image-grid.html new file mode 100644 index 0000000..25bf701 --- /dev/null +++ b/site/layouts/partials/image-grid.html @@ -0,0 +1,17 @@ +
    + +
    +
    + +
    + +
    + +
    + +
    + +
    +
    + +
    diff --git a/site/layouts/partials/jumbotron.html b/site/layouts/partials/jumbotron.html new file mode 100644 index 0000000..b843c1c --- /dev/null +++ b/site/layouts/partials/jumbotron.html @@ -0,0 +1,18 @@ +
    +
    +
    +
    +

    + {{.title}} +

    +
    +
    + {{ if .subtitle }} +

    + {{.subtitle}} +

    + {{ end }} +
    +
    +
    +
    diff --git a/site/layouts/partials/media-block-reverse.html b/site/layouts/partials/media-block-reverse.html new file mode 100644 index 0000000..a7b8c18 --- /dev/null +++ b/site/layouts/partials/media-block-reverse.html @@ -0,0 +1,12 @@ +
    + +
    + +
    + +
    +

    {{.heading}}

    +

    {{.text}}

    +
    + +
    diff --git a/site/layouts/partials/media-block.html b/site/layouts/partials/media-block.html new file mode 100644 index 0000000..db5f619 --- /dev/null +++ b/site/layouts/partials/media-block.html @@ -0,0 +1,12 @@ +
    + +
    + +
    + +
    +

    {{.heading}}

    +

    {{.text}}

    +
    + +
    diff --git a/site/layouts/partials/nav.html b/site/layouts/partials/nav.html new file mode 100644 index 0000000..8225a10 --- /dev/null +++ b/site/layouts/partials/nav.html @@ -0,0 +1,12 @@ + diff --git a/site/layouts/partials/pricing-card.html b/site/layouts/partials/pricing-card.html new file mode 100644 index 0000000..2f009b2 --- /dev/null +++ b/site/layouts/partials/pricing-card.html @@ -0,0 +1,27 @@ +
    + + +

    {{.plan}}

    + + +

    + ${{.price}} +

    + + +

    {{.description}}

    + + + + +
    diff --git a/site/layouts/partials/short-text.html b/site/layouts/partials/short-text.html new file mode 100644 index 0000000..7f10bb7 --- /dev/null +++ b/site/layouts/partials/short-text.html @@ -0,0 +1,6 @@ +
    +
    +

    {{.heading}}

    +

    {{.text}}

    +
    +
    diff --git a/site/layouts/partials/social-icon.html b/site/layouts/partials/social-icon.html new file mode 100644 index 0000000..6d616be --- /dev/null +++ b/site/layouts/partials/social-icon.html @@ -0,0 +1,7 @@ +
  • + + + + + +
  • diff --git a/site/layouts/partials/svg.html b/site/layouts/partials/svg.html new file mode 100644 index 0000000..7a0c34d --- /dev/null +++ b/site/layouts/partials/svg.html @@ -0,0 +1,5 @@ +
    + + 500px-blackAirbnb-blackAmazon-blackFacebook-black + +
    diff --git a/site/layouts/partials/table.html b/site/layouts/partials/table.html new file mode 100644 index 0000000..66da24c --- /dev/null +++ b/site/layouts/partials/table.html @@ -0,0 +1,25 @@ +
    + +
    + +

    {{.heading}}

    +

    {{.text}}

    + +
    + +
    {{ partial "pricing-card" (dict "plan" "Small" "price" "50" "description" "Perfect for the drinker who likes to enjoy 1-2 cups per day." "item1" "3 lbs of coffee per month" "item2" "Green or roasted beans" "item3" "One or two varieties of beans") }} +
    + +
    + {{ partial "pricing-card" (dict "plan" "Big" "price" "80" "description" "Great for avid drinkers, java-loving couples and bigger crowds" "item1" "6 lbs of coffee per month" "item2" "Green or roasted beans" "item3" "Up to 4 different varieties of beans") }} +
    + +
    + {{ partial "pricing-card" (dict "plan" "Small" "price" "80" "description" "Want a few tiny batches from different varieties? Try our custom plan" "item1" "However little or much you need" "item2" "Green or roasted beans" "item3" "Unlimited varieties") }} +
    + +
    + +
    + +
    diff --git a/site/layouts/post/li.html b/site/layouts/post/li.html new file mode 100644 index 0000000..de2d1da --- /dev/null +++ b/site/layouts/post/li.html @@ -0,0 +1,6 @@ + +

    {{ .Title }}

    +

    {{ .Date.Format "Mon, Jan 2, 2006" }}

    +

    {{ .Summary }}

    + +
    diff --git a/site/layouts/post/list.html b/site/layouts/post/list.html new file mode 100644 index 0000000..5d13c7e --- /dev/null +++ b/site/layouts/post/list.html @@ -0,0 +1,14 @@ +{{ partial "header" . }} +{{ partial "nav" . }} + +{{ partial "jumbotron" (dict "imageUrl" "img/2.jpg" "title" "post title goes here") }} + + + +{{ partial "footer" . }} diff --git a/site/layouts/post/single.html b/site/layouts/post/single.html new file mode 100644 index 0000000..e7198b3 --- /dev/null +++ b/site/layouts/post/single.html @@ -0,0 +1,13 @@ +{{ partial "header" . }} +{{ partial "nav" . }} +
    +

    {{.Title}}

    +
    +

    {{ .Date.Format "Mon, Jan 2, 2006" }}

    +

    Read in {{ .ReadingTime }} minutes

    +
    +
    + {{ .Content }} +
    +
    +{{ partial "footer" . }} diff --git a/site/layouts/products/single.html b/site/layouts/products/single.html new file mode 100644 index 0000000..0124e39 --- /dev/null +++ b/site/layouts/products/single.html @@ -0,0 +1,29 @@ +{{ partial "header" . }} +{{ partial "nav" . }} + +{{ partial "jumbotron" (dict "imageUrl" "/img/products/jumbotron.jpg" "title" "Products") }} + +{{ partial "4-up" (dict "heading" "What we offer" "description" "Kaldi is the ultimate spot for coffee lovers who want to learn about their java’s origin and support the farmers that grew it. We take coffee production, roasting and brewing seriously and we’re glad to pass that knowledge to anyone." "svg1" "/img/illustrations/coffee.svg" "text1" "We sell green and roasted coffee beans that are sourced directly from independent farmers and farm cooperatives. We’re proud to offer a variety of coffee beans grown with great care for the environment and local communities. Check our post or contact us directly for current availability." "svg2" "/img/illustrations/coffee-gear.svg" "text2" "We offer a small, but carefully curated selection of brewing gear and tools for every taste and experience level. No matter if you roast your own beans or just bought your first french press, you’ll find a gadget to fall in love with in our shop." "svg3" "/img/illustrations/tutorials.svg" "text3" "Love a great cup of coffee, but never knew how to make one? Bought a fancy new Chemex but have no clue how to use it? Don't worry, we’re here to help. You can schedule a custom 1-on-1 consultation with our baristas to learn anything you want to know about coffee roasting and brewing. Email us or call the store for details." "svg4" "/img/illustrations/meeting-space.svg" "text4" "We believe that good coffee has the power to bring people together. That’s why we decided to turn a corner of our shop into a cozy meeting space where you can hang out with fellow coffee lovers and learn about coffee making techniques. All of the artwork on display there is for sale. The full price you pay goes to the artist." ) }} + +
    +
    +

    Great coffee with no compromises

    +

    We hold our coffee to the highest standards from the shrub to the cup. That’s why we’re meticulous and transparent about each step of the coffee’s journey. We personally visit each farm to make sure the conditions are optimal for the plants, farmers and the local environment.

    +
    +
    + + +{{ partial "image-grid" . }} + +{{ partial "blockquote" (dict "quote" "A testimonial from someone who can’t live without this." "author" "A satisfied customer") }} + +{{ partial "blockquote" (dict "quote" "“The first time I tried Kaldi’s coffee, I couldn’t even believe that was the same thing I’ve been drinking every morning.”" "author" "Elisabeth Kaurismäki") }} + +{{ partial "blockquote" (dict "quote" "“Kaldi is the place to go if you want the best quality coffee. I love their stance on empowering farmers and transparency.”" "author" "Philipp Trommler") }} + + + + +{{ partial "table" (dict "heading" "Monthly subscriptions" "text" "We make it easy to make great coffee a part of your life. Choose one of our monthly subscription plans to receive great coffee at your doorstep each month. Contact us about more details and payment info.") }} + +{{ partial "footer" . }} diff --git a/site/static/admin/config.yml b/site/static/admin/config.yml new file mode 100644 index 0000000..657ec6d --- /dev/null +++ b/site/static/admin/config.yml @@ -0,0 +1,26 @@ +backend: + name: github + repo: owner/repo # Path to your Github repository + branch: master # Branch to update (master by default) + +media_folder: "img/uploads" # Folder where user uploaded files should go + +collections: # A list of collections the CMS should be able to edit + - name: "post" # Used in routes, ie.: /admin/collections/:slug/edit + label: "Post" # Used in the UI, ie.: "New Post" + folder: "post" # The path to the folder where the documents are stored + create: true # Allow users to create new documents in this collection + fields: # The fields each document in this collection have + - {label: "Title", name: "title", widget: "string", tagname: "h1"} + - {label: "Body", name: "body", widget: "markdown"} + - {label: "Publish Date", name: "date", widget: "datetime"} + # - name: "settings" + # label: "Settings" + # files: + # - name: "general" + # label: "General settings" + # file: "_settings/general.json" + # fields: + # - {label: "Main site title", name: "site_title", widget: "string"} + # - {label: "Number of fronpage posts", name: "post_count", widget: "number"} + # - {label: "Site cover image", name: "cover", widget: "image"} diff --git a/site/static/admin/index.html b/site/static/admin/index.html new file mode 100644 index 0000000..69d8a76 --- /dev/null +++ b/site/static/admin/index.html @@ -0,0 +1,19 @@ + + + + + + + + Content Manager + + + + + + + + + + + diff --git a/site/static/img/about/direct-sourcing.jpg b/site/static/img/about/direct-sourcing.jpg new file mode 100755 index 0000000..0a52cc5 Binary files /dev/null and b/site/static/img/about/direct-sourcing.jpg differ diff --git a/site/static/img/about/jumbotron.jpg b/site/static/img/about/jumbotron.jpg new file mode 100644 index 0000000..6ecc2b2 Binary files /dev/null and b/site/static/img/about/jumbotron.jpg differ diff --git a/site/static/img/about/reinvest-profits.jpg b/site/static/img/about/reinvest-profits.jpg new file mode 100755 index 0000000..73bd5d0 Binary files /dev/null and b/site/static/img/about/reinvest-profits.jpg differ diff --git a/site/static/img/about/shade-grown.jpg b/site/static/img/about/shade-grown.jpg new file mode 100755 index 0000000..2f4b502 Binary files /dev/null and b/site/static/img/about/shade-grown.jpg differ diff --git a/site/static/img/about/single-origin.jpg b/site/static/img/about/single-origin.jpg new file mode 100755 index 0000000..78becb3 Binary files /dev/null and b/site/static/img/about/single-origin.jpg differ diff --git a/site/static/img/about/sustainable-farming.jpg b/site/static/img/about/sustainable-farming.jpg new file mode 100755 index 0000000..54eac24 Binary files /dev/null and b/site/static/img/about/sustainable-farming.jpg differ diff --git a/site/static/img/blog posts/chemex.jpg b/site/static/img/blog posts/chemex.jpg new file mode 100755 index 0000000..903f68a Binary files /dev/null and b/site/static/img/blog posts/chemex.jpg differ diff --git a/site/static/img/blog posts/flavor wheel.jpg b/site/static/img/blog posts/flavor wheel.jpg new file mode 100755 index 0000000..dc2a87d Binary files /dev/null and b/site/static/img/blog posts/flavor wheel.jpg differ diff --git a/site/static/img/blog-index.jpg b/site/static/img/blog-index.jpg new file mode 100755 index 0000000..b9c1c8c Binary files /dev/null and b/site/static/img/blog-index.jpg differ diff --git a/site/static/img/home/about-section.jpg b/site/static/img/home/about-section.jpg new file mode 100755 index 0000000..2571ab6 Binary files /dev/null and b/site/static/img/home/about-section.jpg differ diff --git a/site/static/img/home/jumbotron.jpg b/site/static/img/home/jumbotron.jpg new file mode 100644 index 0000000..f02e6d8 Binary files /dev/null and b/site/static/img/home/jumbotron.jpg differ diff --git a/site/static/img/icon.svg b/site/static/img/icon.svg new file mode 100644 index 0000000..1f8f439 --- /dev/null +++ b/site/static/img/icon.svg @@ -0,0 +1,42 @@ + +icon +Created using Figma + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/site/static/img/icons/500px.svg b/site/static/img/icons/500px.svg new file mode 100644 index 0000000..7460839 --- /dev/null +++ b/site/static/img/icons/500px.svg @@ -0,0 +1 @@ +500px-black diff --git a/site/static/img/icons/Airbnb.svg b/site/static/img/icons/Airbnb.svg new file mode 100644 index 0000000..d8c0234 --- /dev/null +++ b/site/static/img/icons/Airbnb.svg @@ -0,0 +1 @@ +Airbnb-blackCreated with Sketch. \ No newline at end of file diff --git a/site/static/img/icons/Amazon.svg b/site/static/img/icons/Amazon.svg new file mode 100644 index 0000000..70cfe69 --- /dev/null +++ b/site/static/img/icons/Amazon.svg @@ -0,0 +1 @@ +Amazon-blackCreated with Sketch. \ No newline at end of file diff --git a/site/static/img/icons/Facebook.svg b/site/static/img/icons/Facebook.svg new file mode 100644 index 0000000..f488b2a --- /dev/null +++ b/site/static/img/icons/Facebook.svg @@ -0,0 +1 @@ +Facebook-blackCreated with Sketch. \ No newline at end of file diff --git a/site/static/img/illustrations/coffee-gear.svg b/site/static/img/illustrations/coffee-gear.svg new file mode 100644 index 0000000..93b797e --- /dev/null +++ b/site/static/img/illustrations/coffee-gear.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/site/static/img/illustrations/coffee.svg b/site/static/img/illustrations/coffee.svg new file mode 100644 index 0000000..baa46a7 --- /dev/null +++ b/site/static/img/illustrations/coffee.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/site/static/img/illustrations/meeting-space.svg b/site/static/img/illustrations/meeting-space.svg new file mode 100644 index 0000000..043eafb --- /dev/null +++ b/site/static/img/illustrations/meeting-space.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/site/static/img/illustrations/tutorials.svg b/site/static/img/illustrations/tutorials.svg new file mode 100644 index 0000000..64f42a1 --- /dev/null +++ b/site/static/img/illustrations/tutorials.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/site/static/img/logo.svg b/site/static/img/logo.svg new file mode 100644 index 0000000..2077f34 --- /dev/null +++ b/site/static/img/logo.svg @@ -0,0 +1 @@ +Logo diff --git a/site/static/img/products/jumbotron.jpg b/site/static/img/products/jumbotron.jpg new file mode 100755 index 0000000..dfb2dbe Binary files /dev/null and b/site/static/img/products/jumbotron.jpg differ diff --git a/site/static/img/products/products-full-width.jpg b/site/static/img/products/products-full-width.jpg new file mode 100644 index 0000000..b1a0194 Binary files /dev/null and b/site/static/img/products/products-full-width.jpg differ diff --git a/site/static/img/products/products-grid1.jpg b/site/static/img/products/products-grid1.jpg new file mode 100755 index 0000000..600be3c Binary files /dev/null and b/site/static/img/products/products-grid1.jpg differ diff --git a/site/static/img/products/products-grid2.jpg b/site/static/img/products/products-grid2.jpg new file mode 100755 index 0000000..b066a88 Binary files /dev/null and b/site/static/img/products/products-grid2.jpg differ diff --git a/site/static/img/products/products-grid3.jpg b/site/static/img/products/products-grid3.jpg new file mode 100755 index 0000000..df47e06 Binary files /dev/null and b/site/static/img/products/products-grid3.jpg differ diff --git a/src/css/imports/_border-colors.css b/src/css/imports/_border-colors.css index 4eaf69e..0babaab 100755 --- a/src/css/imports/_border-colors.css +++ b/src/css/imports/_border-colors.css @@ -1,84 +1,35 @@ -/* +.b--primary { + border-color: var(--primary); +} - BORDER COLORS - Docs: http://tachyons.io/docs/themes/borders/ +.b--highlight { + border-color: --var(--highlight); +} - Border colors can be used to extend the base - border classes ba,bt,bb,br,bl found in the _borders.css file. +.b--white { + border-color: var(--white); +} - The base border class by default will set the color of the border - to that of the current text color. These classes are for the cases - where you desire for the text and border colors to be different. +.b--off-white { + border-color: var(--off-white); +} - Base: - b = border +.b--grey-1 { + border-color: var(--grey-1); +} - Modifiers: - --color-name = each color variable name is also a border color name +.b--grey-2 { + border-color: var(--grey-2); +} -*/ +.b--grey-3 { + border-color: var(--grey-3); +} -.b--black { border-color: var(--black); } -.b--near-black { border-color: var(--near-black); } -.b--dark-gray { border-color: var(--dark-gray); } -.b--mid-gray { border-color: var(--mid-gray); } -.b--gray { border-color: var(--gray); } -.b--silver { border-color: var(--silver); } -.b--light-silver { border-color: var(--light-silver); } -.b--light-gray { border-color: var(--light-gray); } -.b--near-white { border-color: var(--near-white); } -.b--white { border-color: var(--white); } +.b--grey-4 { + border-color: var(--grey-4); +} -.b--white-90 { border-color: var(--white-90); } -.b--white-80 { border-color: var(--white-80); } -.b--white-70 { border-color: var(--white-70); } -.b--white-60 { border-color: var(--white-60); } -.b--white-50 { border-color: var(--white-50); } -.b--white-40 { border-color: var(--white-40); } -.b--white-30 { border-color: var(--white-30); } -.b--white-20 { border-color: var(--white-20); } -.b--white-10 { border-color: var(--white-10); } -.b--white-05 { border-color: var(--white-05); } -.b--white-025 { border-color: var(--white-025); } -.b--white-0125 { border-color: var(--white-0125); } - -.b--black-90 { border-color: var(--black-90); } -.b--black-80 { border-color: var(--black-80); } -.b--black-70 { border-color: var(--black-70); } -.b--black-60 { border-color: var(--black-60); } -.b--black-50 { border-color: var(--black-50); } -.b--black-40 { border-color: var(--black-40); } -.b--black-30 { border-color: var(--black-30); } -.b--black-20 { border-color: var(--black-20); } -.b--black-10 { border-color: var(--black-10); } -.b--black-05 { border-color: var(--black-05); } -.b--black-025 { border-color: var(--black-025); } -.b--black-0125 { border-color: var(--black-0125); } - -.b--dark-red { border-color: var(--dark-red); } -.b--red { border-color: var(--red); } -.b--light-red { border-color: var(--light-red); } -.b--orange { border-color: var(--orange); } -.b--gold { border-color: var(--gold); } -.b--yellow { border-color: var(--yellow); } -.b--light-yellow { border-color: var(--light-yellow); } -.b--purple { border-color: var(--purple); } -.b--light-purple { border-color: var(--light-purple); } -.b--dark-pink { border-color: var(--dark-pink); } -.b--hot-pink { border-color: var(--hot-pink); } -.b--pink { border-color: var(--pink); } -.b--light-pink { border-color: var(--light-pink); } -.b--dark-green { border-color: var(--dark-green); } -.b--green { border-color: var(--green); } -.b--light-green { border-color: var(--light-green); } -.b--navy { border-color: var(--navy); } -.b--dark-blue { border-color: var(--dark-blue); } -.b--blue { border-color: var(--blue); } -.b--light-blue { border-color: var(--light-blue); } -.b--lightest-blue { border-color: var(--lightest-blue); } -.b--washed-blue { border-color: var(--washed-blue); } -.b--washed-green { border-color: var(--washed-green); } -.b--washed-yellow { border-color: var(--washed-yellow); } -.b--washed-red { border-color: var(--washed-red); } - -.b--transparent { border-color: var(--transparent); } +.b--black { + border-color: var(--black); +} diff --git a/src/css/imports/_border-radius.css b/src/css/imports/_border-radius.css index 19b873c..2422bd2 100755 --- a/src/css/imports/_border-radius.css +++ b/src/css/imports/_border-radius.css @@ -24,11 +24,12 @@ */ + :root { + --border-radius: .25rem; + } + .br0 { border-radius: 0; } - .br1 { border-radius: .125rem; } - .br2 { border-radius: .25rem; } - .br3 { border-radius: .5rem; } - .br4 { border-radius: 1rem; } + .br1 { border-radius: var(--border-radius); } .br-100 { border-radius: 100%; } .br-pill { border-radius: 9999px; } .br--bottom { @@ -50,10 +51,7 @@ @media (--breakpoint-not-small) { .br0-ns { border-radius: 0; } - .br1-ns { border-radius: .125rem; } - .br2-ns { border-radius: .25rem; } - .br3-ns { border-radius: .5rem; } - .br4-ns { border-radius: 1rem; } + .br1-ns { border-radius: var(--border-radius); } .br-100-ns { border-radius: 100%; } .br-pill-ns { border-radius: 9999px; } .br--bottom-ns { @@ -76,10 +74,7 @@ @media (--breakpoint-medium) { .br0-m { border-radius: 0; } - .br1-m { border-radius: .125rem; } - .br2-m { border-radius: .25rem; } - .br3-m { border-radius: .5rem; } - .br4-m { border-radius: 1rem; } + .br1-m { border-radius: var(--border-radius); } .br-100-m { border-radius: 100%; } .br-pill-m { border-radius: 9999px; } .br--bottom-m { @@ -102,10 +97,7 @@ @media (--breakpoint-large) { .br0-l { border-radius: 0; } - .br1-l { border-radius: .125rem; } - .br2-l { border-radius: .25rem; } - .br3-l { border-radius: .5rem; } - .br4-l { border-radius: 1rem; } + .br1-l { border-radius: var(--border-radius); } .br-100-l { border-radius: 100%; } .br-pill-l { border-radius: 9999px; } .br--bottom-l { diff --git a/src/css/imports/_buttons.css b/src/css/imports/_buttons.css new file mode 100644 index 0000000..57cb4ff --- /dev/null +++ b/src/css/imports/_buttons.css @@ -0,0 +1,13 @@ +.btn { + display: inline-block; + padding: 12px 16px 10px; + font-size: 1rem; + line-height: 1.25; + background-color: var(--white); + border-radius: var(--border-radius); + text-decoration: none; + font-weight: bold; + color: var(--primary); + text-align: center; + box-shadow: inset 0 0 0 2px var(--primary); +} diff --git a/src/css/imports/_cms.css b/src/css/imports/_cms.css new file mode 100644 index 0000000..e82565e --- /dev/null +++ b/src/css/imports/_cms.css @@ -0,0 +1,13 @@ +.cms { + & h1, h2, h3, h4, h5, h6 { + font-weight: bold; + } + & a { + color: var(--primary); + transition: var(--hover-transition); + &:hover { + background-color: var(--highlight); + color: var(--black); + } + } +} diff --git a/src/css/imports/_colors.css b/src/css/imports/_colors.css index 7280aec..9d09e73 100755 --- a/src/css/imports/_colors.css +++ b/src/css/imports/_colors.css @@ -1,80 +1,94 @@ -/* +/* Color variables */ - Tachyons - COLOR VARIABLES +:root { + --primary: rgba(255, 68, 0, 1); + --highlight: rgba(254, 213, 198, 1); + --white: rgba(255, 255, 255, 1); + --off-white: rgba(255, 253, 252, 1); + --grey-1: rgba(245, 243, 242, 1); + --grey-2: rgba(235, 231, 230, 1); + --grey-3: rgba(89, 87, 86, 1); + --grey-4: rgba(66, 64, 64, 1); + --black: rgba(43, 37, 35, 1); +} - Grayscale - - Solids - - Transparencies - Colors +/* Text colors */ -*/ +.primary { + color: var(--primary); +} -:root { - --black: #000; - --near-black: #111; - --dark-gray:#333; - --mid-gray:#555; - --gray: #777; - --silver: #999; - --light-silver: #aaa; - --moon-gray: #ccc; - --light-gray: #eee; - --near-white: #f4f4f4; - --white: #fff; - - --transparent:transparent; - - --black-90: rgba(0,0,0,.9); - --black-80: rgba(0,0,0,.8); - --black-70: rgba(0,0,0,.7); - --black-60: rgba(0,0,0,.6); - --black-50: rgba(0,0,0,.5); - --black-40: rgba(0,0,0,.4); - --black-30: rgba(0,0,0,.3); - --black-20: rgba(0,0,0,.2); - --black-10: rgba(0,0,0,.1); - --black-05: rgba(0,0,0,.05); - --black-025: rgba(0,0,0,.025); - --black-0125: rgba(0,0,0,.0125); - - --white-90: rgba(255,255,255,.9); - --white-80: rgba(255,255,255,.8); - --white-70: rgba(255,255,255,.7); - --white-60: rgba(255,255,255,.6); - --white-50: rgba(255,255,255,.5); - --white-40: rgba(255,255,255,.4); - --white-30: rgba(255,255,255,.3); - --white-20: rgba(255,255,255,.2); - --white-10: rgba(255,255,255,.1); - --white-05: rgba(255,255,255,.05); - --white-025: rgba(255,255,255,.025); - --white-0125: rgba(255,255,255,.0125); - - --dark-red: #e7040f; - --red: #ff4136; - --light-red: #ff725c; - --orange: #ff6300; - --gold: #ffb700; - --yellow: #ffd700; - --light-yellow: #fbf1a9; - --purple: #5e2ca5; - --light-purple: #a463f2; - --dark-pink: #d5008f; - --hot-pink: #ff41b4; - --pink: #ff80cc; - --light-pink: #ffa3d7; - --dark-green: #137752; - --green: #19a974; - --light-green: #9eebcf; - --navy: #001b44; - --dark-blue: #00449e; - --blue: #357edd; - --light-blue: #96ccff; - --lightest-blue: #cdecff; - --washed-blue: #f6fffe; - --washed-green: #e8fdf5; - --washed-yellow: #fffceb; - --washed-red: #ffdfdf; +.highlight { + color: --var(--highlight); +} + +.white { + color: var(--white); +} + +.off-white { + color: var(--off-white); +} + +.grey-1 { + color: var(--grey-1); +} + +.grey-2 { + color: var(--grey-2); +} + +.grey-3 { + color: var(--grey-3); +} + +.grey-4 { + color: var(--grey-4); +} + +.black { + color: var(--black); +} + +.bg-primary { + background-color: var(--primary); +} + +.bg-highlight { + background-color: --var(--highlight); +} + +.bg-white { + background-color: var(--white); +} + +.bg-off-white { + background-color: var(--off-white); +} + +.bg-grey-1 { + background-color: var(--grey-1); +} + +.bg-grey-2 { + background-color: var(--grey-2); +} + +.bg-grey-3 { + background-color: var(--grey-4); +} + +.bg-grey-4 { + background-color: var(--grey-4); +} + +.bg-black { + background-color: var(--black); +} +.bg-fix-primary { + padding: 0 .5rem; + & :first-child { + box-shadow: .5rem 0 0 var(--primary), -.5rem 0 0 var(--primary); + } } diff --git a/src/css/imports/_font-family.css b/src/css/imports/_font-family.css index eed780a..f71d65d 100755 --- a/src/css/imports/_font-family.css +++ b/src/css/imports/_font-family.css @@ -7,7 +7,7 @@ .sans-serif { - font-family: -apple-system, BlinkMacSystemFont, + font-family: Nunito Sans, -apple-system, BlinkMacSystemFont, 'avenir next', avenir, helvetica, 'helvetica neue', ubuntu, @@ -97,4 +97,3 @@ code, .code { font-family: baskerville, serif; } - diff --git a/src/css/imports/_forms.css b/src/css/imports/_forms.css index fe0b8ab..12ee7c6 100755 --- a/src/css/imports/_forms.css +++ b/src/css/imports/_forms.css @@ -1,9 +1,14 @@ /* FORMS - + */ +fieldset +{ + position: relative; +} + .input-reset { -webkit-appearance: none; -moz-appearance: none; @@ -14,3 +19,62 @@ border: 0; padding: 0; } + +input, textarea { + background-color: var(--grey-2); + border-radius: var(--border-radius); + padding: 12px 16px 10px; + font-size: 1rem; + line-height: 1.25; + position: relative; + z-index: 2; + &:focus { + background-color: var(--white); + } + &:focus + label { + opacity: 1; + pointer-events: auto; + transform: translateY(-120%); + } +} + +::-webkit-input-placeholder { + color: var(--black); + font-size: 1rem; + line-height: normal; +} + +:-moz-placeholder { + color: var(--black); + font-size: 1rem; + line-height: normal; +} + +::-moz-placeholder { + color: var(--black); + font-size: 1rem; + line-height: normal; +} + +:-ms-input-placeholder { + color: var(--black); + font-size: 1rem; + line-height: normal; +} + +label +{ + font-size: .875rem; + font-weight: 800; + color: var(--primary); + background-color: var(--grey-2); + border-radius: .25rem; + padding: .25rem .5rem; + position: absolute; + left: 0; + pointer-events: none; + opacity: 0; + line-height: 1; + transition: var(--hover-transition); + z-index: 2; +} diff --git a/src/css/imports/_hovers.css b/src/css/imports/_hovers.css index 7e9a64e..a10c718 100755 --- a/src/css/imports/_hovers.css +++ b/src/css/imports/_hovers.css @@ -1,33 +1,16 @@ -/* - - HOVER EFFECTS - Docs: http://tachyons.io/docs/themes/hovers/ - - - Dim - - Hide Child - - Underline text - - Grow - - Pointer - - Shadow - -*/ - -/* - - Dim element on hover by adding the dim class. - -*/ -.dim { - opacity: 1; - transition: opacity .15s ease-in; -} -.dim:hover, -.dim:focus { - opacity: .5; - transition: opacity .15s ease-in; -} -.dim:active { - opacity: .8; transition: opacity .15s ease-out; +@media (--breakpoint-large) { + .raise { + transform: none; + transition: var(--hover-transition); + } + .raise:hover, + .raise:focus { + transform: translateY(-.1rem); + transition: var(--hover-transition); + } + .raise:active { + opacity: .5; transition: var(--hover-transition); + } } /* @@ -101,31 +84,3 @@ .pointer:hover { cursor: pointer; } - -/* - Add shadow on hover. - - Performant box-shadow animation pattern from - http://tobiasahlin.com/blog/how-to-animate-box-shadow/ -*/ - -.shadow-hover::after { - box-shadow: 0px 0px 8px 2px rgba( 0, 0, 0, .2 ); - opacity: 0; - transition: opacity .25s ease-in-out; -} - -.shadow-hover:hover::after, -.shadow-hover:focus::after { - opacity: 1; -} - -/* Combine with classes in skins and skins-pseudo for - * thousands of different transition possibilities. */ - -.bg-animate, -.bg-animate:hover, -.bg-animate:focus { - transition: background-color .15s ease-in-out; -} - diff --git a/src/css/imports/_links.css b/src/css/imports/_links.css index 6c9a2c8..243b5f0 100755 --- a/src/css/imports/_links.css +++ b/src/css/imports/_links.css @@ -8,6 +8,7 @@ .link { text-decoration: none; transition: color .15s ease-in; + color: inherit; } .link:link, @@ -16,6 +17,7 @@ } .link:hover { transition: color .15s ease-in; + text-decoration: underline; } .link:active { transition: color .15s ease-in; @@ -24,4 +26,3 @@ transition: color .15s ease-in; outline: 1px dotted currentColor; } - diff --git a/src/css/imports/_media-queries.css b/src/css/imports/_media-queries.css index d8a4c93..d3be559 100755 --- a/src/css/imports/_media-queries.css +++ b/src/css/imports/_media-queries.css @@ -1,36 +1,5 @@ -/* +@custom-media --breakpoint-not-small screen and (min-width: 40em); - CUSTOM MEDIA QUERIES +@custom-media --breakpoint-medium screen and (min-width: 40em) and (max-width: 60em); - Media query values can be changed to fit your own content. - There are no magic bullets when it comes to media query width values. - They should be declared in em units - and they should be set to meet - the needs of your content. You can also add additional media queries, - or remove some of the existing ones. - - These media queries can be referenced like so: - - @media (--breakpoint-not-small) { - .medium-and-larger-specific-style { - background-color: red; - } - } - - @media (--breakpoint-medium) { - .medium-screen-specific-style { - background-color: red; - } - } - - @media (--breakpoint-large) { - .large-and-larger-screen-specific-style { - background-color: red; - } - } - -*/ - -/* Media Queries */ -@custom-media --breakpoint-not-small screen and (min-width: 30em); -@custom-media --breakpoint-medium screen and (min-width: 30em) and (max-width: 60em); @custom-media --breakpoint-large screen and (min-width: 60em); diff --git a/src/css/imports/_normalize.css b/src/css/imports/_normalize.css deleted file mode 100755 index f1f7770..0000000 --- a/src/css/imports/_normalize.css +++ /dev/null @@ -1,422 +0,0 @@ -/* normalize.css v4.1.1 | MIT License | github.com/necolas/normalize.css */ - -/** - * 1. Change the default font family in all browsers (opinionated). - * 2. Correct the line height in all browsers. - * 3. Prevent adjustments of font size after orientation changes in IE and iOS. - */ - -html { - font-family: sans-serif; /* 1 */ - line-height: 1.15; /* 2 */ - -ms-text-size-adjust: 100%; /* 3 */ - -webkit-text-size-adjust: 100%; /* 3 */ -} - -/** - * Remove the margin in all browsers (opinionated). - */ - -body { - margin: 0; -} - -/* HTML5 display definitions - ========================================================================== */ - -/** - * Add the correct display in IE 9-. - * 1. Add the correct display in Edge, IE, and Firefox. - * 2. Add the correct display in IE. - */ - -article, -aside, -details, /* 1 */ -figcaption, -figure, -footer, -header, -main, /* 2 */ -menu, -nav, -section, -summary { /* 1 */ - display: block; -} - -/** - * Add the correct display in IE 9-. - */ - -audio, -canvas, -progress, -video { - display: inline-block; -} - -/** - * Add the correct display in iOS 4-7. - */ - -audio:not([controls]) { - display: none; - height: 0; -} - -/** - * Add the correct vertical alignment in Chrome, Firefox, and Opera. - */ - -progress { - vertical-align: baseline; -} - -/** - * Add the correct display in IE 10-. - * 1. Add the correct display in IE. - */ - -template, /* 1 */ -[hidden] { - display: none; -} - -/* Links - ========================================================================== */ - -/** - * 1. Remove the gray background on active links in IE 10. - * 2. Remove gaps in links underline in iOS 8+ and Safari 8+. - */ - -a { - background-color: transparent; /* 1 */ - -webkit-text-decoration-skip: objects; /* 2 */ -} - -/** - * Remove the outline on focused links when they are also active or hovered - * in all browsers (opinionated). - */ - -a:active, -a:hover { - outline-width: 0; -} - -/* Text-level semantics - ========================================================================== */ - -/** - * 1. Remove the bottom border in Firefox 39-. - * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari. - */ - -abbr[title] { - border-bottom: none; /* 1 */ - text-decoration: underline; /* 2 */ - text-decoration: underline dotted; /* 2 */ -} - -/** - * Prevent the duplicate application of `bolder` by the next rule in Safari 6. - */ - -b, -strong { - font-weight: inherit; -} - -/** - * Add the correct font weight in Chrome, Edge, and Safari. - */ - -b, -strong { - font-weight: bolder; -} - -/** - * Add the correct font style in Android 4.3-. - */ - -dfn { - font-style: italic; -} - -/** - * Correct the font size and margin on `h1` elements within `section` and - * `article` contexts in Chrome, Firefox, and Safari. - */ - -h1 { - font-size: 2em; - margin: 0.67em 0; -} - -/** - * Add the correct background and color in IE 9-. - */ - -mark { - background-color: #ffd700; - color: #000; -} - -/** - * Add the correct font size in all browsers. - */ - -small { - font-size: 80%; -} - -/** - * Prevent `sub` and `sup` elements from affecting the line height in - * all browsers. - */ - -sub, -sup { - font-size: 75%; - line-height: 0; - position: relative; - vertical-align: baseline; -} - -sub { - bottom: -0.25em; -} - -sup { - top: -0.5em; -} - -/* Embedded content - ========================================================================== */ - -/** - * Remove the border on images inside links in IE 10-. - */ - -img { - border-style: none; -} - -/** - * Hide the overflow in IE. - */ - -svg:not(:root) { - overflow: hidden; -} - -/* Grouping content - ========================================================================== */ - -/** - * 1. Correct the inheritance and scaling of font size in all browsers. - * 2. Correct the odd `em` font sizing in all browsers. - */ - -code, -kbd, -pre, -samp { - font-family: monospace, monospace; /* 1 */ - font-size: 1em; /* 2 */ -} - -/** - * Add the correct margin in IE 8. - */ - -figure { - margin: 1em 40px; -} - -/** - * 1. Add the correct box sizing in Firefox. - * 2. Show the overflow in Edge and IE. - */ - -hr { - box-sizing: content-box; /* 1 */ - height: 0; /* 1 */ - overflow: visible; /* 2 */ -} - -/* Forms - ========================================================================== */ - -/** - * 1. Change font properties to `inherit` in all browsers (opinionated). - * 2. Remove the margin in Firefox and Safari. - */ - -button, -input, -optgroup, -select, -textarea { - font: inherit; /* 1 */ - margin: 0; /* 2 */ -} - -/** - * Restore the font weight unset by the previous rule. - */ - -optgroup { - font-weight: bold; -} - -/** - * Show the overflow in IE. - * 1. Show the overflow in Edge. - */ - -button, -input { /* 1 */ - overflow: visible; -} - -/** - * Remove the inheritance of text transform in Edge, Firefox, and IE. - * 1. Remove the inheritance of text transform in Firefox. - */ - -button, -select { /* 1 */ - text-transform: none; -} - -/** - * 1. Prevent a WebKit bug where (2) destroys native `audio` and `video` - * controls in Android 4. - * 2. Correct the inability to style clickable types in iOS and Safari. - */ - -button, -html [type="button"], /* 1 */ -[type="reset"], -[type="submit"] { - -webkit-appearance: button; /* 2 */ -} - -/** - * Remove the inner border and padding in Firefox. - */ - -button::-moz-focus-inner, -[type="button"]::-moz-focus-inner, -[type="reset"]::-moz-focus-inner, -[type="submit"]::-moz-focus-inner { - border-style: none; - padding: 0; -} - -/** - * Restore the focus styles unset by the previous rule. - */ - -button:-moz-focusring, -[type="button"]:-moz-focusring, -[type="reset"]:-moz-focusring, -[type="submit"]:-moz-focusring { - outline: 1px dotted ButtonText; -} - -/** - * Change the border, margin, and padding in all browsers (opinionated). - */ - -fieldset { - border: 1px solid #c0c0c0; - margin: 0 2px; - padding: 0.35em 0.625em 0.75em; -} - -/** - * 1. Correct the text wrapping in Edge and IE. - * 2. Correct the color inheritance from `fieldset` elements in IE. - * 3. Remove the padding so developers are not caught out when they zero out - * `fieldset` elements in all browsers. - */ - -legend { - box-sizing: border-box; /* 1 */ - color: inherit; /* 2 */ - display: table; /* 1 */ - max-width: 100%; /* 1 */ - padding: 0; /* 3 */ - white-space: normal; /* 1 */ -} - -/** - * Remove the default vertical scrollbar in IE. - */ - -textarea { - overflow: auto; -} - -/** - * 1. Add the correct box sizing in IE 10-. - * 2. Remove the padding in IE 10-. - */ - -[type="checkbox"], -[type="radio"] { - box-sizing: border-box; /* 1 */ - padding: 0; /* 2 */ -} - -/** - * Correct the cursor style of increment and decrement buttons in Chrome. - */ - -[type="number"]::-webkit-inner-spin-button, -[type="number"]::-webkit-outer-spin-button { - height: auto; -} - -/** - * 1. Correct the odd appearance in Chrome and Safari. - * 2. Correct the outline style in Safari. - */ - -[type="search"] { - -webkit-appearance: textfield; /* 1 */ - outline-offset: -2px; /* 2 */ -} - -/** - * Remove the inner padding and cancel buttons in Chrome and Safari on OS X. - */ - -[type="search"]::-webkit-search-cancel-button, -[type="search"]::-webkit-search-decoration { - -webkit-appearance: none; -} - -/** - * Correct the text style of placeholders in Chrome, Edge, and Safari. - */ - -::-webkit-input-placeholder { - color: inherit; - opacity: 0.54; -} - -/** - * 1. Correct the inability to style clickable types in iOS and Safari. - * 2. Change font properties to `inherit` in Safari. - */ - -::-webkit-file-upload-button { - -webkit-appearance: button; /* 1 */ - font: inherit; /* 2 */ -} diff --git a/src/css/imports/_reset.css b/src/css/imports/_reset.css new file mode 100755 index 0000000..d0a1f31 --- /dev/null +++ b/src/css/imports/_reset.css @@ -0,0 +1,67 @@ +/* http://meyerweb.com/eric/tools/css/reset/ + v2.0 | 20110126 + License: none (public domain) +*/ + +html, body, div, span, applet, object, iframe, +h1, h2, h3, h4, h5, h6, p, blockquote, pre, +a, abbr, acronym, address, big, cite, code, +del, dfn, em, img, ins, kbd, q, s, samp, +small, strike, strong, sub, sup, tt, var, +b, u, i, center, +dl, dt, dd, ol, ul, li, +fieldset, form, label, legend, +table, caption, tbody, tfoot, thead, tr, th, td, +article, aside, canvas, details, embed, +figure, figcaption, footer, header, hgroup, +menu, nav, output, ruby, section, summary, +time, mark, audio, video { + margin: 0; + padding: 0; + border: 0; + font-size: 100%; + font: inherit; + vertical-align: baseline; +} +/* HTML5 display-role reset for older browsers */ +article, aside, details, figcaption, figure, +footer, header, hgroup, menu, nav, section { + display: block; +} +body { + line-height: 1; +} +ol, ul { + list-style: none; +} +blockquote, q { + quotes: none; +} +blockquote:before, blockquote:after, +q:before, q:after { + content: ''; + content: none; +} +table { + border-collapse: collapse; + border-spacing: 0; +} + +input, textarea { + font-size: 1rem; + border: none; + font-family: inherit; + border: 0; + margin: 0; +} + +button { + font-family: inherit; + border: 0; + margin: 0; + cursor: pointer; +} + +a { + color: inherit; +} diff --git a/src/css/imports/_spacing.css b/src/css/imports/_spacing.css index 8057126..41d4118 100755 --- a/src/css/imports/_spacing.css +++ b/src/css/imports/_spacing.css @@ -46,7 +46,6 @@ */ - .pa0 { padding: var(--spacing-none); } .pa1 { padding: var(--spacing-extra-small); } .pa2 { padding: var(--spacing-small); } @@ -277,6 +276,10 @@ margin-right: var(--spacing-extra-extra-extra-large); } +.mhn1 { margin-left: -.25rem; margin-right: -.25rem; } +.mhn2 { margin-left: -.5rem; margin-right: -.5rem; } +.mhn3 { margin-left: -1rem; margin-right: -1rem; } + @media (--breakpoint-not-small) { .pa0-ns { padding: var(--spacing-none); } .pa1-ns { padding: var(--spacing-extra-small); } @@ -499,6 +502,10 @@ margin-right: var(--spacing-extra-extra-extra-large); } + .mhn1-ns { margin-left: -.25rem; margin-right: -.25rem; } + .mhn2-ns { margin-left: -.5rem; margin-right: -.5rem; } + .mhn3-ns { margin-left: -1rem; margin-right: -1rem; } + } @media (--breakpoint-medium) { @@ -724,6 +731,10 @@ margin-right: var(--spacing-extra-extra-extra-large); } + .mhn1-m { margin-left: -.25rem; margin-right: -.25rem; } + .mhn2-m { margin-left: -.5rem; margin-right: -.5rem; } + .mhn3-m { margin-left: -1rem; margin-right: -1rem; } + } @media (--breakpoint-large) { @@ -948,5 +959,8 @@ margin-left: var(--spacing-extra-extra-extra-large); margin-right: var(--spacing-extra-extra-extra-large); } -} + .mhn1-l { margin-left: -.25rem; margin-right: -.25rem; } + .mhn2-l { margin-left: -.5rem; margin-right: -.5rem; } + .mhn3-l { margin-left: -1rem; margin-right: -1rem; } +} diff --git a/src/css/imports/_styles.css b/src/css/imports/_styles.css index 56beaae..1b6eca0 100755 --- a/src/css/imports/_styles.css +++ b/src/css/imports/_styles.css @@ -6,3 +6,6 @@ */ +::selection { + background-color: var(--highlight); +} diff --git a/src/css/imports/_svg.css b/src/css/imports/_svg.css new file mode 100644 index 0000000..165b5e9 --- /dev/null +++ b/src/css/imports/_svg.css @@ -0,0 +1,7 @@ +svg { + fill: currentColor; + fill-rule:evenodd; + clip-rule:evenodd; + max-width: 100%; + max-height: 100%; +} diff --git a/src/css/imports/_type-scale.css b/src/css/imports/_type-scale.css index 31f1018..dab4aa6 100755 --- a/src/css/imports/_type-scale.css +++ b/src/css/imports/_type-scale.css @@ -27,6 +27,25 @@ * so be careful using them on smaller screens. * */ +html { + font-size: 18px; + @media (--breakpoint-medium) { + font-size: 20px; + } + @media (--breakpoint-large) { + font-size: 22px; + } +} + + +body { + font-size: 1rem; + line-height: 1.5; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; + background-color: var(--white); + } + .f-6, .f-headline { font-size: 6rem; diff --git a/src/css/imports/_typography.css b/src/css/imports/_typography.css index 4a41038..4d6fecc 100755 --- a/src/css/imports/_typography.css +++ b/src/css/imports/_typography.css @@ -10,7 +10,10 @@ */ - +p { + margin-bottom: 1rem; + max-width: 32rem; +} /* Measure is limited to ~66 characters */ .measure { @@ -24,7 +27,7 @@ /* Measure is limited to ~45 characters */ .measure-narrow { - max-width: 20em; + max-width: 25em; } /* Book paragraph style - paragraphs are indented with no vertical spacing. */ diff --git a/src/css/imports/_utilities.css b/src/css/imports/_utilities.css index 73c6b5d..01da910 100755 --- a/src/css/imports/_utilities.css +++ b/src/css/imports/_utilities.css @@ -58,3 +58,24 @@ margin-right: auto; margin-left: auto; } + +.fade-bottom-light { + position: relative; +} + +.fade-bottom-light:after { + + content: ""; + position: absolute; + z-index: 1; + bottom: 0; + left: 0; + pointer-events: none; + background-image: linear-gradient(to bottom, color(#F0F2F5 alpha(-100%)), var(--white) 90%); + width: 100%; + height: 3rem; + } + +.divider { + box-shadow: inset 0 -4px 0 var(--grey-1); +} diff --git a/src/css/imports/_variables.css b/src/css/imports/_variables.css new file mode 100644 index 0000000..f75395f --- /dev/null +++ b/src/css/imports/_variables.css @@ -0,0 +1,3 @@ +:root { + --hover-transition: all 150ms ease; +} diff --git a/src/css/main.css b/src/css/main.css index 98cfc95..c9a363a 100644 --- a/src/css/main.css +++ b/src/css/main.css @@ -12,7 +12,7 @@ * TABLE OF CONTENTS * * 1. External Library Includes - * - Normalize.css | http://normalize.css.github.io + * - Reset.css | http://meyerweb.com/eric/tools/css/reset/ * 2. Tachyons Modules * 3. Variables * - Media Queries @@ -25,7 +25,7 @@ /* External Library Includes */ -@import './imports/_normalize'; +@import './imports/_reset'; /* Modules */ @import './imports/_box-sizing'; @@ -34,10 +34,10 @@ @import './imports/_background-position'; @import './imports/_outlines'; @import './imports/_borders'; -@import './imports/_border-colors'; @import './imports/_border-radius'; @import './imports/_border-style'; @import './imports/_border-widths'; +@import './imports/_border-colors'; @import './imports/_box-shadow'; @import './imports/_code'; @import './imports/_coordinates'; @@ -59,10 +59,7 @@ @import './imports/_overflow'; @import './imports/_position'; @import './imports/_opacity'; -@import './imports/_skins'; -@import './imports/_skins-pseudo'; @import './imports/_spacing'; -@import './imports/_tables'; @import './imports/_text-decoration'; @import './imports/_text-align'; @import './imports/_text-transform'; @@ -75,15 +72,19 @@ @import './imports/_hovers'; @import './imports/_z-index'; @import './imports/_styles'; +@import './imports/_buttons'; +@import './imports/_svg'; +@import './imports/_cms'; /* Variables */ /* Importing here will allow you to override any variables in the modules */ @import './imports/_colors'; @import './imports/_media-queries'; +@import './imports/_variables'; /* Debugging */ @import './imports/_debug-children'; @import './imports/_debug-grid'; /* Uncomment out the line below to help debug layout issues */ -/* @import './imports/_debug'; */ +/*@import './imports/_debug';*/ diff --git a/src/site/static/img/icons/svg.html b/src/site/static/img/icons/svg.html new file mode 100644 index 0000000..e69de29 -- cgit v1.3