Bryan Ollendyke btopro

5 minute overview of what webcomponents are / considerations
- 96.4% of USA government web traffic can handle web components (probably closer to 98% in reality)
- 85% with no polyfills
- "Trouble" areas:
  - IE 10 and below
  - Safari 9 and below
  - Weird unknown browsers
- Ways around this
  - progressive enhancement from "Light DOM" content (PatternFly / Redhat do this)
limiting use of property / attribute / javascript

Make this the contents of a bookmark called Fix twitter:

javascript:(function()%7B var style %3D document.createElement(%27style%27), styleContent %3D document.createTextNode(%27.promoted-tweet, .Trends, .js-activity-favorite, .js-activity-favorited_retweet, .js-activity-favorited_mention, .moments.js-moments-tab, .dashboard-right, .dashboard-left %7B display:none !important%3B %7D .content-main %7B float: unset !important%3B width: unset !important%3B font-size:20px !important%3B %7D .TweetTextSize %7B font-size: 20px !important%3B line-height: 26px !important%3B %7D%27)%3B style.appendChild(styleContent )%3B var caput %3D document.getElementsByTagName(%27head%27)%3B caput%5B0%5D.appendChild(style)%3B %7D)()%3B

Then put it in your browser bar and when you access twitter, click fix twitter.

Build yourself

https://mcdlr.com/css-inject/

.promoted-tweet,

	import { dom } from "@polymer/polymer/lib/legacy/polymer.dom.js";
	/**
	* A collection of utility functions exported for convenience
	*/

	function encapScript(html) {
	// ensure this is a string to then do replacements on, rare but possible w/ null
	if (html && typeof html.replace === "function") {
	html = html.replace(/<script[\s\S]*?>/gi, "<script>");
	html = html.replace(/<\/script>/gi, "</script>");

	Start up Tool up

	Start up culture is a world of break fast, fix faster and the technologies used reflect that.
	But how do you get into the start up scene? Or more importantly, what do you need to know in order to attract offers,
	and get your resume to stand out in a world where thousands of "IT workers" will graduate along side you.

	You'll contribute to a large Penn State lead Open Source software project while building your digital identity as an IT professional on your journey to 1337 (elite).
	You'll improve online education while using things like version control (git), docker, web components, terminal, servers, screencasting and writing technical documentation.
	You'll work with platforms like Github, Digital Ocean, HAXcms, IFTTT, Slack, Travis CI and YouTube. Prior programming knowledge is beneficial but understanding of technical concepts is more important.

	/**
	* Strip word BS
	*/
	function stripMSWord(input) {
	// 1. remove line breaks / Mso classes
	var output = input.replace(/(\\|\\r\| class=(")?Mso[a-zA-Z]+(")?)/g, '');
	// 2. strip Word generated HTML comments
	output = output.replace(/<\!--(\s\|.)*?-->/gim, '');
	output = output.replace(/<\!(\s\|.)*?>/gim, '');
	// 3. remove tags leave content if any

	require "rubygems"
	require "twitter"
	require "json"

	# things you must configure
	TWITTER_USER = "your_username"
	MAX_AGE_IN_DAYS = 1 # anything older than this is deleted

	# get these from dev.twitter.com
	CONSUMER_KEY = "your_consumer_key"

	/**
	* Mix of solutions from https://stackoverflow.com/questions/8493195/how-can-i-parse-a-csv-string-with-javascript-which-contains-comma-in-data
	*/
	CSVtoArray(text) {
	let p = "",
	row = [""],
	ret = [row],
	i = 0,
	r = 0,
	s = !0,

	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="utf-8">
	<link rel="preconnect" crossorigin href="https://cdn.waxam.io">
	<link rel="preload" href="https://cdn.waxam.io/build/es6/dist/elmsln-build.js" as="script" crossorigin="anonymous">
	<link rel="preconnect" crossorigin href="https://fonts.googleapis.com">
	<link rel="preconnect" crossorigin href="https://cdnjs.cloudflare.com">
	<link rel="preconnect" crossorigin href="https://i.creativecommons.org">
	<link rel="preconnect" crossorigin href="https://licensebuttons.net">


	/**
	* Copyright 2019 {Your compay}
	* @license Apache-2.0, see License.md for full text.
	*/
	import { html, PolymerElement } from "@polymer/polymer/polymer-element.js";
	/**
	* `call-out-block`
	* `An auto generated element via to-element`
	*