Putting a bunch of dates or times onto a timeline bar, like we did in the Parler app: https://projects.propublica.org/parler-capitol-videos/
Lena Groeger lenagroeger
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <meta charset="utf-8" /> | |
| <meta name="viewport" content="width=device-width, initial-scale=1" /> | |
| <style> | |
| body { | |
| margin: 0px; | |
| } | |
| .scrolly-centered { |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <style> | |
| .scrolly-side-by-side { | |
| position: relative; | |
| display: -webkit-box; | |
| display: -ms-flexbox; | |
| display: flex; | |
| padding: 1rem; | |
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| let openerMarkup = document.createElement("div"); | |
| openerMarkup.classList.add( | |
| "opener__art", | |
| "opener__art-start--1", | |
| "opener__art-width--6" | |
| ); | |
| openerMarkup.innerHTML = ` | |
| <div id="scroll-opener"> | |
| <div class="scrolly scroll-item"> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <style type="text/css"> | |
| .image-gallery ul { | |
| display: flex; | |
| flex-flow: row wrap; | |
| list-style: none; | |
| margin: 0px auto; | |
| padding: 0px; | |
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <meta charset="utf-8" /> | |
| <meta name="viewport" content="width=device-width, initial-scale=1" /> | |
| <style> | |
| body { | |
| margin: 0px; | |
| } | |
| .scrolly-centered { |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <style type="text/css"> | |
| .article-body p { | |
| width: 90%; | |
| max-width: 700px; | |
| font-size: 17px; | |
| font-family: Tiempos Text, serif; | |
| margin: 15px auto; | |
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| height: 800 | |
| scrolling: yes |
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
NewerOlder