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.

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

increase contrast of selected slide in ToC #315

Merged
merged 1 commit into from
Jun 14, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
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
27 changes: 14 additions & 13 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,6 +1,18 @@
# RAMP Storylines (formerly StoryRAMP)
# RAMP Storylines Editor (formerly StoryRAMP)

This project is an implementation of [RAMP2 FGP Visualiser](https://github.com/fgpv-vpgf/fgpv-vpgf), [Highcharts](https://www.highcharts.com/), and a number of other libraries, with the goal to provide a standards and guidelines compliant alternative to ArcGIS StoryMap, suitable for use in the Government of Canada's web presence.
RAMP Storylines Editor is an implementation of [RAMP4](https://github.com/ramp4-pcar4/ramp4-pcar4) (the mapping framework), [RAMP4 Config Editor](https://github.com/ramp4-pcar4/config-editor) (used to create map configurations), [Highcharts Editor](https://www.highcharts.com/blog/products/highcharts-editor/) (used to create interactive charts and graphs), and [Storylines](https://github.com/ramp4-pcar4/story-ramp) (used to host and display the created product).

The Storylines Editor is an easy-to-use, interactive narrative authoring tool used to produce and edit Storylines products that adhere to Government of Canada and Treasury Board web content standards and guidelines. The Editor allows for the customization of interactive maps and charts, and other multimedia to tell engaging stories about your data, and provides assistance in constructing complete configuration folders without the need to manually create and code configs.

This project is a work in progress.

For more information please see the [RAMP marketing site](https://ramp4-pcar4.github.io/ramp-pcar/#/?lang=en) or contact [[email protected]](mailto:[email protected]).

> This is an unsupported product. If you require a supported version please contact [email protected] for a cost estimate. The software and code samples available on this website are provided "as is" without warranty of any kind, either express or implied. Use at your own risk. Access to this GitHub repository could become unavailable at any point in time.

## Usage

General usage documentation will be available in the future.

## Project setup

Expand All @@ -23,14 +35,3 @@ npm run build
### Customize configuration

See [Configuration Reference](https://cli.vuejs.org/config/).

## Live examples

- [NPRI Sector Overview: Oil Sands Extraction](https://environmental-maps.canada.ca/RAMP-Storylines/index-ca-en.html#/en/410b88da-0ed1-4749-903f-5e76c24e2e5f)
- [NPRI Sector Overview: Pulp and Paper](https://environmental-maps.canada.ca/RAMP-Storylines/index-ca-en.html#/en/f6f7baf4-cccb-4521-a037-b4691b0f0d49)
- [NPRI Substance Overview: Ethylene Glycol](https://environmental-maps.canada.ca/RAMP-Storylines/index-ca-en.html#/en/ea24000c-7dc3-49a9-baac-c55d28dcaeb9)

## Future goals

- [ ] use [RAMP4](https://github.com/ramp4-pcar4/ramp4-pcar4) mapping platform
- [ ] development of a web-based editor
4 changes: 2 additions & 2 deletions src/components/slide-toc.vue
Original file line number Diff line number Diff line change
Expand Up @@ -72,8 +72,8 @@
<draggable v-model="slides" @update="$emit('slides-updated', slides)" item-key="title">
<template #item="{ element, index }">
<li
class="toc-slide border-t flex px-2 cursor-pointer hover:bg-gray-100"
:class="currentSlide === element ? 'bg-gray-100' : ''"
class="toc-slide border-t flex px-2 cursor-pointer hover:bg-gray-300"
:class="currentSlide === element ? 'bg-gray-300' : ''"
@click="selectSlide(index)"
:key="element.title + index"
v-tippy="{
Expand Down
Loading