rushilwiz/mit-regressions.github.io
1
0
Fork 0
mirror of https://github.com/mit-regressions/mit-regressions.github.io.git synced 2025-04-03 04:00:17 -04:00
Code Issues Actions Packages Projects Releases Wiki Activity

copy current version of regressions.net (putting off merge later)

Browse Source
This commit is contained in:
Lucas Igel 2022-10-14 01:53:28 -04:00
parent ec0df2c219
commit 7db92cd9f3
17 changed files with 615 additions and 477 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

0
.nojekyll
View File

2
CNAME
View File

@ -1 +1 @@
regressions.net
www.regressions.net

113
css/brands.css
View File

@ -38,7 +38,7 @@ button {
text-align: center;
vertical-align: middle;
font-size: 14px;
width: 200px;
width: 49%;
font-weight: 700;
line-height: 40px;
letter-spacing: 0.1px;
@ -46,6 +46,7 @@ button {
border-radius: 0px;
cursor: pointer;
filter: opacity(0.7);
margin-bottom: 5px;
}
button:hover,
@ -64,6 +65,49 @@ button:hover,
filter: brightness(90%);
}
/* Header-Button
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.header-button,
header-button {
display: inline-block;
text-decoration: none;
height: 40px;
text-align: center;
vertical-align: middle;
/* font size that scales with screen */
font-size: 1.275rem;
/* font-size: 24px; */
width: 24%;
font-weight: 700;
line-height: 40px;
letter-spacing: 0.1px;
white-space: wrap;
border-radius: 0px;
cursor: pointer;
filter: opacity(1);
margin-top: 7.5px;
margin-bottom: 5px;
/* non-bold */
font-weight: 400;
}
header-button:hover,
.header-button:focus {
color: #333;
border-color: #888;
outline: 0;
}
/* a header bar with reduced padding and margins */
.hr-regressions {
margin-top: 5px;
margin-bottom: 0px;
padding-top: 0px;
padding-bottom: 0px;
}
/* Brand Icons
–––––––––––––––––––––––––––––––––––––––––––––––––– */
@ -452,6 +496,46 @@ button:hover,
filter: brightness(90%);
}
/* REGRESSIONS BRAND */
.button.button-regressions {
width: 98%;
margin: 0 auto;
margin-bottom: 5px;
/* a wireframe-style button with a white outline and white text with black background */
color: #ffffff;
background-color: #000000;
border-style: solid;
border-color: #ffffff;
border-width: 2px;
/* a button that auto-resizes if on mobile*/
display: block;
}
.button.button-regressions:hover,
.button.button-regressions:focus {
filter: brightness(90%);
}
/* REGRESSIONS BRAND - TRAILER */
.button.button-regressions-trailer {
width: 98%;
margin: 0 auto;
margin-bottom: 5px;
/* a wireframe-style button with a white outline and white text with black background */
color: rgba(149,164,159,255);
background-color: #000000;
border-style: solid;
border-color: rgba(149,164,159,255);
border-width: 2px;
/* a button that auto-resizes if on mobile*/
display: block;
}
.button.button-regressions:hover,
.button.button-regressions:focus {
filter: brightness(90%);
}
/* Steam */
.button.button-steam {
color: #ffffff;
@ -613,6 +697,33 @@ button:hover,
filter: brightness(90%);
}
.button.button-regressions-screening {
margin: 0 auto;
padding: 0 0px;
padding-top: 10px;
/* monospace style */
font-family: monospace;
width: 98%;
margin: 0 auto;
margin-bottom: 15px;
margin-top: -10px;
font-size: 12px;
line-height: 1.5;
height: 70px;
color: #ffffffbf;
background-color: #000000;
border-style: solid;
border-color: #ffffff65;
border-width: 2px;
filter: opacity(1);
/* /* a button that auto-res */
}
.button.button-regressions-screening:hover,
.button.button-regressions-screening:focus {
filter: brightness(90%);
}
/* Letterboxd */
.button.button-letterboxd {
color: #ffffff;

208
css/skeleton-auto.css
View File

@ -1,208 +0,0 @@
/*
* littlelink V1
* https://littlelink.com
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
* 12/21/2019
*
* Built using:
*
* Skeleton V2.0.4
* Copyright 2014, Dave Gamache
* www.getskeleton.com
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
* 12/29/2014
*/
/* Table of contents
––––––––––––––––––––––––––––––––––––––––––––––––––
- Grid
- Base Styles
- Typography
- Links
- Code
- Spacing
- Utilities
*
* You'll find the button css in css/brands.css.
*
*/
/* Grid
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.container {
position: relative;
width: 100%;
max-width: 600px;
text-align: center;
margin: 0 auto;
padding: 0 20px;
box-sizing: border-box;
}
.container-left {
position: relative;
width: 100%;
max-width: 600px;
text-align: left;
margin: 0 auto;
padding: 0 20px;
box-sizing: border-box;
}
.column {
position: center;
width: 100%;
float: center;
box-sizing: border-box;
}
/* For devices larger than 400px */
@media (min-width: 400px) {
.container {
width: 85%;
padding: 0;
}
}
/* For devices larger than 550px */
@media (min-width: 550px) {
.container {
width: 80%;
}
.column,
.columns {
margin-left: 0;
}
.column:first-child,
.columns:first-child {
margin-left: 0;
}
}
/* Base Styles
–––––––––––––––––––––––––––––––––––––––––––––––––– */
/* NOTE
html is set to 62.5% so that all the REM measurements throughout Skeleton
are based on 10px sizing. So basically 1.5rem = 15px :) */
html {
font-size: 100%;
color-scheme: light dark;
}
body {
font-size: 18px;
line-height: 24px;
font-weight: 400;
font-family: "Open Sans", "HelveticaNeue", "Helvetica Neue", Helvetica, Arial,
sans-serif;
}
/* Typography
–––––––––––––––––––––––––––––––––––––––––––––––––– */
h1 {
margin-top: 0;
margin-bottom: 16px;
font-weight: 800;
}
h1 {
font-size: 24px;
line-height: 64px;
letter-spacing: 0;
}
/* Larger than phablet */
@media (min-width: 550px) {
h1 {
font-size: 48px;
line-height: 96px;
}
}
p {
margin-top: 0;
}
/* Links
–––––––––––––––––––––––––––––––––––––––––––––––––– */
a {
color: #0085ff;
}
a:hover {
color: #0085ff;
}
/* Code
–––––––––––––––––––––––––––––––––––––––––––––––––– */
code {
padding: 0.2rem 0.5rem;
margin: 0 0.2rem;
font-size: 90%;
white-space: nowrap;
background: #f1f1f1;
border: 1px solid #e1e1e1;
border-radius: 4px;
}
pre > code {
display: block;
padding: 1rem 1.5rem;
white-space: pre;
}
/* Spacing
–––––––––––––––––––––––––––––––––––––––––––––––––– */
button,
.button {
margin-bottom: 1rem;
}
input,
textarea,
select,
fieldset {
margin-bottom: 1.5rem;
}
pre,
blockquote,
dl,
figure,
p,
ol {
margin-bottom: 2.5rem;
}
/* Utilities
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.u-full-width {
width: 100%;
box-sizing: border-box;
}
.u-max-full-width {
max-width: 100%;
box-sizing: border-box;
}
.u-pull-right {
float: right;
}
.u-pull-left {
float: left;
}
/* Misc
–––––––––––––––––––––––––––––––––––––––––––––––––– */
hr {
margin-top: 3rem;
margin-bottom: 3.5rem;
border-width: 0;
border-top: 1px solid #e1e1e1;
}
/* Radius values:
10%-40%: Squircles
50% (default): True circle
*/
.avatar {
width: 128px;
height: 128px;
object-fit: cover;
background-position: center;
border-radius: 50%;
}

67
css/skeleton-dark.css
View File

@ -166,10 +166,12 @@ pre,
blockquote,
dl,
figure,
p,
ol {
margin-bottom: 2.5rem;
}
p {
margin-bottom: 0.5rem;
}
/* Utilities
–––––––––––––––––––––––––––––––––––––––––––––––––– */
@ -209,6 +211,13 @@ hr {
border-radius: 50%;
}
/*
REGRESSIONS STYLES
---- */
/*
a super wide horizontal logo centered in the screen with minimal padding
*/
@ -216,7 +225,8 @@ a super wide horizontal logo centered in the screen with minimal padding
width: 100%;
max-width: 600px;
margin: 0 auto;
padding: 0 20px;
padding: 0 0px;
padding-top: 15px;
box-sizing: border-box;
}
@ -224,6 +234,12 @@ a super wide horizontal logo centered in the screen with minimal padding
letter-spacing: -0.5px;
}
.email-line {
/* non-bold */
font-weight: 100;
letter-spacing: -0.5px;
}
/*
special hyperlink style for creators' names
*/
@ -231,15 +247,49 @@ a super wide horizontal logo centered in the screen with minimal padding
font-weight: bold;
text-decoration: none;
color: rgba(149,164,159,255);
filter: grayscale(0.3);
filter: grayscale(0.1);
}
.creator-name:hover {
font-weight: bold;
text-decoration: none;
color:rgba(149,164,159,255);
filter: grayscale(0);
}
.header-button-text {
/* font-weight: bold; */
text-decoration: none;
/* color: rgba(149,164,159,255); */
color: white;
filter: grayscale(1);
}
.header-button-text:hover {
/* font-weight: bold; */
text-decoration: none;
color:rgba(149,164,159,255);
filter: grayscale(0);
}
/*
special hyperlink style for creators' names
*/
.rsvp-line {
font-weight: bold;
text-decoration: none;
color: #e0b686;
filter: grayscale(0.1);
}
.rsvp-line:hover {
font-weight: bold;
text-decoration: none;
color:#e0b686;
filter: grayscale(0);
}
/*
small text for copyright notice
@ -250,3 +300,14 @@ a super wide horizontal logo centered in the screen with minimal padding
text-align: center;
margin-top: 1rem;
}
.desc {
text-align: right;
font-size: 12px;
color: rgb(255, 255, 255);
margin: 2rem auto;
margin-bottom: 0.5rem;
padding: 1rem;
margin-top: 0rem;
filter: opacity(0.8);
}

208
css/skeleton-light.css
View File

@ -1,208 +0,0 @@
/*
* littlelink V1
* https://littlelink.com
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
* 12/21/2019
*
* Built using:
*
* Skeleton V2.0.4
* Copyright 2014, Dave Gamache
* www.getskeleton.com
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
* 12/29/2014
*/
/* Table of contents
––––––––––––––––––––––––––––––––––––––––––––––––––
- Grid
- Base Styles
- Typography
- Links
- Code
- Spacing
- Utilities
*
* You'll find the button css in css/brands.css.
*
*/
/* Grid
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.container {
position: relative;
width: 100%;
max-width: 600px;
text-align: center;
margin: 0 auto;
padding: 0 20px;
box-sizing: border-box;
}
.container-left {
position: relative;
width: 100%;
max-width: 600px;
text-align: left;
margin: 0 auto;
padding: 0 20px;
box-sizing: border-box;
}
.column {
position: center;
width: 100%;
float: center;
box-sizing: border-box;
}
/* For devices larger than 400px */
@media (min-width: 400px) {
.container {
width: 85%;
padding: 0;
}
}
/* For devices larger than 550px */
@media (min-width: 550px) {
.container {
width: 80%;
}
.column,
.columns {
margin-left: 0;
}
.column:first-child,
.columns:first-child {
margin-left: 0;
}
}
/* Base Styles
–––––––––––––––––––––––––––––––––––––––––––––––––– */
/* NOTE
html is set to 62.5% so that all the REM measurements throughout Skeleton
are based on 10px sizing. So basically 1.5rem = 15px :) */
html {
font-size: 100%;
color-scheme: light;
}
body {
font-size: 18px;
line-height: 24px;
font-weight: 400;
font-family: "Open Sans", "HelveticaNeue", "Helvetica Neue", Helvetica, Arial,
sans-serif;
}
/* Typography
–––––––––––––––––––––––––––––––––––––––––––––––––– */
h1 {
margin-top: 0;
margin-bottom: 16px;
font-weight: 800;
}
h1 {
font-size: 24px;
line-height: 64px;
letter-spacing: 0;
}
/* Larger than phablet */
@media (min-width: 550px) {
h1 {
font-size: 48px;
line-height: 96px;
}
}
p {
margin-top: 0;
}
/* Links
–––––––––––––––––––––––––––––––––––––––––––––––––– */
a {
color: #0085ff;
}
a:hover {
color: #0085ff;
}
/* Code
–––––––––––––––––––––––––––––––––––––––––––––––––– */
code {
padding: 0.2rem 0.5rem;
margin: 0 0.2rem;
font-size: 90%;
white-space: nowrap;
background: #f1f1f1;
border: 1px solid #e1e1e1;
border-radius: 4px;
}
pre > code {
display: block;
padding: 1rem 1.5rem;
white-space: pre;
}
/* Spacing
–––––––––––––––––––––––––––––––––––––––––––––––––– */
button,
.button {
margin-bottom: 1rem;
}
input,
textarea,
select,
fieldset {
margin-bottom: 1.5rem;
}
pre,
blockquote,
dl,
figure,
p,
ol {
margin-bottom: 2.5rem;
}
/* Utilities
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.u-full-width {
width: 100%;
box-sizing: border-box;
}
.u-max-full-width {
max-width: 100%;
box-sizing: border-box;
}
.u-pull-right {
float: right;
}
.u-pull-left {
float: left;
}
/* Misc
–––––––––––––––––––––––––––––––––––––––––––––––––– */
hr {
margin-top: 3rem;
margin-bottom: 3.5rem;
border-width: 0;
border-top: 1px solid #e1e1e1;
}
/* Radius values:
10%-40%: Squircles
50% (default): True circle
*/
.avatar {
width: 128px;
height: 128px;
object-fit: cover;
background-position: center;
border-radius: 50%;
}

1
images/regressions-title-subtitle.svg Executable file
View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 987.92 208.29"><defs><style>.cls-1{font-size:110px;letter-spacing:-0.06em;}.cls-1,.cls-5{fill:#fff;font-family:Helvetica-Bold, Helvetica;font-weight:700;}.cls-2{letter-spacing:-0.15em;}.cls-3{letter-spacing:-0.08em;}.cls-4{letter-spacing:-0.07em;}.cls-5{font-size:60px;letter-spacing:-0.04em;}.cls-6{letter-spacing:-0.08em;}</style></defs><g id="Layer_2" data-name="Layer 2"><g id="Layer_1-2" data-name="Layer 1"><text class="cls-1" transform="translate(34.45 94.58)">MI<tspan class="cls-2" x="109.21" y="0">T</tspan><tspan class="cls-3" x="159.9" y="0">:</tspan><tspan class="cls-4" x="188.07" y="0">REGRESSIONS</tspan></text><text class="cls-5" transform="translate(330.28 163.4)">a history of the Institut<tspan class="cls-6" x="586.67" y="0">e</tspan></text></g></g></svg>
Side by Side

After

Width:  |  Height:  |  Size: 829 B

106
index.html
View File

@ -11,7 +11,7 @@
<meta name="author" content="Lucas Igel and Wesley Block">
<!-- Facebook Meta Tags -->
<meta property="og:url" content="http://regressions.net">
<meta property="og:url" content="https://regressions.net">
<meta property="og:type" content="website">
<meta property="og:title" content="MIT: REGRESSIONS, a documentary.">
<meta property="og:description" content="A feature-length film on the history of MIT, from World War 2 to COVID-19. Available soon on all platforms. Created by Wes and Luke.">
@ -20,7 +20,7 @@
<!-- Twitter Meta Tags -->
<meta name="twitter:card" content="summary_large_image">
<meta property="twitter:domain" content="regressions.net">
<meta property="twitter:url" content="http://regressions.net">
<meta property="twitter:url" content="https://regressions.net">
<meta name="twitter:title" content="MIT: REGRESSIONS, a documentary.">
<meta name="twitter:description" content="A feature-length film on the history of MIT, from World War 2 to COVID-19. Available soon on all platforms. Created by Wes and Luke.">
<meta name="twitter:image" content="images/social-v1.png">
@ -45,8 +45,6 @@
<link rel="stylesheet" href="css/normalize.css">
<!-- Themes:
Auto: css/skeleton-auto.css
Light: css/skeleton-light.css
Dark: css/skeleton-dark.css
-->
<link rel="stylesheet" href="css/skeleton-dark.css">
@ -61,13 +59,13 @@
<!-- Utils
–––––––––––––––––––––––––––––––––––––––––––––––––– -->
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-C4947HZ4CK"></script>
<script async src="https://www.googletagmanager.com/gtag/js?id=G-LZK0NQV957"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-C4947HZ4CK');
gtag('config', 'G-LZK0NQV957');
</script>
</head>
@ -78,7 +76,7 @@
–––––––––––––––––––––––––––––––––––––––––––––––––– -->
<div class="container">
<div class="row">
<div class="column" style="margin-top: 2.5%">
<div class="column" style="margin-top: -1%">
<!--
@ -98,73 +96,70 @@
-->
<a class="button button-regressions-screening" href="mailto:regressions@mit.edu?subject=re: Regressions Web Developer Role" target="_blank" rel="noopener">
<div>
<br>
seeking developers for version 2
<br>
<i>(a portal for all sources and footage)</i>
</div>
</a>
<!-- Your Image Here -->
<img src="images/regressions-title.png" class="regressions-logo" srcset="images/regressions-title.png 2x" alt="MIT:REGRESSIONS. A HISTORY OF THE INSTITUTE.">
<img src="images/regressions-title-subtitle.svg" class="regressions-logo" srcset="images/regressions-title-subtitle.svg 2x" alt="MIT:REGRESSIONS. A HISTORY OF THE INSTITUTE.">
<hr class="hr-regressions">
<!-- Title -->
<!-- <h1 class="regressions-title">MIT: REGRESSIONS</h1> -->
<!-- Subtitle -->
<!-- <h4 class="regressions-subtitle">A history of the Institute.</h2> -->
<!-- Short Bio -->
<p><b>A feature-length documentary on the history of MIT</b>, spanning from World War 2 to COVID-19.</p>
<p>Full release coming soon.</p>
<h4>TRAILER</h5>
<div class="row">
<div class="three columns">
<h2 class="header-button"><a class="header-button-text" href="https://regressions.net/trailer"><i>TRAILER</i></a></h2>
<h2 class="header-button"><a class="header-button-text" href="news.html"><i>NEWS</i></a></h2>
<h2 class="header-button"><a class="header-button-text" href="https://www.zeffy.com/en-US/donation-form/1ae74365-20e9-4652-8d1b-644d39fd8551"><i>DONATE</i></a></h2>
<h2 class="header-button"><a class="header-button-text" href="https://twitter.com/mitregressions"><i>BONUS</i></a></h2>
</div>
</div>
<hr class="hr-regressions">
<!-- <br> -->
<p class="desc">A feature-length documentary on the history of MIT, from World War 2 to COVID-19.</p>
<br>
<!---responsive iframe via embedresponsively.com-->
<style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style><div class='embed-container'><iframe src='https://www.youtube.com/embed//QfWYHSiq4_I?autoplay=1&cc_load_policy=1' allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" frameborder='0' allowfullscreen></iframe></div>
<!-- <iframe width="560" height="315" src="https://www.youtube.com/embed/QfWYHSiq4_I" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> -->
<!--
## Breaking down <a> attributes:
1.) class="button button-default" | The first "button" here is telling this <a> tag that it should make this element a button and applies the default styling in `css/brands.css`.
The second portion, button-default, is declaring the specific brand style you would like to apply. Here we're applying the "default" style and color.
If you want to make this button to use the brand colors for Discord, just change "button-default" to "button-discord". Brands are found in `css/brands.css`. You can always edit & add your own there.
2.) Replace the # in href="#" with the desired target URL for the button.
3.) target="_blank" | This attribute opens links in a new tab. Remove this attribute to prevent links from opening in a new tab.
4.) rel="noopener" | This attribute instructs the browser to navigate to the target resource without granting the new browsing context access to the document that opened it.
This is especially useful when opening untrusted links. https://developer.mozilla.org/en-US/docs/Web/HTML/Link_types/noopener
## Breaking down the <img> attributes:
1.) class="icon" | This class is telling the <img> tag that it should use the styling for icons found in `css/brands.css`.
2.) src="icons/[icon_name].svg" | This defines the icon you would like to display from the icons/ folder. For example, you can change this to src="icons/discord.svg" to use the Discord icon.
Add your own 24x24 icons to the "icons" folder to reference them. We recommend providing a SVG.
3.) alt="Example Logo" | This alt attribute helps provides alternate text for an image, this can assist users who use screen readers.
-->
<style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style><div class='embed-container'><iframe src='https://www.youtube.com/embed/mToftr444Pc?rel=0&modestbranding=1&autohide=1&mute=1&autoplay=1&cc_load_policy=1&muted=1&origin=https://regressions.net' allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" frameborder='0' allowfullscreen></iframe></div>
<!-- <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style><div class='embed-container'><iframe src='https://www.youtube.com/embed//QfWYHSiq4_I?rel=0&modestbranding=1&autohide=1&mute=1&autoplay=1&cc_load_policy=1&muted=1&origin=https://regressions.net' allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" frameborder='0' allowfullscreen></iframe></div> -->
<br>
<br>
<div class="row">
<div class="twelve columns">
<!-- MAILING LIST -->
<a class="button button-regressions" href="https://docs.google.com/forms/d/e/1FAIpQLSd9jkcDtmyI7ItSd8L_896MPQdRCzzCVw0RFmdJF9nqdocwcg/viewform" target="_blank" rel="noopener">
JOIN MAILING LIST
</a>
</div>
</div>
<!-- a 2 x 2 grid of buttons -->
<div class="row">
<div class="two columns">
<!-- Twitter -->
<a class="button button-twit" href="http://twitter.com/mitregressions" target="_blank" rel="noopener">
<img class="icon" src="images/icons/twitter.svg" alt="Twitter Logo">FOLLOW</a>
<a class="button button-twit" href="https://twitter.com/mitregressions" target="_blank" rel="noopener">
<img class="icon" src="images/icons/twitter.svg" alt="Twitter">FOLLOW</a>
<!-- Spotify -->
<a class="button button-spotify" href="https://open.spotify.com/playlist/3udeFyZERv8lvUcJ1SMgM1?si=3b9f60e264534f77&nd=1" target="_blank" rel="noopener">
<img class="icon" src="images/icons/spotify.svg" alt="Spotify Logo">LISTEN</a>
<img class="icon" src="images/icons/spotify.svg" alt="Spotify">LISTEN</a>
</div>
</div>
<div class="row">
<div class="two columns">
<!-- YouTube -->
<a class="button button-yt" href="https://www.youtube.com/channel/UCLdboODKAmPxA4WTLgzihSw/about" target="_blank" rel="noopener">
<img class="icon" src="images/icons/youtube.svg" alt="YouTube Logo">SUBSCRIBE</a>
<img class="icon" src="images/icons/youtube.svg" alt="YouTube">SUBSCRIBE</a>
<!-- Instagram -->
<a class="button button-instagram" href="https://www.instagram.com/mit.regressions/" target="_blank" rel="noopener">
<img class="icon" src="images/icons/instagram.svg" alt="Instagram Logo">FOLLOW</a>
<img class="icon" src="images/icons/instagram.svg" alt="Instagram">FOLLOW</a>
</div>
</div>
@ -179,6 +174,7 @@
-->
<p class="created-by-line"><b>Created by <a class="creator-name" href="https://www.linkedin.com/in/wesleyblock/">Wes</a> and <a class="creator-name" href="https://twitter.com/lukeigel/">Luke</a>.</b>
<p class="email-line"><a class="creator-name" href="mailto:regressions@mit.edu">regressions@mit.edu</a>
<p class="copyright">Copyright © 2022 REGRESSIONS, a registered 501(c)(3)</p>
</div>
</div>

16
lsc2-rsvp-qr/index.html Normal file
View File

@ -0,0 +1,16 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>
Redirecting to <a href="https://fb.me/e/1XZFlncKF">REGRESSIONS Facebook Event.</a>
</title>
<meta http-equiv="refresh" content="0; url=https://fb.me/e/1XZFlncKF">
</head>
<body>
<script>
window.location = "https://fb.me/e/1XZFlncKF";
</script>
<p>Redirecting...</p>
</body>
</html>

16
movie/index.html Normal file
View File

@ -0,0 +1,16 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>
Redirecting to <a href="https://youtu.be/mToftr444Pc">YouTube.</a>
</title>
<meta http-equiv="refresh" content="0; url=https://youtu.be/mToftr444Pc">
</head>
<body>
<script>
window.location = "https://youtu.be/mToftr444Pc";
</script>
<p>Redirecting...</p>
</body>
</html>

16
music/index.html Normal file
View File

@ -0,0 +1,16 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>
Redirecting to <a href="https://open.spotify.com/playlist/3udeFyZERv8lvUcJ1SMgM1?si=3b9f60e264534f77&nd=1">Spotify.</a>
</title>
<meta http-equiv="refresh" content="0; url=https://open.spotify.com/playlist/3udeFyZERv8lvUcJ1SMgM1?si=3b9f60e264534f77&nd=1">
</head>
<body>
<script>
window.location = "https://open.spotify.com/playlist/3udeFyZERv8lvUcJ1SMgM1?si=3b9f60e264534f77&nd=1";
</script>
<p>Redirecting...</p>
</body>
</html>

100
news.html Normal file
View File

@ -0,0 +1,100 @@
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Page Information
–––––––––––––––––––––––––––––––––––––––––––––––––– -->
<meta charset="utf-8">
<title>MIT: REGRESSIONS, a documentary.</title>
<meta name="description" content="A feature-length film on the history of MIT, from World War 2 to COVID-19. Available soon on all platforms. Created by Wes and Luke.">
<meta name="author" content="Lucas Igel and Wesley Block">
<!-- Facebook Meta Tags -->
<meta property="og:url" content="https://regressions.net">
<meta property="og:type" content="website">
<meta property="og:title" content="MIT: REGRESSIONS, a documentary.">
<meta property="og:description" content="A feature-length film on the history of MIT, from World War 2 to COVID-19. Available soon on all platforms. Created by Wes and Luke.">
<meta property="og:image" content="images/social-v1.png">
<!-- Twitter Meta Tags -->
<meta name="twitter:card" content="summary_large_image">
<meta property="twitter:domain" content="regressions.net">
<meta property="twitter:url" content="https://regressions.net">
<meta name="twitter:title" content="MIT: REGRESSIONS, a documentary.">
<meta name="twitter:description" content="A feature-length film on the history of MIT, from World War 2 to COVID-19. Available soon on all platforms. Created by Wes and Luke.">
<meta name="twitter:image" content="images/social-v1.png">
<!-- Favicon -->
<link rel="apple-touch-icon" sizes="180x180" href="../favicon/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="favicon/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="favicon/favicon-16x16.png">
<link rel="manifest" href="favicon/site.webmanifest">
<!-- Mobile Specific Metas
–––––––––––––––––––––––––––––––––––––––––––––––––– -->
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- FONT
–––––––––––––––––––––––––––––––––––––––––––––––––– -->
<link href="https://fonts.googleapis.com/css?family=Open+Sans:400,600,700,800&display=swap" rel="stylesheet">
<!-- CSS
–––––––––––––––––––––––––––––––––––––––––––––––––– -->
<link rel="stylesheet" href="css/normalize.css">
<!-- Themes:
Dark: css/skeleton-dark.css
-->
<link rel="stylesheet" href="css/skeleton-dark.css">
<link rel="stylesheet" href="css/brands.css">
<!-- Favicon
–––––––––––––––––––––––––––––––––––––––––––––––––– -->
<link rel="icon" type="image/png" href="images/avatar.png">
<!-- Utils
–––––––––––––––––––––––––––––––––––––––––––––––––– -->
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-LZK0NQV957"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-LZK0NQV957');
</script>
</head>
<body>
<div class="container">
<div class="row">
<div class="column" style="margin-top: 5%">
<!-- left-justfiy -->
<h2>REGRESSIONS IN THE NEWS MEDIA</h2>
<ul style="text-align: left;">
<br>
<i>10.12.22</i><br><b><a class="creator-name" href="https://mitadmissions.org/blogs/entry/mit-regressions-2/">MIT: REGRESSIONS</a></b><br> by Ankita Devasia @ MIT Admissions
<br>
<br>
<i>10.12.22</i><br><b><a class="creator-name" href="https://thetech.com/2022/10/12/mit-regressions-second-screening">‘MIT: REGRESSIONS’ sparks debate over the Institute’s past and future</a></b><br> by Cindy Xie @ The Tech
<br>
<br>
<i>07.24.22</i><br><b><a class="creator-name" href="https://reboothq.substack.com/p/mit-regressions#details">MIT: Progressions & Regressions</a></b><br> by Jessica Dai @ Reboot
<br>
<br>
<i>04.28.22</i><br><b><a class="creator-name" href="https://thetech.com/2022/04/28/mit-regressions-documentary">Behind the scenes of ‘MIT: Regressions (a history of the Institute)'</a></b><br> by Srinidhi Narayanan @ The Tech
</ul>
</div>
</div>
<br>
<a href="index.html">home</a>
</body>
</html>

189
original.html Normal file
View File

@ -0,0 +1,189 @@
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Page Information
–––––––––––––––––––––––––––––––––––––––––––––––––– -->
<meta charset="utf-8">
<title>MIT: REGRESSIONS, a documentary.</title>
<meta name="description" content="A feature-length film on the history of MIT, from World War 2 to COVID-19. Available soon on all platforms. Created by Wes and Luke.">
<meta name="author" content="Lucas Igel and Wesley Block">
<!-- Facebook Meta Tags -->
<meta property="og:url" content="http://regressions.net">
<meta property="og:type" content="website">
<meta property="og:title" content="MIT: REGRESSIONS, a documentary.">
<meta property="og:description" content="A feature-length film on the history of MIT, from World War 2 to COVID-19. Available soon on all platforms. Created by Wes and Luke.">
<meta property="og:image" content="images/social-v1.png">
<!-- Twitter Meta Tags -->
<meta name="twitter:card" content="summary_large_image">
<meta property="twitter:domain" content="regressions.net">
<meta property="twitter:url" content="http://regressions.net">
<meta name="twitter:title" content="MIT: REGRESSIONS, a documentary.">
<meta name="twitter:description" content="A feature-length film on the history of MIT, from World War 2 to COVID-19. Available soon on all platforms. Created by Wes and Luke.">
<meta name="twitter:image" content="images/social-v1.png">
<!-- Favicon -->
<link rel="apple-touch-icon" sizes="180x180" href="favicon/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="favicon/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="favicon/favicon-16x16.png">
<link rel="manifest" href="favicon/site.webmanifest">
<!-- Mobile Specific Metas
–––––––––––––––––––––––––––––––––––––––––––––––––– -->
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- FONT
–––––––––––––––––––––––––––––––––––––––––––––––––– -->
<link href="https://fonts.googleapis.com/css?family=Open+Sans:400,600,700,800&display=swap" rel="stylesheet">
<!-- CSS
–––––––––––––––––––––––––––––––––––––––––––––––––– -->
<link rel="stylesheet" href="css/normalize.css">
<!-- Themes:
Auto: css/skeleton-auto.css
Light: css/skeleton-light.css
Dark: css/skeleton-dark.css
-->
<link rel="stylesheet" href="css/skeleton-dark.css">
<link rel="stylesheet" href="css/brands.css">
<!-- Favicon
–––––––––––––––––––––––––––––––––––––––––––––––––– -->
<link rel="icon" type="image/png" href="images/avatar.png">
<!-- Utils
–––––––––––––––––––––––––––––––––––––––––––––––––– -->
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-C4947HZ4CK"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-C4947HZ4CK');
</script>
</head>
<body>
<!-- Primary Page Layout
–––––––––––––––––––––––––––––––––––––––––––––––––– -->
<div class="container">
<div class="row">
<div class="column" style="margin-top: 2.5%">
<!--
## Getting Started with LittleLink
This page has been built with every pre-designed button available in LittleLink by default. You can rearrange and delete as needed.
You can add your own brand or others brands you may need in the `css/brands.css` file.
You can add custom icons to `images/icons/...`. It is recommended to use a 24x24 .SVG.
Edit the "Your Image Here" section to add your own personal branding, like a picture of yourself or your brand logo!
Edit the "Title" section to change the page heading. You can use something like your name, your social handle, or your brand name.
Edit the "Short Bio" section tell users about yourself or your brand.
-->
<!-- Your Image Here -->
<img src="images/regressions-title.png" class="regressions-logo" srcset="images/regressions-title.png 2x" alt="MIT:REGRESSIONS. A HISTORY OF THE INSTITUTE.">
<!-- Title -->
<!-- <h1 class="regressions-title">MIT: REGRESSIONS</h1> -->
<!-- Subtitle -->
<!-- <h4 class="regressions-subtitle">A history of the Institute.</h2> -->
<!-- Short Bio -->
<p><b>A feature-length documentary on the history of MIT</b>, spanning from World War 2 to COVID-19.</p>
<p>Full release coming soon.</p>
<h4>TRAILER</h5>
<!---responsive iframe via embedresponsively.com-->
<style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style><div class='embed-container'><iframe src='https://www.youtube.com/embed//QfWYHSiq4_I?rel=0&modestbranding=1&autohide=1&mute=1&autoplay=1&cc_load_policy=1&muted=1&origin=http://regressions.net' allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" frameborder='0' allowfullscreen></iframe></div>
<!-- <iframe src="https://www.youtube.com/embed/hLaPedQVDfA?rel=0&modestbranding=1&autohide=1&mute=0&showinfo=0&controls=0&autoplay=1" width="560" height="315" frameborder="0" allowfullscreen></iframe> -->
<!---- ## Breaking down <a> attributes:
1.) class="button button-default" | The first "button" here is telling this <a> tag that it should make this element a button and applies the default styling in `css/brands.css`.
The second portion, button-default, is declaring the specific brand style you would like to apply. Here we're applying the "default" style and color.
If you want to make this button to use the brand colors for Discord, just change "button-default" to "button-discord". Brands are found in `css/brands.css`. You can always edit & add your own there.
2.) Replace the # in href="#" with the desired target URL for the button.
3.) target="_blank" | This attribute opens links in a new tab. Remove this attribute to prevent links from opening in a new tab.
4.) rel="noopener" | This attribute instructs the browser to navigate to the target resource without granting the new browsing context access to the document that opened it.
This is especially useful when opening untrusted links. https://developer.mozilla.org/en-US/docs/Web/HTML/Link_types/noopener
## Breaking down the <img> attributes:
1.) class="icon" | This class is telling the <img> tag that it should use the styling for icons found in `css/brands.css`.
2.) src="icons/[icon_name].svg" | This defines the icon you would like to display from the icons/ folder. For example, you can change this to src="icons/discord.svg" to use the Discord icon.
Add your own 24x24 icons to the "icons" folder to reference them. We recommend providing a SVG.
3.) alt="Example Logo" | This alt attribute helps provides alternate text for an image, this can assist users who use screen readers.
-->
<br>
<br>
<!-- a 2 x 2 grid of buttons -->
<div class="row">
<div class="two columns">
<!-- Twitter -->
<a class="button button-twit" href="http://twitter.com/mitregressions" target="_blank" rel="noopener">
<img class="icon" src="images/icons/twitter.svg" alt="Twitter Logo">FOLLOW</a>
<!-- Spotify -->
<a class="button button-spotify" href="https://open.spotify.com/playlist/3udeFyZERv8lvUcJ1SMgM1?si=3b9f60e264534f77&nd=1" target="_blank" rel="noopener">
<img class="icon" src="images/icons/spotify.svg" alt="Spotify Logo">LISTEN</a>
</div>
</div>
<div class="row">
<div class="two columns">
<!-- YouTube -->
<a class="button button-yt" href="https://www.youtube.com/channel/UCLdboODKAmPxA4WTLgzihSw/about" target="_blank" rel="noopener">
<img class="icon" src="images/icons/youtube.svg" alt="YouTube Logo">SUBSCRIBE</a>
<!-- Instagram -->
<a class="button button-instagram" href="https://www.instagram.com/mit.regressions/" target="_blank" rel="noopener">
<img class="icon" src="images/icons/instagram.svg" alt="Instagram Logo">FOLLOW</a>
</div>
</div>
<!-- Email -->
<!--<a class="button button-default" href="#" target="_blank" rel="noopener">
<img class="icon" src="images/icons/email.svg" alt="Email Icon">crew@regressions.net</a>
<br> -->
<br>
<!--
Footer
-->
<p class="created-by-line"><b>Created by <a class="creator-name" href="https://www.linkedin.com/in/wesleyblock/">Wes</a> and <a class="creator-name" href="https://twitter.com/lukeigel/">Luke</a>.</b>
<p class="copyright">Copyright © 2022 REGRESSIONS, a registered 501(c)(3)</p>
</div>
</div>
</div>
<!-- End Document
–––––––––––––––––––––––––––––––––––––––––––––––––– -->
</body>
</html>

16
rsvp/index.html Normal file
View File

@ -0,0 +1,16 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>
Redirecting to <a href="https://fb.me/e/1XZFlncKF">REGRESSIONS Facebook Event.</a>
</title>
<meta http-equiv="refresh" content="0; url=https://fb.me/e/1XZFlncKF">
</head>
<body>
<script>
window.location = "https://fb.me/e/1XZFlncKF";
</script>
<p>Redirecting...</p>
</body>
</html>

2
skeleton.css vendored
View File

@ -415,4 +415,4 @@ there.
@media (min-width: 1000px) {}
/* Larger than Desktop HD */
@media (min-width: 1200px) {}
@media (min-width: 1200px) {}

16
subscribe/index.html Normal file
View File

@ -0,0 +1,16 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>
Redirecting to <a href="https://forms.gle/qxwBYaHMvUtUoc45A">Spotify.</a>
</title>
<meta http-equiv="refresh" content="0; url=https://forms.gle/qxwBYaHMvUtUoc45A">
</head>
<body>
<script>
window.location = "https://forms.gle/qxwBYaHMvUtUoc45A";
</script>
<p>Redirecting...</p>
</body>
</html>

16
trailer/index.html Normal file
View File

@ -0,0 +1,16 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>
Redirecting to <a href=https://www.youtube.com/watch?v=QfWYHSiq4_I">YouTube.</a>
</title>
<meta http-equiv="refresh" content="0; url=https://www.youtube.com/watch?v=QfWYHSiq4_I">
</head>
<body>
<script>
window.location = "https://www.youtube.com/watch?v=QfWYHSiq4_I";
</script>
<p>Redirecting...</p>
</body>
</html>