diff --git a/nuxt.config.js b/nuxt.config.js index 3354ac18c6..2641fb6d3f 100644 --- a/nuxt.config.js +++ b/nuxt.config.js @@ -50,6 +50,11 @@ module.exports = { exclude: /(node_modules)/ }); } + + config.module.rules.push({ + test: /\.md$/, + use: ['json-loader', 'yaml-frontmatter-loader'] + }); } } }; diff --git a/package-lock.json b/package-lock.json index a09b1e720d..8bb4909435 100644 --- a/package-lock.json +++ b/package-lock.json @@ -176,6 +176,28 @@ } } }, + "@nuxtjs/markdownit": { + "version": "1.2.1", + "resolved": + "https://registry.npmjs.org/@nuxtjs/markdownit/-/markdownit-1.2.1.tgz", + "integrity": "sha1-gMpyFv1ZQlswUqd6aFMkdvGa+p0=", + "requires": { + "@nuxtjs/markdownit-loader": "^1.1.1", + "raw-loader": "^0.5.1" + } + }, + "@nuxtjs/markdownit-loader": { + "version": "1.1.1", + "resolved": + "https://registry.npmjs.org/@nuxtjs/markdownit-loader/-/markdownit-loader-1.1.1.tgz", + "integrity": + "sha512-ijbEL5QOTRGuykwpikxaanxv5QntRiGYPtBDFvvdhoVNpsfbvROk1QnxCd2tMaYo6zKtpjFQS1RXcluwn5oTXg==", + "requires": { + "highlight.js": "^9.12.0", + "loader-utils": "^1.1.0", + "markdown-it": "^8.3.1" + } + }, "@nuxtjs/youch": { "version": "4.2.3", "resolved": "https://registry.npmjs.org/@nuxtjs/youch/-/youch-4.2.3.tgz", @@ -4532,6 +4554,36 @@ "readable-stream": "^2.0.0" } }, + "front-matter": { + "version": "2.3.0", + "resolved": + "https://registry.npmjs.org/front-matter/-/front-matter-2.3.0.tgz", + "integrity": "sha1-cgOviWzjV+4E4qpFFp6pHtf2dQQ=", + "dev": true, + "requires": { + "js-yaml": "^3.10.0" + }, + "dependencies": { + "esprima": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/esprima/-/esprima-4.0.0.tgz", + "integrity": + "sha512-oftTcaMu/EGrEIu904mWteKIv8vMuOgGYo7EhVJJN00R/EED9DCua/xxHRdYnKtcECzVg7xOWhflvJMnqcFZjw==", + "dev": true + }, + "js-yaml": { + "version": "3.12.0", + "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-3.12.0.tgz", + "integrity": + "sha512-PIt2cnwmPfL4hKNwqeiuz4bKfnzHTBv6HyVgjahA6mPLwPDzjDWrplJBMjHUFxku/N3FlmrbyPclad+I+4mJ3A==", + "dev": true, + "requires": { + "argparse": "^1.0.7", + "esprima": "^4.0.0" + } + } + } + }, "fs-extra": { "version": "5.0.0", "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-5.0.0.tgz", @@ -5406,6 +5458,12 @@ "resolved": "https://registry.npmjs.org/he/-/he-1.1.1.tgz", "integrity": "sha1-k0EP0hsAlzUVH4howvJx80J+I/0=" }, + "highlight.js": { + "version": "9.12.0", + "resolved": + "https://registry.npmjs.org/highlight.js/-/highlight.js-9.12.0.tgz", + "integrity": "sha1-5tnb5Xy+/mB1HwKvM2GVhwyQwB4=" + }, "hmac-drbg": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/hmac-drbg/-/hmac-drbg-1.0.1.tgz", @@ -6754,6 +6812,15 @@ "type-check": "~0.3.2" } }, + "linkify-it": { + "version": "2.0.3", + "resolved": + "https://registry.npmjs.org/linkify-it/-/linkify-it-2.0.3.tgz", + "integrity": "sha1-2UpGSPmxwXnWT6lykSaL22zpQ08=", + "requires": { + "uc.micro": "^1.0.1" + } + }, "lint-staged": { "version": "7.1.0", "resolved": @@ -7409,6 +7476,20 @@ "object-visit": "^1.0.0" } }, + "markdown-it": { + "version": "8.4.1", + "resolved": + "https://registry.npmjs.org/markdown-it/-/markdown-it-8.4.1.tgz", + "integrity": + "sha512-CzzqSSNkFRUf9vlWvhK1awpJreMRqdCrBvZ8DIoDWTOkESMIF741UPAhuAmbyWmdiFPA6WARNhnu2M6Nrhwa+A==", + "requires": { + "argparse": "^1.0.7", + "entities": "~1.1.1", + "linkify-it": "^2.0.0", + "mdurl": "^1.0.1", + "uc.micro": "^1.0.5" + } + }, "math-expression-evaluator": { "version": "1.2.17", "resolved": @@ -7431,6 +7512,11 @@ "inherits": "^2.0.1" } }, + "mdurl": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/mdurl/-/mdurl-1.0.1.tgz", + "integrity": "sha1-/oWy7HWlkDfyrf7BAP1sYBdhFS4=" + }, "media-typer": { "version": "0.3.0", "resolved": @@ -11850,6 +11936,12 @@ } } }, + "raw-loader": { + "version": "0.5.1", + "resolved": + "https://registry.npmjs.org/raw-loader/-/raw-loader-0.5.1.tgz", + "integrity": "sha1-DD0L6u2KAclm2Xh793goElKpeao=" + }, "read-cache": { "version": "1.0.0", "resolved": @@ -13265,7 +13357,9 @@ }, "stringstream": { "version": "0.0.5", - "resolved": "", + "resolved": + "https://registry.npmjs.org/stringstream/-/stringstream-0.0.5.tgz", + "integrity": "sha1-TkhM1N5aC7vuGORjB3EKioFiGHg=", "dev": true }, "strip-ansi": { @@ -13621,6 +13715,12 @@ "https://registry.npmjs.org/typedarray/-/typedarray-0.0.6.tgz", "integrity": "sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c=" }, + "uc.micro": { + "version": "1.0.5", + "resolved": "https://registry.npmjs.org/uc.micro/-/uc.micro-1.0.5.tgz", + "integrity": + "sha512-JoLI4g5zv5qNyT09f4YAvEZIIV1oOjqnewYg5D38dkQljIzpPT296dbIGvKro3digYI1bkb7W6EP1y4uDlmzLg==" + }, "uglify-js": { "version": "3.3.25", "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.3.25.tgz", @@ -14650,6 +14750,16 @@ "resolved": "https://registry.npmjs.org/yallist/-/yallist-2.1.2.tgz", "integrity": "sha1-HBH5IY8HYImkfdUS+TxmmaaoHVI=" }, + "yaml-frontmatter-loader": { + "version": "0.1.0", + "resolved": + "https://registry.npmjs.org/yaml-frontmatter-loader/-/yaml-frontmatter-loader-0.1.0.tgz", + "integrity": "sha1-bNveMMnpokwGSXdzjfPKrlfdrbo=", + "dev": true, + "requires": { + "front-matter": "^2.1.2" + } + }, "yargs": { "version": "8.0.2", "resolved": "https://registry.npmjs.org/yargs/-/yargs-8.0.2.tgz", diff --git a/package.json b/package.json index 9dab68d206..7241e5e6a7 100644 --- a/package.json +++ b/package.json @@ -18,6 +18,7 @@ "*.{json,css,scss}": ["prettier --write", "git add"] }, "dependencies": { + "@nuxtjs/markdownit": "^1.2.1", "normalize.scss": "^0.1.0", "nuxt": "^1.0.0", "vue-smooth-scroll": "^1.0.13" @@ -39,6 +40,7 @@ "prettier": "^1.12.1", "pug": "^2.0.3", "pug-loader": "^2.4.0", - "sass-loader": "^7.0.1" + "sass-loader": "^7.0.1", + "yaml-frontmatter-loader": "^0.1.0" } } diff --git a/pages/index.vue b/pages/index.vue index 044d7f876c..636e25b1e2 100644 --- a/pages/index.vue +++ b/pages/index.vue @@ -2,8 +2,8 @@ div header.hero .hero-inner - h1 contents.hero.title - p.type-featured contents.hero.dek + h1 {{ contents.hero.title }} + p.type-featured {{ contents.hero.dek }} form.js-ajax-form.hero-signup(name='Quick Signup Form') .form-input label(for='hero-signup').sr-only Enter your email address @@ -15,19 +15,18 @@ div strong Thanks! You'll hear from us soon. section#hack-nights.content-section.section-hack-nights .page-contain - h2 contents.location.title - div contents.location.dek + h2 {{ contents.location.title }} + div {{ contents.location.dek }} .locations - //- each location in contents.location.locations - //- .location - //- .location-img(style=`background-image: url("${location.image}")`) - //- .location-details - //- h3.location-header - //- strong= location.title - //- | #{location.date} - //- address. - //- #{location.address1}#[br] - //- #{location.address2}, #{location.city}, #{location.state} #{location.zip} + .location(v-for='location in contents.location.locations') + .location-img(:style='{ "background-image": `url(${location.image})` }') + .location-details + h3.location-header + strong {{ location.title }} + | {{ location.date }} + address. + {{ location.address1 }}#[br] + {{ location.address2 }}, {{ location.city }}, {{ location.state }} {{ location.zip }} p a(href='https://www.meetup.com/hackforla/', target='_blank').btn.btn-primary RSVP on Meetup @@ -76,9 +75,9 @@ div section#press.content-section.press .page-contain blockquote.quote - p contents.testimonial.quote - cite.type-h4 contents.testimonial.source - img(src=`contents.testimonial.image`).quote-tmb + p {{ contents.testimonial.quote }} + cite.type-h4 {{ contents.testimonial.source }} + img(:src='contents.testimonial.image').quote-tmb h2 Press ul.news-cards.unstyled-list //- each item in contents.press @@ -91,8 +90,8 @@ div section#about.content-section.about .page-contain - h2 contents.about.title - | contents.about.dek + h2 {{ contents.about.title }} + | {{ contents.about.dek }} #contact h3 Contact Us p. @@ -124,11 +123,12 @@ div diff --git a/static/content/index.md b/static/content/index.md new file mode 100644 index 0000000000..4704531c21 --- /dev/null +++ b/static/content/index.md @@ -0,0 +1,157 @@ +--- +title: Hack for LA +meta: + dek: '' +hero: + dek: >- + Can you design, write, or code? Are you an activist with an idea? You can + help Los Angeles live up to its potential at Hack for LA. Everyone is + welcome! + title: You can change LA for the better! +location: + dek: >- + We host weekly Hack Nights in Downtown Los Angeles and Santa Monica. At + these events, we organize groups of volunteers to build technology + addressing the LA region’s biggest civic issues. Each night offers an + inclusive, diverse community, and everyone is welcome. Join an existing + project team or pitch your own civic issue. + locations: + - address1: Carbon Five + address2: 525 Colorado Ave. + city: Santa Monica + date: 'Mondays at 6:00 pm' + image: /images/uploads/santa-monica.jpg + state: CA + title: Westside + zip: '90401' + - address1: 'La Kretz Innovation Center, Room 401' + address2: 525 S Hewitt St + city: Los Angeles + date: 'Tuesdays at 6:00 pm' + image: /images/uploads/la-kretz.jpg + state: CA + title: Downtown + zip: '90013' + title: Hack Nights - Every Monday & Tuesday +projects: + - dek: '' + image: /images/uploads/light-the-way.jpg + links: + - name: Github + url: 'https://github.com/light-the-way' + - name: Site + url: 'https://lighttheway.herokuapp.com/' + location: Downtown + looking: 'Front-end Developers, UX Designers' + title: Project Light The Way + - dek: >- + Applying for work should be simple—but the application process for the + City of LA is confusing and cumbersome. We’re going to make it easier to + find the job of your dreams. + image: /images/uploads/project-workforla.jpg + links: + - name: Site + url: 'http://www.workfor.la/' + location: Downtown + looking: 'UX, Writers, Designers' + partner: Department of Personnel + title: Work for LA + - dek: >- + Everyone deserves access to healthy food. Help us make it easier for + Angelenos to find the best places to buy or grow healthy food in their + city. + image: /images/uploads/project-fola.jpg + links: + - name: Github + url: 'https://github.com/foodoasisla' + - name: Site + url: 'https://foodoasis.la/' + location: '' + looking: '' + partner: Youth Policy Institute + title: Food Oasis + - dek: >- + There are thousands of works of public art scattered around the city. + There should be one place to see where they are and how they’re doing. + We’re building it. + image: /images/uploads/project-art.jpg + links: + - name: Github + url: 'https://github.com/hackforla/adopt-civic-art' + location: '' + looking: '' + partner: County of Los Angeles + title: ArtWatcher + - dek: >- + We are building a platform to engage the community to map and update the + city's parking restrictions. Simultaneously we want to create an app that + is easy for all people (community members, visitors, etc.) to use to see + the landscape of parking around themselves. We want to help you avoid + endlessly searching for parking in all the wrong places and reduce your + risk of getting tickets. + image: /images/uploads/project-curb-map.jpg + links: + - name: Github + url: 'https://github.com/curbmap' + - name: Site + url: 'https://curbmap.com/' + looking: 'UX designers, UX researchers, UI designers' + title: curbmap + location: Downtown + - dek: >- + Engage is a platform to stay up to date on your local issues, making it + easy to get your voice heard. + image: /images/uploads/project-engage.jpg + links: + - name: Github + url: 'https://github.com/hackla-engage' + - name: Site + url: 'https://engage-santa-monica.herokuapp.com/' + looking: >- + NLP engineers, Django developers (API), React developers, UX designers, + anyone else... + title: Engage + location: Santa Monica +testimonial: + image: /images/uploads/quote-garcetti.jpg + quote: >- + Hack for LA is a great example of how we can harness technology and our + city's creativity to solve everyday problems. As Mayor, I will closely + partner with our tech industry to create jobs and bring innovation to City + Hall so government works faster and more efficiently. + source: Mayor Eric Garcetti +press: + - source: CNN + title: Why LA’s Tech Community is Trying to Hack Hunger + url: 'http://money.cnn.com/2017/04/19/technology/la-food-deserts/' + - source: LA Times + title: 'At L.A. ''hackathon,'' civic-minded coders aim to put city data to good use' + url: >- + http://www.latimes.com/local/california/la-me-hackathon-20150607-story.html + - source: GovTech + title: March 4 Declared “Open Data Day” in Los Angeles + url: >- + http://www.govtech.com/dc/articles/March-4-Declared-Open-Data-Day-in-Los-Angeles-Cities-Worldwide.html +about: + dek: >- + Hack for LA is the official Los Angeles chapter of Code for America, a + national nonprofit that believes government can work for the people, by the + people, in the 21st century. We bring together coders, designers, + entrepreneurs, students, government staff, activists, and other civic-minded + people to solve the LA region’s biggest challenges. + title: Want to know more about Hack for LA? +sponsors: + - image: /images/uploads/logo-cfa.svg + name: Code for America + url: 'https://www.codeforamerica.org/' + - image: /images/uploads/logo-laci-updated.svg + name: Los Angeles Cleantech Incubator + url: 'http://laincubator.org/' + - image: /images/uploads/logo-carbon-five.jpg + name: Carbon Five + url: 'https://www.carbonfive.com/' + - image: /images/uploads/logo-hacker-fund.svg + name: Hacker Fund + url: 'https://www.hacker.fund' +template: _templates/_home.pug +---