Fixes #50: Improve organization of “chart gallery” #52
Conversation
…art and initiates new files for RiverConditions_Carousel
…y in the carousel
…s, cleans up riverConditionsCharts object array, adjusts carousel to use river conditions charts for slider images
… for flow tiles carousel
…utlines to both flow and river conditions charts
…in the site, removes those little boxes on Recent, Vis, and About in the header
…ds in more videos to the js file, updates gray border styling for river conditions
…r both flow and river conditions, adds link to river conditions code
There was a problem hiding this comment.
Nice job, this worked great for me:
One thing I noticed that is cool, but may also slow the page down, is that each of the videos for river conditions can be played in the site. That's pretty nice. As there are more and more we will need to be smart about using lazy loading so that page doesn't load all of the videos at start. Similarly, the chart gallery charts use full size images for the thumbnails and load all charts when the carousel is clicked in. In a future improvement we should implement lazy loading to optimize the page. Please add an issue to note this, otherwise looks good to merge in.
src/components/About.vue
Outdated
| @@ -146,6 +146,16 @@ $coolBlue: rgb(66, 145, 235); | |||
|
|
|||
| } | |||
| } | |||
| .usa-nav__primary button[aria-expanded=false] span::after { //removes those little squares that were appearing by Recent, Visualizations, About | |||
src/components/About.vue
Outdated
| display: inline-block; | ||
| height: 0px; | ||
| width: 0px; | ||
| content: ""; |
There was a problem hiding this comment.
Curious - what does this content: "" do?
There was a problem hiding this comment.
Good catch! Looks like nothing. Removed.
|
@cnell-usgs Made a few changes and opened issues based on your comments, so it should be good to merge in! I can't merge it myself because of my permissions on this repo. |
Changes made:
Adds carousels for quarterly river conditions and monthly flow tiles.
handleSlickClick()function on line 57 ofRiverConditions_Carousel.vue) to drupal to go to twitter instead (or removing it altogether and just having the videos as they are in the site). When I had the carousel as just images, I could not get the thumbnails to stop opening in full screen without disabling full screen for other elements throughout the app which is why I pivoted to embedded videos.Testing:
Before making this pull request, I:
I can confirm this has been checked on: