Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Year in review #81

Merged
merged 39 commits into from
Aug 15, 2019
Merged

Year in review #81

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
39 commits
Select commit Hold shift + click to select a range
1a12090
initial layout of Year in Review
xjenniferxie Jul 22, 2019
a4abbf7
making YIR CSS compatible with Feather
xjenniferxie Jul 23, 2019
bad3805
compatible with Feather
xjenniferxie Jul 23, 2019
93515b5
working on formatting tables
xjenniferxie Jul 29, 2019
3ba9684
formatting metrics content
xjenniferxie Jul 30, 2019
7297507
Formatted metrics
xjenniferxie Jul 31, 2019
429f4d5
deleted unused about page, added top nav to Year in Review
xjenniferxie Jul 31, 2019
98b1d07
working on locations formatting
xjenniferxie Aug 1, 2019
6eecfbc
adjusted font size in locations
xjenniferxie Aug 1, 2019
c1b6a1e
updated travis job and gitignore
Aug 2, 2019
bbfd962
moved scripts from metrics repo to this repo
Aug 2, 2019
f691c59
moved JSONs from _metadata to _data directory, deleted _metadata
Aug 2, 2019
920fe5a
top 10 repo data now comes from repo_commits.json
xjenniferxie Aug 2, 2019
d3ececd
Added Jen Y's animation of svg emojis
xjenniferxie Aug 2, 2019
f0d54d9
regenerated JSONs with fixed API endpoint for commit counts
Aug 5, 2019
884e072
Merge remote-tracking branch 'origin/year-in-review' into year-in-review
Aug 5, 2019
7ec6fdb
Updated header and last section's tweet
xjenniferxie Aug 9, 2019
6f56878
Put real copy in html
xjenniferxie Aug 9, 2019
a00309d
working on mobile responsiveness
xjenniferxie Aug 9, 2019
3d59b12
still workingo on mobile
xjenniferxie Aug 9, 2019
a32c021
good for iPad size
xjenniferxie Aug 9, 2019
3003b42
mobile looks much better
xjenniferxie Aug 9, 2019
d733c91
changed Github -> GitHub, updated glasses on top navigation
xjenniferxie Aug 9, 2019
abd2578
mobile nav works! :D
xjenniferxie Aug 9, 2019
7b502a5
fixed typo in mobile nav-menu
xjenniferxie Aug 10, 2019
48fb1f0
top 10 repos are now links
xjenniferxie Aug 12, 2019
1521a05
deleted old svgs, updated top 10 repo links
xjenniferxie Aug 12, 2019
341b6ce
reformatted and cleaned SVG CSS and fixed trigger on scroll bug
Aug 12, 2019
d99beaa
changed font weights to be feather variables
xjenniferxie Aug 13, 2019
289dae8
Merge branch 'year-in-review' of github.com:twitter/twitter.github.io…
xjenniferxie Aug 13, 2019
0e46e58
updated copy, pull requests -> PRs
xjenniferxie Aug 13, 2019
80e60d2
update aggregate_summary.json with final correct numbers
Aug 14, 2019
8a5aae1
Merge branch 'year-in-review' of github.com:twitter/twitter.github.io…
Aug 14, 2019
5d59a70
made breakpoints for when window height too small
xjenniferxie Aug 15, 2019
23fbd7a
Fixed typo of stars_count
xjenniferxie Aug 15, 2019
e85a50e
adjusted default layout
xjenniferxie Aug 15, 2019
ebc2351
added Year in Review link in default
xjenniferxie Aug 15, 2019
669f886
restructured some code
xjenniferxie Aug 15, 2019
6a420a7
re-commented
xjenniferxie Aug 15, 2019
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
Prev Previous commit
Next Next commit
Formatted metrics
  • Loading branch information
@xjenniferxie
xjenniferxie committed Jul 31, 2019
commit 7297507f45c2a6e006ac178c39fd1e5f277f8647
18 changes: 9 additions & 9 deletions css/year-in-review.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,10 +2,14 @@

:root {
--YIR-page-width: 1200px;
--timeline-width: 400px;

--timeline-active-text-width: 400px;
/* YIR-nav-body width + longer white line width + active li padding + YIR-nav-wrapper padding + */
--timeline-total-width: calc(var(--timeline-active-text-width) + 35px + var(--feather-grid-medium) + 2 * var(--feather-grid-large));
--nav-body-text-height: 80px;
--timeline-element-border-height: 100vh;

--metric-width: 520px;
--font-size-metric-count: 4.6rem;
--line-height-metric-count: 5rem;
}
Expand Down Expand Up @@ -74,11 +78,11 @@ img.emoji-outline {
}

.metric-wrapper {
margin-left: 500px; /* FIX - hardcoded */
margin-left: calc(var(--timeline-total-width) + 1.5 * var(--feather-grid-mega));
}

div.metric {
max-width: 550px; /* FIX - hardcoded */
max-width: var(--metric-width);
margin-top: var(--feather-grid-large);
}

Expand All @@ -92,11 +96,7 @@ span.metric-name {
font-weight: 600;
font-size: var(--font-size-mini-jumbo);
line-height: var(--line-height-mini-jumbo);
padding-left: var(--feather-grid-xxsmall); /* FIX - maybe space here? */
}

div.metric div.description {
/* font-size: var(--feather-font-size-xlarge); */
padding-left: var(--feather-grid-xxsmall);
}

/* Sections */
Expand Down Expand Up @@ -160,7 +160,7 @@ section:nth-child(8) {
}

.YIR-nav-body {
width: var(--timeline-width);
width: var(--timeline-active-text-width);
height: 0;
overflow: hidden;
opacity: 0;
Expand Down
72 changes: 58 additions & 14 deletions year-in-review.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -67,7 +67,7 @@

<section class="section1" id="section1">
<div class="YIR-container-section">

Header
</div>
</section>

Expand Down Expand Up @@ -134,21 +134,51 @@
</section>

<section class="section3" id="section3">
<div class="YIR-container-section">
Locations
</div>
</section>

<section class="section4" id="section4">
<div class="YIR-container-section">
<div class="metric-wrapper">
<img src="assets/year-in-review/fire_outline.svg" alt="Fire emoji" class="emoji-outline">

<div class="metric">
<span class="metric-count">100</span>
<span class="metric-name">commits</span>
<div class="description">
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut
</div>
</div>

<div class="metric">
<span class="metric-count">100</span>
<span class="metric-name">committers</span>
<div class="description">
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut
</div>
</div>
</div>
</div>
</section>

<section class="section5" id="section5">
<div class="YIR-container-section">
<div class="metric-wrapper">
<img src="assets/year-in-review/fire_outline.svg" alt="Fire emoji" class="emoji-outline">
<img src="assets/year-in-review/sun_outline.svg" alt="Fire emoji" class="emoji-outline">

<div class="metric">
<span class="metric-count">100</span>
<span class="metric-name">commits</span>
<span class="metric-name">watchers</span>
<div class="description">
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut
</div>
</div>

<div class="metric">
<span class="metric-count">100</span>
<span class="metric-name">committers</span>
<span class="metric-name">stars</span>
<div class="description">
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut
</div>
Expand All @@ -157,20 +187,34 @@
</div>
</section>

<section class="section4" id="section4">
Section 4
</section>

<section class="section5" id="section5">
Section 5
</section>

<section class="section6" id="section6">
Section 6
<div class="YIR-container-section">
<div class="metric-wrapper">
<img src="assets/year-in-review/heart_outline.svg" alt="Fire emoji" class="emoji-outline">

<div class="metric">
<span class="metric-count">100</span>
<span class="metric-name">forks</span>
<div class="description">
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut
</div>
</div>

<div class="metric">
<span class="metric-count">100</span>
<span class="metric-name">pull requests merged</span>
<div class="description">
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut
</div>
</div>
</div>
</div>
</section>

<section class="section7" id="section7">
Section 7
<div class="YIR-container-section">
Tweet
</div>
</section>

</div> <!-- End of YIR-wrapper -->
Expand Down