From a119fe64d25de6b4a35155ffc8cf30eaa9c69518 Mon Sep 17 00:00:00 2001 From: Kevin Chen Date: Sun, 21 Jan 2024 18:37:15 -0800 Subject: [PATCH 1/2] Adds anchor links to API subsections --- app/views/developer.scala.html | 87 +++++++++++++++++++++++++++++----- 1 file changed, 75 insertions(+), 12 deletions(-) diff --git a/app/views/developer.scala.html b/app/views/developer.scala.html index 9edacfac13..76f657feaf 100644 --- a/app/views/developer.scala.html +++ b/app/views/developer.scala.html @@ -37,7 +37,11 @@

Access APIs

-

Access Attributes

+

Access Attributes + + A link + +

Download Access Attribute Data @@ -172,7 +176,11 @@

Access Attributes

-

Access Score: Streets

+

Access Score: Streets + + A link + +

Download Access Score: Streets Data @@ -273,7 +281,11 @@

Access Score: Streets

-

Access Score: Neighborhood

+

Access Score: Neighborhood + + A link + +

Download Access Score: Neighborhood Data @@ -368,7 +380,11 @@

Access Score: Neighborhood

-

General Project Sidewalk Stats API

+

General Project Sidewalk Stats API + + A link + +

@@ -403,7 +419,11 @@

General Project Sidewalk Stats API

URL
-

Users API

+

Users API + + A link + +

@@ -435,10 +455,18 @@

Users API

URL
-

Access Dataset

+

Access Dataset + + A link + +

We are working on this!

-

Changes in API v2

+

Changes in API v2 + + A link + +

We have moved to v2 of the public API as of October, 2018. Changes include:

@@ -459,7 +487,11 @@

Changes in API v2

-

Disclaimer

+

Disclaimer + + A link + +

We are still in the experimental stage of the project, so we want you to keep in mind a few things, for example: @@ -477,8 +509,12 @@

Disclaimer

- -

Contribute

+ +

Contribute + + A link + +

All the code for Project Sidewalk is open source. You can find it in our GitHub repo. @@ -489,7 +525,11 @@

Contribute

-

Contact Us

+

Contact Us + + A link + +

Questions? Bugs? Feature requests and suggestions? Or anything else? Email us (sidewalk@@cs.uw.edu), post a @@ -502,7 +542,11 @@

Contact Us

-

License

+

License + + A link + +

The Project Sidewalk code is licensed under the terms of the MIT License.

@@ -518,6 +562,25 @@

License

#access-streets-dropdown { margin-top: 13px; } + .col-sm-8 { + scroll-margin-top: 100px; + } + .scroll-margin { + scroll-margin-top: 100px; + } + .permalink-icon { + height: 18px; + opacity: 0; + -webkit-transition: opacity 200ms ease-in-out; + transition: opacity 200ms ease-in-out; + } + .row { + padding-top: 0px; + margin-top: 0px; + } + .permalink-anchor:hover .permalink-icon { + opacity: 1; + } From 91a867c60a24e430d3f01248ab17083877350250 Mon Sep 17 00:00:00 2001 From: Mikey Saugstad Date: Mon, 22 Jan 2024 12:35:18 -0800 Subject: [PATCH 2/2] cleans up permalink code/css --- app/views/developer.scala.html | 115 +++++++----------- app/views/labelingGuideCurbRamps.scala.html | 104 ++++++++-------- app/views/labelingGuideNoSidewalk.scala.html | 14 +-- app/views/labelingGuideObstacles.scala.html | 30 ++--- app/views/labelingGuideOcclusion.scala.html | 2 +- .../labelingGuideSurfaceProblems.scala.html | 61 +++++----- public/stylesheets/labelingGuide.css | 22 ---- public/stylesheets/main.css | 18 ++- 8 files changed, 165 insertions(+), 201 deletions(-) diff --git a/app/views/developer.scala.html b/app/views/developer.scala.html index 76f657feaf..f0194cc0c9 100644 --- a/app/views/developer.scala.html +++ b/app/views/developer.scala.html @@ -12,34 +12,33 @@

Developer Zone

We serve our accessibility data in two formats: Access Attribute and Access Score. Access Attribute contains - point-level information on what accessibility attributes exist and where (latitude-longitude). See below for an example. - Access Score is a value that indicates how (in)accessible a given street/area is. See the Access Score APIs for examples. + point-level information on what accessibility attributes exist and where (latitude-longitude). See below for an example. + Access Score is a value that indicates how (in)accessible a given street/area is. See the Access Score APIs for examples.

- You can get the data through the REST APIs. - @*or download the zip file.*@ - You can also help contribute! The code is available on - github. + You can get the data through the REST APIs. You can also help + contribute! The code is available on + Github.

-
- -

Access APIs

-
+
-
-

Access Attributes - - A link +
@@ -169,16 +168,15 @@

Access Attributes

-
-

Access Score: Streets - - A link +
@@ -281,9 +279,9 @@

Access Score: Streets

-

Access Score: Neighborhood - - A link +
@@ -380,9 +378,9 @@

Access Score: Neighborhood
-

General Project Sidewalk Stats API - - A link + @@ -419,9 +417,9 @@

General Project Sidewalk Stats

-

Users API - - A link + @@ -455,20 +453,20 @@

Users API

-

Access Dataset - - A link +

We are working on this!

-

Changes in API v2 - - A link +

- We have moved to v2 of the public API as of October, 2018. Changes include: + We have moved to v2 of the public API as of October 2018. Changes include:

  1. More sophisticated clustering is used for the Attribute and Access Score endpoints.
    2. @@ -486,10 +484,9 @@

    Changes in API v2 the edge coordinates of the designated city.

- -

Disclaimer - - A link +

@@ -509,10 +506,9 @@

Disclaimer
- -

Contribute - - A link +

@@ -525,9 +521,9 @@

Contribute
-

Contact Us - - A link +

@@ -542,9 +538,9 @@

Contact Us
-

License - - A link +

@@ -557,29 +553,6 @@

License .map { margin: 25px 0 0 0; height: 300px; - width: 100%; - }, - #access-streets-dropdown { - margin-top: 13px; - } - .col-sm-8 { - scroll-margin-top: 100px; - } - .scroll-margin { - scroll-margin-top: 100px; - } - .permalink-icon { - height: 18px; - opacity: 0; - -webkit-transition: opacity 200ms ease-in-out; - transition: opacity 200ms ease-in-out; - } - .row { - padding-top: 0px; - margin-top: 0px; - } - .permalink-anchor:hover .permalink-icon { - opacity: 1; } diff --git a/app/views/labelingGuideCurbRamps.scala.html b/app/views/labelingGuideCurbRamps.scala.html index 47668f9147..d518442186 100644 --- a/app/views/labelingGuideCurbRamps.scala.html +++ b/app/views/labelingGuideCurbRamps.scala.html @@ -40,9 +40,9 @@

Curb Ramps

@Html(Messages("labeling.guide.curb.ramp.summary"))

-

How should I label corners with only one curb ramp? - - A link + @@ -95,10 +95,10 @@

How should I label cor

-

- What should I do when there is a curb ramp but there there is no sidewalk? - - A link +
@@ -134,10 +134,10 @@

-

+

@@ -172,9 +172,9 @@

-

How should I label driveways? - - A link +
@@ -212,9 +212,9 @@

How should I label driveways?

-

How should I label small side streets or alleyways? - - A link +
@@ -252,9 +252,9 @@

How should I label sma

-

How should I label crosswalks? - - A link +
@@ -289,10 +289,10 @@

How should I label crosswalks?

-

+

@@ -319,9 +319,9 @@

-

How should I label islands? - - A link +
@@ -371,9 +371,9 @@

How should I label islands?

-

How should I label an extension of walkway to a house? - - A link +
@@ -411,9 +411,9 @@

How should I label an

-

How should I label tactile warning? - - A link +
@@ -446,9 +446,9 @@

How should I label tactile warning?

-

How should I label surface problems on curb ramps? - - A link +
@@ -498,9 +498,9 @@

How should I label surf

-

How should I label narrow ramps? - - A link +
@@ -543,9 +543,9 @@

How should I label narrow ramps?

-

What should I do about debris on a curb ramp? - - A link +
@@ -583,9 +583,9 @@

What should I do about debris on

-

What should I do about insufficient landing space? - - A link +
@@ -630,9 +630,9 @@

What should I do about insu

-

How should I label steep flares? - - A link +
@@ -667,9 +667,9 @@

How should I label steep flares?

-

What should I do about steep counter slopes? - - A link +
@@ -685,9 +685,9 @@

What should I do about steep coun

-

What should I do about pooled water? - - A link +
diff --git a/app/views/labelingGuideNoSidewalk.scala.html b/app/views/labelingGuideNoSidewalk.scala.html index 3dec1c1d27..8bccfdc00d 100644 --- a/app/views/labelingGuideNoSidewalk.scala.html +++ b/app/views/labelingGuideNoSidewalk.scala.html @@ -33,16 +33,16 @@
-

No Sidewalk

+

No Sidewalk

A No Sidewalk label should be placed if there is a missing sidewalk where there should be one.

-

Where and how should I place a No Sidewalk label? - - A link +

@Html(Messages("labeling.guide.no.sidewalk.summary"))

@@ -79,9 +79,9 @@

Where and how should I place a No Si

-

Do I place a No Sidewalk label on a median? - - A link +

diff --git a/app/views/labelingGuideObstacles.scala.html b/app/views/labelingGuideObstacles.scala.html index 677328fa4c..e17eecd764 100644 --- a/app/views/labelingGuideObstacles.scala.html +++ b/app/views/labelingGuideObstacles.scala.html @@ -45,9 +45,9 @@

Obstacles

(ADA 305)

-

How should I mark an obstacle? - - A link +
@@ -91,9 +91,9 @@

How should I mark an obsta

-

What do I do about permanent obstacles? - - A link +
@@ -135,9 +135,9 @@

What do I do about permanent obsta

-

Do I label temporary obstacles as obstacles? - - A link +
@@ -180,9 +180,9 @@

Do I label temporary obstacles as

-

Do I label all objects as obstacles? - - A link +
@@ -232,9 +232,9 @@

Do I label all objects as obstacles?

-

How should I label obstacles in a crosswalk? - - A link +
diff --git a/app/views/labelingGuideOcclusion.scala.html b/app/views/labelingGuideOcclusion.scala.html index 5f1bc3e698..e9002e3963 100644 --- a/app/views/labelingGuideOcclusion.scala.html +++ b/app/views/labelingGuideOcclusion.scala.html @@ -33,7 +33,7 @@
-

Can't See the Sidewalk

+

Can't See the Sidewalk

@Html(Messages("labeling.guide.occlusion.summary"))

diff --git a/app/views/labelingGuideSurfaceProblems.scala.html b/app/views/labelingGuideSurfaceProblems.scala.html index b8e9cd4d8d..6e0c9f9bda 100644 --- a/app/views/labelingGuideSurfaceProblems.scala.html +++ b/app/views/labelingGuideSurfaceProblems.scala.html @@ -36,14 +36,13 @@
-

Surface Problems

@Html(Messages("labeling.guide.surface.problem.summary"))

-

How should I label sidewalk cracks? - - A link +
@@ -85,9 +84,9 @@

How should I label sidewalk cracks?

-

How should I label driveways? - - A link +
@@ -143,9 +142,9 @@

How should I label driveways?

-

How should I label gravel? - - A link +
@@ -179,10 +178,10 @@

How should I label gravel?

-

+

@@ -221,9 +220,9 @@

-

How should I label grates, gaps, and other openings? - - A link +
@@ -269,9 +268,9 @@

How should I label grat

-

How should I label narrow sidewalks? - - A link +
@@ -319,9 +318,9 @@

How should I label narrow sidewalks?

-

How should I label debris on sidewalk? - - A link +
@@ -356,9 +355,9 @@

How should I label debris on sidewa

-

How should I label grass on sidewalk blocks? - - A link +
@@ -393,9 +392,9 @@

How should I label grass on s

-

How should I label avoidable problems? - - A link +
@@ -418,9 +417,9 @@

How should I label avoidable proble

-

How should I label problems in a crosswalk? - - A link +
diff --git a/public/stylesheets/labelingGuide.css b/public/stylesheets/labelingGuide.css index 0e7a454c16..2137b1b6f9 100644 --- a/public/stylesheets/labelingGuide.css +++ b/public/stylesheets/labelingGuide.css @@ -1,9 +1,3 @@ -/*#faq-panel { - position: fixed; - width: 18%; - .faq ul#questions-list #subtopics li -}*/ - .help ul#questions-list #subtopics li { padding-left: 40px; } @@ -50,22 +44,6 @@ transition: max-height 0.2s ease-out; } -.permalink-icon { - height: 18px; - opacity: 0; - -webkit-transition: opacity 200ms ease-in-out; - transition: opacity 200ms ease-in-out; -} - .help-item { padding-bottom: 25px; } - -.question { - padding-top: 100px; - margin-top: -100px; -} - -.question:hover .permalink-icon { - opacity: 1; -} diff --git a/public/stylesheets/main.css b/public/stylesheets/main.css index 93e28df841..57a85c0a9a 100644 --- a/public/stylesheets/main.css +++ b/public/stylesheets/main.css @@ -780,8 +780,6 @@ kbd { } - - /* * Hamburger Menu styling based on Bootstrap 3.3.5's collapsible navbar * https://bootstrapdocs.com/v3.3.5/docs/components/#navbar @@ -892,3 +890,19 @@ kbd { .template { display: none; } + +/* Permalink styling and behavior. */ +.permalink-anchor { + scroll-margin-top: 85px; /* Offset for the fixed navbar plus a little extra. */ +} + +.permalink-icon { + height: 18px; + opacity: 0; + -webkit-transition: opacity 200ms ease-in-out; + transition: opacity 200ms ease-in-out; +} + +.permalink-anchor:hover .permalink-icon { + opacity: 1; +}