Skip to content
This repository has been archived by the owner on Jun 10, 2019. It is now read-only.

Fixes #1017: Adds media highlights to Operation Code website: General #1024

Open
wants to merge 3 commits into
base: master
Choose a base branch
from
Open

Fixes #1017: Adds media highlights to Operation Code website: General #1024

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
eefb1d3
Fixes #1017: Adds media highlights to Operation Code website: General
cyph3r-m00n Aug 6, 2018
065bbf9
Changed <Link to, to <a href
cyph3r-m00n Aug 6, 2018
08e48cc
Changed Anchor Tags to use the OutboundLink component for Analytics.
cyph3r-m00n Aug 6, 2018
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
7 changes: 6 additions & 1 deletion src/scenes/home/press/press.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@ import Section from 'shared/components/section/section';
import PressVideos from './pressVideos/pressVideos';
import PressPhotos from './pressPhotos/pressPhotos';
import PressBranding from './pressBranding/pressBranding';
import PressLinks from './pressLinks/pressLinks';
import styles from './press.css';

const Press = () => (
Expand Down Expand Up @@ -71,7 +72,11 @@ const Press = () => (
<PressPhotos />
</Section>

<Section title="Branding">
<Section title="Press Articles">
<PressLinks />
</Section>

<Section title="Branding" theme="white">
<PressBranding />
</Section>
</div>
Expand Down
16 changes: 16 additions & 0 deletions src/scenes/home/press/pressLinks/pressLinks.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,16 @@
.logos a {
color: #249cbc;
text-decoration: none;
}

@media screen and (min-width: 415px) and (max-width: 1280px) {
.logos > .imgBox {
width: 350px;
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I don't see any elements with the class .imgBox in the markup - so is there any need for this CSS rule?

}
}

@media screen and (max-width: 414px) {
.logos > .imgBox {
width: 300px;
}
}
323 changes: 323 additions & 0 deletions src/scenes/home/press/pressLinks/pressLinks.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,323 @@
import React from 'react';
import styles from './pressLinks.css';

const ReactGA = require('react-ga');

function PressLinks() {
return (
<div className={styles.logos}>
<ul>
<li>
<ReactGA.OutboundLink
eventLabel="myLabel"
to="https://blog.opportunityatwork.org/techhire-educator-spotlight-operation-code-debd0a796f9d"
target="_blank"
>
TechHire Educator Spotlight: Operation Code
</ReactGA.OutboundLink>
</li>
<li>
<ReactGA.OutboundLink
eventLabel="myLabel"
to="https://www.switchup.org/blog/why-veterans-will-make-excellent-programmers"
target="_blank"
>
Why Veterans Will Make Excellent Programmers
</ReactGA.OutboundLink>
</li>
<li>
<ReactGA.OutboundLink
eventLabel="myLabel"
to="https://www.wired.com/story/thousands-of-veterans-want-to-learn-to-code-but-cant/"
target="_blank"
>
Thousands Of Veterans Want to Learn to Code But Cant
</ReactGA.OutboundLink>
</li>
<li>
<ReactGA.OutboundLink
eventLabel="myLabel"
to="https://medium.com/the-hum/hacking-entrepreneurship-an-interview-with-david-molina-of-operation-code-12a7e199e4e0"
target="_blank"
>
Hacking Entrepreneurship: An Interview with David Molina of Operation Code
</ReactGA.OutboundLink>
</li>
<li>
<ReactGA.OutboundLink
eventLabel="myLabel"
to="https://medium.com/operation-code/a-marine-vets-path-into-coding-brings-him-back-home-4fcf5645d740"
target="_blank"
>
A Marine Vet’s Path into Coding Brings Him Back Home
</ReactGA.OutboundLink>
</li>
<li>
<ReactGA.OutboundLink
eventLabel="myLabel"
to="http://blog.teamtreehouse.com/operation-code-connecting-veterans-with-code"
target="_blank"
>
Operation Code: Connecting Veterans with Code Skills
</ReactGA.OutboundLink>
</li>
<li>
<ReactGA.OutboundLink
eventLabel="myLabel"
to="https://blog.github.com/2016-11-11-operation-code-connecting-tech-and-veterans/"
target="_blank"
>
Operation Code: connecting tech and veterans
</ReactGA.OutboundLink>
</li>
<li>
<ReactGA.OutboundLink
eventLabel="myLabel"
to="https://www.geekwire.com/2016/call-duty-technology-veterans-rally-support-operation-code/"
target="_blank"
>
When the call of duty is technology, veterans rally to support each other through
Operation Code
</ReactGA.OutboundLink>
</li>
<li>
<ReactGA.OutboundLink
eventLabel="myLabel"
to="https://www.youtube.com/watch?v=qoy7scC2SHk"
target="_blank"
>
Get Coding Now with Operation Code Army Veteran and Founder David Molina
</ReactGA.OutboundLink>
</li>
<li>
<ReactGA.OutboundLink
eventLabel="myLabel"
to="https://www.youtube.com/watch?v=xN7yMoe38xc"
target="_blank"
>
The New Developer - Operation Code - GitHub Universe 2016
</ReactGA.OutboundLink>
</li>
<li>
<ReactGA.OutboundLink
eventLabel="myLabel"
to="https://www.youtube.com/watch?v=-wSwlLeKFdE"
target="_blank"
>
What happens when military veterans learn to code - CodeConf 2016
</ReactGA.OutboundLink>
</li>
<li>
<ReactGA.OutboundLink
eventLabel="myLabel"
to="https://opensource.com/article/17/4/operation-code-mentors-veterans"
target="_blank"
>
How Operation Code helps veterans learn programming skills
</ReactGA.OutboundLink>
</li>
<li>
<ReactGA.OutboundLink
eventLabel="myLabel"
to="https://softwareengineeringdaily.com/2016/03/20/helping-veterans-learn-code-david-molina/"
target="_blank"
>
Helping Veterans Learn to Code with David Molina
</ReactGA.OutboundLink>
</li>
<li>
<ReactGA.OutboundLink
eventLabel="myLabel"
to="https://developingstory.netlify.com/tds-66-david-molina-from-operation-code"
target="_blank"
>
Podcast from David Molina - Operation Code
</ReactGA.OutboundLink>
</li>
<li>
<ReactGA.OutboundLink
eventLabel="myLabel"
to="https://www.instagram.com/p/21p5bFxUjd/?taken-by=davidcmolina"
target="_blank"
>
Operation Code and AirBnb
</ReactGA.OutboundLink>
</li>
<li>
<ReactGA.OutboundLink
eventLabel="myLabel"
to="http://blog.teamtreehouse.com/from-aviation-electrician-to-back-end-engineering-bret-funk-operation-code-story"
target="_blank"
>
From Aviation Electrician to Back End Engineering: Bret Funk’s Operation Code story
</ReactGA.OutboundLink>
</li>
<li>
<ReactGA.OutboundLink
eventLabel="myLabel"
to="http://blog.teamtreehouse.com/navy-veteran-to-software-developer-geno-guerreros-operation-code-story"
target="_blank"
>
Navy Veteran to Software Developer: Geno Guerrero’s Operation Code Story
</ReactGA.OutboundLink>
</li>
<li>
<ReactGA.OutboundLink
eventLabel="myLabel"
to="http://blog.teamtreehouse.com/marine-corps-veteran-front-end-developer-billy-le"
target="_blank"
>
From Marine Corps Veteran to Front End Developer: Billy Le’s Operation Code Story
</ReactGA.OutboundLink>
</li>
<li>
<ReactGA.OutboundLink
eventLabel="myLabel"
to="https://techcrunch.com/2015/11/11/few-options-for-veterans-looking-to-enter-tech/"
target="_blank"
>
Few Options For Veterans Loking To Enter Tech
</ReactGA.OutboundLink>
</li>
<li>
<ReactGA.OutboundLink
eventLabel="myLabel"
to="https://www.ibtimes.com/coding-boot-camps-go-after-veterans-take-silicon-valleys-vacant-tech-jobs-2174421"
target="_blank"
>
Coding Boot Camps Go After Veterans To Take Silicon Valleys Vacant Tech Jobs
</ReactGA.OutboundLink>
</li>
<li>
<ReactGA.OutboundLink
eventLabel="myLabel"
to="https://www.makeschool.com/blog/20-diversity-and-inclusion-leaders-to-follow-in-2018"
target="_blank"
>
20 Diversity and Inclusion Leaders to Follow in 2018
</ReactGA.OutboundLink>
</li>
<li>
<ReactGA.OutboundLink
eventLabel="myLabel"
to="http://bitshare.cm/news/tech-innovation-meets-military-service-geekwires-memorial-day-remembrance-and-update/"
target="_blank"
>
Tech innovation meets military service: GeekWire’s Memorial Day remembrance and update
</ReactGA.OutboundLink>
</li>
<li>
<ReactGA.OutboundLink
eventLabel="myLabel"
to="https://www.millennialaction.org/press-archives/vetstechpr"
target="_blank"
>
MAP Hosts Congressional Briefing on Veterans Readiness in Tech Careers
</ReactGA.OutboundLink>
</li>
<li>
<ReactGA.OutboundLink
eventLabel="myLabel"
to="https://www.advfn.com/news_Analytics-Pros-Inc-Hosts-Training-for-Veterans-a_72657464.html"
target="_blank"
>
Analytics Pros, Inc. Hosts Training for Veterans and Veterans Spouses
</ReactGA.OutboundLink>
</li>
<li>
<ReactGA.OutboundLink
eventLabel="myLabel"
to="http://mentoringdevelopers.com/episode-36-how-to-pick-a-programming-language-to-learn-for-new-developers-part-2/"
target="_blank"
>
How to pick a programming language to learn for new developers
</ReactGA.OutboundLink>
</li>
<li>
<ReactGA.OutboundLink
eventLabel="myLabel"
to="https://www.blogs.va.gov/VAntage/33028/upskill-veterans-training-technology-jobs/"
target="_blank"
>
How to “upskill” Veterans’ training for technology jobs
</ReactGA.OutboundLink>
</li>
<li>
<ReactGA.OutboundLink
eventLabel="myLabel"
to="https://www.instagram.com/p/BbZT3Q-BBDC/"
target="_blank"
>
Oregon Veterans News Magazine
</ReactGA.OutboundLink>
</li>
<li>
<ReactGA.OutboundLink
eventLabel="myLabel"
to="https://blog.sabio.la/jameel-from-jarhead-to-softwareengineer-9130702da5c1"
target="_blank"
>
Jameel: From Marines to SoftwareEngineer
</ReactGA.OutboundLink>
</li>
<li>
<ReactGA.OutboundLink
eventLabel="myLabel"
to="https://www.seattletimes.com/business/technology/seattles-code-fellows-wins-approval-under-gi-bill/"
target="_blank"
>
Seattle coding-school tuition to be covered by GI Bill
</ReactGA.OutboundLink>
</li>
<li>
<ReactGA.OutboundLink
eventLabel="myLabel"
to="https://www.koin.com/news/veteran-gi-bill-should-cover-code-school_20180208085618706/960235415"
target="_blank"
>
Veteran: GI Bill should cover code school
</ReactGA.OutboundLink>
</li>
<li>
<ReactGA.OutboundLink
eventLabel="myLabel"
to="http://patriotbootcamp.org/blog/operation-code"
target="_blank"
>
Patriot Boot Camp and Operation Code join forces to help military veterans become
technology entrepreneurs
</ReactGA.OutboundLink>
</li>
<li>
<ReactGA.OutboundLink
eventLabel="myLabel"
to="http://www.maswired.com/operation-code-wants-veterans-to-work-in-tech/"
target="_blank"
>
Operation Code wants veterans to work in tech
</ReactGA.OutboundLink>
</li>
<li>
<ReactGA.OutboundLink
eventLabel="myLabel"
to="http://diversemilitary.net/2017/06/27/coding-bootcamps-accepts-gi-bill/"
target="_blank"
>
Coding Bootcamps Accepts GI Bill
</ReactGA.OutboundLink>
</li>
<li>
<ReactGA.OutboundLink
eventLabel="myLabel"
to="https://news.clearancejobs.com/2017/07/17/operation-code-looks-help-veterans-land-careers/"
target="_blank"
>
Operation Code Looks to Help Veterans Land IT Careers
</ReactGA.OutboundLink>
</li>
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

selection_081

The list-items could use some vertical space between them on mobile to provide visual separation between elements. I suggest adjusting the line-height for the all <li> elements, and adjusting the margin-top for adjacent sibling <li> elements:

.item {
  line-height: 1;
}

.item + .item {
  margin-top: 5px;
}

Due to the small width of mobile screens, for the <ul> element, the bullets can probably be removed, and the padding can be adjusted:

.list {
    list-style: none;
    padding: 0 20px;
}

</ul>
</div>
);
}

export default PressLinks;