diff --git a/.storybook/main.js b/.storybook/main.js index bb349649f..27f93ac31 100644 --- a/.storybook/main.js +++ b/.storybook/main.js @@ -29,7 +29,16 @@ module.exports = { ], webpackFinal: async (config, { configType }) => { // This method is for altering Storybook's webpack configuration. - + // Add support for importing image files + config.module.rules.push({ + test: /\.(png|jpg|gif|svg)$/, + use: [ + { + loader: 'file-loader', + }, + ], + include: path.resolve(__dirname, './packages/transitive-overlay/src/images'), + }); // Add support for importing YAML files. config.module.rules.push({ test: /\.(yml|yaml)$/, diff --git a/__snapshots__/storybook.test.ts.snap b/__snapshots__/storybook.test.ts.snap index 21103cf3e..ed34d8b5c 100644 --- a/__snapshots__/storybook.test.ts.snap +++ b/__snapshots__/storybook.test.ts.snap @@ -1323,6 +1323,446 @@ Array [ ] `; +exports[`Storyshots Building-Blocks/Dropdown Dropdown As Otprr Nav Item 1`] = ` + + + + + + + + + +`; + +exports[`Storyshots Building-Blocks/Dropdown Dropdown As Otprr Nav Item 2`] = ` +.c2 { + background: #fff; + border: 1px solid black; + border-radius: 5px; + color: inherit; + padding: 5px 7px; + -webkit-transition: all 0.1s ease-in-out; + transition: all 0.1s ease-in-out; +} + +.c2 span.caret { + border-left: 4px solid transparent; + border-right: 4px solid transparent; + border-top: 4px solid; + color: inherit; + display: inline-block; + height: 0; + margin-left: 5px; + vertical-align: middle; + width: 0; +} + +.c2:hover, +.c2[aria-expanded="true"] { + background: #ECECEC; + color: black; + cursor: pointer; +} + +.c1 { + float: left; + position: relative; +} + +.c0 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + background: #004686; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + min-height: 50px; + padding: 0 10px; + position: relative; + width: 100%; +} + +.c0 .navBarItem { + position: static; +} + +.c0 .navBarItem > button { + background: transparent; + border: none; + color: white; + padding: 15px; +} + +.c0 .navBarItem > button:hover { + background: rgba(0,0,0,0.05); + color: #ececec; +} + +@media (max-width:768px) { + .c0 .navBarItem > button { + padding: 10px; + } +} + +
+ + + +
+`; + +exports[`Storyshots Building-Blocks/Dropdown Dropdown With Label 1`] = ` + + + More content here + + +`; + +exports[`Storyshots Building-Blocks/Dropdown Dropdown With Label 2`] = ` +.c1 { + background: #fff; + border: 1px solid black; + border-radius: 5px; + color: inherit; + padding: 5px 7px; + -webkit-transition: all 0.1s ease-in-out; + transition: all 0.1s ease-in-out; +} + +.c1 span.caret { + border-left: 4px solid transparent; + border-right: 4px solid transparent; + border-top: 4px solid; + color: inherit; + display: inline-block; + height: 0; + margin-left: 5px; + vertical-align: middle; + width: 0; +} + +.c1:hover, +.c1[aria-expanded="true"] { + background: #ECECEC; + color: black; + cursor: pointer; +} + +.c0 { + float: left; + position: relative; +} + + + + +`; + +exports[`Storyshots Building-Blocks/Dropdown Dropdown With List 1`] = ` + + +
  • + +
    • +
  • + +
    • +
  • + +
    • +     +     +`; + +exports[`Storyshots Building-Blocks/Dropdown Dropdown With List 2`] = ` +.c1 { + background: #fff; + border: 1px solid black; + border-radius: 5px; + color: inherit; + padding: 5px 7px; + -webkit-transition: all 0.1s ease-in-out; + transition: all 0.1s ease-in-out; +} + +.c1 span.caret { + border-left: 4px solid transparent; + border-right: 4px solid transparent; + border-top: 4px solid; + color: inherit; + display: inline-block; + height: 0; + margin-left: 5px; + vertical-align: middle; + width: 0; +} + +.c1:hover, +.c1[aria-expanded="true"] { + background: #ECECEC; + color: black; + cursor: pointer; +} + +.c0 { + float: left; + position: relative; +} + + + + +`; + +exports[`Storyshots Building-Blocks/Dropdown Dropdown With List Align Menu Left 1`] = ` + + +
  • + +
    • +
  • + +
    • +
  • + +
    • +     +     +`; + +exports[`Storyshots Building-Blocks/Dropdown Dropdown With List Align Menu Left 2`] = ` +.c1 { + background: #fff; + border: 1px solid black; + border-radius: 5px; + color: inherit; + padding: 5px 7px; + -webkit-transition: all 0.1s ease-in-out; + transition: all 0.1s ease-in-out; +} + +.c1 span.caret { + border-left: 4px solid transparent; + border-right: 4px solid transparent; + border-top: 4px solid; + color: inherit; + display: inline-block; + height: 0; + margin-left: 5px; + vertical-align: middle; + width: 0; +} + +.c1:hover, +.c1[aria-expanded="true"] { + background: #ECECEC; + color: black; + cursor: pointer; +} + +.c0 { + float: left; + position: relative; +} + + + + +`; + exports[`Storyshots EndpointsOverlay Endpoints Overlay With Custom Map Markers 1`] = ` `; +exports[`Storyshots Icons/SeptaModeIcon Septa Mode Icon Examples 1`] = ` + + + +`; + +exports[`Storyshots Icons/SeptaModeIcon Septa Mode Icon Examples 2`] = ` +.c0 { + border-collapse: collapse; + border-spacing: 0; + font-family: system-ui; + vertical-align: middle; +} + +.c0 div { + width: 50px; +} + +.c0 td, +.c0 th { + padding: 10px; +} + +.c0 tr { + border: 1px solid gray; +} + +.c0 tbody tr:nth-child(even) { + background-color: #eaeaea; +} + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + Mode Type + + Result +
    + BICYCLE + +
    + + + +
    +
    + BICYCLE_RENT + +
    + + + +
    +
    + BUS + +
    + + + + + + + + + +
    +
    + CAR + +
    + + + +
    +
    + CAR_PARK + +
    + + + +
    +
    + FERRY + +
    +
    + GONDOLA + +
    +
    + MICROMOBILITY + +
    +
    + MICROMOBILITY_RENT + +
    +
    + SCOOTER + +
    +
    + RAIL + +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
    + STREETCAR + +
    + + + + + + +
    +
    + SUBWAY + +
    + + + + + + +
    +
    + TRAM + +
    + + + + + + +
    +
    + TRANSIT + +
    + + + + + + +
    +
    + WALK + +
    + + + +
    +
    + NONE_OF_THE_ABOVE + +
    +
    +`; + exports[`Storyshots Icons/StandardLegIcon Standard Leg Icon Examples 1`] = ` `; -exports[`Storyshots ItineraryBody/otp-react-redux Bike Only Itinerary 1`] = ` +exports[`Storyshots ItineraryBody/otp-react-redux Approximate Prefix Itinerary 1`] = ` `; -exports[`Storyshots ItineraryBody/otp-react-redux Bike Only Itinerary 2`] = ` +exports[`Storyshots ItineraryBody/otp-react-redux Approximate Prefix Itinerary 2`] = ` .c8 { display: inline-block; vertical-align: middle; @@ -6066,7 +7050,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Only Itinerary 2`] = ` color: #333; } -.c44 { +.c64 { color: #f44256; } @@ -6080,11 +7064,38 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Only Itinerary 2`] = ` text-decoration: none; } +.c40 { + color: #008; + margin-left: 5px; +} + +.c40:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c41 { + padding-left: 0px; +} + +.c41:before { + content: "|"; + color: black; + margin-right: 5px; +} + .c31::before { content: ""; margin: 0 0.125em; } +.c59 { + display: block; + font-size: 13px; + list-style: none; + padding: 0; +} + .c0 { list-style: none; padding: 0; @@ -6130,10 +7141,29 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Only Itinerary 2`] = ` width: 0; } +.c46 { + font-weight: 200; +} + .c25 { font-weight: inherit; } +.c45 { + font-size: 13px; + font-weight: 500; +} + +.c44 { + font-weight: 800; + margin-right: 6px; +} + +.c42 { + color: #807373; + margin-top: 5px; +} + .c24 img, .c24 svg { margin-right: 6px; @@ -6156,38 +7186,16 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Only Itinerary 2`] = ` .c28 { display: grid; - grid-template-columns: 100px auto; + grid-template-columns: 130px auto; } .c3 { max-width: 500px; display: grid; + grid-template-areas: "time line title" "time line instructions"; grid-template-columns: 65px 30px auto; } -.c38 { - border-color: #fff; - border-radius: 5px; - border-style: solid; - border-width: 1px; - display: inline-block; - font-style: normal; - grid-column: 2; - grid-row: 1; - margin: 0 4px; - position: relative; - text-align: center; - -webkit-text-decoration: none; - text-decoration: none; - vertical-align: middle; - width: 75%; -} - -.c38:hover { - border-color: #d1d5da; - background-color: #f6f8fa; -} - .c18 { grid-column-start: 1; grid-row: 1 / span 2; @@ -6198,6 +7206,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Only Itinerary 2`] = ` .c20 { grid-row-start: 2; grid-column-start: 3; + grid-area: instructions; } .c14 { @@ -6225,29 +7234,12 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Only Itinerary 2`] = ` } .c39 { - padding: 2px; - width: 100%; -} - -.c41 { - font-size: xx-small; -} - -.c41::before { - content: ""; - margin: 0 0.125em; -} - -.c42 { - color: #e60000; -} - -.c43 { - color: green; -} - -.c40 { - font-size: small; + color: #807373; + font-size: 13px; + font-weight: 300; + padding-top: 1px; + margin-bottom: 10px; + margin-top: -14px; } .c32 { @@ -6323,6 +7315,126 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Only Itinerary 2`] = ` padding-left: 1ch; } +.c62 { + float: left; + margin-left: -36px; + color: #fff; +} + +.c63 { + color: #676767; + margin-top: 3px; +} + +.c60 { + z-index: 30; + position: relative; +} + +.c50 { + background-color: #eee; + border-radius: 4px; + color: #000; + display: block; + margin-top: 5px; + padding: 8px; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c54 { + -webkit-align-items: baseline; + -webkit-box-align: baseline; + -ms-flex-align: baseline; + align-items: baseline; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + gap: 5px; + margin-top: 0.5em; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c54:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c52 { + font-size: 12px; + margin-left: 30px; + white-space: pre-wrap; +} + +.c53 { + margin-top: 5px; + margin-left: 30px; + font-size: 12px; + font-style: italic; +} + +.c51 { + float: left; + font-size: 18px; +} + +.c49 { + display: block; + margin-top: 3px; + padding: 0; +} + +.c48 { + color: #d14727; + cursor: cursor; + display: inline-block; + font-weight: 400; + margin-top: 8px; + padding: 0; +} + +.c55 { + margin-top: 5px; +} + +.c56 { + color: #676767; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; +} + +.c58 { + font-size: 14px; +} + +.c57 { + padding: 0; +} + +.c47 { + margin-top: 5px; +} + +.c47 a { + color: #337ab7; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c47 a:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c47 img { + margin-left: 5px; + vertical-align: middle; +} + .c1 { font-size: 16px; } @@ -6332,7 +7444,28 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Only Itinerary 2`] = ` font-family: Hind,sans-serif; } +.c1 .c43 { + background-color: rgb(15,106,172); + border-color: white; + border-image: initial; + border-radius: 12px; + border-style: solid; + border-width: 1px; + box-shadow: rgb(0,0,0) 0px 0px 0.25em; + color: white; + display: inline-block; + font-size: 14px; + font-weight: 500; + height: 24px; + line-height: 1.5; + margin-right: 8px; + min-width: 24px; + padding: 2px 3px; + text-align: center; +} + .c1 .c4 { + grid-area: line; display: table-cell; max-width: 20px; width: 20px; @@ -6341,6 +7474,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Only Itinerary 2`] = ` } .c1 .c13 { + grid-area: title; color: #000; font-size: 18px; font-weight: 500; @@ -6356,7 +7490,12 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Only Itinerary 2`] = ` width: 100%; } +.c1 .c61 { + margin-left: -23px; +} + .c1 .c17 { + grid-area: time; color: #676767; display: table-cell; font-size: 14px; @@ -6375,9 +7514,23 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Only Itinerary 2`] = ` } .c6 { - background: repeating-linear-gradient( 0deg,red,red 8px,white 8px,white 12.5px ); - left: 7.5px; - right: 7.5px; + background: radial-gradient(ellipse at center,#87cefa 40%,transparent 10%); + background-position: center -5px; + background-repeat: repeat-y; + background-size: 12px 12px; + left: 6px; + right: 6px; + bottom: -11px; + position: absolute; + top: 11px; + z-index: 10; +} + +.c38 { + background-color: gray; + left: 5px; + right: 5px; + background-color: #084C8D; bottom: -11px; position: absolute; top: 11px; @@ -6407,13 +7560,13 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Only Itinerary 2`] = ` className="c0 c1" >
  • - 503 SW Alder St, Portland, OR, USA 97204 + KGW Studio on the Sq, Portland, OR, USA
    - 3:42 PM + 3:44 PM
    otpUi.TransitLegBody.fromLocation
    + - - Bicycle 0.7 miles to + Walk 269 feet to - 1737 SW Morrison St, Portland, OR, USA 97205 + Pioneer Square North MAX Station
    @@ -6633,7 +7791,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Only Itinerary 2`] = ` viewBox="0 0 261 261" >
    @@ -6641,104 +7799,903 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Only Itinerary 2`] = ` className="c35" > - RIGHT + LEFT on - SW 5th Ave + Pioneer Sq N (path) - 257 feet + 101 feet
    • -
  • -
    - - - -
    -
    +
    + + + + +
    • +
  • +
    +
    + + + + +
    +
    + + Pioneer Square North MAX Station + +
    +
    + 3:46 PM +
    + + otpUi.TransitLegBody.fromLocation + +
    +
    + Stop ID 8383 + +
    +
    +
    + + + + - + Ride + + + + - - RIGHT - on + + + + + + + + MAX Blue Line + + + + + MAX Blue Line + + to + + Hillsboro + + + + + - + Disembark at + Providence Park MAX Station + + + + +
    +
    +
    + Service operated by + + TriMet + + +
    + +
    +
    +
    - + +
    +
    +
    +
    +
      +
    1. +
      + • +
      +
      + Galleria/SW 10th Ave MAX Station +
      +
      2. +
    +
    - + + Typical wait: + 15 min + +
    +
    +
    +
    +
    • +
  • +
    +
    + + + + +
    +
    + + Providence Park MAX Station + +
    +
    + 3:49 PM +
    + + otpUi.TransitLegBody.fromLocation + +
    +
    + Stop ID 9757 + +
    +
    +
    + + + - - - mocked-react-resize-detector + + + + + + + + - + + + Walk 249 feet to + + 1737 SW Morrison St, Portland, OR, USA 97205 + + + + +
    + + + + +
    +
    +
      +
    1. +
      + + + +
      +
      + + Head + WEST + on + + Providence Park (path) + + + 19 feet + + +
      +
      2. +
    2. +
      + + + +
      +
      + + RIGHT + on + + Unnamed Path + + + 104 feet + + +
      +
      3. +
    3. +
      + + + +
      +
      + + RIGHT + on + + Unnamed Path + + + 27 feet + + +
      +
      4. +
    4. +
      + + + +
      +
      + + RIGHT + on + + SW Morrison St + + + 99 feet + + +
      +
      5. +
    +
  • Arrive at 1737 SW Morrison St, Portland, OR, USA 97205
    • `; -exports[`Storyshots ItineraryBody/otp-react-redux Bike Rental Itinerary 1`] = ` +exports[`Storyshots ItineraryBody/otp-react-redux Bike Only Itinerary 1`] = ` `; -exports[`Storyshots ItineraryBody/otp-react-redux Bike Rental Itinerary 2`] = ` +exports[`Storyshots ItineraryBody/otp-react-redux Bike Only Itinerary 2`] = ` .c8 { display: inline-block; vertical-align: middle; @@ -7707,7 +9284,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Rental Itinerary 2`] = ` color: #333; } -.c46 { +.c44 { color: #f44256; } @@ -7797,16 +9374,17 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Rental Itinerary 2`] = ` .c28 { display: grid; - grid-template-columns: 100px auto; + grid-template-columns: 130px auto; } .c3 { max-width: 500px; display: grid; + grid-template-areas: "time line title" "time line instructions"; grid-template-columns: 65px 30px auto; } -.c40 { +.c38 { border-color: #fff; border-radius: 5px; border-style: solid; @@ -7824,7 +9402,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Rental Itinerary 2`] = ` width: 75%; } -.c40:hover { +.c38:hover { border-color: #d1d5da; background-color: #f6f8fa; } @@ -7839,6 +9417,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Rental Itinerary 2`] = ` .c20 { grid-row-start: 2; grid-column-start: 3; + grid-area: instructions; } .c14 { @@ -7866,37 +9445,28 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Rental Itinerary 2`] = ` } .c39 { - color: #807373; - font-size: 13px; - font-weight: 300; - padding-top: 1px; - margin-bottom: 10px; - margin-top: -14px; -} - -.c41 { padding: 2px; width: 100%; } -.c43 { +.c41 { font-size: xx-small; } -.c43::before { +.c41::before { content: ""; margin: 0 0.125em; } -.c44 { +.c42 { color: #e60000; } -.c45 { +.c43 { color: green; } -.c42 { +.c40 { font-size: small; } @@ -7983,6 +9553,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Rental Itinerary 2`] = ` } .c1 .c4 { + grid-area: line; display: table-cell; max-width: 20px; width: 20px; @@ -7991,6 +9562,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Rental Itinerary 2`] = ` } .c1 .c13 { + grid-area: title; color: #000; font-size: 18px; font-weight: 500; @@ -8007,6 +9579,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Rental Itinerary 2`] = ` } .c1 .c17 { + grid-area: time; color: #676767; display: table-cell; font-size: 14px; @@ -8025,19 +9598,6 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Rental Itinerary 2`] = ` } .c6 { - background: radial-gradient(ellipse at center,#87cefa 40%,transparent 10%); - background-position: center -5px; - background-repeat: repeat-y; - background-size: 12px 12px; - left: 6px; - right: 6px; - bottom: -11px; - position: absolute; - top: 11px; - z-index: 10; -} - -.c38 { background: repeating-linear-gradient( 0deg,red,red 8px,white 8px,white 12.5px ); left: 7.5px; right: 7.5px; @@ -8070,13 +9630,13 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Rental Itinerary 2`] = ` className="c0 c1" >
  • - 2624 SE 30th Ave, Portland, OR, USA 97202 + 503 SW Alder St, Portland, OR, USA 97204
    - 3:45 PM + 3:42 PM
    otpUi.TransitLegBody.fromLocation
    - - - Walk 498 feet to + Bicycle 0.7 miles to - SE 30th at Division + 1737 SW Morrison St, Portland, OR, USA 97205
    @@ -8314,12 +9869,45 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Rental Itinerary 2`] = ` - SE 30th Ave + SW 5th Ave - 419 feet + 257 feet + + +
    +
    • +
  • +
    + + + +
    +
    + + RIGHT + on + + SW Morrison St + + + 0.6 miles
    @@ -8327,31 +9915,69 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Rental Itinerary 2`] = ` +
    + +
  • -
    +
    - SE 30th at Division + 1737 SW Morrison St, Portland, OR, USA 97205
    - 3:48 PM + 3:49 PM
    - otpUi.TransitLegBody.fromLocation + Arrive at + 1737 SW Morrison St, Portland, OR, USA 97205
    -
    - Pick up - shared bike - -
    -
    -
    - - - - - - - - - - - - - - Bicycle 0.6 miles to - - SE 29th at Hawthorne - - - - -
    - - - - -
    -
    -
      -
    1. -
      - - - -
      -
      - - CONTINUE - on - - SE 30th Ave - - - 0.3 miles - - -
      -
      2. -
    2. -
      - - - -
      -
      - - LEFT - on - - SE Harrison St - - - 361 feet - - -
      -
      3. -
    3. -
      - - - -
      -
      - - RIGHT - on - - SE 29th Ave - - - 0.2 miles - - -
      -
      4. -
    4. -
      - - - -
      -
      - - LEFT - on - - SE Hawthorne Blvd - - - 50 feet - - -
      -
      5. -
    -
    -
    -
    - -
    -     -
    -
    -
    • -
  • -
    -
    - - - -
    -
    - - SE 29th at Hawthorne - -
    -
    - 3:55 PM -
    - - otpUi.TransitLegBody.fromLocation - -
    -
    -
    - - - - - - - - - - - - - - - Walk 0.1 miles to - - 1415 SE 28th Ave, Portland, OR, USA 97214 - - - - -
    - - - - -
    -
    -
      -
    1. -
      - - - -
      -
      - - CONTINUE - on - - SE Hawthorne Blvd - - - 210 feet - - -
      -
      2. -
    2. -
      - - - -
      -
      - - RIGHT - on - - SE 28th Ave - - - 295 feet - - -
      -
      3. -
    3. -
      - - - -
      -
      - - LEFT - on - - SE Madison St - - - 114 feet - - -
      -
      4. -
    -
    -
    -     -
    -
    -
    • -
  • -
    - - - - -
    -
    - - 1415 SE 28th Ave, Portland, OR, USA 97214 - -
    -
    - 3:58 PM -
    - - Arrive at - 1415 SE 28th Ave, Portland, OR, USA 97214 - -
    • `; -exports[`Storyshots ItineraryBody/otp-react-redux Bike Rental Transit Itinerary 1`] = ` +exports[`Storyshots ItineraryBody/otp-react-redux Bike Rental Itinerary 1`] = ` `; -exports[`Storyshots ItineraryBody/otp-react-redux Bike Rental Transit Itinerary 2`] = ` +exports[`Storyshots ItineraryBody/otp-react-redux Bike Rental Itinerary 2`] = ` .c8 { display: inline-block; vertical-align: middle; @@ -11240,7 +10930,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Rental Transit Itinerary color: #333; } -.c71 { +.c46 { color: #f44256; } @@ -11254,38 +10944,11 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Rental Transit Itinerary text-decoration: none; } -.c47 { - color: #008; - margin-left: 5px; -} - -.c47:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c48 { - padding-left: 0px; -} - -.c48:before { - content: "|"; - color: black; - margin-right: 5px; -} - .c31::before { content: ""; margin: 0 0.125em; } -.c66 { - display: block; - font-size: 13px; - list-style: none; - padding: 0; -} - .c0 { list-style: none; padding: 0; @@ -11331,29 +10994,10 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Rental Transit Itinerary width: 0; } -.c53 { - font-weight: 200; -} - .c25 { font-weight: inherit; } -.c52 { - font-size: 13px; - font-weight: 500; -} - -.c51 { - font-weight: 800; - margin-right: 6px; -} - -.c49 { - color: #807373; - margin-top: 5px; -} - .c24 img, .c24 svg { margin-right: 6px; @@ -11376,12 +11020,13 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Rental Transit Itinerary .c28 { display: grid; - grid-template-columns: 100px auto; + grid-template-columns: 130px auto; } .c3 { max-width: 500px; display: grid; + grid-template-areas: "time line title" "time line instructions"; grid-template-columns: 65px 30px auto; } @@ -11418,6 +11063,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Rental Transit Itinerary .c20 { grid-row-start: 2; grid-column-start: 3; + grid-area: instructions; } .c14 { @@ -11552,126 +11198,6 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Rental Transit Itinerary padding-left: 1ch; } -.c69 { - float: left; - margin-left: -36px; - color: #fff; -} - -.c70 { - color: #676767; - margin-top: 3px; -} - -.c67 { - z-index: 30; - position: relative; -} - -.c57 { - background-color: #eee; - border-radius: 4px; - color: #000; - display: block; - margin-top: 5px; - padding: 8px; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c61 { - -webkit-align-items: baseline; - -webkit-box-align: baseline; - -ms-flex-align: baseline; - align-items: baseline; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - gap: 5px; - margin-top: 0.5em; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c61:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c59 { - font-size: 12px; - margin-left: 30px; - white-space: pre-wrap; -} - -.c60 { - margin-top: 5px; - margin-left: 30px; - font-size: 12px; - font-style: italic; -} - -.c58 { - float: left; - font-size: 18px; -} - -.c56 { - display: block; - margin-top: 3px; - padding: 0; -} - -.c55 { - color: #d14727; - cursor: auto; - display: inline-block; - font-weight: 400; - margin-top: 8px; - padding: 0; -} - -.c62 { - margin-top: 5px; -} - -.c63 { - color: #676767; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; -} - -.c65 { - font-size: 14px; -} - -.c64 { - padding: 0; -} - -.c54 { - margin-top: 5px; -} - -.c54 a { - color: #337ab7; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c54 a:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c54 img { - margin-left: 5px; - vertical-align: middle; -} - .c1 { font-size: 16px; } @@ -11681,27 +11207,8 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Rental Transit Itinerary font-family: Hind,sans-serif; } -.c1 .c50 { - background-color: rgb(15,106,172); - border-color: white; - border-image: initial; - border-radius: 12px; - border-style: solid; - border-width: 1px; - box-shadow: rgb(0,0,0) 0px 0px 0.25em; - color: white; - display: inline-block; - font-size: 14px; - font-weight: 500; - height: 24px; - line-height: 1.5; - margin-right: 8px; - min-width: 24px; - padding: 2px 3px; - text-align: center; -} - .c1 .c4 { + grid-area: line; display: table-cell; max-width: 20px; width: 20px; @@ -11710,6 +11217,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Rental Transit Itinerary } .c1 .c13 { + grid-area: title; color: #000; font-size: 18px; font-weight: 500; @@ -11725,11 +11233,8 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Rental Transit Itinerary width: 100%; } -.c1 .c68 { - margin-left: -23px; -} - .c1 .c17 { + grid-area: time; color: #676767; display: table-cell; font-size: 14px; @@ -11770,17 +11275,6 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Rental Transit Itinerary z-index: 10; } -.c46 { - background-color: gray; - left: 5px; - right: 5px; - background-color: #000088; - bottom: -11px; - position: absolute; - top: 11px; - z-index: 10; -} - .c9 { left: 0; line-height: inherit; @@ -11804,13 +11298,13 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Rental Transit Itinerary className="c0 c1" >
  • - 2943 SE Washington St, Portland, OR, USA 97214 + 2624 SE 30th Ave, Portland, OR, USA 97202
    - 3:50 PM + 3:45 PM
    otpUi.TransitLegBody.fromLocation
    - - Walk 400 feet to + Walk 498 feet to - SE 29th at Stark + SE 30th at Division
    -
    • -
  • -
    - - - -
    -
    - - RIGHT + WEST on - SE Stark St + SE Clinton St - 277 feet + 79 feet
    @@ -12081,12 +11542,12 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Rental Transit Itinerary - SE 29th Ave + SE 30th Ave - 19 feet + 419 feet @@ -12099,13 +11560,13 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Rental Transit Itinerary
  • - SE 29th at Stark + SE 30th at Division
    - 3:53 PM + 3:48 PM
    otpUi.TransitLegBody.fromLocation
    - - Bicycle 0.8 miles to + Bicycle 0.6 miles to - NE Glisan at 24th + SE 29th at Hawthorne
    -
    • -
  • -
    - - - -
    -
    - - LEFT - on - - SE Pine St - - - 358 feet - - -
    -
    • -
  • -
    - - - -
    -
    - - RIGHT - on - - SE 28th Ave + SE 30th Ave - 518 feet + 0.3 miles
    @@ -12395,12 +11790,12 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Rental Transit Itinerary - SE Ankeny St + SE Harrison St - 0.2 miles + 361 feet @@ -12428,40 +11823,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Rental Transit Itinerary - SE 24th Ave - - - 259 feet - - - -
    • -
  • -
    - - - -
    -
    - - CONTINUE - on - - NE 24th Ave + SE 29th Ave - NE Glisan St + SE Hawthorne Blvd - 57 feet + 50 feet
    @@ -12525,13 +11887,13 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Rental Transit Itinerary className="c43 c44" > ↑ - 33' + 63' ↓ - 33' + 18' @@ -12553,13 +11915,13 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Rental Transit Itinerary
  • - NE Glisan at 24th + SE 29th at Hawthorne
    - 3:59 PM + 3:55 PM
    otpUi.TransitLegBody.fromLocation
    - - Walk 497 feet to + Walk 0.1 miles to - NE Sandy & 24th + 1415 SE 28th Ave, Portland, OR, USA 97214
    @@ -12743,17 +12105,17 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Rental Transit Itinerary className="c35" > - HARD_LEFT + CONTINUE on - NE Glisan St + SE Hawthorne Blvd - 57 feet + 210 feet
    @@ -12768,7 +12130,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Rental Transit Itinerary viewBox="0 0 261 261" >
    @@ -12776,17 +12138,17 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Rental Transit Itinerary className="c35" > - LEFT + RIGHT on - NE 24th Ave + SE 28th Ave - 382 feet + 295 feet @@ -12801,7 +12163,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Rental Transit Itinerary viewBox="0 0 261 261" > @@ -12809,17 +12171,17 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Rental Transit Itinerary className="c35" > - RIGHT + LEFT on - NE Sandy Blvd + SE Madison St - 58 feet + 114 feet @@ -12832,26 +12194,23 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Rental Transit Itinerary
  • -
    - 4:02 PM + 3:58 PM
    - otpUi.TransitLegBody.fromLocation + Arrive at + 1415 SE 28th Ave, Portland, OR, USA 97214
    -
    - Stop ID 5066 - -
    -
    -
    - - - - - - Ride - - - - - - - - - - - - - - - 12 - - - - - Barbur/Sandy Blvd - - to - - Parkrose TC - - - - - - - Disembark at - NE Sandy & 57th - - - - -
    -
    -
    - Service operated by - - TriMet - - -
    -
    - - - 2 alerts -
    -
    -
    - -
    -
    -
    -
    - - -
    -
    -
    -
    -
      -
    1. -
      - • -
      -
      - NE Sandy & Lawrence -
      -
      2. -
    2. -
      - • -
      -
      - NE Sandy & 28th -
      -
      3. -
    3. -
      - • -
      -
      - NE Sandy & 31st -
      -
      4. -
    4. -
      - • -
      -
      - NE Sandy & 33rd -
      -
      5. -
    5. -
      - • -
      -
      - NE Sandy & Imperial -
      -
      6. -
    6. -
      - • -
      -
      - NE Sandy & 38th -
      -
      7. -
    7. -
      - • -
      -
      - NE Sandy & 42nd -
      -
      8. -
    8. -
      - • -
      -
      - NE Sandy & 44th -
      -
      9. -
    9. -
      - • -
      -
      - NE Sandy & 48th -
      -
      10. -
    10. -
      - • -
      -
      - NE Sandy & 50th -
      -
      11. -
    11. -
      - • -
      -
      - NE Sandy & Sacramento -
      -
      12. -
    12. -
      - • -
      -
      - NE Sandy & 54th -
      -
      13. -
    -
    -
    -
    -
    -
    -
    -
    -
    • -
  • -
    -
    - - - - -
    -
    - - NE Sandy & 57th - -
    -
    - 4:14 PM -
    - - otpUi.TransitLegBody.fromLocation - -
    -
    - Stop ID 5104 - -
    -
    -
    - - - - - - - - - - - - - - - Walk 279 feet to - - 0086 BIKETOWN - - - - -
    - - - - -
    -
    -
      -
    1. -
      - - - -
      -
      - - Head - NORTHEAST - on - - NE Sandy Blvd - - - 75 feet - - -
      -
      2. -
    2. -
      - - - -
      -
      - - HARD_LEFT - on - - NE Alameda St - - - 203 feet - - -
      -
      3. -
    -
    -
    -     -
    -
    + className="c20 place-details " + />
    • -
  • -
    -
    - - - -
    -
    - - 0086 BIKETOWN - -
    -
    - 4:16 PM -
    - - otpUi.TransitLegBody.fromLocation - -
    -
    - Pick up - shared bike - -
    -
    -
    - - - - - - - - - - - - - - Bicycle 1 mile to - - NE 60th at Cully - - - - -
    - - - - -
    +`; + +exports[`Storyshots ItineraryBody/otp-react-redux Bike Rental Transit Itinerary 1`] = ` + + -
    -
      -
    1. -
      - - - -
      -
      - - HARD_LEFT - on - - NE Alameda St - - - 203 feet - - -
      -
      2. -
    2. -
      - - - -
      -
      - - HARD_LEFT - on - - NE 57th Ave - - - 0.6 miles - - -
      -
      3. -
    3. -
      - - - -
      -
      - - CONTINUE - on - - NE Cully Blvd - - - 0.3 miles - - -
      -
      4. -
    4. -
      - - - -
      -
      - - LEFT - on - - NE 60th Ave - - - 171 feet - - -
      -
      5. -
    -
    -
    -
    - -
    -     -
    -
    -
    • -
  • -
    -
    - - - -
    -
    - - NE 60th at Cully - -
    -
    - 4:24 PM -
    - - otpUi.TransitLegBody.fromLocation - -
    -
    -
    - - - - - - - - - - - - - - - Walk 494 feet to - - 5916 NE Going St, Portland, OR, USA 97218 - - - - -
    - - - - -
    -
    -
      -
    1. -
      - - - -
      -
      - - CONTINUE - on - - NE 60th Ave - - - 270 feet - - -
      -
      2. -
    2. -
      - - - -
      -
      - - LEFT - on - - NE Going St - - - 225 feet - - -
      -
      3. -
    -
    -
    -     -
    -
    -
    • -
  • -
    - - - - -
    -
    - - 5916 NE Going St, Portland, OR, USA 97218 - -
    -
    - 4:26 PM -
    - - Arrive at - 5916 NE Going St, Portland, OR, USA 97218 - -
    -
    • - -`; - -exports[`Storyshots ItineraryBody/otp-react-redux Bike Transit Bike Itinerary 1`] = ` - - `; -exports[`Storyshots ItineraryBody/otp-react-redux Bike Transit Bike Itinerary 2`] = ` +exports[`Storyshots ItineraryBody/otp-react-redux Bike Rental Transit Itinerary 2`] = ` .c8 { display: inline-block; vertical-align: middle; @@ -15062,7 +14468,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Transit Bike Itinerary 2` color: #333; } -.c65 { +.c71 { color: #f44256; } @@ -15076,21 +14482,21 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Transit Bike Itinerary 2` text-decoration: none; } -.c41 { +.c47 { color: #008; margin-left: 5px; } -.c41:hover { +.c47:hover { -webkit-text-decoration: underline; text-decoration: underline; } -.c42 { +.c48 { padding-left: 0px; } -.c42:before { +.c48:before { content: "|"; color: black; margin-right: 5px; @@ -15101,7 +14507,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Transit Bike Itinerary 2` margin: 0 0.125em; } -.c60 { +.c66 { display: block; font-size: 13px; list-style: none; @@ -15153,7 +14559,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Transit Bike Itinerary 2` width: 0; } -.c47 { +.c53 { font-weight: 200; } @@ -15161,17 +14567,17 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Transit Bike Itinerary 2` font-weight: inherit; } -.c46 { +.c52 { font-size: 13px; font-weight: 500; } -.c45 { +.c51 { font-weight: 800; margin-right: 6px; } -.c43 { +.c49 { color: #807373; margin-top: 5px; } @@ -15198,15 +14604,39 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Transit Bike Itinerary 2` .c28 { display: grid; - grid-template-columns: 100px auto; + grid-template-columns: 130px auto; } .c3 { max-width: 500px; display: grid; + grid-template-areas: "time line title" "time line instructions"; grid-template-columns: 65px 30px auto; } +.c40 { + border-color: #fff; + border-radius: 5px; + border-style: solid; + border-width: 1px; + display: inline-block; + font-style: normal; + grid-column: 2; + grid-row: 1; + margin: 0 4px; + position: relative; + text-align: center; + -webkit-text-decoration: none; + text-decoration: none; + vertical-align: middle; + width: 75%; +} + +.c40:hover { + border-color: #d1d5da; + background-color: #f6f8fa; +} + .c18 { grid-column-start: 1; grid-row: 1 / span 2; @@ -15217,6 +14647,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Transit Bike Itinerary 2` .c20 { grid-row-start: 2; grid-column-start: 3; + grid-area: instructions; } .c14 { @@ -15243,7 +14674,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Transit Bike Itinerary 2` padding: 3px 0 10px 0; } -.c40 { +.c39 { color: #807373; font-size: 13px; font-weight: 300; @@ -15252,6 +14683,32 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Transit Bike Itinerary 2` margin-top: -14px; } +.c41 { + padding: 2px; + width: 100%; +} + +.c43 { + font-size: xx-small; +} + +.c43::before { + content: ""; + margin: 0 0.125em; +} + +.c44 { + color: #e60000; +} + +.c45 { + color: green; +} + +.c42 { + font-size: small; +} + .c32 { display: block; list-style: none; @@ -15325,23 +14782,23 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Transit Bike Itinerary 2` padding-left: 1ch; } -.c63 { +.c69 { float: left; margin-left: -36px; color: #fff; } -.c64 { +.c70 { color: #676767; margin-top: 3px; } -.c61 { +.c67 { z-index: 30; position: relative; } -.c51 { +.c57 { background-color: #eee; border-radius: 4px; color: #000; @@ -15352,7 +14809,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Transit Bike Itinerary 2` text-decoration: none; } -.c55 { +.c61 { -webkit-align-items: baseline; -webkit-box-align: baseline; -ms-flex-align: baseline; @@ -15367,36 +14824,36 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Transit Bike Itinerary 2` text-decoration: none; } -.c55:hover { +.c61:hover { -webkit-text-decoration: underline; text-decoration: underline; } -.c53 { +.c59 { font-size: 12px; margin-left: 30px; white-space: pre-wrap; } -.c54 { +.c60 { margin-top: 5px; margin-left: 30px; font-size: 12px; font-style: italic; } -.c52 { +.c58 { float: left; font-size: 18px; } -.c50 { +.c56 { display: block; margin-top: 3px; padding: 0; } -.c49 { +.c55 { color: #d14727; cursor: auto; display: inline-block; @@ -15405,11 +14862,11 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Transit Bike Itinerary 2` padding: 0; } -.c56 { +.c62 { margin-top: 5px; } -.c57 { +.c63 { color: #676767; display: -webkit-box; display: -webkit-flex; @@ -15417,30 +14874,30 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Transit Bike Itinerary 2` display: flex; } -.c59 { +.c65 { font-size: 14px; } -.c58 { +.c64 { padding: 0; } -.c48 { +.c54 { margin-top: 5px; } -.c48 a { +.c54 a { color: #337ab7; -webkit-text-decoration: none; text-decoration: none; } -.c48 a:hover { +.c54 a:hover { -webkit-text-decoration: underline; text-decoration: underline; } -.c48 img { +.c54 img { margin-left: 5px; vertical-align: middle; } @@ -15454,7 +14911,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Transit Bike Itinerary 2` font-family: Hind,sans-serif; } -.c1 .c44 { +.c1 .c50 { background-color: rgb(15,106,172); border-color: white; border-image: initial; @@ -15475,6 +14932,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Transit Bike Itinerary 2` } .c1 .c4 { + grid-area: line; display: table-cell; max-width: 20px; width: 20px; @@ -15483,6 +14941,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Transit Bike Itinerary 2` } .c1 .c13 { + grid-area: title; color: #000; font-size: 18px; font-weight: 500; @@ -15498,11 +14957,12 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Transit Bike Itinerary 2` width: 100%; } -.c1 .c62 { +.c1 .c68 { margin-left: -23px; } .c1 .c17 { + grid-area: time; color: #676767; display: table-cell; font-size: 14px; @@ -15543,11 +15003,11 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Transit Bike Itinerary 2` z-index: 10; } -.c39 { +.c46 { background-color: gray; left: 5px; right: 5px; - background-color: #084C8D; + background-color: #000088; bottom: -11px; position: absolute; top: 11px; @@ -15577,13 +15037,13 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Transit Bike Itinerary 2` className="c0 c1" >
  • - KGW Studio on the Sq, Portland, OR, USA + 2943 SE Washington St, Portland, OR, USA 97214
    - 3:44 PM + 3:50 PM
    otpUi.TransitLegBody.fromLocation
    - - Walk 91 feet to + Walk 400 feet to - corner of path and Pioneer Courthouse Sq (pedestrian street) + SE 29th at Stark
    +
    • +
  • +
    + + + +
    +
    + + RIGHT + on + + SE Stark St + + + 277 feet + + +
    +
    • +
  • +
    + + + +
    +
    + + RIGHT + on + + SE 29th Ave + + + 19 feet
    @@ -15806,13 +15332,13 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Transit Bike Itinerary 2`
  • - 3:44 PM + 3:53 PM
    otpUi.TransitLegBody.fromLocation
    +
    + Pick up + shared bike + +
    @@ -15910,16 +15427,16 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Transit Bike Itinerary 2` - - Bicycle 0.1 miles to + Bicycle 0.8 miles to - corner of path and Pioneer Sq N (path) + NE Glisan at 24th
    @@ -16007,17 +15524,17 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Transit Bike Itinerary 2` className="c35" > - LEFT + CONTINUE on - Unnamed Path + SE 29th Ave - 20 feet + 492 feet
    @@ -16045,12 +15562,12 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Transit Bike Itinerary 2` - SW 6th Ave + SE Pine St - 245 feet + 358 feet
    @@ -16065,7 +15582,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Transit Bike Itinerary 2` viewBox="0 0 261 261" > @@ -16073,17 +15590,17 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Transit Bike Itinerary 2` className="c35" > - LEFT + RIGHT on - SW Morrison St + SE 28th Ave - 241 feet + 518 feet @@ -16111,12 +15628,111 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Transit Bike Itinerary 2` - Unnamed Path + SE Ankeny St - 27 feet + 0.2 miles + + + +
    • +
  • +
    + + + +
    +
    + + RIGHT + on + + SE 24th Ave + + + 259 feet + + +
    +
    • +
  • +
    + + + +
    +
    + + CONTINUE + on + + NE 24th Ave + + + 0.2 miles + + +
    +
    • +
  • +
    + + + +
    +
    + + LEFT + on + + NE Glisan St + + + 57 feet
    @@ -16124,18 +15740,59 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Transit Bike Itinerary 2` +
    + +
  • - 3:45 PM + 3:59 PM
    otpUi.TransitLegBody.fromLocation
    - - Walk 22 feet to + Walk 497 feet to - Pioneer Square North MAX Station + NE Sandy & 24th
    +
    • +
  • +
    + + + +
    +
    + + RIGHT + on + + NE Sandy Blvd + + + 58 feet
    @@ -16358,13 +16065,13 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Transit Bike Itinerary 2`
  • - Pioneer Square North MAX Station + NE Sandy & 24th
    - 3:46 PM + 4:02 PM
    otpUi.TransitLegBody.fromLocation
    - Stop ID 8383 + Stop ID 5066
    Service operated by
  • - Providence Park MAX Station + NE Sandy & 57th
    - 3:49 PM + 4:14 PM
    otpUi.TransitLegBody.fromLocation
    - Stop ID 9757 + Stop ID 5104
    +
    • +
  • +
    + + + +
    +
    + + HARD_LEFT + on + + NE Alameda St + + + 203 feet
    @@ -17043,13 +16943,13 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Transit Bike Itinerary 2`
  • - 3:49 PM + 4:16 PM
    otpUi.TransitLegBody.fromLocation
    +
    + Pick up + shared bike + +
    @@ -17147,16 +17038,16 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Transit Bike Itinerary 2` - - Bicycle 230 feet to + Bicycle 1 mile to - 1737 SW Morrison St, Portland, OR, USA 97205 + NE 60th at Cully
    @@ -17244,17 +17135,17 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Transit Bike Itinerary 2` className="c35" > - RIGHT + HARD_LEFT on - Unnamed Path + NE Alameda St - 104 feet + 203 feet
    @@ -17269,7 +17160,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Transit Bike Itinerary 2` viewBox="0 0 261 261" >
    @@ -17277,17 +17168,17 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Transit Bike Itinerary 2` className="c35" > - RIGHT + HARD_LEFT on - Unnamed Path + NE 57th Ave - 27 feet + 0.6 miles @@ -17302,7 +17193,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Transit Bike Itinerary 2` viewBox="0 0 261 261" > @@ -17310,17 +17201,50 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Transit Bike Itinerary 2` className="c35" > - RIGHT + CONTINUE on - SW Morrison St + NE Cully Blvd - 99 feet + 0.3 miles + + + +
    • +
  • +
    + + + +
    +
    + + LEFT + on + + NE 60th Ave + + + 171 feet
    @@ -17328,12 +17252,299 @@ exports[`Storyshots ItineraryBody/otp-react-redux Bike Transit Bike Itinerary 2` +
    + +
  • +
    +
    + + + +
    +
    + + NE 60th at Cully + +
    +
    + 4:24 PM +
    + + otpUi.TransitLegBody.fromLocation + +
    +
    +
    + + + + + + + + + + + - + + + Walk 494 feet to + + 5916 NE Going St, Portland, OR, USA 97218 + + + + +
    + + + + +
    +
    +
      +
    1. +
      + + + +
      +
      + + CONTINUE + on + + NE 60th Ave + + + 270 feet + + +
      +
      2. +
    2. +
      + + + +
      +
      + + LEFT + on + + NE Going St + + + 225 feet + + +
      +
      3. +
    +
    +
    +     +
    +
    +
    • +
  • - 3:50 PM + 4:26 PM
    Arrive at - 1737 SW Morrison St, Portland, OR, USA 97205 + 5916 NE Going St, Portland, OR, USA 97218
    • `; -exports[`Storyshots ItineraryBody/otp-react-redux Custom Time Column 1`] = ` +exports[`Storyshots ItineraryBody/otp-react-redux Bike Transit Bike Itinerary 1`] = ` `; -exports[`Storyshots ItineraryBody/otp-react-redux Custom Time Column 2`] = ` +exports[`Storyshots ItineraryBody/otp-react-redux Bike Transit Bike Itinerary 2`] = ` .c8 { display: inline-block; vertical-align: middle; @@ -17818,11 +18296,11 @@ exports[`Storyshots ItineraryBody/otp-react-redux Custom Time Column 2`] = ` color: #333; } -.c58 { +.c65 { color: #f44256; } -.c27 { +.c26 { background: transparent; border: 0; color: inherit; @@ -17832,123 +18310,32 @@ exports[`Storyshots ItineraryBody/otp-react-redux Custom Time Column 2`] = ` text-decoration: none; } -.c30 { - background-color: #fff; - background-image: none; - border-radius: 4px; - border: 1px solid #ccc; - color: #333; - cursor: pointer; - display: inline-block; - font-size: 14px; - font-weight: 400; - padding: 4px 6px; - text-align: center; - -webkit-text-decoration: none; - text-decoration: none; - touch-action: manipulation; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - white-space: nowrap; -} - -.c30:hover { - color: #333; - background-color: #e6e6e6; - border-color: #adadad; -} - -.c30:active { - color: #333; - background-color: #e6e6e6; - background-image: none; - border-color: #adadad; - outline: 0; - box-shadow: inset 0 3px 5px rgba(0,0,0,0.125); -} - -.c30:focus { - color: #333; - background-color: #e6e6e6; - border-color: #8c8c8c; -} - -.c30:active:hover { - color: #333; - background-color: #d4d4d4; - border-color: #8c8c8c; -} - -.c37 { +.c41 { color: #008; margin-left: 5px; } -.c37:hover { +.c41:hover { -webkit-text-decoration: underline; text-decoration: underline; } -.c38 { +.c42 { padding-left: 0px; } -.c38:before { +.c42:before { content: "|"; color: black; margin-right: 5px; } -.c55 { - bottom: 0; - left: 110px; - position: absolute; - right: 0; - top: 0; -} - -.c56 { - background-color: #fcf9d3; - display: table; - height: 100%; - width: 100%; -} - -.c54 { - border-bottom: 16px solid transparent; - border-right: 16px solid #fcf9d3; - border-top: 16px solid transparent; - height: 0; - left: 94px; - position: absolute; - top: 0; - width: 0; -} - -.c57 { - color: #444; - display: table-cell; - font-style: italic; - line-height: 0.95; - padding: 0px 2px; - vertical-align: middle; -} - -.c29 { - height: 32px; - margin-bottom: 10px; - margin-top: 10px; - position: relative; -} - -.c47::before { +.c31::before { content: ""; margin: 0 0.125em; } -.c49 { +.c60 { display: block; font-size: 13px; list-style: none; @@ -17960,13 +18347,13 @@ exports[`Storyshots ItineraryBody/otp-react-redux Custom Time Column 2`] = ` padding: 0; } -.c22 { +.c21 { color: #676767; font-size: 13px; padding-bottom: 12px; } -.c28 { +.c27 { bottom: 0; cursor: pointer; left: 0; @@ -17977,7 +18364,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Custom Time Column 2`] = ` z-index: 1; } -.c23 { +.c22 { -webkit-align-items: center; -webkit-box-align: center; -ms-flex-align: center; @@ -18000,34 +18387,38 @@ exports[`Storyshots ItineraryBody/otp-react-redux Custom Time Column 2`] = ` width: 0; } -.c26 { +.c47 { + font-weight: 200; +} + +.c25 { font-weight: inherit; } -.c42 { +.c46 { font-size: 13px; font-weight: 500; } -.c41 { +.c45 { font-weight: 800; margin-right: 6px; } -.c39 { +.c43 { color: #807373; margin-top: 5px; } -.c25 img, -.c25 svg { +.c24 img, +.c24 svg { margin-right: 6px; height: 24px; width: 24px; vertical-align: bottom; } -.c24 { +.c23 { -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; @@ -18039,14 +18430,15 @@ exports[`Storyshots ItineraryBody/otp-react-redux Custom Time Column 2`] = ` padding-right: 5px; } -.c32 { +.c28 { display: grid; - grid-template-columns: 100px auto; + grid-template-columns: 130px auto; } .c3 { max-width: 500px; display: grid; + grid-template-areas: "time line title" "time line instructions"; grid-template-columns: 65px 30px auto; } @@ -18060,6 +18452,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Custom Time Column 2`] = ` .c20 { grid-row-start: 2; grid-column-start: 3; + grid-area: instructions; } .c14 { @@ -18086,7 +18479,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Custom Time Column 2`] = ` padding: 3px 0 10px 0; } -.c21 { +.c40 { color: #807373; font-size: 13px; font-weight: 300; @@ -18095,13 +18488,23 @@ exports[`Storyshots ItineraryBody/otp-react-redux Custom Time Column 2`] = ` margin-top: -14px; } -.c35 { +.c32 { display: block; list-style: none; padding: 0; } -.c33 { +.c35 { + margin-left: 24px; + line-height: 1.25em; + padding-top: 1px; +} + +.c35 > span { + margin-right: 1ch; +} + +.c29 { display: -webkit-inline-box; display: -webkit-inline-flex; display: -ms-inline-flexbox; @@ -18112,7 +18515,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Custom Time Column 2`] = ` margin-top: 10px; } -.c33 a { +.c29 a { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; @@ -18127,34 +18530,122 @@ exports[`Storyshots ItineraryBody/otp-react-redux Custom Time Column 2`] = ` justify-content: center; } -.c34 { +.c30 { color: #676767; font-size: 13px; font-style: normal; padding: 0; } -.c52 { +.c34 { + fill: #676767; + float: left; + height: 16px; + width: 16px; +} + +.c33 { + font-size: 13px; + margin-top: 8px; + color: #676767; + font-style: normal; +} + +.c36 { + font-weight: 500; +} + +.c37 { + font-weight: 200; + opacity: 0.8975; + padding-left: 1ch; +} + +.c63 { float: left; margin-left: -36px; color: #fff; } -.c53 { +.c64 { color: #676767; margin-top: 3px; } -.c50 { +.c61 { z-index: 30; position: relative; } -.c44 { +.c51 { + background-color: #eee; + border-radius: 4px; + color: #000; + display: block; margin-top: 5px; + padding: 8px; + -webkit-text-decoration: none; + text-decoration: none; } -.c45 { +.c55 { + -webkit-align-items: baseline; + -webkit-box-align: baseline; + -ms-flex-align: baseline; + align-items: baseline; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + gap: 5px; + margin-top: 0.5em; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c55:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c53 { + font-size: 12px; + margin-left: 30px; + white-space: pre-wrap; +} + +.c54 { + margin-top: 5px; + margin-left: 30px; + font-size: 12px; + font-style: italic; +} + +.c52 { + float: left; + font-size: 18px; +} + +.c50 { + display: block; + margin-top: 3px; + padding: 0; +} + +.c49 { + color: #d14727; + cursor: auto; + display: inline-block; + font-weight: 400; + margin-top: 8px; + padding: 0; +} + +.c56 { + margin-top: 5px; +} + +.c57 { color: #676767; display: -webkit-box; display: -webkit-flex; @@ -18162,30 +18653,30 @@ exports[`Storyshots ItineraryBody/otp-react-redux Custom Time Column 2`] = ` display: flex; } -.c48 { +.c59 { font-size: 14px; } -.c46 { +.c58 { padding: 0; } -.c43 { +.c48 { margin-top: 5px; } -.c43 a { +.c48 a { color: #337ab7; -webkit-text-decoration: none; text-decoration: none; } -.c43 a:hover { +.c48 a:hover { -webkit-text-decoration: underline; text-decoration: underline; } -.c43 img { +.c48 img { margin-left: 5px; vertical-align: middle; } @@ -18199,7 +18690,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Custom Time Column 2`] = ` font-family: Hind,sans-serif; } -.c1 .c40 { +.c1 .c44 { background-color: rgb(15,106,172); border-color: white; border-image: initial; @@ -18220,6 +18711,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Custom Time Column 2`] = ` } .c1 .c4 { + grid-area: line; display: table-cell; max-width: 20px; width: 20px; @@ -18228,6 +18720,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Custom Time Column 2`] = ` } .c1 .c13 { + grid-area: title; color: #000; font-size: 18px; font-weight: 500; @@ -18243,11 +18736,12 @@ exports[`Storyshots ItineraryBody/otp-react-redux Custom Time Column 2`] = ` width: 100%; } -.c1 .c51 { +.c1 .c62 { margin-left: -23px; } .c1 .c17 { + grid-area: time; color: #676767; display: table-cell; font-size: 14px; @@ -18266,16 +18760,6 @@ exports[`Storyshots ItineraryBody/otp-react-redux Custom Time Column 2`] = ` } .c6 { - background: repeating-linear-gradient( 0deg,grey,grey 8px,white 8px,white 12.5px ); - left: 7.5px; - right: 7.5px; - bottom: -11px; - position: absolute; - top: 11px; - z-index: 10; -} - -.c31 { background: radial-gradient(ellipse at center,#87cefa 40%,transparent 10%); background-position: center -5px; background-repeat: repeat-y; @@ -18288,11 +18772,21 @@ exports[`Storyshots ItineraryBody/otp-react-redux Custom Time Column 2`] = ` z-index: 10; } -.c36 { +.c38 { + background: repeating-linear-gradient( 0deg,red,red 8px,white 8px,white 12.5px ); + left: 7.5px; + right: 7.5px; + bottom: -11px; + position: absolute; + top: 11px; + z-index: 10; +} + +.c39 { background-color: gray; left: 5px; right: 5px; - background-color: #000088; + background-color: #084C8D; bottom: -11px; position: absolute; top: 11px; @@ -18322,13 +18816,13 @@ exports[`Storyshots ItineraryBody/otp-react-redux Custom Time Column 2`] = ` className="c0 c1" >
  • - 128 NW 12th Ave, Portland + KGW Studio on the Sq, Portland, OR, USA
    -
    - - 10:58 AM - -
    + 3:44 PM +
    + + otpUi.TransitLegBody.fromLocation + +
    - - Delayed xx min. -
    -
    - - otpUi.TransitLegBody.fromLocation - -
    -
    -
    - Wait 4 minutes for pickup -
    -
    - Estimated travel time: - 2 min - (does not account for traffic) -
    + 0 min + + + + + (Expand details) + + +
    - Estimated cost: - $17.00 - - - $19.00 +
    +
      +
    1. +
      + + + +
      +
      + + Head + SOUTHEAST + on + + Unnamed Path + + + 91 feet + + +
      +
      2. +
    +
    -
    +
  • -
    + 3:44 PM +
    + + otpUi.TransitLegBody.fromLocation + +
    +
    +
    + + + + + + + + + + - + + + Bicycle 0.1 miles to + + corner of path and Pioneer Sq N (path) + + + + +
    - 11:01 AM + + + +
    +
    +
      +
    1. +
      + + + +
      +
      + + LEFT + on + + Unnamed Path + + + 20 feet + + +
      +
      2. +
    2. +
      + + + +
      +
      + + LEFT + on + + SW 6th Ave + + + 245 feet + + +
      +
      3. +
    3. +
      + + + +
      +
      + + LEFT + on + + SW Morrison St + + + 241 feet + + +
      +
      4. +
    4. +
      + + + +
      +
      + + LEFT + on + + Unnamed Path + + + 27 feet + + +
      +
      5. +
    +
    +
    +
    +
    • +
  • +
    + - Delayed xx min. -
    + + +
    +
    + + corner of path and Pioneer Sq N (path) + +
    +
    + 3:45 PM
    otpUi.TransitLegBody.fromLocation
    - - Walk to + Walk 22 feet to - W Burnside & SW 6th + Pioneer Square North MAX Station
    @@ -18723,13 +19597,13 @@ exports[`Storyshots ItineraryBody/otp-react-redux Custom Time Column 2`] = `
  • - W Burnside & SW 6th + Pioneer Square North MAX Station
    -
    - - 11:02 AM - -
    -
    - - Delayed xx min. -
    + 3:46 PM
    otpUi.TransitLegBody.fromLocation
    - Stop ID + Stop ID 8383
    - Ride + - - - - - 20 + MAX Blue Line - Burnside/Stark + MAX Blue Line + + to + + Hillsboro - Disembark at - E Burnside & SE 12th + Providence Park MAX Station
    Service operated by + > + TriMet + + +
    +
    + + + 2 alerts
    + > + +
  • - E Burnside & SE 12th + Providence Park MAX Station
    -
    - - 11:08 AM - -
    -
    - - Delayed xx min. -
    + 3:49 PM
    otpUi.TransitLegBody.fromLocation
    + Stop ID 9757 + +
    +
    - - Walk to + Walk 19 feet to - East Burnside Street + corner of path and Providence Park (path)
    - -
    + + + + + (Expand details) + + + +
      + className="c32" + > +
    1. +
      + + + +
      +
      + + Head + WEST + on + + Providence Park (path) + + + 19 feet + + +
      +
      2. +
    @@ -19277,13 +20283,13 @@ exports[`Storyshots ItineraryBody/otp-react-redux Custom Time Column 2`] = `
  • -
    - - 11:09 AM - -
    -
    - - Delayed xx min. -
    + 3:49 PM
    otpUi.TransitLegBody.fromLocation
    -
    -
    - Wait for pickup -
    +
    -
    - - - - - - - - + + + + + - + + + Bicycle 230 feet to - - + 1737 SW Morrison St, Portland, OR, USA 97205 - - Ride 0.2 miles to - - 407 NE 12th Ave, Portland - + +
    + + + - -
    + + + + + (Expand details) + + +
    - - Book Ride -
    -
    -
    -
    - Wait until 11:08 AM to book -
    -
    +
    + + + +
    +
    + + RIGHT + on + + Unnamed Path + + + 104 feet + + +
    +
    • +
  • +
    + + + +
    +
    + + RIGHT + on + + Unnamed Path + + + 27 feet + + +
    +
    • +
  • +
    + + + +
    +
    + + RIGHT + on + + SW Morrison St + + + 99 feet + + +
    +
    • + -
    - Estimated travel time: - 1 min - (does not account for traffic) -
    -
    - Estimated cost: - $17.00 - - - $18.00 -
    - +
  • -
    - - 11:10 AM - -
    -
    - - Delayed xx min. -
    + 3:50 PM
    Arrive at - 407 NE 12th Ave, Portland + 1737 SW Morrison St, Portland, OR, USA 97205
    • `; -exports[`Storyshots ItineraryBody/otp-react-redux E Scooter Rental Itinerary 1`] = ` +exports[`Storyshots ItineraryBody/otp-react-redux Custom Time Column 1`] = ` - -`; - -exports[`Storyshots ItineraryBody/otp-react-redux E Scooter Rental Itinerary 2`] = ` -.c8 { - display: inline-block; - vertical-align: middle; - overflow: hidden; + Object { + "agency": null, + "arrivalDelay": 0, + "departureDelay": 0, + "distance": 0, + "duration": 60, + "endTime": 1684865340000, + "from": Object { + "lat": 45.522823, + "lon": -122.653824, + "name": "E Burnside & SE 12th", + "rentalVehicle": null, + "stop": Object { + "alerts": Array [], + "code": "13327", + "gtfsId": "trimet:13327", + "id": "U3RvcDp0cmltZXQ6MTMzMjc", + }, + "vertexType": "TRANSIT", + }, + "interlineWithPreviousLeg": false, + "intermediateStops": null, + "legGeometry": Object { + "length": 2, + "points": "sdztGlyrkVO?", + }, + "mode": "WALK", + "realTime": false, + "realtimeState": null, + "rentedBike": false, + "rideHailingEstimate": null, + "route": null, + "startTime": 1684865280000, + "steps": Array [], + "to": Object { + "lat": 45.522907, + "lon": -122.653824, + "name": "East Burnside Street", + "rentalVehicle": null, + "stop": null, + "vertexType": "NORMAL", + }, + "transitLeg": false, + "trip": null, + }, + Object { + "agency": null, + "arrivalDelay": 0, + "departureDelay": 0, + "distance": 334.71, + "duration": 66, + "endTime": 1684865406000, + "from": Object { + "lat": 45.522907, + "lon": -122.653824, + "name": "East Burnside Street", + "rentalVehicle": null, + "stop": null, + "vertexType": "NORMAL", + }, + "interlineWithPreviousLeg": false, + "intermediateStops": null, + "legGeometry": Object { + "length": 17, + "points": "ceztGlyrkV?I?_@U?c@?A?]?A?c@?M?O?oBAO?Q?uDAuA?A?", + }, + "mode": "CAR", + "realTime": false, + "realtimeState": null, + "rentedBike": false, + "rideHailingEstimate": Object { + "arrival": "PT2M", + "maxPrice": Object { + "amount": 18, + "currency": Object { + "code": "USD", + }, + }, + "minPrice": Object { + "amount": 17, + "currency": Object { + "code": "USD", + }, + }, + "provider": Object { + "id": "uber", + }, + }, + "route": null, + "startTime": 1684865340000, + "steps": Array [ + Object { + "absoluteDirection": "EAST", + "alerts": Array [], + "area": false, + "distance": 16.06, + "elevationProfile": Array [], + "lat": 45.522907, + "lon": -122.653824, + "relativeDirection": "DEPART", + "stayOn": false, + "streetName": "East Burnside Street", + }, + Object { + "absoluteDirection": "NORTH", + "alerts": Array [], + "area": false, + "distance": 318.65, + "elevationProfile": Array [], + "lat": 45.5229076, + "lon": -122.6536179, + "relativeDirection": "LEFT", + "stayOn": false, + "streetName": "Northeast 12th Avenue", + }, + ], + "to": Object { + "lat": 45.525773, + "lon": -122.6535042, + "name": "407 NE 12th Ave, Portland", + "rentalVehicle": null, + "stop": null, + "vertexType": "NORMAL", + }, + "transitLeg": false, + "trip": null, + }, + ], + "startTime": 1684864716000, + "waitingTime": 0, + "walkTime": 330, + } + } + /> +     +`; + +exports[`Storyshots ItineraryBody/otp-react-redux Custom Time Column 2`] = ` +.c8 { + display: inline-block; + vertical-align: middle; + overflow: hidden; } .c11 { color: #333; } -.c40 { +.c58 { color: #f44256; } -.c26 { +.c27 { background: transparent; border: 0; color: inherit; @@ -20033,23 +21072,141 @@ exports[`Storyshots ItineraryBody/otp-react-redux E Scooter Rental Itinerary 2`] text-decoration: none; } -.c31::before { +.c30 { + background-color: #fff; + background-image: none; + border-radius: 4px; + border: 1px solid #ccc; + color: #333; + cursor: pointer; + display: inline-block; + font-size: 14px; + font-weight: 400; + padding: 4px 6px; + text-align: center; + -webkit-text-decoration: none; + text-decoration: none; + touch-action: manipulation; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + white-space: nowrap; +} + +.c30:hover { + color: #333; + background-color: #e6e6e6; + border-color: #adadad; +} + +.c30:active { + color: #333; + background-color: #e6e6e6; + background-image: none; + border-color: #adadad; + outline: 0; + box-shadow: inset 0 3px 5px rgba(0,0,0,0.125); +} + +.c30:focus { + color: #333; + background-color: #e6e6e6; + border-color: #8c8c8c; +} + +.c30:active:hover { + color: #333; + background-color: #d4d4d4; + border-color: #8c8c8c; +} + +.c37 { + color: #008; + margin-left: 5px; +} + +.c37:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c38 { + padding-left: 0px; +} + +.c38:before { + content: "|"; + color: black; + margin-right: 5px; +} + +.c55 { + bottom: 0; + left: 110px; + position: absolute; + right: 0; + top: 0; +} + +.c56 { + background-color: #fcf9d3; + display: table; + height: 100%; + width: 100%; +} + +.c54 { + border-bottom: 16px solid transparent; + border-right: 16px solid #fcf9d3; + border-top: 16px solid transparent; + height: 0; + left: 94px; + position: absolute; + top: 0; + width: 0; +} + +.c57 { + color: #444; + display: table-cell; + font-style: italic; + line-height: 0.95; + padding: 0px 2px; + vertical-align: middle; +} + +.c29 { + height: 32px; + margin-bottom: 10px; + margin-top: 10px; + position: relative; +} + +.c47::before { content: ""; margin: 0 0.125em; } +.c49 { + display: block; + font-size: 13px; + list-style: none; + padding: 0; +} + .c0 { list-style: none; padding: 0; } -.c21 { +.c22 { color: #676767; font-size: 13px; padding-bottom: 12px; } -.c27 { +.c28 { bottom: 0; cursor: pointer; left: 0; @@ -20060,7 +21217,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux E Scooter Rental Itinerary 2`] z-index: 1; } -.c22 { +.c23 { -webkit-align-items: center; -webkit-box-align: center; -ms-flex-align: center; @@ -20083,19 +21240,34 @@ exports[`Storyshots ItineraryBody/otp-react-redux E Scooter Rental Itinerary 2`] width: 0; } -.c25 { +.c26 { font-weight: inherit; } -.c24 img, -.c24 svg { +.c42 { + font-size: 13px; + font-weight: 500; +} + +.c41 { + font-weight: 800; + margin-right: 6px; +} + +.c39 { + color: #807373; + margin-top: 5px; +} + +.c25 img, +.c25 svg { margin-right: 6px; height: 24px; width: 24px; vertical-align: bottom; } -.c23 { +.c24 { -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; @@ -20107,14 +21279,15 @@ exports[`Storyshots ItineraryBody/otp-react-redux E Scooter Rental Itinerary 2`] padding-right: 5px; } -.c28 { +.c32 { display: grid; - grid-template-columns: 100px auto; + grid-template-columns: 130px auto; } .c3 { max-width: 500px; display: grid; + grid-template-areas: "time line title" "time line instructions"; grid-template-columns: 65px 30px auto; } @@ -20128,6 +21301,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux E Scooter Rental Itinerary 2`] .c20 { grid-row-start: 2; grid-column-start: 3; + grid-area: instructions; } .c14 { @@ -20154,7 +21328,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux E Scooter Rental Itinerary 2`] padding: 3px 0 10px 0; } -.c39 { +.c21 { color: #807373; font-size: 13px; font-weight: 300; @@ -20163,23 +21337,13 @@ exports[`Storyshots ItineraryBody/otp-react-redux E Scooter Rental Itinerary 2`] margin-top: -14px; } -.c32 { +.c35 { display: block; list-style: none; padding: 0; } -.c35 { - margin-left: 24px; - line-height: 1.25em; - padding-top: 1px; -} - -.c35 > span { - margin-right: 1ch; -} - -.c29 { +.c33 { display: -webkit-inline-box; display: -webkit-inline-flex; display: -ms-inline-flexbox; @@ -20190,7 +21354,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux E Scooter Rental Itinerary 2`] margin-top: 10px; } -.c29 a { +.c33 a { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; @@ -20205,35 +21369,67 @@ exports[`Storyshots ItineraryBody/otp-react-redux E Scooter Rental Itinerary 2`] justify-content: center; } -.c30 { +.c34 { color: #676767; font-size: 13px; font-style: normal; padding: 0; } -.c34 { - fill: #676767; +.c52 { float: left; - height: 16px; - width: 16px; + margin-left: -36px; + color: #fff; } -.c33 { - font-size: 13px; - margin-top: 8px; +.c53 { color: #676767; - font-style: normal; + margin-top: 3px; } -.c36 { - font-weight: 500; +.c50 { + z-index: 30; + position: relative; } -.c37 { - font-weight: 200; - opacity: 0.8975; - padding-left: 1ch; +.c44 { + margin-top: 5px; +} + +.c45 { + color: #676767; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; +} + +.c48 { + font-size: 14px; +} + +.c46 { + padding: 0; +} + +.c43 { + margin-top: 5px; +} + +.c43 a { + color: #337ab7; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c43 a:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c43 img { + margin-left: 5px; + vertical-align: middle; } .c1 { @@ -20245,7 +21441,28 @@ exports[`Storyshots ItineraryBody/otp-react-redux E Scooter Rental Itinerary 2`] font-family: Hind,sans-serif; } +.c1 .c40 { + background-color: rgb(15,106,172); + border-color: white; + border-image: initial; + border-radius: 12px; + border-style: solid; + border-width: 1px; + box-shadow: rgb(0,0,0) 0px 0px 0.25em; + color: white; + display: inline-block; + font-size: 14px; + font-weight: 500; + height: 24px; + line-height: 1.5; + margin-right: 8px; + min-width: 24px; + padding: 2px 3px; + text-align: center; +} + .c1 .c4 { + grid-area: line; display: table-cell; max-width: 20px; width: 20px; @@ -20254,6 +21471,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux E Scooter Rental Itinerary 2`] } .c1 .c13 { + grid-area: title; color: #000; font-size: 18px; font-weight: 500; @@ -20269,7 +21487,12 @@ exports[`Storyshots ItineraryBody/otp-react-redux E Scooter Rental Itinerary 2`] width: 100%; } +.c1 .c51 { + margin-left: -23px; +} + .c1 .c17 { + grid-area: time; color: #676767; display: table-cell; font-size: 14px; @@ -20288,6 +21511,16 @@ exports[`Storyshots ItineraryBody/otp-react-redux E Scooter Rental Itinerary 2`] } .c6 { + background: repeating-linear-gradient( 0deg,grey,grey 8px,white 8px,white 12.5px ); + left: 7.5px; + right: 7.5px; + bottom: -11px; + position: absolute; + top: 11px; + z-index: 10; +} + +.c31 { background: radial-gradient(ellipse at center,#87cefa 40%,transparent 10%); background-position: center -5px; background-repeat: repeat-y; @@ -20300,10 +21533,11 @@ exports[`Storyshots ItineraryBody/otp-react-redux E Scooter Rental Itinerary 2`] z-index: 10; } -.c38 { - background: repeating-linear-gradient( 0deg,#f5a729,#f5a729 8px,white 8px,white 12.5px ); - left: 7.5px; - right: 7.5px; +.c36 { + background-color: gray; + left: 5px; + right: 5px; + background-color: #000088; bottom: -11px; position: absolute; top: 11px; @@ -20333,13 +21567,13 @@ exports[`Storyshots ItineraryBody/otp-react-redux E Scooter Rental Itinerary 2`] className="c0 c1" >
  • - 600 SW 5th Ave, Portland, OR, USA 97204 + 128 NW 12th Ave, Portland
    - 3:45 PM +
    + + 10:58 AM + +
    +
    + + Delayed xx min. +
    otpUi.TransitLegBody.fromLocation
    -
    +
    - +
    +
    - - - - - - - - - - - - Walk 206 feet to - - EMAQ + + + + + + + - - - -
    - - - - + + Zoom to leg on map + + + +
    -
    -
      -
    1. -
      - - - -
      -
      - - Head - EAST - on - - SW Alder St - - - 118 feet - - -
      -
      2. -
    2. -
      - - - -
      -
      - - LEFT - on - - SW 4th Ave - - - 88 feet - - -
      -
      3. -
    -
    + Book Ride +
    -     +
    + Estimated travel time: + 2 min + (does not account for traffic) +
    +
    + Estimated cost: + $17.00 + - + $19.00 +
    +
  • - 3:46 PM +
    + + 11:01 AM + +
    +
    + + Delayed xx min. +
    otpUi.TransitLegBody.fromLocation
    - Pick up Razor - E-scooter - -
    -
    - - RAZOR - + + + + - - Ride 0.3 miles to + Walk to - 205 SW Pine St, Portland, OR, USA 97204 + W Burnside & SW 6th
    @@ -20828,23 +21968,26 @@ exports[`Storyshots ItineraryBody/otp-react-redux E Scooter Rental Itinerary 2`]
  • +
    - 3:48 PM +
    + + 11:02 AM + +
    +
    + + Delayed xx min. +
    - Arrive at - 205 SW Pine St, Portland, OR, USA 97204 + otpUi.TransitLegBody.fromLocation
    -
    • - -`; - -exports[`Storyshots ItineraryBody/otp-react-redux E Scooter Rental Transit Itinerary 1`] = ` - - +
    + Stop ID + +
    +
    +
    + + + + - + Ride + + + + + + + + + + + + + + + 20 + + + + + Burnside/Stark + + + + + - + Disembark at + E Burnside & SE 12th + + + + +
    +
    +
    + Service operated by + +
    +
    +
    +
    +
    +
    + + +
    +
    +
    +
    +
      +
    1. +
      + • +
      +
      + W Burnside & SW 2nd +
      +
      2. +
    2. +
      + • +
      +
      + E Burnside & SE 8th +
      +
      3. +
    +
    +
    +
    +
    +
    +
    +
    + +
  • +
    +
    + + + + +
    +
    + + E Burnside & SE 12th + +
    +
    +
    + + 11:08 AM + +
    +
    + + Delayed xx min. +
    +
    + + otpUi.TransitLegBody.fromLocation + +
    +
    +
    + + + + + + + + + + + - + + + Walk to + + East Burnside Street + + + + +
    + + + + +
    +
    +
      +
    +
    +     +
    +
    +
    • +
  • +
    +
    + + + +
    +
    + + East Burnside Street + +
    +
    +
    + + 11:09 AM + +
    +
    + + Delayed xx min. +
    +
    + + otpUi.TransitLegBody.fromLocation + +
    +
    +
    + Wait for pickup +
    +
    +
    + + + + + + + + + + + + + - + + + Ride 0.2 miles to + + 407 NE 12th Ave, Portland + + + + +
    +
    + + Book Ride + +
    +
    +
    +
    + Wait until 11:08 AM to book +
    +
    +
    +
    +
    + Estimated travel time: + 1 min + (does not account for traffic) +
    +
    + Estimated cost: + $17.00 + - + $18.00 +
    +
    +
    +
    +
    • +
  • +
    + + + + +
    +
    + + 407 NE 12th Ave, Portland + +
    +
    +
    + + 11:10 AM + +
    +
    + + Delayed xx min. +
    +
    + + Arrive at + 407 NE 12th Ave, Portland + +
    +
    • + +`; + +exports[`Storyshots ItineraryBody/otp-react-redux E Scooter Rental Itinerary 1`] = ` + + + +`; + +exports[`Storyshots ItineraryBody/otp-react-redux E Scooter Rental Itinerary 2`] = ` +.c8 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c11 { + color: #333; +} + +.c40 { + color: #f44256; +} + +.c26 { + background: transparent; + border: 0; + color: inherit; + cursor: pointer; + font-size: inherit; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c31::before { + content: ""; + margin: 0 0.125em; +} + +.c0 { + list-style: none; + padding: 0; +} + +.c21 { + color: #676767; + font-size: 13px; + padding-bottom: 12px; +} + +.c27 { + bottom: 0; + cursor: pointer; + left: 0; + position: absolute; + right: 0; + top: 0; + width: 100%; + z-index: 1; +} + +.c22 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + line-height: 16px; + min-height: 31px; + position: relative; +} + +.c19 { + display: inline-block; + grid-row-start: 2; + grid-column-start: 1; + height: 0; + overflow: hidden; + width: 0; +} + +.c25 { + font-weight: inherit; +} + +.c24 img, +.c24 svg { + margin-right: 6px; + height: 24px; + width: 24px; + vertical-align: bottom; +} + +.c23 { + -webkit-flex-shrink: 0; + -ms-flex-negative: 0; + flex-shrink: 0; +} + +.c5 { + grid-column-start: 2; + grid-row: span 2; + padding-right: 5px; +} + +.c28 { + display: grid; + grid-template-columns: 130px auto; +} + +.c3 { + max-width: 500px; + display: grid; + grid-template-areas: "time line title" "time line instructions"; + grid-template-columns: 65px 30px auto; +} + +.c18 { + grid-column-start: 1; + grid-row: 1 / span 2; + padding-right: 5px; + font-size: 0.9em; +} + +.c20 { + grid-row-start: 2; + grid-column-start: 3; + grid-area: instructions; +} + +.c14 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + font-size: 1.2em; + grid-row-start: 1; + grid-column-start: 3; +} + +.c16 { + font-size: inherit; + font-weight: bold; + height: 1.2em; + margin: 0; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + -webkit-flex: 1 1 auto; + -ms-flex: 1 1 auto; + flex: 1 1 auto; + padding: 3px 0 10px 0; +} + +.c39 { + color: #807373; + font-size: 13px; + font-weight: 300; + padding-top: 1px; + margin-bottom: 10px; + margin-top: -14px; +} + +.c32 { + display: block; + list-style: none; + padding: 0; +} + +.c35 { + margin-left: 24px; + line-height: 1.25em; + padding-top: 1px; +} + +.c35 > span { + margin-right: 1ch; +} + +.c29 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-self: center; + -ms-flex-item-align: center; + align-self: center; + margin-top: 10px; +} + +.c29 a { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c30 { + color: #676767; + font-size: 13px; + font-style: normal; + padding: 0; +} + +.c34 { + fill: #676767; + float: left; + height: 16px; + width: 16px; +} + +.c33 { + font-size: 13px; + margin-top: 8px; + color: #676767; + font-style: normal; +} + +.c36 { + font-weight: 500; +} + +.c37 { + font-weight: 200; + opacity: 0.8975; + padding-left: 1ch; +} + +.c1 { + font-size: 16px; +} + +.c1 *:not(.fa) { + box-sizing: border-box; + font-family: Hind,sans-serif; +} + +.c1 .c4 { + grid-area: line; + display: table-cell; + max-width: 20px; + width: 20px; + padding: 0; + position: relative; +} + +.c1 .c13 { + grid-area: title; + color: #000; + font-size: 18px; + font-weight: 500; + line-height: 20px; +} + +.c1 .c15 { + height: inherit; + white-space: normal; +} + +.c1 .c2 { + width: 100%; +} + +.c1 .c17 { + grid-area: time; + color: #676767; + display: table-cell; + font-size: 14px; + padding-right: 4px; + padding-top: 2px; + text-align: right; + vertical-align: top; + width: 60px; +} + +.c7 { + position: absolute; + width: 100%; + top: 3px; + z-index: 20; +} + +.c6 { + background: radial-gradient(ellipse at center,#87cefa 40%,transparent 10%); + background-position: center -5px; + background-repeat: repeat-y; + background-size: 12px 12px; + left: 6px; + right: 6px; + bottom: -11px; + position: absolute; + top: 11px; + z-index: 10; +} + +.c38 { + background: repeating-linear-gradient( 0deg,#f5a729,#f5a729 8px,white 8px,white 12.5px ); + left: 7.5px; + right: 7.5px; + bottom: -11px; + position: absolute; + top: 11px; + z-index: 10; +} + +.c9 { + left: 0; + line-height: inherit; + position: absolute; + text-align: center; + width: 100%; +} + +.c10 { + top: 3px; +} + +.c12 { + left: 0; + position: absolute; + text-align: center; + width: 100%; +} + +
      +
    1. +
      +
      + + + + +
      +
      + + 600 SW 5th Ave, Portland, OR, USA 97204 + +
      +
      + 3:45 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + + + + + + + + - + + + Walk 206 feet to + + EMAQ + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + EAST + on + + SW Alder St + + + 118 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + LEFT + on + + SW 4th Ave + + + 88 feet + + +
        +
        3. +
      +
      +
      +       +
      +
      +
      2. +
    2. +
      +
      + + + +
      +
      + + EMAQ + +
      +
      + 3:46 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      + Pick up Razor + E-scooter + +
      +
      +
      + + + + + RAZOR + + + + + - + + + Ride 0.3 miles to + + 205 SW Pine St, Portland, OR, USA 97204 + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + CONTINUE + on + + SW 4th Ave + + + 0.2 miles + + +
        +
        2. +
      2. +
        + + + +
        +
        + + RIGHT + on + + SW Pine St + + + 456 feet + + +
        +
        3. +
      +
      +
      +       +
      +
      +
      3. +
    3. +
      + + + + +
      +
      + + 205 SW Pine St, Portland, OR, USA 97204 + +
      +
      + 3:48 PM +
      + + Arrive at + 205 SW Pine St, Portland, OR, USA 97204 + +
      +
      4. +
    +`; + +exports[`Storyshots ItineraryBody/otp-react-redux E Scooter Rental Transit Itinerary 1`] = ` + + - -`; - -exports[`Storyshots ItineraryBody/otp-react-redux E Scooter Rental Transit Itinerary 2`] = ` -.c8 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c11 { - color: #333; -} - -.c64 { - color: #f44256; -} - -.c26 { - background: transparent; - border: 0; - color: inherit; - cursor: pointer; - font-size: inherit; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c47 { - color: #008; - margin-left: 5px; -} - -.c47:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c48 { - padding-left: 0px; -} - -.c48:before { - content: "|"; - color: black; - margin-right: 5px; -} - -.c31::before { - content: ""; - margin: 0 0.125em; -} - -.c59 { - display: block; - font-size: 13px; - list-style: none; - padding: 0; -} - -.c0 { - list-style: none; - padding: 0; -} - -.c21 { - color: #676767; - font-size: 13px; - padding-bottom: 12px; -} - -.c27 { - bottom: 0; - cursor: pointer; - left: 0; - position: absolute; - right: 0; - top: 0; - width: 100%; - z-index: 1; -} - -.c22 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - line-height: 16px; - min-height: 31px; - position: relative; -} - -.c19 { - display: inline-block; - grid-row-start: 2; - grid-column-start: 1; - height: 0; - overflow: hidden; - width: 0; -} - -.c53 { - font-weight: 200; -} - -.c25 { - font-weight: inherit; -} - -.c52 { - font-size: 13px; - font-weight: 500; -} - -.c51 { - font-weight: 800; - margin-right: 6px; -} - -.c49 { - color: #807373; - margin-top: 5px; -} - -.c24 img, -.c24 svg { - margin-right: 6px; - height: 24px; - width: 24px; - vertical-align: bottom; -} - -.c23 { - -webkit-flex-shrink: 0; - -ms-flex-negative: 0; - flex-shrink: 0; -} - -.c5 { - grid-column-start: 2; - grid-row: span 2; - padding-right: 5px; -} - -.c28 { - display: grid; - grid-template-columns: 100px auto; -} - -.c3 { - max-width: 500px; - display: grid; - grid-template-columns: 65px 30px auto; -} - -.c38 { - border-color: #fff; - border-radius: 5px; - border-style: solid; - border-width: 1px; - display: inline-block; - font-style: normal; - grid-column: 2; - grid-row: 1; - margin: 0 4px; - position: relative; - text-align: center; - -webkit-text-decoration: none; - text-decoration: none; - vertical-align: middle; - width: 75%; -} - -.c38:hover { - border-color: #d1d5da; - background-color: #f6f8fa; -} - -.c18 { - grid-column-start: 1; - grid-row: 1 / span 2; - padding-right: 5px; - font-size: 0.9em; -} - -.c20 { - grid-row-start: 2; - grid-column-start: 3; -} - -.c14 { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - font-size: 1.2em; - grid-row-start: 1; - grid-column-start: 3; -} - -.c16 { - font-size: inherit; - font-weight: bold; - height: 1.2em; - margin: 0; - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; - -webkit-flex: 1 1 auto; - -ms-flex: 1 1 auto; - flex: 1 1 auto; - padding: 3px 0 10px 0; -} - -.c45 { - color: #807373; - font-size: 13px; - font-weight: 300; - padding-top: 1px; - margin-bottom: 10px; - margin-top: -14px; -} - -.c39 { - padding: 2px; - width: 100%; -} - -.c41 { - font-size: xx-small; -} - -.c41::before { - content: ""; - margin: 0 0.125em; -} - -.c42 { - color: #e60000; -} - -.c43 { - color: green; -} - -.c40 { - font-size: small; -} - -.c32 { - display: block; - list-style: none; - padding: 0; -} - -.c35 { - margin-left: 24px; - line-height: 1.25em; - padding-top: 1px; -} - -.c35 > span { - margin-right: 1ch; -} - -.c29 { - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - -webkit-align-self: center; - -ms-flex-item-align: center; - align-self: center; - margin-top: 10px; -} - -.c29 a { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; -} - -.c30 { - color: #676767; - font-size: 13px; - font-style: normal; - padding: 0; -} - -.c34 { - fill: #676767; - float: left; - height: 16px; - width: 16px; -} - -.c33 { - font-size: 13px; - margin-top: 8px; - color: #676767; - font-style: normal; -} - -.c36 { - font-weight: 500; -} - -.c37 { - font-weight: 200; - opacity: 0.8975; - padding-left: 1ch; -} - -.c62 { - float: left; - margin-left: -36px; - color: #fff; -} - -.c63 { - color: #676767; - margin-top: 3px; -} - -.c60 { - z-index: 30; - position: relative; -} - -.c55 { - margin-top: 5px; -} - -.c56 { - color: #676767; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; -} - -.c58 { - font-size: 14px; -} - -.c57 { - padding: 0; -} - -.c54 { - margin-top: 5px; -} - -.c54 a { - color: #337ab7; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c54 a:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c54 img { - margin-left: 5px; - vertical-align: middle; -} - -.c1 { - font-size: 16px; -} - -.c1 *:not(.fa) { - box-sizing: border-box; - font-family: Hind,sans-serif; -} - -.c1 .c50 { - background-color: rgb(15,106,172); - border-color: white; - border-image: initial; - border-radius: 12px; - border-style: solid; - border-width: 1px; - box-shadow: rgb(0,0,0) 0px 0px 0.25em; - color: white; - display: inline-block; - font-size: 14px; - font-weight: 500; - height: 24px; - line-height: 1.5; - margin-right: 8px; - min-width: 24px; - padding: 2px 3px; - text-align: center; -} - -.c1 .c4 { - display: table-cell; - max-width: 20px; - width: 20px; - padding: 0; - position: relative; -} - -.c1 .c13 { - color: #000; - font-size: 18px; - font-weight: 500; - line-height: 20px; -} - -.c1 .c15 { - height: inherit; - white-space: normal; -} - -.c1 .c2 { - width: 100%; -} - -.c1 .c61 { - margin-left: -23px; -} - -.c1 .c17 { - color: #676767; - display: table-cell; - font-size: 14px; - padding-right: 4px; - padding-top: 2px; - text-align: right; - vertical-align: top; - width: 60px; -} - -.c7 { - position: absolute; - width: 100%; - top: 3px; - z-index: 20; -} - -.c6 { - background: radial-gradient(ellipse at center,#87cefa 40%,transparent 10%); - background-position: center -5px; - background-repeat: repeat-y; - background-size: 12px 12px; - left: 6px; - right: 6px; - bottom: -11px; - position: absolute; - top: 11px; - z-index: 10; -} - -.c44 { - background: repeating-linear-gradient( 0deg,#f5a729,#f5a729 8px,white 8px,white 12.5px ); - left: 7.5px; - right: 7.5px; - bottom: -11px; - position: absolute; - top: 11px; - z-index: 10; -} - -.c46 { - background-color: gray; - left: 5px; - right: 5px; - background-color: #000088; - bottom: -11px; - position: absolute; - top: 11px; - z-index: 10; -} - -.c9 { - left: 0; - line-height: inherit; - position: absolute; - text-align: center; - width: 100%; -} - -.c10 { - top: 3px; -} - -.c12 { - left: 0; - position: absolute; - text-align: center; - width: 100%; -} - -
      -
    1. -
      -
      - - - - -
      -
      - - 2943 SE Washington St, Portland, OR, USA 97214 - -
      -
      - 3:45 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - - - - - - - - Walk 0.4 miles to - - Shared E-scooter - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - SOUTH - on - - SE 30th Ave - - - 0.2 miles - - -
        -
        2. -
      2. -
        - - - -
        -
        - - RIGHT - on - - SE Belmont St - - - 330 feet - - -
        -
        3. -
      3. -
        - - - -
        -
        - - LEFT - on - - SE 29th Ave - - - 511 feet - - -
        -
        4. -
      4. -
        - - - -
        -
        - - RIGHT - on - - SE Taylor St - - - 235 feet - - -
        -
        5. -
      -
      -
      -
      - -
      -       -
      -
      -
      2. -
    2. -
      -
      - - - -
      -
      - - Shared E-scooter - -
      -
      - 3:54 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      - Pick up Shared - E-scooter - -
      -
      -
      - - - - - SHARED - - - - - - - - - Ride 1.4 miles to - - NE Broadway - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - CONTINUE - on - - SE Taylor St - - - 26 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - RIGHT - on - - SE 28th Ave - - - 0.6 miles - - -
        -
        3. -
      3. -
        - - - -
        -
        - - CONTINUE - on - - NE 28th Ave - - - 0.7 miles - - -
        -
        4. -
      4. -
        - - - -
        -
        - - SLIGHTLY_RIGHT - on - - NE Halsey St - - - 17 feet - - -
        -
        5. -
      5. -
        - - - -
        -
        - - RIGHT - on - - NE Halsey St - - - 59 feet - - -
        -
        6. -
      6. -
        - - - -
        -
        - - SLIGHTLY_LEFT - on - - NE 28th Ave - - - 28 feet - - -
        -
        7. -
      7. -
        - - - -
        -
        - - SLIGHTLY_LEFT - on - - NE 28th Ave - - - 489 feet - - -
        -
        8. -
      8. -
        - - - -
        -
        - - RIGHT - on - - NE Broadway - - - 86 feet - - -
        -
        9. -
      -
      -
      -
      - -
      -       -
      -
      -
      3. -
    3. -
      -
      - - - -
      -
      - - NE Broadway - -
      -
      - 4:03 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - - - - - - - - Walk to - - NE Broadway & 28th - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - RIGHT - on - - street transit link - - -
        -
        2. -
      -
      -
      -       -
      -
      -
      4. -
    4. -
      -
      - - - - -
      -
      - - NE Broadway & 28th - -
      -
      - 4:08 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      - Stop ID 638 - -
      -
      -
      - - - - - - Ride - - - - - - - - - - - - - - - 70 - - - - - 12th/NE 33rd Ave - - to - - NE Sunderland - - - - - - - Disembark at - NE 33rd & Shaver - - - - -
      -
      -
      - Service operated by - - TriMet - - -
      -
      -
      -
      -
      -
      - - -
      -
      -
      -
      -
        -
      1. -
        - • -
        -
        - NE Broadway & 32nd -
        -
        2. -
      2. -
        - • -
        -
        - NE 33rd & Schuyler -
        -
        3. -
      3. -
        - • -
        -
        - NE 33rd & US Grant Pl -
        -
        4. -
      4. -
        - • -
        -
        - NE 33rd & Brazee -
        -
        5. -
      5. -
        - • -
        -
        - NE 33rd & Knott -
        -
        6. -
      6. -
        - • -
        -
        - NE 33rd & Stanton -
        -
        7. -
      7. -
        - • -
        -
        - NE 33rd & Siskiyou -
        -
        8. -
      8. -
        - • -
        -
        - NE 33rd & Alameda -
        -
        9. -
      -
      -
      -
      -
      -
      -
      -
      -
      5. -
    5. -
      -
      - - - - -
      -
      - - NE 33rd & Shaver - -
      -
      - 4:17 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      - Stop ID 7393 - -
      -
      -
      - - - - - - - - - - - - - - - Walk 0.4 miles to - - Shared E-scooter - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - NORTH - on - - NE 33rd Ave - - - 33 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - RIGHT - on - - NE Shaver St - - - 0.3 miles - - -
        -
        3. -
      3. -
        - - - -
        -
        - - LEFT - on - - NE 38th Ave - - - 332 feet - - -
        -
        4. -
      -
      -
      -
      - -
      -       -
      -
      -
      6. -
    6. -
      -
      - - - -
      -
      - - Shared E-scooter - -
      -
      - 4:25 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      - Pick up Shared - E-scooter - -
      -
      -
      - - - - - SHARED - - - - - - - - - Ride 1 mile to - - 5112 NE 47th Pl, Portland, OR, USA 97218 - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - CONTINUE - on - - NE 38th Ave - - - 355 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - RIGHT - on - - NE Skidmore St - - - 0.2 miles - - -
        -
        3. -
      3. -
        - - - -
        -
        - - LEFT - on - - NE 42nd Ave - - - 0.4 miles - - -
        -
        4. -
      4. -
        - - - -
        -
        - - RIGHT - on - - NE Alberta St - - - 0.3 miles - - -
        -
        5. -
      5. -
        - - - -
        -
        - - LEFT - on - - NE 47th Pl - - - 313 feet - - -
        -
        6. -
      -
      -
      -
      - -
      -       -
      -
      -
      7. -
    7. -
      - - - - -
      -
      - - 5112 NE 47th Pl, Portland, OR, USA 97218 - -
      -
      - 4:31 PM -
      - - Arrive at - 5112 NE 47th Pl, Portland, OR, USA 97218 - -
      -
      8. -
    -`; - -exports[`Storyshots ItineraryBody/otp-react-redux Hide Driving Directions 1`] = ` - - `; -exports[`Storyshots ItineraryBody/otp-react-redux Hide Driving Directions 2`] = ` +exports[`Storyshots ItineraryBody/otp-react-redux E Scooter Rental Transit Itinerary 2`] = ` .c8 { display: inline-block; vertical-align: middle; @@ -28904,7 +26969,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Hide Driving Directions 2`] = color: #333; } -.c66 { +.c64 { color: #f44256; } @@ -28918,32 +26983,32 @@ exports[`Storyshots ItineraryBody/otp-react-redux Hide Driving Directions 2`] = text-decoration: none; } -.c42 { +.c47 { color: #008; margin-left: 5px; } -.c42:hover { +.c47:hover { -webkit-text-decoration: underline; text-decoration: underline; } -.c43 { +.c48 { padding-left: 0px; } -.c43:before { +.c48:before { content: "|"; color: black; margin-right: 5px; } -.c33::before { +.c31::before { content: ""; margin: 0 0.125em; } -.c61 { +.c59 { display: block; font-size: 13px; list-style: none; @@ -28995,7 +27060,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Hide Driving Directions 2`] = width: 0; } -.c48 { +.c53 { font-weight: 200; } @@ -29003,17 +27068,17 @@ exports[`Storyshots ItineraryBody/otp-react-redux Hide Driving Directions 2`] = font-weight: inherit; } -.c47 { +.c52 { font-size: 13px; font-weight: 500; } -.c46 { +.c51 { font-weight: 800; margin-right: 6px; } -.c44 { +.c49 { color: #807373; margin-top: 5px; } @@ -29040,15 +27105,39 @@ exports[`Storyshots ItineraryBody/otp-react-redux Hide Driving Directions 2`] = .c28 { display: grid; - grid-template-columns: 100px auto; + grid-template-columns: 130px auto; } .c3 { max-width: 500px; display: grid; + grid-template-areas: "time line title" "time line instructions"; grid-template-columns: 65px 30px auto; } +.c38 { + border-color: #fff; + border-radius: 5px; + border-style: solid; + border-width: 1px; + display: inline-block; + font-style: normal; + grid-column: 2; + grid-row: 1; + margin: 0 4px; + position: relative; + text-align: center; + -webkit-text-decoration: none; + text-decoration: none; + vertical-align: middle; + width: 75%; +} + +.c38:hover { + border-color: #d1d5da; + background-color: #f6f8fa; +} + .c18 { grid-column-start: 1; grid-row: 1 / span 2; @@ -29059,6 +27148,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Hide Driving Directions 2`] = .c20 { grid-row-start: 2; grid-column-start: 3; + grid-area: instructions; } .c14 { @@ -29085,7 +27175,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Hide Driving Directions 2`] = padding: 3px 0 10px 0; } -.c41 { +.c45 { color: #807373; font-size: 13px; font-weight: 300; @@ -29094,19 +27184,45 @@ exports[`Storyshots ItineraryBody/otp-react-redux Hide Driving Directions 2`] = margin-top: -14px; } -.c34 { +.c39 { + padding: 2px; + width: 100%; +} + +.c41 { + font-size: xx-small; +} + +.c41::before { + content: ""; + margin: 0 0.125em; +} + +.c42 { + color: #e60000; +} + +.c43 { + color: green; +} + +.c40 { + font-size: small; +} + +.c32 { display: block; list-style: none; padding: 0; } -.c37 { +.c35 { margin-left: 24px; line-height: 1.25em; padding-top: 1px; } -.c37 > span { +.c35 > span { margin-right: 1ch; } @@ -29136,130 +27252,58 @@ exports[`Storyshots ItineraryBody/otp-react-redux Hide Driving Directions 2`] = justify-content: center; } -.c32 { - color: #676767; - font-size: 13px; - font-style: normal; - padding: 0; -} - .c30 { color: #676767; font-size: 13px; font-style: normal; padding: 0; - margin-right: 0.4em; } -.c36 { +.c34 { fill: #676767; float: left; height: 16px; width: 16px; } -.c35 { +.c33 { font-size: 13px; margin-top: 8px; color: #676767; font-style: normal; } -.c38 { +.c36 { font-weight: 500; } -.c39 { +.c37 { font-weight: 200; opacity: 0.8975; padding-left: 1ch; } -.c64 { +.c62 { float: left; margin-left: -36px; color: #fff; } -.c65 { +.c63 { color: #676767; margin-top: 3px; } -.c62 { +.c60 { z-index: 30; position: relative; } -.c52 { - background-color: #eee; - border-radius: 4px; - color: #000; - display: block; - margin-top: 5px; - padding: 8px; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c56 { - -webkit-align-items: baseline; - -webkit-box-align: baseline; - -ms-flex-align: baseline; - align-items: baseline; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - gap: 5px; - margin-top: 0.5em; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c56:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c54 { - font-size: 12px; - margin-left: 30px; - white-space: pre-wrap; -} - .c55 { margin-top: 5px; - margin-left: 30px; - font-size: 12px; - font-style: italic; -} - -.c53 { - float: left; - font-size: 18px; -} - -.c51 { - display: block; - margin-top: 3px; - padding: 0; -} - -.c50 { - color: #d14727; - cursor: auto; - display: inline-block; - font-weight: 400; - margin-top: 8px; - padding: 0; -} - -.c57 { - margin-top: 5px; } -.c58 { +.c56 { color: #676767; display: -webkit-box; display: -webkit-flex; @@ -29267,30 +27311,30 @@ exports[`Storyshots ItineraryBody/otp-react-redux Hide Driving Directions 2`] = display: flex; } -.c60 { +.c58 { font-size: 14px; } -.c59 { +.c57 { padding: 0; } -.c49 { +.c54 { margin-top: 5px; } -.c49 a { +.c54 a { color: #337ab7; -webkit-text-decoration: none; text-decoration: none; } -.c49 a:hover { +.c54 a:hover { -webkit-text-decoration: underline; text-decoration: underline; } -.c49 img { +.c54 img { margin-left: 5px; vertical-align: middle; } @@ -29304,7 +27348,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Hide Driving Directions 2`] = font-family: Hind,sans-serif; } -.c1 .c45 { +.c1 .c50 { background-color: rgb(15,106,172); border-color: white; border-image: initial; @@ -29325,6 +27369,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Hide Driving Directions 2`] = } .c1 .c4 { + grid-area: line; display: table-cell; max-width: 20px; width: 20px; @@ -29333,6 +27378,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Hide Driving Directions 2`] = } .c1 .c13 { + grid-area: title; color: #000; font-size: 18px; font-weight: 500; @@ -29348,11 +27394,12 @@ exports[`Storyshots ItineraryBody/otp-react-redux Hide Driving Directions 2`] = width: 100%; } -.c1 .c63 { +.c1 .c61 { margin-left: -23px; } .c1 .c17 { + grid-area: time; color: #676767; display: table-cell; font-size: 14px; @@ -29371,16 +27418,6 @@ exports[`Storyshots ItineraryBody/otp-react-redux Hide Driving Directions 2`] = } .c6 { - background: repeating-linear-gradient( 0deg,grey,grey 8px,white 8px,white 12.5px ); - left: 7.5px; - right: 7.5px; - bottom: -11px; - position: absolute; - top: 11px; - z-index: 10; -} - -.c31 { background: radial-gradient(ellipse at center,#87cefa 40%,transparent 10%); background-position: center -5px; background-repeat: repeat-y; @@ -29393,11 +27430,21 @@ exports[`Storyshots ItineraryBody/otp-react-redux Hide Driving Directions 2`] = z-index: 10; } -.c40 { +.c44 { + background: repeating-linear-gradient( 0deg,#f5a729,#f5a729 8px,white 8px,white 12.5px ); + left: 7.5px; + right: 7.5px; + bottom: -11px; + position: absolute; + top: 11px; + z-index: 10; +} + +.c46 { background-color: gray; left: 5px; right: 5px; - background-color: #084C8D; + background-color: #000088; bottom: -11px; position: absolute; top: 11px; @@ -29427,13 +27474,13 @@ exports[`Storyshots ItineraryBody/otp-react-redux Hide Driving Directions 2`] = className="c0 c1" >
  • - 330 SW Murray Blvd, Washington County, OR, USA 97005 + 2943 SE Washington St, Portland, OR, USA 97214
    - 3:50 PM + 3:45 PM
    otpUi.TransitLegBody.fromLocation
    + - - Drive 2.4 miles to + Walk 0.4 miles to - P+R Sunset TC + Shared E-scooter +
    +
    +
      +
    1. +
      + + + +
      +
      + + Head + SOUTH + on + + SE 30th Ave + + + 0.2 miles + + +
      +
      2. +
    2. +
      + + + +
      +
      + + RIGHT + on + + SE Belmont St + + + 330 feet + + +
      +
      3. +
    3. +
      + + + +
      +
      + + LEFT + on + + SE 29th Ave + + + 511 feet + + +
      +
      4. +
    4. +
      + + + +
      +
      + + RIGHT + on + + SE Taylor St + + + 235 feet + + +
      +
      5. +
    +
    +
    +
    + +
  • - 4:02 PM + 3:54 PM
    otpUi.TransitLegBody.fromLocation
    +
    + Pick up Shared + E-scooter + +
    @@ -29637,42 +27917,22 @@ exports[`Storyshots ItineraryBody/otp-react-redux Hide Driving Directions 2`] = - - - - + + SHARED + - - Walk 426 feet to + Ride 1.4 miles to - Sunset TC MAX Station + NE Broadway
    +
    + +
  • - 4:05 PM + 4:03 PM
    otpUi.TransitLegBody.fromLocation
    -
    - Stop ID 2600 - -
    @@ -29971,74 +28376,48 @@ exports[`Storyshots ItineraryBody/otp-react-redux Hide Driving Directions 2`] = - - - - - Ride - + - - - - - - - - - - MAX Blue Line - - - - - MAX Blue Line - - to - - Gresham - - + + + + + + - + + + Walk to - - - Disembark at - Oak/ SW 1st Ave MAX Station + NE Broadway & 28th
    -
    -
    - Service operated by - - TriMet - - -
    -
    - - - 2 alerts -
    + 0 min + + + + + (Expand details) + + +
    -
    +
    + +
    +
    +
    • +
  • +
    +
    + + + + +
    +
    + + NE Broadway & 28th + +
    +
    + 4:08 PM +
    + + otpUi.TransitLegBody.fromLocation + +
    +
    + Stop ID 638 + +
    +
    +
    + + + + - + Ride + + + -
    -
    -
    - The west elevators at the Washington Park MAX Station are out of service. Please use east elevators to access street level and platforms. -
    - -
    • - - + to + + NE Sunderland + + + + + - + Disembark at + NE 33rd & Shaver + + + + + +
    +
    + Service operated by + + TriMet + +
    +
    +
    +
    +
    +
    + +
    + +
    +
    + +
  • +
    +
    + + + +
    +
    + + Shared E-scooter + +
    +
    + 4:25 PM +
    + + otpUi.TransitLegBody.fromLocation + +
    +
    + Pick up Shared + E-scooter + +
    +
    +
    + + + + + SHARED + + + + + - + + + Ride 1 mile to + + 5112 NE 47th Pl, Portland, OR, USA 97218 + + + + +
    + + + + +
    +
    +
      +
    1. +
      CONTINUE on - Unnamed Path + NE 38th Ave - 27 feet + 355 feet
    2. + + + +
      +
      + + RIGHT + on + + NE Skidmore St + + + 0.2 miles + + +
      +
      3. +
    3. +
      LEFT on - SW Oak St + NE 42nd Ave - 37 feet + 0.4 miles
    4. RIGHT on - SW 1st Ave + NE Alberta St - 260 feet + 0.3 miles
    5. LEFT on - SW Pine St + NE 47th Pl - 337 feet + 313 feet
      @@ -30792,12 +29599,53 @@ exports[`Storyshots ItineraryBody/otp-react-redux Hide Driving Directions 2`] =
    +
    + +
  • - 4:29 PM + 4:31 PM
    Arrive at - 205 SW Pine St, Portland, OR, USA 97204 + 5112 NE 47th Pl, Portland, OR, USA 97218
    • `; -exports[`Storyshots ItineraryBody/otp-react-redux Individual Leg Fare Components 1`] = ` +exports[`Storyshots ItineraryBody/otp-react-redux Hide Driving Directions 1`] = ` - -`; - -exports[`Storyshots ItineraryBody/otp-react-redux Individual Leg Fare Components 2`] = ` -.c8 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c11 { - color: #333; -} - -.c66 { - color: #f44256; -} - -.c26 { - background: transparent; - border: 0; - color: inherit; - cursor: pointer; - font-size: inherit; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c46 { - color: #008; - margin-left: 5px; -} - -.c46:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c47 { - padding-left: 0px; -} - -.c47:before { - content: "|"; - color: black; - margin-right: 5px; -} - -.c31::before { - content: ""; - margin: 0 0.125em; -} - -.c59 { - display: block; - font-size: 13px; - list-style: none; - padding: 0; -} - -.c0 { - list-style: none; - padding: 0; -} - -.c21 { - color: #676767; - font-size: 13px; - padding-bottom: 12px; -} - -.c27 { - bottom: 0; - cursor: pointer; - left: 0; - position: absolute; - right: 0; - top: 0; - width: 100%; - z-index: 1; -} - -.c22 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - line-height: 16px; - min-height: 31px; - position: relative; -} - -.c19 { - display: inline-block; - grid-row-start: 2; - grid-column-start: 1; - height: 0; - overflow: hidden; - width: 0; -} - -.c52 { - font-weight: 200; -} - -.c25 { - font-weight: inherit; -} - -.c51 { - font-size: 13px; - font-weight: 500; -} - -.c50 { - font-weight: 800; - margin-right: 6px; -} - -.c48 { - color: #807373; - margin-top: 5px; -} - -.c24 img, -.c24 svg { - margin-right: 6px; - height: 24px; - width: 24px; - vertical-align: bottom; -} - -.c23 { - -webkit-flex-shrink: 0; - -ms-flex-negative: 0; - flex-shrink: 0; -} - -.c5 { - grid-column-start: 2; - grid-row: span 2; - padding-right: 5px; -} - -.c28 { - display: grid; - grid-template-columns: 100px auto; -} - -.c3 { - max-width: 500px; - display: grid; - grid-template-columns: 65px 30px auto; -} - -.c38 { - border-color: #fff; - border-radius: 5px; - border-style: solid; - border-width: 1px; - display: inline-block; - font-style: normal; - grid-column: 2; - grid-row: 1; - margin: 0 4px; - position: relative; - text-align: center; - -webkit-text-decoration: none; - text-decoration: none; - vertical-align: middle; - width: 75%; -} - -.c38:hover { - border-color: #d1d5da; - background-color: #f6f8fa; -} - -.c18 { - grid-column-start: 1; - grid-row: 1 / span 2; - padding-right: 5px; - font-size: 0.9em; -} - -.c20 { - grid-row-start: 2; - grid-column-start: 3; -} - -.c14 { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - font-size: 1.2em; - grid-row-start: 1; - grid-column-start: 3; -} - -.c16 { - font-size: inherit; - font-weight: bold; - height: 1.2em; - margin: 0; - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; - -webkit-flex: 1 1 auto; - -ms-flex: 1 1 auto; - flex: 1 1 auto; - padding: 3px 0 10px 0; -} - -.c45 { - color: #807373; - font-size: 13px; - font-weight: 300; - padding-top: 1px; - margin-bottom: 10px; - margin-top: -14px; -} - -.c39 { - padding: 2px; - width: 100%; -} - -.c41 { - font-size: xx-small; -} - -.c41::before { - content: ""; - margin: 0 0.125em; -} - -.c42 { - color: #e60000; -} - -.c43 { - color: green; -} - -.c40 { - font-size: small; -} - -.c32 { - display: block; - list-style: none; - padding: 0; -} - -.c35 { - margin-left: 24px; - line-height: 1.25em; - padding-top: 1px; -} - -.c35 > span { - margin-right: 1ch; -} - -.c29 { - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - -webkit-align-self: center; - -ms-flex-item-align: center; - align-self: center; - margin-top: 10px; -} - -.c29 a { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; -} - -.c30 { - color: #676767; - font-size: 13px; - font-style: normal; - padding: 0; -} - -.c34 { - fill: #676767; - float: left; - height: 16px; - width: 16px; -} - -.c33 { - font-size: 13px; - margin-top: 8px; - color: #676767; - font-style: normal; -} - -.c36 { - font-weight: 500; -} - -.c37 { - font-weight: 200; - opacity: 0.8975; - padding-left: 1ch; -} - -.c62 { - float: left; - margin-left: -36px; - color: #fff; -} - -.c63 { - color: #676767; - margin-top: 3px; -} - -.c60 { - z-index: 30; - position: relative; -} - -.c54 { - display: block; - margin-top: 3px; - padding: 0; -} - -.c55 { - margin-top: 5px; -} - -.c56 { - color: #676767; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; -} - -.c58 { - font-size: 14px; -} - -.c57 { - padding: 0; -} - -.c53 { - margin-top: 5px; -} - -.c53 a { - color: #337ab7; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c53 a:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c53 img { - margin-left: 5px; - vertical-align: middle; -} - -.c1 { - font-size: 16px; -} - -.c1 *:not(.fa) { - box-sizing: border-box; - font-family: Hind,sans-serif; -} - -.c1 .c49 { - background-color: rgb(15,106,172); - border-color: white; - border-image: initial; - border-radius: 12px; - border-style: solid; - border-width: 1px; - box-shadow: rgb(0,0,0) 0px 0px 0.25em; - color: white; - display: inline-block; - font-size: 14px; - font-weight: 500; - height: 24px; - line-height: 1.5; - margin-right: 8px; - min-width: 24px; - padding: 2px 3px; - text-align: center; -} - -.c1 .c4 { - display: table-cell; - max-width: 20px; - width: 20px; - padding: 0; - position: relative; -} - -.c1 .c13 { - color: #000; - font-size: 18px; - font-weight: 500; - line-height: 20px; -} - -.c1 .c15 { - height: inherit; - white-space: normal; -} - -.c1 .c2 { - width: 100%; -} - -.c1 .c61 { - margin-left: -23px; -} - -.c1 .c17 { - color: #676767; - display: table-cell; - font-size: 14px; - padding-right: 4px; - padding-top: 2px; - text-align: right; - vertical-align: top; - width: 60px; -} - -.c7 { - position: absolute; - width: 100%; - top: 3px; - z-index: 20; -} - -.c6 { - background: radial-gradient(ellipse at center,#87cefa 40%,transparent 10%); - background-position: center -5px; - background-repeat: repeat-y; - background-size: 12px 12px; - left: 6px; - right: 6px; - bottom: -11px; - position: absolute; - top: 11px; - z-index: 10; -} - -.c44 { - background-color: gray; - left: 5px; - right: 5px; - background-color: #006400; - bottom: -11px; - position: absolute; - top: 11px; - z-index: 10; -} - -.c64 { - background-color: gray; - left: 5px; - right: 5px; - background-color: #2B376E; - bottom: -11px; - position: absolute; - top: 11px; - z-index: 10; -} - -.c65 { - background-color: gray; - left: 5px; - right: 5px; - background-color: #000088; - bottom: -11px; - position: absolute; - top: 11px; - z-index: 10; -} - -.c9 { - left: 0; - line-height: inherit; - position: absolute; - text-align: center; - width: 100%; -} - -.c10 { - top: 3px; -} - -.c12 { - left: 0; - position: absolute; - text-align: center; - width: 100%; -} - -
      -
    1. -
      -
      - - - - -
      -
      - - 100 South 11th Street, Mount Vernon, WA, USA - -
      -
      - 1:42 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - - - - - - - - Walk 0.8 miles to - - Skagit Station Gate 3 - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - WEST - on - - East Division Street - - - 72 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - LEFT - on - - South 11th Street - - - 48 feet - - -
        -
        3. -
      3. -
        - - - -
        -
        - - RIGHT - on - - service road - - - 27 feet - - -
        -
        4. -
      4. -
        - - - -
        -
        - - LEFT - on - - sidewalk - - - 0.2 miles - - -
        -
        5. -
      5. -
        - - - -
        -
        - - LEFT - on - - South 10th Street - - - 282 feet - - -
        -
        6. -
      6. -
        - - - -
        -
        - - RIGHT - on - - Unnamed Path - - - 136 feet - - -
        -
        7. -
      7. -
        - - - -
        -
        - - LEFT - on - - alley - - - 17 feet - - -
        -
        8. -
      8. -
        - - - -
        -
        - - RIGHT - on - - East Montgomery Street - - - 109 feet - - -
        -
        9. -
      9. -
        - - - -
        -
        - - LEFT - on - - Unnamed Path - - - 0.2 miles - - -
        -
        10. -
      10. -
        - - - -
        -
        - - RIGHT - on - - sidewalk - - - 0.2 miles - - -
        -
        11. -
      11. -
        - - - -
        -
        - - RIGHT - on - - sidewalk - - - 56 feet - - -
        -
        12. -
      12. -
        - - - -
        -
        - - LEFT - on - - service road - - - 175 feet - - -
        -
        13. -
      -
      -
      -
      - -
      -       -
      -
      -
      2. -
    2. -
      -
      - - - - -
      -
      - - Skagit Station Gate 3 - -
      -
      - 2:00 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      - Stop ID 6233 - -
      -
      -
      - - - - - - Ride - - - - - - - - - - - - - - - 90X - - - - - County Connector Snohomish/Skagit - - to - - Everett - - - - - - - Disembark at - Everett Station - - - - -
      -
      -
      - Service operated by - - Skagit Transit - - -
      -
      -
      -
        -
      -
      -
      -
      - - -
      -
      -
      -
      -
        -
      1. -
        - • -
        -
        - South Mount Vernon Park & Ride -
        -
        2. -
      2. -
        - • -
        -
        - Broadway - Everett Community College -
        -
        3. -
      3. -
        - • -
        -
        - Broadway & 14th (near hospital) -
        -
        4. -
      4. -
        - • -
        -
        - Broadway just South of the Event Center -
        -
        5. -
      -
      - Fare: - $1.00 -
      -
      -
      -
      -
      -
      -
      -
      -
      3. -
    3. -
      -
      - - - - -
      -
      - - Everett Station - -
      -
      - 3:00 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      - Stop ID 7010 - -
      -
      -
      - - - - - - - - - - - - - - - Walk 318 feet to - - Everett Station Bay C1 - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - NORTH - on - - Unnamed Path - - - 318 feet - - -
        -
        2. -
      -
      -
      -       -
      -
      -
      4. -
    4. -
      -
      - - - - -
      -
      - - Everett Station Bay C1 - -
      -
      - 3:03 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      - Stop ID 2345 - -
      -
      -
      - - - - - - Ride - - - - - - - - - - - - - - - 512 - - - - - Northgate Station - - - - - - - Disembark at - Lynnwood Transit Center Bay D3 - - - - -
      -
      -
      - Service operated by - - Sound Transit - - -
      -
      -
      -
        -
      -
      -
      -
      - - -
      -
      -
      -
      -
        -
      1. -
        - • -
        -
        - Broadway & 34th St -
        -
        2. -
      2. -
        - • -
        -
        - South Everett Fwy Station Bay 3 -
        -
        3. -
      3. -
        - • -
        -
        - Ash Way Park & Ride Bay 1 -
        -
        4. -
      -
      - Fare: - $3.25 -
      -
      -
      -
      -
      -
      -
      -
      -
      5. -
    5. -
      -
      - - - - -
      -
      - - Lynnwood Transit Center Bay D3 - -
      -
      - 3:29 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      - Stop ID 2422 - -
      -
      -
      - - - - - - - - - - - - - - - Walk 176 feet to - - Lynnwood Transit Center Bay D1 - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - WEST - on - - platform - - - 176 feet - - -
        -
        2. -
      -
      -
      -       -
      -
      -
      6. -
    6. -
      -
      - - - - -
      -
      - - Lynnwood Transit Center Bay D1 - -
      -
      - 3:40 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      - Stop ID 2113 - -
      -
      -
      - - - - - - Ride - - - - - - - - - - - - - - - 535 - - - - - Bellevue - - - - - - - Disembark at - Bothell Park & Ride Bay 2 - - - - -
      -
      -
      - Service operated by - - Sound Transit - - -
      -
      -
      -
        -
      -
      -
      -
      - - -
      -
      -
      -
      -
        -
      1. -
        - • -
        -
        - Alderwood Mall Pkwy & Beech Rd -
        -
        2. -
      2. -
        - • -
        -
        - Alderwood Mall Pkwy & 184th St SW -
        -
        3. -
      3. -
        - • -
        -
        - Canyon Park Fwy Station Bay 4 -
        -
        4. -
      4. -
        - • -
        -
        - Beardslee Blvd & Ross Rd -
        -
        5. -
      5. -
        - • -
        -
        - UW Bothell & Cascadia College -
        -
        6. -
      -
      - Fare: - $3.25 -
      -
      -
      -
      -
      -
      -
      -
      -
      7. -
    7. -
      -
      - - - - -
      -
      - - Bothell Park & Ride Bay 2 - -
      -
      - 4:05 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      - Stop ID 1399 - -
      -
      -
      - - - - - - - - - - - - - - - Walk 1 foot to - - Kaysner Way & Woodinville Dr - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - NORTHWEST - on - - sidewalk - - - 1 foot - - -
        -
        2. -
      -
      -
      -       -
      -
      -
      8. -
    8. -
      -
      - - - - -
      -
      - - Kaysner Way & Woodinville Dr - -
      -
      - 4:18 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      - Stop ID 76300 - -
      -
      -
      - - - - - - Ride - - - - - - - - - - - - - - - 372 - - - - - U-District Station Lake City - - - - - - - Disembark at - NE Bothell Way & 61st Ave NE - - - - -
      -
      -
      - Service operated by - - Metro Transit - - -
      -
      -
      -
        -
      -
      -
      -
      - - -
      -
      -
      -
      -
        -
      1. -
        - • -
        -
        - Woodinville Dr & Kaysner Way -
        -
        2. -
      2. -
        - • -
        -
        - Bothell Way NE & NE 180th St -
        -
        3. -
      3. -
        - • -
        -
        - NE Bothell Way & 96th Ave NE -
        -
        4. -
      4. -
        - • -
        -
        - NE Bothell Way & 91st Ave NE -
        -
        5. -
      5. -
        - • -
        -
        - NE Bothell Way & 83rd Pl NE -
        -
        6. -
      6. -
        - • -
        -
        - NE Bothell Way & 80th Ave NE -
        -
        7. -
      7. -
        - • -
        -
        - NE Bothell Way & 77th Ct NE -
        -
        8. -
      8. -
        - • -
        -
        - NE Bothell Way & Kenmore Park & Ride -
        -
        9. -
      9. -
        - • -
        -
        - NE Bothell Way & 68th Ave NE -
        -
        10. -
      -
      - Fare: - $2.75 -
      -
      -
      -
      -
      -
      -
      -
      -
      9. -
    9. -
      -
      - - - - -
      -
      - - NE Bothell Way & 61st Ave NE - -
      -
      - 4:29 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      - Stop ID 76420 - -
      -
      -
      - - - - - - - - - - - - - - - Walk 0.4 miles to - - 18311 57th Avenue NE, Kenmore, WA, USA - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - WEST - on - - Bothell Way Northeast - - - 74 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - RIGHT - on - - 60th Avenue Northeast - - - 190 feet - - -
        -
        3. -
      3. -
        - - - -
        -
        - - LEFT - on - - Northeast 180th Street - - - 0.2 miles - - -
        -
        4. -
      4. -
        - - - -
        -
        - - RIGHT - on - - 57th Avenue Northeast - - - 0.2 miles - - -
        -
        5. -
      -
      -
      -
      - -
      -       -
      -
      -
      10. -
    10. -
      - - - - -
      -
      - - 18311 57th Avenue NE, Kenmore, WA, USA - -
      -
      - 4:38 PM -
      - - Arrive at - 18311 57th Avenue NE, Kenmore, WA, USA - -
      -
      11. -
    -`; - -exports[`Storyshots ItineraryBody/otp-react-redux OTP 2 Flex Itinerary 1`] = ` - - `; -exports[`Storyshots ItineraryBody/otp-react-redux OTP 2 Flex Itinerary 2`] = ` +exports[`Storyshots ItineraryBody/otp-react-redux Hide Driving Directions 2`] = ` .c8 { display: inline-block; vertical-align: middle; @@ -37771,37 +32175,32 @@ exports[`Storyshots ItineraryBody/otp-react-redux OTP 2 Flex Itinerary 2`] = ` text-decoration: none; } -.c46 { +.c42 { color: #008; margin-left: 5px; } -.c46:hover { +.c42:hover { -webkit-text-decoration: underline; text-decoration: underline; } -.c47 { +.c43 { padding-left: 0px; } -.c47:before { +.c43:before { content: "|"; color: black; margin-right: 5px; } -.c65 { - color: #b22727; - margin-top: 5px; -} - -.c31::before { +.c33::before { content: ""; margin: 0 0.125em; } -.c58 { +.c61 { display: block; font-size: 13px; list-style: none; @@ -37853,7 +32252,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux OTP 2 Flex Itinerary 2`] = ` width: 0; } -.c52 { +.c48 { font-weight: 200; } @@ -37861,17 +32260,17 @@ exports[`Storyshots ItineraryBody/otp-react-redux OTP 2 Flex Itinerary 2`] = ` font-weight: inherit; } -.c51 { +.c47 { font-size: 13px; font-weight: 500; } -.c50 { +.c46 { font-weight: 800; margin-right: 6px; } -.c48 { +.c44 { color: #807373; margin-top: 5px; } @@ -37898,38 +32297,16 @@ exports[`Storyshots ItineraryBody/otp-react-redux OTP 2 Flex Itinerary 2`] = ` .c28 { display: grid; - grid-template-columns: 100px auto; + grid-template-columns: 130px auto; } .c3 { max-width: 500px; display: grid; + grid-template-areas: "time line title" "time line instructions"; grid-template-columns: 65px 30px auto; } -.c38 { - border-color: #fff; - border-radius: 5px; - border-style: solid; - border-width: 1px; - display: inline-block; - font-style: normal; - grid-column: 2; - grid-row: 1; - margin: 0 4px; - position: relative; - text-align: center; - -webkit-text-decoration: none; - text-decoration: none; - vertical-align: middle; - width: 75%; -} - -.c38:hover { - border-color: #d1d5da; - background-color: #f6f8fa; -} - .c18 { grid-column-start: 1; grid-row: 1 / span 2; @@ -37940,6 +32317,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux OTP 2 Flex Itinerary 2`] = ` .c20 { grid-row-start: 2; grid-column-start: 3; + grid-area: instructions; } .c14 { @@ -37966,7 +32344,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux OTP 2 Flex Itinerary 2`] = ` padding: 3px 0 10px 0; } -.c45 { +.c41 { color: #807373; font-size: 13px; font-weight: 300; @@ -37975,45 +32353,19 @@ exports[`Storyshots ItineraryBody/otp-react-redux OTP 2 Flex Itinerary 2`] = ` margin-top: -14px; } -.c39 { - padding: 2px; - width: 100%; -} - -.c41 { - font-size: xx-small; -} - -.c41::before { - content: ""; - margin: 0 0.125em; -} - -.c42 { - color: #e60000; -} - -.c43 { - color: green; -} - -.c40 { - font-size: small; -} - -.c32 { +.c34 { display: block; list-style: none; padding: 0; } -.c35 { +.c37 { margin-left: 24px; line-height: 1.25em; padding-top: 1px; } -.c35 > span { +.c37 > span { margin-right: 1ch; } @@ -38043,58 +32395,130 @@ exports[`Storyshots ItineraryBody/otp-react-redux OTP 2 Flex Itinerary 2`] = ` justify-content: center; } +.c32 { + color: #676767; + font-size: 13px; + font-style: normal; + padding: 0; +} + .c30 { color: #676767; font-size: 13px; font-style: normal; padding: 0; + margin-right: 0.4em; } -.c34 { +.c36 { fill: #676767; float: left; height: 16px; width: 16px; } -.c33 { +.c35 { font-size: 13px; margin-top: 8px; color: #676767; font-style: normal; } -.c36 { +.c38 { font-weight: 500; } -.c37 { +.c39 { font-weight: 200; opacity: 0.8975; padding-left: 1ch; } -.c61 { +.c64 { float: left; margin-left: -36px; color: #fff; } -.c62 { +.c65 { color: #676767; margin-top: 3px; } -.c59 { +.c62 { z-index: 30; position: relative; } -.c54 { +.c52 { + background-color: #eee; + border-radius: 4px; + color: #000; + display: block; margin-top: 5px; + padding: 8px; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c56 { + -webkit-align-items: baseline; + -webkit-box-align: baseline; + -ms-flex-align: baseline; + align-items: baseline; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + gap: 5px; + margin-top: 0.5em; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c56:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c54 { + font-size: 12px; + margin-left: 30px; + white-space: pre-wrap; } .c55 { + margin-top: 5px; + margin-left: 30px; + font-size: 12px; + font-style: italic; +} + +.c53 { + float: left; + font-size: 18px; +} + +.c51 { + display: block; + margin-top: 3px; + padding: 0; +} + +.c50 { + color: #d14727; + cursor: auto; + display: inline-block; + font-weight: 400; + margin-top: 8px; + padding: 0; +} + +.c57 { + margin-top: 5px; +} + +.c58 { color: #676767; display: -webkit-box; display: -webkit-flex; @@ -38102,30 +32526,30 @@ exports[`Storyshots ItineraryBody/otp-react-redux OTP 2 Flex Itinerary 2`] = ` display: flex; } -.c57 { +.c60 { font-size: 14px; } -.c56 { +.c59 { padding: 0; } -.c53 { +.c49 { margin-top: 5px; } -.c53 a { +.c49 a { color: #337ab7; -webkit-text-decoration: none; text-decoration: none; } -.c53 a:hover { +.c49 a:hover { -webkit-text-decoration: underline; text-decoration: underline; } -.c53 img { +.c49 img { margin-left: 5px; vertical-align: middle; } @@ -38139,7 +32563,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux OTP 2 Flex Itinerary 2`] = ` font-family: Hind,sans-serif; } -.c1 .c49 { +.c1 .c45 { background-color: rgb(15,106,172); border-color: white; border-image: initial; @@ -38160,6 +32584,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux OTP 2 Flex Itinerary 2`] = ` } .c1 .c4 { + grid-area: line; display: table-cell; max-width: 20px; width: 20px; @@ -38168,6 +32593,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux OTP 2 Flex Itinerary 2`] = ` } .c1 .c13 { + grid-area: title; color: #000; font-size: 18px; font-weight: 500; @@ -38183,11 +32609,12 @@ exports[`Storyshots ItineraryBody/otp-react-redux OTP 2 Flex Itinerary 2`] = ` width: 100%; } -.c1 .c60 { +.c1 .c63 { margin-left: -23px; } .c1 .c17 { + grid-area: time; color: #676767; display: table-cell; font-size: 14px; @@ -38206,46 +32633,33 @@ exports[`Storyshots ItineraryBody/otp-react-redux OTP 2 Flex Itinerary 2`] = ` } .c6 { - background: radial-gradient(ellipse at center,#87cefa 40%,transparent 10%); - background-position: center -5px; - background-repeat: repeat-y; - background-size: 12px 12px; - left: 6px; - right: 6px; - bottom: -11px; - position: absolute; - top: 11px; - z-index: 10; -} - -.c44 { - background-color: gray; - left: 5px; - right: 5px; - background-color: #111; + background: repeating-linear-gradient( 0deg,grey,grey 8px,white 8px,white 12.5px ); + left: 7.5px; + right: 7.5px; bottom: -11px; position: absolute; top: 11px; z-index: 10; } -.c63 { - background-color: gray; - left: 5px; - right: 5px; - background-color: #0076CE; +.c31 { + background: radial-gradient(ellipse at center,#87cefa 40%,transparent 10%); + background-position: center -5px; + background-repeat: repeat-y; + background-size: 12px 12px; + left: 6px; + right: 6px; bottom: -11px; position: absolute; top: 11px; z-index: 10; } -.c64 { +.c40 { background-color: gray; left: 5px; right: 5px; - background-color: #000088; - background: repeating-linear-gradient( -45deg, #00008830, #00008830 5px, #000088 5px, #000088 10px ); + background-color: #084C8D; bottom: -11px; position: absolute; top: 11px; @@ -38275,13 +32689,13 @@ exports[`Storyshots ItineraryBody/otp-react-redux OTP 2 Flex Itinerary 2`] = ` className="c0 c1" >
  • - 2nd Avenue, Longmont, CO, USA + 330 SW Murray Blvd, Washington County, OR, USA 97005
    - 4:59 PM + 3:50 PM +
    + + otpUi.TransitLegBody.fromLocation + +
    +
    +
    + + + + + + + + + + - + + + Drive 2.4 miles to + + P+R Sunset TC + + + + +
    + + + + 10 min + + + +
    +
    +
    • +
  • +
    +
    + + + +
    +
    + + P+R Sunset TC + +
    +
    + 4:02 PM
    otpUi.TransitLegBody.fromLocation
    - - Walk 0.3 miles to + Walk 426 feet to - S Main St & 1st Ave + Sunset TC MAX Station
    -
    - -
  • - S Main St & 1st Ave + Sunset TC MAX Station
    - 5:06 PM + 4:05 PM
    otpUi.TransitLegBody.fromLocation
    - Stop ID 25633 + Stop ID 2600
    +
    + + + 2 alerts +
    -
    -
    -
    - - -
    -
    -
    -
    -
      -
    1. -
      - • -
      -
      - S Main St & Ken Pratt Blvd -
      -
      2. -
    2. + +
    +
    + The Park and Ride garage elevator at Sunset Transit Center is closed for approximately 3 months for improvements. During this time garage users must use the stairs or find alternate parking. Visit trimet.org/parkandride for a complete list of Park and Ride garages. +
    +
    • -
  • -
    - • -
    -
    - S Main St & Missouri Ave -
    -
    • -
  • -
    - • -
    -
    - S Main St & Quebec Ave -
    -
    • -
  • -
    - • -
    -
    - US 287 & Pike Rd -
    -
    • -
  • -
    - • -
    -
    - US 287 & Niwot Rd -
    -
    • -
  • -
    - • -
    -
    - US 287 & Hwy 52 -
    -
    • -
  • -
    - • -
    -
    - US 287 & Lookout Rd -
    -
    • -
  • -
    - • -
    -
    - US 287 & Dawson Dr -
    -
    • -
  • -
    - • -
    -
    - US 287 & Goose Haven Dr -
    -
    • -
  • -
    - • -
    -
    - US 287 & Isabelle Rd -
    -
    • - - - - - - - - - -
  • -
    -
    - - - - -
    -
    - - US 287 & Arapahoe Rd - -
    -
    - 5:25 PM -
    - - otpUi.TransitLegBody.fromLocation - -
  • - - Head - SOUTH - on - - US Highway 287 - - - 0.1 miles - - + The west elevators at the Washington Park MAX Station are out of service. Please use east elevators to access street level and platforms.
    -
    • -
  • - - - -
    -
    - - RIGHT - on - + + + See alert on TriMet website - 485 feet + + otpUi.TransitLegBody.AlertsBody.linkOpensNewWindow - +
    • - + - - - - -
  • -
    -
    - - - - -
    -
    - - Arapahoe Rd & Stonehenge Dr - -
    -
    - 6:00 PM -
    - - otpUi.TransitLegBody.fromLocation - -
    -
    - Stop ID 33465 - -
    -
    -
    - - - - - - Ride - - - - - - - - - - - - - - - JUMP - - - - - Boulder / Lafayette via Arapahoe - - to - - Erie Community Center - - - - - - - Disembark at - Erie Community Center - - - - -
    -
    -
    - Service operated by - - Regional Transportation District - -
    -
    -
    -
  • - Erie Community Center + Oak/ SW 1st Ave MAX Station
    - 6:12 PM + 4:27 PM
    otpUi.TransitLegBody.fromLocation
    - Stop ID 33200 + Stop ID 8337
  • -
    - 6:12 PM + 4:29 PM
    - otpUi.TransitLegBody.fromLocation + Arrive at + 205 SW Pine St, Portland, OR, USA 97204
    -
    - Stop ID area_626 -
    -
    -
    - - - - - - Ride - - - - - - - - - - - - - - - 60+ Ride - - - - - 60+ Ride - - - - - - - Disembark at - 60plusride-co-us:area_626 - - - - -
    -
    -
    - Service operated by - - 60+ Ride - -
    -
    - To take this route, you must - call 555-352-9348 - at least 7 days in advance - . -
    -
    -
    -
    -
    -
    -
    -
    • -
  • -
    - - - - -
    -
    - - 60plusride-co-us:area_626 - -
    -
    - 6:37 PM -
    - - Arrive at - 60plusride-co-us:area_626 - -
    • `; -exports[`Storyshots ItineraryBody/otp-react-redux OTP 2 Scooter Itinerary 1`] = ` +exports[`Storyshots ItineraryBody/otp-react-redux Individual Leg Fare Components 1`] = ` - -`; - -exports[`Storyshots ItineraryBody/otp-react-redux OTP 2 Scooter Itinerary 2`] = ` -.c8 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c11 { - color: #333; -} - -.c46 { - color: #f44256; -} - -.c26 { - background: transparent; - border: 0; - color: inherit; - cursor: pointer; - font-size: inherit; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c31::before { - content: ""; - margin: 0 0.125em; -} - -.c0 { - list-style: none; - padding: 0; -} - -.c21 { - color: #676767; - font-size: 13px; - padding-bottom: 12px; -} - -.c27 { - bottom: 0; - cursor: pointer; - left: 0; - position: absolute; - right: 0; - top: 0; - width: 100%; - z-index: 1; -} - -.c22 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - line-height: 16px; - min-height: 31px; - position: relative; -} - -.c19 { - display: inline-block; - grid-row-start: 2; - grid-column-start: 1; - height: 0; - overflow: hidden; - width: 0; -} - -.c25 { - font-weight: inherit; -} - -.c24 img, -.c24 svg { - margin-right: 6px; - height: 24px; - width: 24px; - vertical-align: bottom; -} - -.c23 { - -webkit-flex-shrink: 0; - -ms-flex-negative: 0; - flex-shrink: 0; -} - -.c5 { - grid-column-start: 2; - grid-row: span 2; - padding-right: 5px; -} - -.c28 { - display: grid; - grid-template-columns: 100px auto; -} - -.c3 { - max-width: 500px; - display: grid; - grid-template-columns: 65px 30px auto; -} - -.c40 { - border-color: #fff; - border-radius: 5px; - border-style: solid; - border-width: 1px; - display: inline-block; - font-style: normal; - grid-column: 2; - grid-row: 1; - margin: 0 4px; - position: relative; - text-align: center; - -webkit-text-decoration: none; - text-decoration: none; - vertical-align: middle; - width: 75%; -} - -.c40:hover { - border-color: #d1d5da; - background-color: #f6f8fa; -} - -.c18 { - grid-column-start: 1; - grid-row: 1 / span 2; - padding-right: 5px; - font-size: 0.9em; -} - -.c20 { - grid-row-start: 2; - grid-column-start: 3; -} - -.c14 { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - font-size: 1.2em; - grid-row-start: 1; - grid-column-start: 3; -} - -.c16 { - font-size: inherit; - font-weight: bold; - height: 1.2em; - margin: 0; - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; - -webkit-flex: 1 1 auto; - -ms-flex: 1 1 auto; - flex: 1 1 auto; - padding: 3px 0 10px 0; -} - -.c39 { - color: #807373; - font-size: 13px; - font-weight: 300; - padding-top: 1px; - margin-bottom: 10px; - margin-top: -14px; -} - -.c41 { - padding: 2px; - width: 100%; -} - -.c43 { - font-size: xx-small; -} - -.c43::before { - content: ""; - margin: 0 0.125em; -} - -.c44 { - color: #e60000; -} - -.c45 { - color: green; -} - -.c42 { - font-size: small; -} - -.c32 { - display: block; - list-style: none; - padding: 0; -} - -.c35 { - margin-left: 24px; - line-height: 1.25em; - padding-top: 1px; -} - -.c35 > span { - margin-right: 1ch; -} - -.c29 { - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - -webkit-align-self: center; - -ms-flex-item-align: center; - align-self: center; - margin-top: 10px; -} - -.c29 a { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; -} - -.c30 { - color: #676767; - font-size: 13px; - font-style: normal; - padding: 0; -} - -.c34 { - fill: #676767; - float: left; - height: 16px; - width: 16px; -} - -.c33 { - font-size: 13px; - margin-top: 8px; - color: #676767; - font-style: normal; -} - -.c36 { - font-weight: 500; -} - -.c37 { - font-weight: 200; - opacity: 0.8975; - padding-left: 1ch; -} - -.c1 { - font-size: 16px; -} - -.c1 *:not(.fa) { - box-sizing: border-box; - font-family: Hind,sans-serif; -} - -.c1 .c4 { - display: table-cell; - max-width: 20px; - width: 20px; - padding: 0; - position: relative; -} - -.c1 .c13 { - color: #000; - font-size: 18px; - font-weight: 500; - line-height: 20px; -} - -.c1 .c15 { - height: inherit; - white-space: normal; -} - -.c1 .c2 { - width: 100%; -} - -.c1 .c17 { - color: #676767; - display: table-cell; - font-size: 14px; - padding-right: 4px; - padding-top: 2px; - text-align: right; - vertical-align: top; - width: 60px; -} - -.c7 { - position: absolute; - width: 100%; - top: 3px; - z-index: 20; -} - -.c6 { - background: radial-gradient(ellipse at center,#87cefa 40%,transparent 10%); - background-position: center -5px; - background-repeat: repeat-y; - background-size: 12px 12px; - left: 6px; - right: 6px; - bottom: -11px; - position: absolute; - top: 11px; - z-index: 10; -} - -.c38 { - background: repeating-linear-gradient( 0deg,#f5a729,#f5a729 8px,white 8px,white 12.5px ); - left: 7.5px; - right: 7.5px; - bottom: -11px; - position: absolute; - top: 11px; - z-index: 10; -} - -.c9 { - left: 0; - line-height: inherit; - position: absolute; - text-align: center; - width: 100%; -} - -.c10 { - top: 3px; -} - -.c12 { - left: 0; - position: absolute; - text-align: center; - width: 100%; -} - -
      -
    1. -
      -
      - - - - -
      -
      - - 300 Courtland St NE, Atlanta, GA 30303-12ND, United States - -
      -
      - 9:15 AM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - - - - - - - - Walk 0.2 miles to - - Razor Vehicle - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - SOUTH - on - - Courtland Street Northeast - - - 172 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - RIGHT - on - - Unnamed Path - - - 0.1 miles - - -
        -
        3. -
      3. -
        - - - -
        -
        - - LEFT - on - - Peachtree Center Avenue Northeast - - - 140 feet - - -
        -
        4. -
      -
      -
      -       -
      -
      -
      2. -
    2. -
      -
      - - - -
      -
      - - Razor E-scooter - -
      -
      - 9:19 AM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      - Pick up Razor - E-scooter - -
      -
      -
      - - - - - - - - - - - - - - Ride 1 mile to - - 126 Mitchell St SW, Atlanta, GA 30303-3524, United States - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - HARD_RIGHT - on - - Peachtree Center Avenue Northeast - - - 12 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - LEFT - on - - service road - - - 10 feet - - -
        -
        3. -
      3. -
        - - - -
        -
        - - LEFT - on - - Peachtree Center Cycle Track - - - 0.5 miles - - -
        -
        4. -
      4. -
        - - - -
        -
        - - RIGHT - on - - Edgewood Avenue Northeast - - - 0.1 miles - - -
        -
        5. -
      5. -
        - - - -
        -
        - - LEFT - on - - Pryor Street Southwest - - - 269 feet - - -
        -
        6. -
      6. -
        - - - -
        -
        - - CONTINUE - on - - Pryor Street - - - 518 feet - - -
        -
        7. -
      7. -
        - - - -
        -
        - - CONTINUE - on - - Pryor Street Southwest - - - 0.2 miles - - -
        -
        8. -
      8. -
        - - - -
        -
        - - RIGHT - on - - Unnamed Path - - - 19 feet - - -
        -
        9. -
      9. -
        - - - -
        -
        - - RIGHT - on - - sidewalk - - - 22 feet - - -
        -
        10. -
      -
      -
      -
      - -
      -       -
      -
      -
      3. -
    3. -
      - - - - -
      -
      - - 126 Mitchell St SW, Atlanta, GA 30303-3524, United States - -
      -
      - 9:26 AM -
      - - Arrive at - 126 Mitchell St SW, Atlanta, GA 30303-3524, United States - -
      -
      4. -
    -`; - -exports[`Storyshots ItineraryBody/otp-react-redux Otp 24 Itinerary 1`] = ` - - `; -exports[`Storyshots ItineraryBody/otp-react-redux Otp 24 Itinerary 2`] = ` +exports[`Storyshots ItineraryBody/otp-react-redux Individual Leg Fare Components 2`] = ` .c8 { display: inline-block; vertical-align: middle; @@ -43971,7 +36529,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Otp 24 Itinerary 2`] = ` color: #333; } -.c65 { +.c66 { color: #f44256; } @@ -44010,7 +36568,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Otp 24 Itinerary 2`] = ` margin: 0 0.125em; } -.c56 { +.c59 { display: block; font-size: 13px; list-style: none; @@ -44062,7 +36620,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Otp 24 Itinerary 2`] = ` width: 0; } -.c64 { +.c52 { font-weight: 200; } @@ -44070,12 +36628,12 @@ exports[`Storyshots ItineraryBody/otp-react-redux Otp 24 Itinerary 2`] = ` font-weight: inherit; } -.c49 { +.c51 { font-size: 13px; font-weight: 500; } -.c63 { +.c50 { font-weight: 800; margin-right: 6px; } @@ -44107,12 +36665,13 @@ exports[`Storyshots ItineraryBody/otp-react-redux Otp 24 Itinerary 2`] = ` .c28 { display: grid; - grid-template-columns: 100px auto; + grid-template-columns: 130px auto; } .c3 { max-width: 500px; display: grid; + grid-template-areas: "time line title" "time line instructions"; grid-template-columns: 65px 30px auto; } @@ -44149,6 +36708,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Otp 24 Itinerary 2`] = ` .c20 { grid-row-start: 2; grid-column-start: 3; + grid-area: instructions; } .c14 { @@ -44283,33 +36843,33 @@ exports[`Storyshots ItineraryBody/otp-react-redux Otp 24 Itinerary 2`] = ` padding-left: 1ch; } -.c59 { +.c62 { float: left; margin-left: -36px; color: #fff; } -.c60 { +.c63 { color: #676767; margin-top: 3px; } -.c57 { +.c60 { z-index: 30; position: relative; } -.c51 { +.c54 { display: block; margin-top: 3px; padding: 0; } -.c52 { +.c55 { margin-top: 5px; } -.c53 { +.c56 { color: #676767; display: -webkit-box; display: -webkit-flex; @@ -44317,30 +36877,30 @@ exports[`Storyshots ItineraryBody/otp-react-redux Otp 24 Itinerary 2`] = ` display: flex; } -.c55 { +.c58 { font-size: 14px; } -.c54 { +.c57 { padding: 0; } -.c50 { +.c53 { margin-top: 5px; } -.c50 a { +.c53 a { color: #337ab7; -webkit-text-decoration: none; text-decoration: none; } -.c50 a:hover { +.c53 a:hover { -webkit-text-decoration: underline; text-decoration: underline; } -.c50 img { +.c53 img { margin-left: 5px; vertical-align: middle; } @@ -44354,7 +36914,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Otp 24 Itinerary 2`] = ` font-family: Hind,sans-serif; } -.c1 .c62 { +.c1 .c49 { background-color: rgb(15,106,172); border-color: white; border-image: initial; @@ -44375,6 +36935,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Otp 24 Itinerary 2`] = ` } .c1 .c4 { + grid-area: line; display: table-cell; max-width: 20px; width: 20px; @@ -44383,6 +36944,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Otp 24 Itinerary 2`] = ` } .c1 .c13 { + grid-area: title; color: #000; font-size: 18px; font-weight: 500; @@ -44398,11 +36960,12 @@ exports[`Storyshots ItineraryBody/otp-react-redux Otp 24 Itinerary 2`] = ` width: 100%; } -.c1 .c58 { +.c1 .c61 { margin-left: -23px; } .c1 .c17 { + grid-area: time; color: #676767; display: table-cell; font-size: 14px; @@ -44437,18 +37000,29 @@ exports[`Storyshots ItineraryBody/otp-react-redux Otp 24 Itinerary 2`] = ` background-color: gray; left: 5px; right: 5px; - background-color: #114C96; + background-color: #006400; bottom: -11px; position: absolute; top: 11px; z-index: 10; } -.c61 { +.c64 { background-color: gray; left: 5px; right: 5px; - background-color: #084C8D; + background-color: #2B376E; + bottom: -11px; + position: absolute; + top: 11px; + z-index: 10; +} + +.c65 { + background-color: gray; + left: 5px; + right: 5px; + background-color: #000088; bottom: -11px; position: absolute; top: 11px; @@ -44478,13 +37052,13 @@ exports[`Storyshots ItineraryBody/otp-react-redux Otp 24 Itinerary 2`] = ` className="c0 c1" >
  • - 1375 NE Cherry Lane, Hillsboro + 100 South 11th Street, Mount Vernon, WA, USA
    - 7:54 AM + 1:42 PM
    otpUi.TransitLegBody.fromLocation
    - - Walk 0.9 miles to + Walk 0.8 miles to - Orenco MAX Station + Skagit Station Gate 3
    @@ -44722,12 +37296,45 @@ exports[`Storyshots ItineraryBody/otp-react-redux Otp 24 Itinerary 2`] = ` - Northeast Cherry Lane + South 11th Street - 342 feet + 48 feet + + +
    +
    • +
  • +
    + + + +
    +
    + + RIGHT + on + + service road + + + 27 feet
    @@ -44755,12 +37362,12 @@ exports[`Storyshots ItineraryBody/otp-react-redux Otp 24 Itinerary 2`] = ` - Northeast Cherry Drive + sidewalk - 0.7 miles + 0.2 miles @@ -44788,12 +37395,12 @@ exports[`Storyshots ItineraryBody/otp-react-redux Otp 24 Itinerary 2`] = ` - Northeast Century Boulevard + South 10th Street - 332 feet + 282 feet @@ -44821,12 +37428,12 @@ exports[`Storyshots ItineraryBody/otp-react-redux Otp 24 Itinerary 2`] = ` - Northeast Century Boulevard (path) + Unnamed Path - 26 feet + 136 feet @@ -44841,7 +37448,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Otp 24 Itinerary 2`] = ` viewBox="0 0 261 261" > @@ -44849,7 +37456,73 @@ exports[`Storyshots ItineraryBody/otp-react-redux Otp 24 Itinerary 2`] = ` className="c35" > - CONTINUE + LEFT + on + + alley + + + 17 feet + + + +
    • +
  • +
    + + + +
    +
    + + RIGHT + on + + East Montgomery Street + + + 109 feet + + +
    +
    • +
  • +
    + + + +
    +
    + + LEFT on - 204 feet + 0.2 miles
    @@ -44874,7 +37547,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Otp 24 Itinerary 2`] = ` viewBox="0 0 261 261" > @@ -44882,17 +37555,83 @@ exports[`Storyshots ItineraryBody/otp-react-redux Otp 24 Itinerary 2`] = ` className="c35" > - CONTINUE + RIGHT on - Orenco + sidewalk - 98 feet + 0.2 miles + + + +
    • +
  • +
    + + + +
    +
    + + RIGHT + on + + sidewalk + + + 56 feet + + +
    +
    • +
  • +
    + + + +
    +
    + + LEFT + on + + service road + + + 175 feet
    @@ -44918,26 +37657,16 @@ exports[`Storyshots ItineraryBody/otp-react-redux Otp 24 Itinerary 2`] = ` className="c41 c42" > ↑ - 52' + 0' ↓ - 29' + 0' - - - + No elevation data available. mocked-react-resize-detector @@ -44946,13 +37675,13 @@ exports[`Storyshots ItineraryBody/otp-react-redux Otp 24 Itinerary 2`] = `
  • - Orenco MAX Station + Skagit Station Gate 3
    - 8:15 AM + 2:00 PM
    otpUi.TransitLegBody.fromLocation
    - Stop ID 9835 + Stop ID 6233
    Service operated by - TriMet + Skagit Transit
    @@ -45142,23 +37888,23 @@ exports[`Storyshots ItineraryBody/otp-react-redux Otp 24 Itinerary 2`] = ` style={Object {}} >
    @@ -45375,13 +38029,13 @@ exports[`Storyshots ItineraryBody/otp-react-redux Otp 24 Itinerary 2`] = `
  • - Providence Park MAX Station + Everett Station
    - 8:49 AM + 3:00 PM
    otpUi.TransitLegBody.fromLocation
    - Stop ID 9758 + Stop ID 7010
    -
    • -
  • -
    - - - -
    -
    - - LEFT - on - - Unnamed Path - - - 19 feet - - -
    -
    • -
  • -
    - - - -
    -
    - - RIGHT + NORTH on - 19 feet - - -
    -
    • -
  • -
    - - - -
    -
    - - LEFT - on - - Southwest 17th Avenue - - - 0.1 miles - - -
    -
    • -
  • -
    - - - -
    -
    - - LEFT - on - - West Burnside Street - - - 276 feet + 318 feet
    @@ -45749,13 +38271,13 @@ exports[`Storyshots ItineraryBody/otp-react-redux Otp 24 Itinerary 2`] = `
  • - W Burnside & SW 18th + Everett Station Bay C1
    - 8:57 AM + 3:03 PM
    otpUi.TransitLegBody.fromLocation
    - Stop ID 9860 + Stop ID 2345
    Service operated by - TriMet + Sound Transit
    @@ -45961,23 +38478,23 @@ exports[`Storyshots ItineraryBody/otp-react-redux Otp 24 Itinerary 2`] = ` style={Object {}} >
    @@ -46488,13 +38605,13 @@ exports[`Storyshots ItineraryBody/otp-react-redux Otp 24 Itinerary 2`] = `
  • - E Burnside & SE 94th + Lynnwood Transit Center Bay D3
    - 9:25 AM + 3:29 PM
    otpUi.TransitLegBody.fromLocation
    - Stop ID 822 + Stop ID 2422
    • -
  • + + + + + +
    • +
  • +
    +
    + + + + +
    +
    + + Lynnwood Transit Center Bay D1 + +
    +
    + 3:40 PM +
    + + otpUi.TransitLegBody.fromLocation + +
    +
    + Stop ID 2113 + +
    +
    +
    + + + + - + Ride + + + -
    - -
    -
    - - RIGHT - on - - Southeast 94th Avenue - - - 28 feet - - -
    -
    • -
  • -
    - + + + + -
    -
    + - - CONTINUE - on - - Northeast 94th Avenue - - - 0.4 miles - - -
    -
    • -
  • + + -
    - - - -
    -
    - - RIGHT - on - - Northeast Oregon Street - - - 107 feet - - -
    -
    • - + + Bellevue + + + + + - + Disembark at + Bothell Park & Ride Bay 2 + + + + + +
    +
    + Service operated by + + Sound Transit + + +
    +
    +
    +
    - + Trip Viewer + +
    +
    +
    +
    +
      +
    1. +
      + • +
      +
      + Alderwood Mall Pkwy & Beech Rd +
      +
      2. +
    2. +
      + • +
      +
      + Alderwood Mall Pkwy & 184th St SW +
      +
      3. +
    3. +
      + • +
      +
      + Canyon Park Fwy Station Bay 4 +
      +
      4. +
    4. +
      + • +
      +
      + Beardslee Blvd & Ross Rd +
      +
      5. +
    5. +
      + • +
      +
      + UW Bothell & Cascadia College +
      +
      6. +
    +
    + Fare: + $3.25 +
    +
    +
    +
    - +
  • +
    - 9:35 AM + 4:05 PM
    - Arrive at - 766 NE 94th Avenue, Portland + otpUi.TransitLegBody.fromLocation
    -
    • - -`; - -exports[`Storyshots ItineraryBody/otp-react-redux Park And Ride Itinerary 1`] = ` - - +
    + Stop ID 1399 + +
    +
    +
    + + + + + + + + + + + - + + + Walk 1 foot to + + Kaysner Way & Woodinville Dr + + + + +
    + + + + +
    +
    +
      +
    1. +
      + + + +
      +
      + + Head + NORTHWEST + on + + sidewalk + + + 1 foot + + +
      +
      2. +
    +
    +
    +     +
    + + +
  • +
    +
    + + + + +
    +
    + + Kaysner Way & Woodinville Dr + +
    +
    + 4:18 PM +
    + + otpUi.TransitLegBody.fromLocation + +
    +
    + Stop ID 76300 + +
    +
    +
    + + + + - + Ride + + + + + + + + + + + + + + + 372 + + + + + U-District Station Lake City + + + + + - + Disembark at + NE Bothell Way & 61st Ave NE + + + + +
    +
    +
    + Service operated by + + Metro Transit + + +
    +
    +
    +
      +
    +
    +
    +
    + + +
    +
    +
    +
    +
      +
    1. +
      + • +
      +
      + Woodinville Dr & Kaysner Way +
      +
      2. +
    2. +
      + • +
      +
      + Bothell Way NE & NE 180th St +
      +
      3. +
    3. +
      + • +
      +
      + NE Bothell Way & 96th Ave NE +
      +
      4. +
    4. +
      + • +
      +
      + NE Bothell Way & 91st Ave NE +
      +
      5. +
    5. +
      + • +
      +
      + NE Bothell Way & 83rd Pl NE +
      +
      6. +
    6. +
      + • +
      +
      + NE Bothell Way & 80th Ave NE +
      +
      7. +
    7. +
      + • +
      +
      + NE Bothell Way & 77th Ct NE +
      +
      8. +
    8. +
      + • +
      +
      + NE Bothell Way & Kenmore Park & Ride +
      +
      9. +
    9. +
      + • +
      +
      + NE Bothell Way & 68th Ave NE +
      +
      10. +
    +
    + Fare: + $2.75 +
    +
    +
    +
    +
    +
    +
    +
    +
    • +
  • +
    +
    + + + + +
    +
    + + NE Bothell Way & 61st Ave NE + +
    +
    + 4:29 PM +
    + + otpUi.TransitLegBody.fromLocation + +
    +
    + Stop ID 76420 + +
    +
    +
    + + + + + + + + + + + - + + + Walk 0.4 miles to + + 18311 57th Avenue NE, Kenmore, WA, USA + + + + +
    + + + + +
    +
    +
      +
    1. +
      + + + +
      +
      + + Head + WEST + on + + Bothell Way Northeast + + + 74 feet + + +
      +
      2. +
    2. +
      + + + +
      +
      + + RIGHT + on + + 60th Avenue Northeast + + + 190 feet + + +
      +
      3. +
    3. +
      + + + +
      +
      + + LEFT + on + + Northeast 180th Street + + + 0.2 miles + + +
      +
      4. +
    4. +
      + + + +
      +
      + + RIGHT + on + + 57th Avenue Northeast + + + 0.2 miles + + +
      +
      5. +
    +
    +
    +
    + +
    +     +
    +
    +
    • +
  • +
    + + + + +
    +
    + + 18311 57th Avenue NE, Kenmore, WA, USA + +
    +
    + 4:38 PM +
    + + Arrive at + 18311 57th Avenue NE, Kenmore, WA, USA + +
    +
    • + +`; + +exports[`Storyshots ItineraryBody/otp-react-redux OTP 2 Flex Itinerary 1`] = ` + + `; -exports[`Storyshots ItineraryBody/otp-react-redux Park And Ride Itinerary 2`] = ` +exports[`Storyshots ItineraryBody/otp-react-redux OTP 2 Flex Itinerary 2`] = ` .c8 { display: inline-block; vertical-align: middle; @@ -49385,7 +41029,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Park And Ride Itinerary 2`] = color: #333; } -.c65 { +.c66 { color: #f44256; } @@ -49399,32 +41043,37 @@ exports[`Storyshots ItineraryBody/otp-react-redux Park And Ride Itinerary 2`] = text-decoration: none; } -.c41 { +.c46 { color: #008; margin-left: 5px; } -.c41:hover { +.c46:hover { -webkit-text-decoration: underline; text-decoration: underline; } -.c42 { +.c47 { padding-left: 0px; } -.c42:before { +.c47:before { content: "|"; color: black; margin-right: 5px; } +.c65 { + color: #b22727; + margin-top: 5px; +} + .c31::before { content: ""; margin: 0 0.125em; } -.c60 { +.c58 { display: block; font-size: 13px; list-style: none; @@ -49476,7 +41125,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Park And Ride Itinerary 2`] = width: 0; } -.c47 { +.c52 { font-weight: 200; } @@ -49484,17 +41133,17 @@ exports[`Storyshots ItineraryBody/otp-react-redux Park And Ride Itinerary 2`] = font-weight: inherit; } -.c46 { +.c51 { font-size: 13px; font-weight: 500; } -.c45 { +.c50 { font-weight: 800; margin-right: 6px; } -.c43 { +.c48 { color: #807373; margin-top: 5px; } @@ -49521,15 +41170,39 @@ exports[`Storyshots ItineraryBody/otp-react-redux Park And Ride Itinerary 2`] = .c28 { display: grid; - grid-template-columns: 100px auto; + grid-template-columns: 130px auto; } .c3 { max-width: 500px; display: grid; + grid-template-areas: "time line title" "time line instructions"; grid-template-columns: 65px 30px auto; } +.c38 { + border-color: #fff; + border-radius: 5px; + border-style: solid; + border-width: 1px; + display: inline-block; + font-style: normal; + grid-column: 2; + grid-row: 1; + margin: 0 4px; + position: relative; + text-align: center; + -webkit-text-decoration: none; + text-decoration: none; + vertical-align: middle; + width: 75%; +} + +.c38:hover { + border-color: #d1d5da; + background-color: #f6f8fa; +} + .c18 { grid-column-start: 1; grid-row: 1 / span 2; @@ -49540,6 +41213,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Park And Ride Itinerary 2`] = .c20 { grid-row-start: 2; grid-column-start: 3; + grid-area: instructions; } .c14 { @@ -49566,7 +41240,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Park And Ride Itinerary 2`] = padding: 3px 0 10px 0; } -.c40 { +.c45 { color: #807373; font-size: 13px; font-weight: 300; @@ -49575,6 +41249,32 @@ exports[`Storyshots ItineraryBody/otp-react-redux Park And Ride Itinerary 2`] = margin-top: -14px; } +.c39 { + padding: 2px; + width: 100%; +} + +.c41 { + font-size: xx-small; +} + +.c41::before { + content: ""; + margin: 0 0.125em; +} + +.c42 { + color: #e60000; +} + +.c43 { + color: green; +} + +.c40 { + font-size: small; +} + .c32 { display: block; list-style: none; @@ -49648,91 +41348,27 @@ exports[`Storyshots ItineraryBody/otp-react-redux Park And Ride Itinerary 2`] = padding-left: 1ch; } -.c63 { +.c61 { float: left; margin-left: -36px; color: #fff; } -.c64 { +.c62 { color: #676767; margin-top: 3px; } -.c61 { +.c59 { z-index: 30; position: relative; } -.c51 { - background-color: #eee; - border-radius: 4px; - color: #000; - display: block; - margin-top: 5px; - padding: 8px; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c55 { - -webkit-align-items: baseline; - -webkit-box-align: baseline; - -ms-flex-align: baseline; - align-items: baseline; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - gap: 5px; - margin-top: 0.5em; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c55:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c53 { - font-size: 12px; - margin-left: 30px; - white-space: pre-wrap; -} - .c54 { margin-top: 5px; - margin-left: 30px; - font-size: 12px; - font-style: italic; -} - -.c52 { - float: left; - font-size: 18px; -} - -.c50 { - display: block; - margin-top: 3px; - padding: 0; -} - -.c49 { - color: #d14727; - cursor: auto; - display: inline-block; - font-weight: 400; - margin-top: 8px; - padding: 0; -} - -.c56 { - margin-top: 5px; } -.c57 { +.c55 { color: #676767; display: -webkit-box; display: -webkit-flex; @@ -49740,30 +41376,30 @@ exports[`Storyshots ItineraryBody/otp-react-redux Park And Ride Itinerary 2`] = display: flex; } -.c59 { +.c57 { font-size: 14px; } -.c58 { +.c56 { padding: 0; } -.c48 { +.c53 { margin-top: 5px; } -.c48 a { +.c53 a { color: #337ab7; -webkit-text-decoration: none; text-decoration: none; } -.c48 a:hover { +.c53 a:hover { -webkit-text-decoration: underline; text-decoration: underline; } -.c48 img { +.c53 img { margin-left: 5px; vertical-align: middle; } @@ -49777,7 +41413,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Park And Ride Itinerary 2`] = font-family: Hind,sans-serif; } -.c1 .c44 { +.c1 .c49 { background-color: rgb(15,106,172); border-color: white; border-image: initial; @@ -49798,6 +41434,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Park And Ride Itinerary 2`] = } .c1 .c4 { + grid-area: line; display: table-cell; max-width: 20px; width: 20px; @@ -49806,6 +41443,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Park And Ride Itinerary 2`] = } .c1 .c13 { + grid-area: title; color: #000; font-size: 18px; font-weight: 500; @@ -49821,11 +41459,12 @@ exports[`Storyshots ItineraryBody/otp-react-redux Park And Ride Itinerary 2`] = width: 100%; } -.c1 .c62 { +.c1 .c60 { margin-left: -23px; } .c1 .c17 { + grid-area: time; color: #676767; display: table-cell; font-size: 14px; @@ -49844,16 +41483,6 @@ exports[`Storyshots ItineraryBody/otp-react-redux Park And Ride Itinerary 2`] = } .c6 { - background: repeating-linear-gradient( 0deg,grey,grey 8px,white 8px,white 12.5px ); - left: 7.5px; - right: 7.5px; - bottom: -11px; - position: absolute; - top: 11px; - z-index: 10; -} - -.c38 { background: radial-gradient(ellipse at center,#87cefa 40%,transparent 10%); background-position: center -5px; background-repeat: repeat-y; @@ -49866,11 +41495,34 @@ exports[`Storyshots ItineraryBody/otp-react-redux Park And Ride Itinerary 2`] = z-index: 10; } -.c39 { +.c44 { background-color: gray; left: 5px; right: 5px; - background-color: #084C8D; + background-color: #111; + bottom: -11px; + position: absolute; + top: 11px; + z-index: 10; +} + +.c63 { + background-color: gray; + left: 5px; + right: 5px; + background-color: #0076CE; + bottom: -11px; + position: absolute; + top: 11px; + z-index: 10; +} + +.c64 { + background-color: gray; + left: 5px; + right: 5px; + background-color: #000088; + background: repeating-linear-gradient( -45deg, #00008830, #00008830 5px, #000088 5px, #000088 10px ); bottom: -11px; position: absolute; top: 11px; @@ -49900,13 +41552,13 @@ exports[`Storyshots ItineraryBody/otp-react-redux Park And Ride Itinerary 2`] = className="c0 c1" >
  • - 330 SW Murray Blvd, Washington County, OR, USA 97005 + 2nd Avenue, Longmont, CO, USA
    - 3:50 PM + 4:59 PM
    otpUi.TransitLegBody.fromLocation
    + - - Drive 2.4 miles to + Walk 0.3 miles to - P+R Sunset TC + S Main St & 1st Ave
    @@ -50125,7 +41783,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Park And Ride Itinerary 2`] = viewBox="0 0 261 261" >
    @@ -50133,17 +41791,17 @@ exports[`Storyshots ItineraryBody/otp-react-redux Park And Ride Itinerary 2`] = className="c35" > - RIGHT + LEFT on - SW Murray Blvd + Emery Street - 0.2 miles + 0.1 miles
    @@ -50158,7 +41816,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Park And Ride Itinerary 2`] = viewBox="0 0 261 261" > @@ -50166,17 +41824,17 @@ exports[`Storyshots ItineraryBody/otp-react-redux Park And Ride Itinerary 2`] = className="c35" > - CONTINUE + RIGHT on - NW Murray Blvd + 1st Avenue - 150 feet + 0.1 miles @@ -50191,7 +41849,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Park And Ride Itinerary 2`] = viewBox="0 0 261 261" > @@ -50199,234 +41857,504 @@ exports[`Storyshots ItineraryBody/otp-react-redux Park And Ride Itinerary 2`] = className="c35" > - SLIGHTLY_RIGHT + LEFT on - NW Murray Blvd + parking aisle - 0.4 miles + 280 feet
    • -
  • + + +
    +
    • -
  • + -
    +
    + No elevation data available. + mocked-react-resize-detector + + +     + + +
    • +
  • +
    +
    + + + + +
    +
    + + S Main St & 1st Ave + +
    +
    + 5:06 PM +
    + + otpUi.TransitLegBody.fromLocation + +
    +
    + Stop ID 25633 + +
    +
    +
    + + + + - + Ride + + + + + + + + + -
    -
    + - - CONTINUE - on - - NW Sunset Hwy - - - 0.3 miles - + LD3 + + + + + Longmont / Denver + + to -
    -
    • -
  • + + + + - + Disembark at + US 287 & Arapahoe Rd + + + + + +
    +
    + Service operated by + + Regional Transportation District + +
    +
    +
    +
    +
    +
    + + +
    +
    +
    +
    +
      - - LEFT - on - +
      - SW Cedar Hills Blvd - - +
      - 0.2 miles - - -
      - -
    1. -
      - +
      2. +
    2. - - -
      3. -
      - - RIGHT - on - - SW Barnes Rd - - +
      - 0.5 miles - - -
      - -
    3. -
      - +
      4. +
    4. - - -
      5. -
      - - RIGHT - on - - service road - - +
      - 0.2 miles - - -
      - -
    5. -
      - +
      6. +
    6. - - -
      7. -
      - - RIGHT - on - - Sunset TC - - +
      - 76 feet - - -
      - -
    + S Main St & Quebec Ave +
    +
    • +
  • +
    + • +
    +
    + US 287 & Pike Rd +
    +
    • +
  • +
    + • +
    +
    + US 287 & Niwot Rd +
    +
    • +
  • +
    + • +
    +
    + US 287 & Hwy 52 +
    +
    • +
  • +
    + • +
    +
    + US 287 & Lookout Rd +
    +
    • +
  • +
    + • +
    +
    + US 287 & Dawson Dr +
    +
    • +
  • +
    + • +
    +
    + US 287 & Goose Haven Dr +
    +
    • +
  • +
    + • +
    +
    + US 287 & Isabelle Rd +
    +
    • + + + - +
  • - 4:02 PM + 5:25 PM
    otpUi.TransitLegBody.fromLocation
    +
    + Stop ID 33109 + +
    @@ -50513,16 +42469,16 @@ exports[`Storyshots ItineraryBody/otp-react-redux Park And Ride Itinerary 2`] = - - Walk 426 feet to + Walk 0.2 miles to - Sunset TC MAX Station + Arapahoe Rd & Stonehenge Dr
    -
    - - SLIGHTLY_RIGHT - on - - Unnamed Path - - - 16 feet - - -
    -
    • -
  • -
    - - - -
    -
    - - LEFT - on - - steps - - - 232 feet - - -
    -
    • -
  • -
    - -
    @@ -50676,17 +42566,18 @@ exports[`Storyshots ItineraryBody/otp-react-redux Park And Ride Itinerary 2`] = className="c35" > - LEFT + Head + SOUTH on - Unnamed Path + US Highway 287 - 19 feet + 0.1 miles @@ -50714,12 +42605,12 @@ exports[`Storyshots ItineraryBody/otp-react-redux Park And Ride Itinerary 2`] = - Sunset TC (path) + Arapahoe Road - 159 feet + 485 feet @@ -50732,13 +42623,13 @@ exports[`Storyshots ItineraryBody/otp-react-redux Park And Ride Itinerary 2`] =
  • - Sunset TC MAX Station + Arapahoe Rd & Stonehenge Dr
    - 4:05 PM + 6:00 PM
    otpUi.TransitLegBody.fromLocation
    - Stop ID 2600 + Stop ID 33465
    -
    - - - 2 alerts -
    - -
    + />
  • - Oak/ SW 1st Ave MAX Station + Erie Community Center
    - 4:27 PM + 6:12 PM
    otpUi.TransitLegBody.fromLocation
    - Stop ID 8337 + Stop ID 33200
    @@ -51517,7 +43248,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Park And Ride Itinerary 2`] = viewBox="0 0 261 261" >
    @@ -51525,7 +43256,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Park And Ride Itinerary 2`] = className="c35" > - CONTINUE + LEFT on - 27 feet + 38 feet
    • -
  • -
    - - - -
    -
    - - LEFT - on - - SW Oak St - - - 37 feet - - -
    -
    • -
  • + + + + + +
    • +
  • +
    +
    + + + + +
    +
    + + 60plusride-co-us:area_626 + +
    +
    + 6:12 PM +
    + + otpUi.TransitLegBody.fromLocation + +
    +
    + Stop ID area_626 +
    +
    +
    + + + + - + Ride + + + -
    - -
    -
    - - RIGHT - on - - SW 1st Ave - - - 260 feet - - -
    -
    • -
  • -
    - + + + + -
    -
    + - - LEFT - on - - SW Pine St - - - 337 feet - - -
    -
    • - - + 60+ Ride + + + + + 60+ Ride + + + + + - + Disembark at + 60plusride-co-us:area_626 + + + + + +
    +
    + Service operated by + + 60+ Ride +
    - +
    + To take this route, you must + call 555-352-9348 + at least 7 days in advance + . +
    +
    +
    +
    +
  • - 4:29 PM + 6:37 PM
    Arrive at - 205 SW Pine St, Portland, OR, USA 97204 + 60plusride-co-us:area_626
    • `; -exports[`Storyshots ItineraryBody/otp-react-redux Three Alerts Always Collapsing 1`] = ` +exports[`Storyshots ItineraryBody/otp-react-redux OTP 2 Scooter Itinerary 1`] = ` `; -exports[`Storyshots ItineraryBody/otp-react-redux Three Alerts Always Collapsing 2`] = ` +exports[`Storyshots ItineraryBody/otp-react-redux OTP 2 Scooter Itinerary 2`] = ` .c8 { display: inline-block; vertical-align: middle; @@ -52123,7 +43849,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Three Alerts Always Collapsing color: #333; } -.c64 { +.c46 { color: #f44256; } @@ -52137,38 +43863,11 @@ exports[`Storyshots ItineraryBody/otp-react-redux Three Alerts Always Collapsing text-decoration: none; } -.c40 { - color: #008; - margin-left: 5px; -} - -.c40:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c41 { - padding-left: 0px; -} - -.c41:before { - content: "|"; - color: black; - margin-right: 5px; -} - .c31::before { content: ""; margin: 0 0.125em; } -.c59 { - display: block; - font-size: 13px; - list-style: none; - padding: 0; -} - .c0 { list-style: none; padding: 0; @@ -52214,29 +43913,10 @@ exports[`Storyshots ItineraryBody/otp-react-redux Three Alerts Always Collapsing width: 0; } -.c46 { - font-weight: 200; -} - .c25 { font-weight: inherit; } -.c45 { - font-size: 13px; - font-weight: 500; -} - -.c44 { - font-weight: 800; - margin-right: 6px; -} - -.c42 { - color: #807373; - margin-top: 5px; -} - .c24 img, .c24 svg { margin-right: 6px; @@ -52259,15 +43939,39 @@ exports[`Storyshots ItineraryBody/otp-react-redux Three Alerts Always Collapsing .c28 { display: grid; - grid-template-columns: 100px auto; + grid-template-columns: 130px auto; } .c3 { max-width: 500px; display: grid; + grid-template-areas: "time line title" "time line instructions"; grid-template-columns: 65px 30px auto; } +.c40 { + border-color: #fff; + border-radius: 5px; + border-style: solid; + border-width: 1px; + display: inline-block; + font-style: normal; + grid-column: 2; + grid-row: 1; + margin: 0 4px; + position: relative; + text-align: center; + -webkit-text-decoration: none; + text-decoration: none; + vertical-align: middle; + width: 75%; +} + +.c40:hover { + border-color: #d1d5da; + background-color: #f6f8fa; +} + .c18 { grid-column-start: 1; grid-row: 1 / span 2; @@ -52278,6 +43982,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Three Alerts Always Collapsing .c20 { grid-row-start: 2; grid-column-start: 3; + grid-area: instructions; } .c14 { @@ -52313,6 +44018,32 @@ exports[`Storyshots ItineraryBody/otp-react-redux Three Alerts Always Collapsing margin-top: -14px; } +.c41 { + padding: 2px; + width: 100%; +} + +.c43 { + font-size: xx-small; +} + +.c43::before { + content: ""; + margin: 0 0.125em; +} + +.c44 { + color: #e60000; +} + +.c45 { + color: green; +} + +.c42 { + font-size: small; +} + .c32 { display: block; list-style: none; @@ -52386,126 +44117,6 @@ exports[`Storyshots ItineraryBody/otp-react-redux Three Alerts Always Collapsing padding-left: 1ch; } -.c62 { - float: left; - margin-left: -36px; - color: #fff; -} - -.c63 { - color: #676767; - margin-top: 3px; -} - -.c60 { - z-index: 30; - position: relative; -} - -.c50 { - background-color: #eee; - border-radius: 4px; - color: #000; - display: block; - margin-top: 5px; - padding: 8px; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c54 { - -webkit-align-items: baseline; - -webkit-box-align: baseline; - -ms-flex-align: baseline; - align-items: baseline; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - gap: 5px; - margin-top: 0.5em; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c54:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c52 { - font-size: 12px; - margin-left: 30px; - white-space: pre-wrap; -} - -.c53 { - margin-top: 5px; - margin-left: 30px; - font-size: 12px; - font-style: italic; -} - -.c51 { - float: left; - font-size: 18px; -} - -.c49 { - display: block; - margin-top: 3px; - padding: 0; -} - -.c48 { - color: #d14727; - cursor: cursor; - display: inline-block; - font-weight: 400; - margin-top: 8px; - padding: 0; -} - -.c55 { - margin-top: 5px; -} - -.c56 { - color: #676767; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; -} - -.c58 { - font-size: 14px; -} - -.c57 { - padding: 0; -} - -.c47 { - margin-top: 5px; -} - -.c47 a { - color: #337ab7; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c47 a:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c47 img { - margin-left: 5px; - vertical-align: middle; -} - .c1 { font-size: 16px; } @@ -52515,27 +44126,8 @@ exports[`Storyshots ItineraryBody/otp-react-redux Three Alerts Always Collapsing font-family: Hind,sans-serif; } -.c1 .c43 { - background-color: rgb(15,106,172); - border-color: white; - border-image: initial; - border-radius: 12px; - border-style: solid; - border-width: 1px; - box-shadow: rgb(0,0,0) 0px 0px 0.25em; - color: white; - display: inline-block; - font-size: 14px; - font-weight: 500; - height: 24px; - line-height: 1.5; - margin-right: 8px; - min-width: 24px; - padding: 2px 3px; - text-align: center; -} - .c1 .c4 { + grid-area: line; display: table-cell; max-width: 20px; width: 20px; @@ -52544,6 +44136,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Three Alerts Always Collapsing } .c1 .c13 { + grid-area: title; color: #000; font-size: 18px; font-weight: 500; @@ -52559,11 +44152,8 @@ exports[`Storyshots ItineraryBody/otp-react-redux Three Alerts Always Collapsing width: 100%; } -.c1 .c61 { - margin-left: -23px; -} - .c1 .c17 { + grid-area: time; color: #676767; display: table-cell; font-size: 14px; @@ -52595,10 +44185,9 @@ exports[`Storyshots ItineraryBody/otp-react-redux Three Alerts Always Collapsing } .c38 { - background-color: gray; - left: 5px; - right: 5px; - background-color: #084C8D; + background: repeating-linear-gradient( 0deg,#f5a729,#f5a729 8px,white 8px,white 12.5px ); + left: 7.5px; + right: 7.5px; bottom: -11px; position: absolute; top: 11px; @@ -52628,13 +44217,13 @@ exports[`Storyshots ItineraryBody/otp-react-redux Three Alerts Always Collapsing className="c0 c1" >
  • - KGW Studio on the Sq, Portland, OR, USA + 300 Courtland St NE, Atlanta, GA 30303-12ND, United States
    - 3:44 PM + 9:15 AM
    otpUi.TransitLegBody.fromLocation
    - - Walk 269 feet to + Walk 0.2 miles to - Pioneer Square North MAX Station + Razor Vehicle
    @@ -52859,7 +44448,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Three Alerts Always Collapsing viewBox="0 0 261 261" >
    @@ -52867,567 +44456,69 @@ exports[`Storyshots ItineraryBody/otp-react-redux Three Alerts Always Collapsing className="c35" > - LEFT + RIGHT on - Pioneer Sq N (path) + Unnamed Path - 101 feet + 0.1 miles
    • - - - - - - - -
  • -
    -
    - - - - -
    -
    - - Pioneer Square North MAX Station - -
    -
    - 3:46 PM -
    - - otpUi.TransitLegBody.fromLocation - -
    -
    - Stop ID 8383 - -
    -
    -
    - - - - - - Ride - - - - - - - - - - - - MAX Blue Line - - - - - MAX Blue Line - - to - - Hillsboro - - - - - - - Disembark at - Providence Park MAX Station - - - - -
    -
    -
    - Service operated by - - TriMet - - -
    - -
    -
    - -
    -
    -
    -
    - - -
    -
    -
    -
    -
      -
    1. -
      - • -
      -
      - Galleria/SW 10th Ave MAX Station -
      -
      2. -
    -
    -
    +
    - - Typical wait: - 15 min -
    -
    +
  • - 3:49 PM + 9:19 AM
    otpUi.TransitLegBody.fromLocation
    - Stop ID 9757 - + Pick up Razor + E-scooter +
    - - - Walk 249 feet to + Ride 1 mile to - 1737 SW Morrison St, Portland, OR, USA 97205 + 126 Mitchell St SW, Atlanta, GA 30303-3524, United States
    @@ -53639,18 +44703,83 @@ exports[`Storyshots ItineraryBody/otp-react-redux Three Alerts Always Collapsing className="c35" > - Head - WEST + HARD_RIGHT on - Providence Park (path) + Peachtree Center Avenue Northeast - 19 feet + 12 feet + + +
    +
    • +
  • +
    + + + +
    +
    + + LEFT + on + + service road + + + 10 feet + + +
    +
    • +
  • +
    + + + +
    +
    + + LEFT + on + + Peachtree Center Cycle Track + + + 0.5 miles
    @@ -53678,12 +44807,111 @@ exports[`Storyshots ItineraryBody/otp-react-redux Three Alerts Always Collapsing - Unnamed Path + Edgewood Avenue Northeast - 104 feet + 0.1 miles + + + +
    • +
  • +
    + + + +
    +
    + + LEFT + on + + Pryor Street Southwest + + + 269 feet + + +
    +
    • +
  • +
    + + + +
    +
    + + CONTINUE + on + + Pryor Street + + + 518 feet + + +
    +
    • +
  • +
    + + + +
    +
    + + CONTINUE + on + + Pryor Street Southwest + + + 0.2 miles
    @@ -53716,7 +44944,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Three Alerts Always Collapsing - 27 feet + 19 feet @@ -53744,12 +44972,12 @@ exports[`Storyshots ItineraryBody/otp-react-redux Three Alerts Always Collapsing - SW Morrison St + sidewalk - 99 feet + 22 feet @@ -53757,12 +44985,43 @@ exports[`Storyshots ItineraryBody/otp-react-redux Three Alerts Always Collapsing +
    + +
  • - 3:50 PM + 9:26 AM
    Arrive at - 1737 SW Morrison St, Portland, OR, USA 97205 + 126 Mitchell St SW, Atlanta, GA 30303-3524, United States
    • `; -exports[`Storyshots ItineraryBody/otp-react-redux Three Alerts Not Always Collapsing 1`] = ` +exports[`Storyshots ItineraryBody/otp-react-redux Otp 24 Itinerary 1`] = ` `; -exports[`Storyshots ItineraryBody/otp-react-redux Three Alerts Not Always Collapsing 2`] = ` +exports[`Storyshots ItineraryBody/otp-react-redux Otp 24 Itinerary 2`] = ` .c8 { display: inline-block; vertical-align: middle; @@ -54238,7 +47256,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Three Alerts Not Always Collap color: #333; } -.c64 { +.c65 { color: #f44256; } @@ -54252,21 +47270,21 @@ exports[`Storyshots ItineraryBody/otp-react-redux Three Alerts Not Always Collap text-decoration: none; } -.c40 { +.c46 { color: #008; margin-left: 5px; } -.c40:hover { +.c46:hover { -webkit-text-decoration: underline; text-decoration: underline; } -.c41 { +.c47 { padding-left: 0px; } -.c41:before { +.c47:before { content: "|"; color: black; margin-right: 5px; @@ -54277,7 +47295,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Three Alerts Not Always Collap margin: 0 0.125em; } -.c59 { +.c56 { display: block; font-size: 13px; list-style: none; @@ -54329,7 +47347,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Three Alerts Not Always Collap width: 0; } -.c46 { +.c64 { font-weight: 200; } @@ -54337,17 +47355,17 @@ exports[`Storyshots ItineraryBody/otp-react-redux Three Alerts Not Always Collap font-weight: inherit; } -.c45 { +.c49 { font-size: 13px; font-weight: 500; } -.c44 { +.c63 { font-weight: 800; margin-right: 6px; } -.c42 { +.c48 { color: #807373; margin-top: 5px; } @@ -54374,15 +47392,39 @@ exports[`Storyshots ItineraryBody/otp-react-redux Three Alerts Not Always Collap .c28 { display: grid; - grid-template-columns: 100px auto; + grid-template-columns: 130px auto; } .c3 { max-width: 500px; display: grid; + grid-template-areas: "time line title" "time line instructions"; grid-template-columns: 65px 30px auto; } +.c38 { + border-color: #fff; + border-radius: 5px; + border-style: solid; + border-width: 1px; + display: inline-block; + font-style: normal; + grid-column: 2; + grid-row: 1; + margin: 0 4px; + position: relative; + text-align: center; + -webkit-text-decoration: none; + text-decoration: none; + vertical-align: middle; + width: 75%; +} + +.c38:hover { + border-color: #d1d5da; + background-color: #f6f8fa; +} + .c18 { grid-column-start: 1; grid-row: 1 / span 2; @@ -54393,6 +47435,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Three Alerts Not Always Collap .c20 { grid-row-start: 2; grid-column-start: 3; + grid-area: instructions; } .c14 { @@ -54419,7 +47462,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Three Alerts Not Always Collap padding: 3px 0 10px 0; } -.c39 { +.c45 { color: #807373; font-size: 13px; font-weight: 300; @@ -54428,6 +47471,32 @@ exports[`Storyshots ItineraryBody/otp-react-redux Three Alerts Not Always Collap margin-top: -14px; } +.c39 { + padding: 2px; + width: 100%; +} + +.c41 { + font-size: xx-small; +} + +.c41::before { + content: ""; + margin: 0 0.125em; +} + +.c42 { + color: #e60000; +} + +.c43 { + color: green; +} + +.c40 { + font-size: small; +} + .c32 { display: block; list-style: none; @@ -54501,91 +47570,33 @@ exports[`Storyshots ItineraryBody/otp-react-redux Three Alerts Not Always Collap padding-left: 1ch; } -.c62 { +.c59 { float: left; margin-left: -36px; color: #fff; } -.c63 { +.c60 { color: #676767; margin-top: 3px; } -.c60 { +.c57 { z-index: 30; position: relative; } -.c50 { - background-color: #eee; - border-radius: 4px; - color: #000; - display: block; - margin-top: 5px; - padding: 8px; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c54 { - -webkit-align-items: baseline; - -webkit-box-align: baseline; - -ms-flex-align: baseline; - align-items: baseline; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - gap: 5px; - margin-top: 0.5em; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c54:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c52 { - font-size: 12px; - margin-left: 30px; - white-space: pre-wrap; -} - -.c53 { - margin-top: 5px; - margin-left: 30px; - font-size: 12px; - font-style: italic; -} - .c51 { - float: left; - font-size: 18px; -} - -.c49 { display: block; margin-top: 3px; padding: 0; } -.c48 { - color: #d14727; - cursor: cursor; - display: inline-block; - font-weight: 400; - margin-top: 8px; - padding: 0; -} - -.c55 { +.c52 { margin-top: 5px; } -.c56 { +.c53 { color: #676767; display: -webkit-box; display: -webkit-flex; @@ -54593,30 +47604,30 @@ exports[`Storyshots ItineraryBody/otp-react-redux Three Alerts Not Always Collap display: flex; } -.c58 { +.c55 { font-size: 14px; } -.c57 { +.c54 { padding: 0; } -.c47 { +.c50 { margin-top: 5px; } -.c47 a { +.c50 a { color: #337ab7; -webkit-text-decoration: none; text-decoration: none; } -.c47 a:hover { +.c50 a:hover { -webkit-text-decoration: underline; text-decoration: underline; } -.c47 img { +.c50 img { margin-left: 5px; vertical-align: middle; } @@ -54630,7 +47641,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Three Alerts Not Always Collap font-family: Hind,sans-serif; } -.c1 .c43 { +.c1 .c62 { background-color: rgb(15,106,172); border-color: white; border-image: initial; @@ -54651,6 +47662,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Three Alerts Not Always Collap } .c1 .c4 { + grid-area: line; display: table-cell; max-width: 20px; width: 20px; @@ -54659,6 +47671,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Three Alerts Not Always Collap } .c1 .c13 { + grid-area: title; color: #000; font-size: 18px; font-weight: 500; @@ -54674,11 +47687,12 @@ exports[`Storyshots ItineraryBody/otp-react-redux Three Alerts Not Always Collap width: 100%; } -.c1 .c61 { +.c1 .c58 { margin-left: -23px; } .c1 .c17 { + grid-area: time; color: #676767; display: table-cell; font-size: 14px; @@ -54709,7 +47723,18 @@ exports[`Storyshots ItineraryBody/otp-react-redux Three Alerts Not Always Collap z-index: 10; } -.c38 { +.c44 { + background-color: gray; + left: 5px; + right: 5px; + background-color: #114C96; + bottom: -11px; + position: absolute; + top: 11px; + z-index: 10; +} + +.c61 { background-color: gray; left: 5px; right: 5px; @@ -54743,13 +47768,13 @@ exports[`Storyshots ItineraryBody/otp-react-redux Three Alerts Not Always Collap className="c0 c1" >
  • - KGW Studio on the Sq, Portland, OR, USA + 1375 NE Cherry Lane, Hillsboro
    - 3:44 PM + 7:54 AM
    otpUi.TransitLegBody.fromLocation
    - - Walk 269 feet to + Walk 0.9 miles to - Pioneer Square North MAX Station + Orenco MAX Station
    @@ -54987,12 +48012,177 @@ exports[`Storyshots ItineraryBody/otp-react-redux Three Alerts Not Always Collap - Pioneer Sq N (path) + Northeast Cherry Lane - 101 feet + 342 feet + + +
    +
    • +
  • +
    + + + +
    +
    + + LEFT + on + + Northeast Cherry Drive + + + 0.7 miles + + +
    +
    • +
  • +
    + + + +
    +
    + + LEFT + on + + Northeast Century Boulevard + + + 332 feet + + +
    +
    • +
  • +
    + + + +
    +
    + + RIGHT + on + + Northeast Century Boulevard (path) + + + 26 feet + + +
    +
    • +
  • +
    + + + +
    +
    + + CONTINUE + on + + Unnamed Path + + + 204 feet + + +
    +
    • +
  • +
    + + + +
    +
    + + CONTINUE + on + + Orenco + + + 98 feet
    @@ -55000,18 +48190,59 @@ exports[`Storyshots ItineraryBody/otp-react-redux Three Alerts Not Always Collap +
    + +
  • - Pioneer Square North MAX Station + Orenco MAX Station
    - 3:46 PM + 8:15 AM
    otpUi.TransitLegBody.fromLocation
    - Stop ID 8383 + Stop ID 9835
    -
    @@ -55258,204 +48433,23 @@ exports[`Storyshots ItineraryBody/otp-react-redux Three Alerts Not Always Collap style={Object {}} > + className="c51 alert-body" + />
    - - Typical wait: - 15 min -
  • - 3:49 PM + 8:49 AM
    otpUi.TransitLegBody.fromLocation
    - Stop ID 9757 + Stop ID 9758
    @@ -55780,7 +48910,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Three Alerts Not Always Collap viewBox="0 0 261 261" >
    @@ -55788,7 +48918,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Three Alerts Not Always Collap className="c35" > - RIGHT + LEFT on - 104 feet + 19 feet
    @@ -55831,7 +48961,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Three Alerts Not Always Collap - 27 feet + 19 feet @@ -55846,7 +48976,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Three Alerts Not Always Collap viewBox="0 0 261 261" > @@ -55854,17 +48984,50 @@ exports[`Storyshots ItineraryBody/otp-react-redux Three Alerts Not Always Collap className="c35" > - RIGHT + LEFT on - SW Morrison St + Southwest 17th Avenue - 99 feet + 0.1 miles + + + +
    • +
  • +
    + + + +
    +
    + + LEFT + on + + West Burnside Street + + + 276 feet
    @@ -55877,23 +49040,26 @@ exports[`Storyshots ItineraryBody/otp-react-redux Three Alerts Not Always Collap
  • +
    - 3:50 PM + 8:57 AM
    - Arrive at - 1737 SW Morrison St, Portland, OR, USA 97205 + otpUi.TransitLegBody.fromLocation
    -
    • - -`; - -exports[`Storyshots ItineraryBody/otp-react-redux Three Alerts Without Collapsing Prop 1`] = ` - - - -`; - -exports[`Storyshots ItineraryBody/otp-react-redux Three Alerts Without Collapsing Prop 2`] = ` -.c8 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c11 { - color: #333; -} - -.c64 { - color: #f44256; -} - -.c26 { - background: transparent; - border: 0; - color: inherit; - cursor: pointer; - font-size: inherit; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c40 { - color: #008; - margin-left: 5px; -} - -.c40:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c41 { - padding-left: 0px; -} - -.c41:before { - content: "|"; - color: black; - margin-right: 5px; -} - -.c31::before { - content: ""; - margin: 0 0.125em; -} - -.c59 { - display: block; - font-size: 13px; - list-style: none; - padding: 0; -} - -.c0 { - list-style: none; - padding: 0; -} - -.c21 { - color: #676767; - font-size: 13px; - padding-bottom: 12px; -} - -.c27 { - bottom: 0; - cursor: pointer; - left: 0; - position: absolute; - right: 0; - top: 0; - width: 100%; - z-index: 1; -} - -.c22 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - line-height: 16px; - min-height: 31px; - position: relative; -} - -.c19 { - display: inline-block; - grid-row-start: 2; - grid-column-start: 1; - height: 0; - overflow: hidden; - width: 0; -} - -.c46 { - font-weight: 200; -} - -.c25 { - font-weight: inherit; -} - -.c45 { - font-size: 13px; - font-weight: 500; -} - -.c44 { - font-weight: 800; - margin-right: 6px; -} - -.c42 { - color: #807373; - margin-top: 5px; -} - -.c24 img, -.c24 svg { - margin-right: 6px; - height: 24px; - width: 24px; - vertical-align: bottom; -} - -.c23 { - -webkit-flex-shrink: 0; - -ms-flex-negative: 0; - flex-shrink: 0; -} - -.c5 { - grid-column-start: 2; - grid-row: span 2; - padding-right: 5px; -} - -.c28 { - display: grid; - grid-template-columns: 100px auto; -} - -.c3 { - max-width: 500px; - display: grid; - grid-template-columns: 65px 30px auto; -} - -.c18 { - grid-column-start: 1; - grid-row: 1 / span 2; - padding-right: 5px; - font-size: 0.9em; -} - -.c20 { - grid-row-start: 2; - grid-column-start: 3; -} - -.c14 { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - font-size: 1.2em; - grid-row-start: 1; - grid-column-start: 3; -} - -.c16 { - font-size: inherit; - font-weight: bold; - height: 1.2em; - margin: 0; - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; - -webkit-flex: 1 1 auto; - -ms-flex: 1 1 auto; - flex: 1 1 auto; - padding: 3px 0 10px 0; -} - -.c39 { - color: #807373; - font-size: 13px; - font-weight: 300; - padding-top: 1px; - margin-bottom: 10px; - margin-top: -14px; -} - -.c32 { - display: block; - list-style: none; - padding: 0; -} - -.c35 { - margin-left: 24px; - line-height: 1.25em; - padding-top: 1px; -} - -.c35 > span { - margin-right: 1ch; -} - -.c29 { - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - -webkit-align-self: center; - -ms-flex-item-align: center; - align-self: center; - margin-top: 10px; -} - -.c29 a { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; -} - -.c30 { - color: #676767; - font-size: 13px; - font-style: normal; - padding: 0; -} - -.c34 { - fill: #676767; - float: left; - height: 16px; - width: 16px; -} - -.c33 { - font-size: 13px; - margin-top: 8px; - color: #676767; - font-style: normal; -} - -.c36 { - font-weight: 500; -} - -.c37 { - font-weight: 200; - opacity: 0.8975; - padding-left: 1ch; -} - -.c62 { - float: left; - margin-left: -36px; - color: #fff; -} - -.c63 { - color: #676767; - margin-top: 3px; -} - -.c60 { - z-index: 30; - position: relative; -} - -.c50 { - background-color: #eee; - border-radius: 4px; - color: #000; - display: block; - margin-top: 5px; - padding: 8px; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c54 { - -webkit-align-items: baseline; - -webkit-box-align: baseline; - -ms-flex-align: baseline; - align-items: baseline; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - gap: 5px; - margin-top: 0.5em; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c54:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c52 { - font-size: 12px; - margin-left: 30px; - white-space: pre-wrap; -} - -.c53 { - margin-top: 5px; - margin-left: 30px; - font-size: 12px; - font-style: italic; -} - -.c51 { - float: left; - font-size: 18px; -} - -.c49 { - display: block; - margin-top: 3px; - padding: 0; -} - -.c48 { - color: #d14727; - cursor: cursor; - display: inline-block; - font-weight: 400; - margin-top: 8px; - padding: 0; -} - -.c55 { - margin-top: 5px; -} - -.c56 { - color: #676767; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; -} - -.c58 { - font-size: 14px; -} - -.c57 { - padding: 0; -} - -.c47 { - margin-top: 5px; -} - -.c47 a { - color: #337ab7; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c47 a:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c47 img { - margin-left: 5px; - vertical-align: middle; -} - -.c1 { - font-size: 16px; -} - -.c1 *:not(.fa) { - box-sizing: border-box; - font-family: Hind,sans-serif; -} - -.c1 .c43 { - background-color: rgb(15,106,172); - border-color: white; - border-image: initial; - border-radius: 12px; - border-style: solid; - border-width: 1px; - box-shadow: rgb(0,0,0) 0px 0px 0.25em; - color: white; - display: inline-block; - font-size: 14px; - font-weight: 500; - height: 24px; - line-height: 1.5; - margin-right: 8px; - min-width: 24px; - padding: 2px 3px; - text-align: center; -} - -.c1 .c4 { - display: table-cell; - max-width: 20px; - width: 20px; - padding: 0; - position: relative; -} - -.c1 .c13 { - color: #000; - font-size: 18px; - font-weight: 500; - line-height: 20px; -} - -.c1 .c15 { - height: inherit; - white-space: normal; -} - -.c1 .c2 { - width: 100%; -} - -.c1 .c61 { - margin-left: -23px; -} - -.c1 .c17 { - color: #676767; - display: table-cell; - font-size: 14px; - padding-right: 4px; - padding-top: 2px; - text-align: right; - vertical-align: top; - width: 60px; -} - -.c7 { - position: absolute; - width: 100%; - top: 3px; - z-index: 20; -} - -.c6 { - background: radial-gradient(ellipse at center,#87cefa 40%,transparent 10%); - background-position: center -5px; - background-repeat: repeat-y; - background-size: 12px 12px; - left: 6px; - right: 6px; - bottom: -11px; - position: absolute; - top: 11px; - z-index: 10; -} - -.c38 { - background-color: gray; - left: 5px; - right: 5px; - background-color: #084C8D; - bottom: -11px; - position: absolute; - top: 11px; - z-index: 10; -} - -.c9 { - left: 0; - line-height: inherit; - position: absolute; - text-align: center; - width: 100%; -} - -.c10 { - top: 3px; -} - -.c12 { - left: 0; - position: absolute; - text-align: center; - width: 100%; -} - -
      -
    1. -
      - - - - -
      -
      - - KGW Studio on the Sq, Portland, OR, USA - -
      -
      - 3:44 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      + Stop Viewer + +
      @@ -56933,438 +49129,123 @@ exports[`Storyshots ItineraryBody/otp-react-redux Three Alerts Without Collapsin - + - + + - - - + + + + + + + + + + + + 20 + + + + + Burnside/Stark + + to + + Gresham TC + + - - - - - - - Walk 269 feet to - Pioneer Square North MAX Station + - + Disembark at + E Burnside & SE 94th
      - - - - + TriMet + + +
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - NORTHWEST - on - - Unnamed Path - - - 167 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - LEFT - on - - Pioneer Sq N (path) - - - 101 feet - - -
        -
        3. -
      -
      -
      - - - -
      2. -
    2. -
      -
      - - - - -
      -
      - - Pioneer Square North MAX Station - -
      -
      - 3:46 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      - Stop ID 8383 - -
      -
      -
      - - - - - - Ride - - - - - - - - - - - - MAX Blue Line - - - - - MAX Blue Line - - to - - Hillsboro - - - - - - - Disembark at - Providence Park MAX Station - - - - -
      -
      -
      - Service operated by - - TriMet - - -
      - -
      @@ -57372,204 +49253,23 @@ exports[`Storyshots ItineraryBody/otp-react-redux Three Alerts Without Collapsin style={Object {}} > + className="c51 alert-body" + />
      - - Typical wait: - 15 min -
    3. - Providence Park MAX Station + E Burnside & SE 94th
      - 3:49 PM + 9:25 AM
      otpUi.TransitLegBody.fromLocation
      - Stop ID 9757 + Stop ID 822
      @@ -57907,12 +50037,12 @@ exports[`Storyshots ItineraryBody/otp-react-redux Three Alerts Without Collapsin - Unnamed Path + Southeast 94th Avenue - 104 feet + 28 feet
      @@ -57927,7 +50057,7 @@ exports[`Storyshots ItineraryBody/otp-react-redux Three Alerts Without Collapsin viewBox="0 0 261 261" >
      @@ -57935,17 +50065,17 @@ exports[`Storyshots ItineraryBody/otp-react-redux Three Alerts Without Collapsin className="c35" > - RIGHT + CONTINUE on - Unnamed Path + Northeast 94th Avenue - 27 feet + 0.4 miles @@ -57973,12 +50103,12 @@ exports[`Storyshots ItineraryBody/otp-react-redux Three Alerts Without Collapsin - SW Morrison St + Northeast Oregon Street - 99 feet + 107 feet @@ -57986,23 +50116,64 @@ exports[`Storyshots ItineraryBody/otp-react-redux Three Alerts Without Collapsin
    - - - - -
  • -
    - -
    + Elevation chart + + ↑ + 11' + + + ↓ + 14' + +
    + + + + mocked-react-resize-detector + +
    + + + +
    • +
  • +
    + +
    - 3:50 PM + 9:35 AM
    Arrive at - 1737 SW Morrison St, Portland, OR, USA 97205 + 766 NE 94th Avenue, Portland
    • `; -exports[`Storyshots ItineraryBody/otp-react-redux Tnc Transit Itinerary 1`] = ` +exports[`Storyshots ItineraryBody/otp-react-redux Park And Ride Itinerary 1`] = ` - -`; - -exports[`Storyshots ItineraryBody/otp-react-redux Tnc Transit Itinerary 2`] = ` -.c8 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c11 { - color: #333; -} - -.c58 { - color: #f44256; -} - -.c27 { - background: transparent; - border: 0; - color: inherit; - cursor: pointer; - font-size: inherit; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c30 { - background-color: #fff; - background-image: none; - border-radius: 4px; - border: 1px solid #ccc; - color: #333; - cursor: pointer; - display: inline-block; - font-size: 14px; - font-weight: 400; - padding: 4px 6px; - text-align: center; - -webkit-text-decoration: none; - text-decoration: none; - touch-action: manipulation; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - white-space: nowrap; -} - -.c30:hover { - color: #333; - background-color: #e6e6e6; - border-color: #adadad; -} - -.c30:active { - color: #333; - background-color: #e6e6e6; - background-image: none; - border-color: #adadad; - outline: 0; - box-shadow: inset 0 3px 5px rgba(0,0,0,0.125); -} - -.c30:focus { - color: #333; - background-color: #e6e6e6; - border-color: #8c8c8c; -} - -.c30:active:hover { - color: #333; - background-color: #d4d4d4; - border-color: #8c8c8c; -} - -.c37 { - color: #008; - margin-left: 5px; -} - -.c37:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c38 { - padding-left: 0px; -} - -.c38:before { - content: "|"; - color: black; - margin-right: 5px; -} - -.c55 { - bottom: 0; - left: 110px; - position: absolute; - right: 0; - top: 0; -} - -.c56 { - background-color: #fcf9d3; - display: table; - height: 100%; - width: 100%; -} - -.c54 { - border-bottom: 16px solid transparent; - border-right: 16px solid #fcf9d3; - border-top: 16px solid transparent; - height: 0; - left: 94px; - position: absolute; - top: 0; - width: 0; -} - -.c57 { - color: #444; - display: table-cell; - font-style: italic; - line-height: 0.95; - padding: 0px 2px; - vertical-align: middle; -} - -.c29 { - height: 32px; - margin-bottom: 10px; - margin-top: 10px; - position: relative; -} - -.c47::before { - content: ""; - margin: 0 0.125em; -} - -.c49 { - display: block; - font-size: 13px; - list-style: none; - padding: 0; -} - -.c0 { - list-style: none; - padding: 0; -} - -.c22 { - color: #676767; - font-size: 13px; - padding-bottom: 12px; -} - -.c28 { - bottom: 0; - cursor: pointer; - left: 0; - position: absolute; - right: 0; - top: 0; - width: 100%; - z-index: 1; -} - -.c23 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - line-height: 16px; - min-height: 31px; - position: relative; -} - -.c19 { - display: inline-block; - grid-row-start: 2; - grid-column-start: 1; - height: 0; - overflow: hidden; - width: 0; -} - -.c26 { - font-weight: inherit; -} - -.c42 { - font-size: 13px; - font-weight: 500; -} - -.c41 { - font-weight: 800; - margin-right: 6px; -} - -.c39 { - color: #807373; - margin-top: 5px; -} - -.c25 img, -.c25 svg { - margin-right: 6px; - height: 24px; - width: 24px; - vertical-align: bottom; -} - -.c24 { - -webkit-flex-shrink: 0; - -ms-flex-negative: 0; - flex-shrink: 0; -} - -.c5 { - grid-column-start: 2; - grid-row: span 2; - padding-right: 5px; -} - -.c32 { - display: grid; - grid-template-columns: 100px auto; -} - -.c3 { - max-width: 500px; - display: grid; - grid-template-columns: 65px 30px auto; -} - -.c18 { - grid-column-start: 1; - grid-row: 1 / span 2; - padding-right: 5px; - font-size: 0.9em; -} - -.c20 { - grid-row-start: 2; - grid-column-start: 3; -} - -.c14 { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - font-size: 1.2em; - grid-row-start: 1; - grid-column-start: 3; -} - -.c16 { - font-size: inherit; - font-weight: bold; - height: 1.2em; - margin: 0; - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; - -webkit-flex: 1 1 auto; - -ms-flex: 1 1 auto; - flex: 1 1 auto; - padding: 3px 0 10px 0; -} - -.c21 { - color: #807373; - font-size: 13px; - font-weight: 300; - padding-top: 1px; - margin-bottom: 10px; - margin-top: -14px; -} - -.c35 { - display: block; - list-style: none; - padding: 0; -} - -.c33 { - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - -webkit-align-self: center; - -ms-flex-item-align: center; - align-self: center; - margin-top: 10px; -} - -.c33 a { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; -} - -.c34 { - color: #676767; - font-size: 13px; - font-style: normal; - padding: 0; -} - -.c52 { - float: left; - margin-left: -36px; - color: #fff; -} - -.c53 { - color: #676767; - margin-top: 3px; -} - -.c50 { - z-index: 30; - position: relative; -} - -.c44 { - margin-top: 5px; -} - -.c45 { - color: #676767; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; -} - -.c48 { - font-size: 14px; -} - -.c46 { - padding: 0; -} - -.c43 { - margin-top: 5px; -} - -.c43 a { - color: #337ab7; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c43 a:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c43 img { - margin-left: 5px; - vertical-align: middle; -} - -.c1 { - font-size: 16px; -} - -.c1 *:not(.fa) { - box-sizing: border-box; - font-family: Hind,sans-serif; -} - -.c1 .c40 { - background-color: rgb(15,106,172); - border-color: white; - border-image: initial; - border-radius: 12px; - border-style: solid; - border-width: 1px; - box-shadow: rgb(0,0,0) 0px 0px 0.25em; - color: white; - display: inline-block; - font-size: 14px; - font-weight: 500; - height: 24px; - line-height: 1.5; - margin-right: 8px; - min-width: 24px; - padding: 2px 3px; - text-align: center; -} - -.c1 .c4 { - display: table-cell; - max-width: 20px; - width: 20px; - padding: 0; - position: relative; -} - -.c1 .c13 { - color: #000; - font-size: 18px; - font-weight: 500; - line-height: 20px; -} - -.c1 .c15 { - height: inherit; - white-space: normal; -} - -.c1 .c2 { - width: 100%; -} - -.c1 .c51 { - margin-left: -23px; -} - -.c1 .c17 { - color: #676767; - display: table-cell; - font-size: 14px; - padding-right: 4px; - padding-top: 2px; - text-align: right; - vertical-align: top; - width: 60px; -} - -.c7 { - position: absolute; - width: 100%; - top: 3px; - z-index: 20; -} - -.c6 { - background: repeating-linear-gradient( 0deg,grey,grey 8px,white 8px,white 12.5px ); - left: 7.5px; - right: 7.5px; - bottom: -11px; - position: absolute; - top: 11px; - z-index: 10; -} - -.c31 { - background: radial-gradient(ellipse at center,#87cefa 40%,transparent 10%); - background-position: center -5px; - background-repeat: repeat-y; - background-size: 12px 12px; - left: 6px; - right: 6px; - bottom: -11px; - position: absolute; - top: 11px; - z-index: 10; -} - -.c36 { - background-color: gray; - left: 5px; - right: 5px; - background-color: #000088; - bottom: -11px; - position: absolute; - top: 11px; - z-index: 10; -} - -.c9 { - left: 0; - line-height: inherit; - position: absolute; - text-align: center; - width: 100%; -} - -.c10 { - top: 3px; -} - -.c12 { - left: 0; - position: absolute; - text-align: center; - width: 100%; -} - -
      -
    1. -
      -
      - - - - -
      -
      - - 128 NW 12th Ave, Portland - -
      -
      - 10:58 AM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - Wait 4 minutes for pickup -
      -
      -
      - - - - - uber - - - - - - - - - Ride 0.4 miles to - - West Burnside Street - - - - -
      - -
      - Estimated travel time: - 2 min - (does not account for traffic) -
      -
      - Estimated cost: - $17.00 - - - $19.00 -
      -
      -
      -
      -
      2. -
    2. -
      -
      - - - -
      -
      - - West Burnside Street - -
      -
      - 11:01 AM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - - - - - - - - Walk to - - W Burnside & SW 6th - - - - -
      - - - - -
      -
      -
        -
      -
      -       -
      -
      -
      3. -
    3. -
      -
      - - - - -
      -
      - - W Burnside & SW 6th - -
      -
      - 11:02 AM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      - Stop ID 792 - -
      -
      -
      - - - - - - Ride - - - - - - - - - - - - - - - 20 - - - - - Burnside/Stark - - - - - - - Disembark at - E Burnside & SE 12th - - - - -
      -
      -
      - Service operated by - - TriMet - - -
      -
      -
      -
      -
      -
      - - -
      -
      -
      -
      -
        -
      1. -
        - • -
        -
        - W Burnside & SW 2nd -
        -
        2. -
      2. -
        - • -
        -
        - E Burnside & SE 8th -
        -
        3. -
      -
      -
      -
      -
      -
      -
      -
      -
      4. -
    4. -
      -
      - - - - -
      -
      - - E Burnside & SE 12th - -
      -
      - 11:08 AM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      - Stop ID 13327 - -
      -
      -
      - - - - - - - - - - - - - - - Walk to - - East Burnside Street - - - - -
      - - - - -
      -
      -
        -
      -
      -       -
      -
      -
      5. -
    5. -
      -
      - - - -
      -
      - - East Burnside Street - -
      -
      - 11:09 AM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - Wait for pickup -
      -
      -
      - - - - - uber - - - - - - - - - Ride 0.2 miles to - - 407 NE 12th Ave, Portland - - - - -
      -
      - - Book Ride - -
      -
      -
      -
      - Wait until 11:08 AM to book -
      -
      -
      -
      -
      - Estimated travel time: - 1 min - (does not account for traffic) -
      -
      - Estimated cost: - $17.00 - - - $18.00 -
      -
      -
      -
      -
      6. -
    6. -
      - - - - -
      -
      - - 407 NE 12th Ave, Portland - -
      -
      - 11:10 AM -
      - - Arrive at - 407 NE 12th Ave, Portland - -
      -
      7. -
    -`; - -exports[`Storyshots ItineraryBody/otp-react-redux Two Alerts Always Collapsing 1`] = ` - - - -`; - -exports[`Storyshots ItineraryBody/otp-react-redux Two Alerts Always Collapsing 2`] = ` -.c8 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c11 { - color: #333; -} - -.c65 { - color: #f44256; -} - -.c26 { - background: transparent; - border: 0; - color: inherit; - cursor: pointer; - font-size: inherit; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c41 { - color: #008; - margin-left: 5px; -} - -.c41:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c42 { - padding-left: 0px; -} - -.c42:before { - content: "|"; - color: black; - margin-right: 5px; -} - -.c31::before { - content: ""; - margin: 0 0.125em; -} - -.c60 { - display: block; - font-size: 13px; - list-style: none; - padding: 0; -} - -.c0 { - list-style: none; - padding: 0; -} - -.c21 { - color: #676767; - font-size: 13px; - padding-bottom: 12px; -} - -.c27 { - bottom: 0; - cursor: pointer; - left: 0; - position: absolute; - right: 0; - top: 0; - width: 100%; - z-index: 1; -} - -.c22 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - line-height: 16px; - min-height: 31px; - position: relative; -} - -.c19 { - display: inline-block; - grid-row-start: 2; - grid-column-start: 1; - height: 0; - overflow: hidden; - width: 0; -} - -.c47 { - font-weight: 200; -} - -.c25 { - font-weight: inherit; -} - -.c46 { - font-size: 13px; - font-weight: 500; -} - -.c45 { - font-weight: 800; - margin-right: 6px; -} - -.c43 { - color: #807373; - margin-top: 5px; -} - -.c24 img, -.c24 svg { - margin-right: 6px; - height: 24px; - width: 24px; - vertical-align: bottom; -} - -.c23 { - -webkit-flex-shrink: 0; - -ms-flex-negative: 0; - flex-shrink: 0; -} - -.c5 { - grid-column-start: 2; - grid-row: span 2; - padding-right: 5px; -} - -.c28 { - display: grid; - grid-template-columns: 100px auto; -} - -.c3 { - max-width: 500px; - display: grid; - grid-template-columns: 65px 30px auto; -} - -.c18 { - grid-column-start: 1; - grid-row: 1 / span 2; - padding-right: 5px; - font-size: 0.9em; -} - -.c20 { - grid-row-start: 2; - grid-column-start: 3; -} - -.c14 { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - font-size: 1.2em; - grid-row-start: 1; - grid-column-start: 3; -} - -.c16 { - font-size: inherit; - font-weight: bold; - height: 1.2em; - margin: 0; - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; - -webkit-flex: 1 1 auto; - -ms-flex: 1 1 auto; - flex: 1 1 auto; - padding: 3px 0 10px 0; -} - -.c40 { - color: #807373; - font-size: 13px; - font-weight: 300; - padding-top: 1px; - margin-bottom: 10px; - margin-top: -14px; -} - -.c32 { - display: block; - list-style: none; - padding: 0; -} - -.c35 { - margin-left: 24px; - line-height: 1.25em; - padding-top: 1px; -} - -.c35 > span { - margin-right: 1ch; -} - -.c29 { - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - -webkit-align-self: center; - -ms-flex-item-align: center; - align-self: center; - margin-top: 10px; -} - -.c29 a { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; -} - -.c30 { - color: #676767; - font-size: 13px; - font-style: normal; - padding: 0; -} - -.c34 { - fill: #676767; - float: left; - height: 16px; - width: 16px; -} - -.c33 { - font-size: 13px; - margin-top: 8px; - color: #676767; - font-style: normal; -} - -.c36 { - font-weight: 500; -} - -.c37 { - font-weight: 200; - opacity: 0.8975; - padding-left: 1ch; -} - -.c63 { - float: left; - margin-left: -36px; - color: #fff; -} - -.c64 { - color: #676767; - margin-top: 3px; -} - -.c61 { - z-index: 30; - position: relative; -} - -.c51 { - background-color: #eee; - border-radius: 4px; - color: #000; - display: block; - margin-top: 5px; - padding: 8px; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c55 { - -webkit-align-items: baseline; - -webkit-box-align: baseline; - -ms-flex-align: baseline; - align-items: baseline; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - gap: 5px; - margin-top: 0.5em; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c55:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c53 { - font-size: 12px; - margin-left: 30px; - white-space: pre-wrap; -} - -.c54 { - margin-top: 5px; - margin-left: 30px; - font-size: 12px; - font-style: italic; -} - -.c52 { - float: left; - font-size: 18px; -} - -.c50 { - display: block; - margin-top: 3px; - padding: 0; -} - -.c49 { - color: #d14727; - cursor: cursor; - display: inline-block; - font-weight: 400; - margin-top: 8px; - padding: 0; -} - -.c56 { - margin-top: 5px; -} - -.c57 { - color: #676767; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; -} - -.c59 { - font-size: 14px; -} - -.c58 { - padding: 0; -} - -.c48 { - margin-top: 5px; -} - -.c48 a { - color: #337ab7; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c48 a:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c48 img { - margin-left: 5px; - vertical-align: middle; -} - -.c1 { - font-size: 16px; -} - -.c1 *:not(.fa) { - box-sizing: border-box; - font-family: Hind,sans-serif; -} - -.c1 .c44 { - background-color: rgb(15,106,172); - border-color: white; - border-image: initial; - border-radius: 12px; - border-style: solid; - border-width: 1px; - box-shadow: rgb(0,0,0) 0px 0px 0.25em; - color: white; - display: inline-block; - font-size: 14px; - font-weight: 500; - height: 24px; - line-height: 1.5; - margin-right: 8px; - min-width: 24px; - padding: 2px 3px; - text-align: center; -} - -.c1 .c4 { - display: table-cell; - max-width: 20px; - width: 20px; - padding: 0; - position: relative; -} - -.c1 .c13 { - color: #000; - font-size: 18px; - font-weight: 500; - line-height: 20px; -} - -.c1 .c15 { - height: inherit; - white-space: normal; -} - -.c1 .c2 { - width: 100%; -} - -.c1 .c62 { - margin-left: -23px; -} - -.c1 .c17 { - color: #676767; - display: table-cell; - font-size: 14px; - padding-right: 4px; - padding-top: 2px; - text-align: right; - vertical-align: top; - width: 60px; -} - -.c7 { - position: absolute; - width: 100%; - top: 3px; - z-index: 20; -} - -.c6 { - background: repeating-linear-gradient( 0deg,grey,grey 8px,white 8px,white 12.5px ); - left: 7.5px; - right: 7.5px; - bottom: -11px; - position: absolute; - top: 11px; - z-index: 10; -} - -.c38 { - background: radial-gradient(ellipse at center,#87cefa 40%,transparent 10%); - background-position: center -5px; - background-repeat: repeat-y; - background-size: 12px 12px; - left: 6px; - right: 6px; - bottom: -11px; - position: absolute; - top: 11px; - z-index: 10; -} - -.c39 { - background-color: gray; - left: 5px; - right: 5px; - background-color: #084C8D; - bottom: -11px; - position: absolute; - top: 11px; - z-index: 10; -} - -.c9 { - left: 0; - line-height: inherit; - position: absolute; - text-align: center; - width: 100%; -} - -.c10 { - top: 3px; -} - -.c12 { - left: 0; - position: absolute; - text-align: center; - width: 100%; -} - -
      -
    1. -
      -
      - - - - -
      -
      - - 330 SW Murray Blvd, Washington County, OR, USA 97005 - -
      -
      - 3:50 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - - - - - - - Drive 2.4 miles to - - P+R Sunset TC - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - SOUTHWEST - on - - parking aisle - - - 158 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - RIGHT - on - - SW Murray Blvd - - - 0.2 miles - - -
        -
        3. -
      3. -
        - - - -
        -
        - - CONTINUE - on - - NW Murray Blvd - - - 150 feet - - -
        -
        4. -
      4. -
        - - - -
        -
        - - SLIGHTLY_RIGHT - on - - NW Murray Blvd - - - 0.4 miles - - -
        -
        5. -
      5. -
        - - - -
        -
        - - CONTINUE - on - - NW Sunset Hwy - - - 0.6 miles - - -
        -
        6. -
      6. -
        - - - -
        -
        - - CONTINUE - on - - NW Sunset Hwy - - - 0.3 miles - - -
        -
        7. -
      7. -
        - - - -
        -
        - - LEFT - on - - SW Cedar Hills Blvd - - - 0.2 miles - - -
        -
        8. -
      8. -
        - - - -
        -
        - - RIGHT - on - - SW Barnes Rd - - - 0.5 miles - - -
        -
        9. -
      9. -
        - - - -
        -
        - - RIGHT - on - - service road - - - 0.2 miles - - -
        -
        10. -
      10. -
        - - - -
        -
        - - RIGHT - on - - Sunset TC - - - 76 feet - - -
        -
        11. -
      -
      -
      -       -
      -
      -
      2. -
    2. -
      -
      - - - -
      -
      - - P+R Sunset TC - -
      -
      - 4:02 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - - - - - - - - Walk 426 feet to - - Sunset TC MAX Station - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - SLIGHTLY_RIGHT - on - - Unnamed Path - - - 16 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - LEFT - on - - steps - - - 232 feet - - -
        -
        3. -
      3. -
        - - - -
        -
        - - LEFT - on - - Unnamed Path - - - 19 feet - - -
        -
        4. -
      4. -
        - - - -
        -
        - - RIGHT - on - - Sunset TC (path) - - - 159 feet - - -
        -
        5. -
      -
      -
      -       -
      -
      -
      3. -
    3. -
      -
      - - - - -
      -
      - - Sunset TC MAX Station - -
      -
      - 4:05 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      - Stop ID 2600 - -
      -
      -
      - - - - - - Ride - - - - - - - - - - - - MAX Blue Line - - - - - MAX Blue Line - - to - - Gresham - - - - - - - Disembark at - Oak/ SW 1st Ave MAX Station - - - - -
      -
      -
      - Service operated by - - TriMet - - -
      - -
      -
      - -
      -
      -
      -
      - - -
      -
      -
      -
      -
        -
      1. -
        - • -
        -
        - Washington Park MAX Station -
        -
        2. -
      2. -
        - • -
        -
        - Goose Hollow/SW Jefferson St MAX Station -
        -
        3. -
      3. -
        - • -
        -
        - Kings Hill/SW Salmon St MAX Station -
        -
        4. -
      4. -
        - • -
        -
        - Providence Park MAX Station -
        -
        5. -
      5. -
        - • -
        -
        - Library/SW 9th Ave MAX Station -
        -
        6. -
      6. -
        - • -
        -
        - Pioneer Square South MAX Station -
        -
        7. -
      7. -
        - • -
        -
        - Mall/SW 4th Ave MAX Station -
        -
        8. -
      8. -
        - • -
        -
        - Yamhill District MAX Station -
        -
        9. -
      -
      -
      -
      -
      -
      -
      -
      -
      4. -
    4. -
      -
      - - - - -
      -
      - - Oak/ SW 1st Ave MAX Station - -
      -
      - 4:27 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      - Stop ID 8337 - -
      -
      -
      - - - - - - - - - - - - - - - Walk 0.1 miles to - - 205 SW Pine St, Portland, OR, USA 97204 - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - NORTHEAST - on - - Oak/SW 1st Ave (path) - - - 13 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - CONTINUE - on - - Unnamed Path - - - 27 feet - - -
        -
        3. -
      3. -
        - - - -
        -
        - - LEFT - on - - SW Oak St - - - 37 feet - - -
        -
        4. -
      4. -
        - - - -
        -
        - - RIGHT - on - - SW 1st Ave - - - 260 feet - - -
        -
        5. -
      5. -
        - - - -
        -
        - - LEFT - on - - SW Pine St - - - 337 feet - - -
        -
        6. -
      -
      -
      -       -
      -
      -
      5. -
    5. -
      - - - - -
      -
      - - 205 SW Pine St, Portland, OR, USA 97204 - -
      -
      - 4:29 PM -
      - - Arrive at - 205 SW Pine St, Portland, OR, USA 97204 - -
      -
      6. -
    -`; - -exports[`Storyshots ItineraryBody/otp-react-redux Two Alerts Not Always Collapsing 1`] = ` - - - -`; - -exports[`Storyshots ItineraryBody/otp-react-redux Two Alerts Not Always Collapsing 2`] = ` -.c8 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c11 { - color: #333; -} - -.c65 { - color: #f44256; -} - -.c26 { - background: transparent; - border: 0; - color: inherit; - cursor: pointer; - font-size: inherit; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c41 { - color: #008; - margin-left: 5px; -} - -.c41:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c42 { - padding-left: 0px; -} - -.c42:before { - content: "|"; - color: black; - margin-right: 5px; -} - -.c31::before { - content: ""; - margin: 0 0.125em; -} - -.c60 { - display: block; - font-size: 13px; - list-style: none; - padding: 0; -} - -.c0 { - list-style: none; - padding: 0; -} - -.c21 { - color: #676767; - font-size: 13px; - padding-bottom: 12px; -} - -.c27 { - bottom: 0; - cursor: pointer; - left: 0; - position: absolute; - right: 0; - top: 0; - width: 100%; - z-index: 1; -} - -.c22 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - line-height: 16px; - min-height: 31px; - position: relative; -} - -.c19 { - display: inline-block; - grid-row-start: 2; - grid-column-start: 1; - height: 0; - overflow: hidden; - width: 0; -} - -.c47 { - font-weight: 200; -} - -.c25 { - font-weight: inherit; -} - -.c46 { - font-size: 13px; - font-weight: 500; -} - -.c45 { - font-weight: 800; - margin-right: 6px; -} - -.c43 { - color: #807373; - margin-top: 5px; -} - -.c24 img, -.c24 svg { - margin-right: 6px; - height: 24px; - width: 24px; - vertical-align: bottom; -} - -.c23 { - -webkit-flex-shrink: 0; - -ms-flex-negative: 0; - flex-shrink: 0; -} - -.c5 { - grid-column-start: 2; - grid-row: span 2; - padding-right: 5px; -} - -.c28 { - display: grid; - grid-template-columns: 100px auto; -} - -.c3 { - max-width: 500px; - display: grid; - grid-template-columns: 65px 30px auto; -} - -.c18 { - grid-column-start: 1; - grid-row: 1 / span 2; - padding-right: 5px; - font-size: 0.9em; -} - -.c20 { - grid-row-start: 2; - grid-column-start: 3; -} - -.c14 { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - font-size: 1.2em; - grid-row-start: 1; - grid-column-start: 3; -} - -.c16 { - font-size: inherit; - font-weight: bold; - height: 1.2em; - margin: 0; - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; - -webkit-flex: 1 1 auto; - -ms-flex: 1 1 auto; - flex: 1 1 auto; - padding: 3px 0 10px 0; -} - -.c40 { - color: #807373; - font-size: 13px; - font-weight: 300; - padding-top: 1px; - margin-bottom: 10px; - margin-top: -14px; -} - -.c32 { - display: block; - list-style: none; - padding: 0; -} - -.c35 { - margin-left: 24px; - line-height: 1.25em; - padding-top: 1px; -} - -.c35 > span { - margin-right: 1ch; -} - -.c29 { - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - -webkit-align-self: center; - -ms-flex-item-align: center; - align-self: center; - margin-top: 10px; -} - -.c29 a { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; -} - -.c30 { - color: #676767; - font-size: 13px; - font-style: normal; - padding: 0; -} - -.c34 { - fill: #676767; - float: left; - height: 16px; - width: 16px; -} - -.c33 { - font-size: 13px; - margin-top: 8px; - color: #676767; - font-style: normal; -} - -.c36 { - font-weight: 500; -} - -.c37 { - font-weight: 200; - opacity: 0.8975; - padding-left: 1ch; -} - -.c63 { - float: left; - margin-left: -36px; - color: #fff; -} - -.c64 { - color: #676767; - margin-top: 3px; -} - -.c61 { - z-index: 30; - position: relative; -} - -.c51 { - background-color: #eee; - border-radius: 4px; - color: #000; - display: block; - margin-top: 5px; - padding: 8px; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c55 { - -webkit-align-items: baseline; - -webkit-box-align: baseline; - -ms-flex-align: baseline; - align-items: baseline; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - gap: 5px; - margin-top: 0.5em; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c55:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c53 { - font-size: 12px; - margin-left: 30px; - white-space: pre-wrap; -} - -.c54 { - margin-top: 5px; - margin-left: 30px; - font-size: 12px; - font-style: italic; -} - -.c52 { - float: left; - font-size: 18px; -} - -.c50 { - display: block; - margin-top: 3px; - padding: 0; -} - -.c49 { - color: #d14727; - cursor: auto; - display: inline-block; - font-weight: 400; - margin-top: 8px; - padding: 0; -} - -.c56 { - margin-top: 5px; -} - -.c57 { - color: #676767; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; -} - -.c59 { - font-size: 14px; -} - -.c58 { - padding: 0; -} - -.c48 { - margin-top: 5px; -} - -.c48 a { - color: #337ab7; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c48 a:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c48 img { - margin-left: 5px; - vertical-align: middle; -} - -.c1 { - font-size: 16px; -} - -.c1 *:not(.fa) { - box-sizing: border-box; - font-family: Hind,sans-serif; -} - -.c1 .c44 { - background-color: rgb(15,106,172); - border-color: white; - border-image: initial; - border-radius: 12px; - border-style: solid; - border-width: 1px; - box-shadow: rgb(0,0,0) 0px 0px 0.25em; - color: white; - display: inline-block; - font-size: 14px; - font-weight: 500; - height: 24px; - line-height: 1.5; - margin-right: 8px; - min-width: 24px; - padding: 2px 3px; - text-align: center; -} - -.c1 .c4 { - display: table-cell; - max-width: 20px; - width: 20px; - padding: 0; - position: relative; -} - -.c1 .c13 { - color: #000; - font-size: 18px; - font-weight: 500; - line-height: 20px; -} - -.c1 .c15 { - height: inherit; - white-space: normal; -} - -.c1 .c2 { - width: 100%; -} - -.c1 .c62 { - margin-left: -23px; -} - -.c1 .c17 { - color: #676767; - display: table-cell; - font-size: 14px; - padding-right: 4px; - padding-top: 2px; - text-align: right; - vertical-align: top; - width: 60px; -} - -.c7 { - position: absolute; - width: 100%; - top: 3px; - z-index: 20; -} - -.c6 { - background: repeating-linear-gradient( 0deg,grey,grey 8px,white 8px,white 12.5px ); - left: 7.5px; - right: 7.5px; - bottom: -11px; - position: absolute; - top: 11px; - z-index: 10; -} - -.c38 { - background: radial-gradient(ellipse at center,#87cefa 40%,transparent 10%); - background-position: center -5px; - background-repeat: repeat-y; - background-size: 12px 12px; - left: 6px; - right: 6px; - bottom: -11px; - position: absolute; - top: 11px; - z-index: 10; -} - -.c39 { - background-color: gray; - left: 5px; - right: 5px; - background-color: #084C8D; - bottom: -11px; - position: absolute; - top: 11px; - z-index: 10; -} - -.c9 { - left: 0; - line-height: inherit; - position: absolute; - text-align: center; - width: 100%; -} - -.c10 { - top: 3px; -} - -.c12 { - left: 0; - position: absolute; - text-align: center; - width: 100%; -} - -
      -
    1. -
      -
      - - - - -
      -
      - - 330 SW Murray Blvd, Washington County, OR, USA 97005 - -
      -
      - 3:50 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - - - - - - - Drive 2.4 miles to - - P+R Sunset TC - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - SOUTHWEST - on - - parking aisle - - - 158 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - RIGHT - on - - SW Murray Blvd - - - 0.2 miles - - -
        -
        3. -
      3. -
        - - - -
        -
        - - CONTINUE - on - - NW Murray Blvd - - - 150 feet - - -
        -
        4. -
      4. -
        - - - -
        -
        - - SLIGHTLY_RIGHT - on - - NW Murray Blvd - - - 0.4 miles - - -
        -
        5. -
      5. -
        - - - -
        -
        - - CONTINUE - on - - NW Sunset Hwy - - - 0.6 miles - - -
        -
        6. -
      6. -
        - - - -
        -
        - - CONTINUE - on - - NW Sunset Hwy - - - 0.3 miles - - -
        -
        7. -
      7. -
        - - - -
        -
        - - LEFT - on - - SW Cedar Hills Blvd - - - 0.2 miles - - -
        -
        8. -
      8. -
        - - - -
        -
        - - RIGHT - on - - SW Barnes Rd - - - 0.5 miles - - -
        -
        9. -
      9. -
        - - - -
        -
        - - RIGHT - on - - service road - - - 0.2 miles - - -
        -
        10. -
      10. -
        - - - -
        -
        - - RIGHT - on - - Sunset TC - - - 76 feet - - -
        -
        11. -
      -
      -
      -       -
      -
      -
      2. -
    2. -
      -
      - - - -
      -
      - - P+R Sunset TC - -
      -
      - 4:02 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - - - - - - - - Walk 426 feet to - - Sunset TC MAX Station - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - SLIGHTLY_RIGHT - on - - Unnamed Path - - - 16 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - LEFT - on - - steps - - - 232 feet - - -
        -
        3. -
      3. -
        - - - -
        -
        - - LEFT - on - - Unnamed Path - - - 19 feet - - -
        -
        4. -
      4. -
        - - - -
        -
        - - RIGHT - on - - Sunset TC (path) - - - 159 feet - - -
        -
        5. -
      -
      -
      -       -
      -
      -
      3. -
    3. -
      -
      - - - - -
      -
      - - Sunset TC MAX Station - -
      -
      - 4:05 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      - Stop ID 2600 - -
      -
      -
      - - - - - - Ride - - - - - - - - - - - - MAX Blue Line - - - - - MAX Blue Line - - to - - Gresham - - - - - - - Disembark at - Oak/ SW 1st Ave MAX Station - - - - -
      -
      -
      - Service operated by - - TriMet - - -
      -
      - - - 2 alerts -
      -
      -
      - -
      -
      -
      -
      - - -
      -
      -
      -
      -
        -
      1. -
        - • -
        -
        - Washington Park MAX Station -
        -
        2. -
      2. -
        - • -
        -
        - Goose Hollow/SW Jefferson St MAX Station -
        -
        3. -
      3. -
        - • -
        -
        - Kings Hill/SW Salmon St MAX Station -
        -
        4. -
      4. -
        - • -
        -
        - Providence Park MAX Station -
        -
        5. -
      5. -
        - • -
        -
        - Library/SW 9th Ave MAX Station -
        -
        6. -
      6. -
        - • -
        -
        - Pioneer Square South MAX Station -
        -
        7. -
      7. -
        - • -
        -
        - Mall/SW 4th Ave MAX Station -
        -
        8. -
      8. -
        - • -
        -
        - Yamhill District MAX Station -
        -
        9. -
      -
      -
      -
      -
      -
      -
      -
      -
      4. -
    4. -
      -
      - - - - -
      -
      - - Oak/ SW 1st Ave MAX Station - -
      -
      - 4:27 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      - Stop ID 8337 - -
      -
      -
      - - - - - - - - - - - - - - - Walk 0.1 miles to - - 205 SW Pine St, Portland, OR, USA 97204 - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - NORTHEAST - on - - Oak/SW 1st Ave (path) - - - 13 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - CONTINUE - on - - Unnamed Path - - - 27 feet - - -
        -
        3. -
      3. -
        - - - -
        -
        - - LEFT - on - - SW Oak St - - - 37 feet - - -
        -
        4. -
      4. -
        - - - -
        -
        - - RIGHT - on - - SW 1st Ave - - - 260 feet - - -
        -
        5. -
      5. -
        - - - -
        -
        - - LEFT - on - - SW Pine St - - - 337 feet - - -
        -
        6. -
      -
      -
      -       -
      -
      -
      5. -
    5. -
      - - - - -
      -
      - - 205 SW Pine St, Portland, OR, USA 97204 - -
      -
      - 4:29 PM -
      - - Arrive at - 205 SW Pine St, Portland, OR, USA 97204 - -
      -
      6. -
    -`; - -exports[`Storyshots ItineraryBody/otp-react-redux Two Alerts Without Collapsing Prop 1`] = ` - - - -`; - -exports[`Storyshots ItineraryBody/otp-react-redux Two Alerts Without Collapsing Prop 2`] = ` -.c8 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c11 { - color: #333; -} - -.c65 { - color: #f44256; -} - -.c26 { - background: transparent; - border: 0; - color: inherit; - cursor: pointer; - font-size: inherit; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c41 { - color: #008; - margin-left: 5px; -} - -.c41:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c42 { - padding-left: 0px; -} - -.c42:before { - content: "|"; - color: black; - margin-right: 5px; -} - -.c31::before { - content: ""; - margin: 0 0.125em; -} - -.c60 { - display: block; - font-size: 13px; - list-style: none; - padding: 0; -} - -.c0 { - list-style: none; - padding: 0; -} - -.c21 { - color: #676767; - font-size: 13px; - padding-bottom: 12px; -} - -.c27 { - bottom: 0; - cursor: pointer; - left: 0; - position: absolute; - right: 0; - top: 0; - width: 100%; - z-index: 1; -} - -.c22 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - line-height: 16px; - min-height: 31px; - position: relative; -} - -.c19 { - display: inline-block; - grid-row-start: 2; - grid-column-start: 1; - height: 0; - overflow: hidden; - width: 0; -} - -.c47 { - font-weight: 200; -} - -.c25 { - font-weight: inherit; -} - -.c46 { - font-size: 13px; - font-weight: 500; -} - -.c45 { - font-weight: 800; - margin-right: 6px; -} - -.c43 { - color: #807373; - margin-top: 5px; -} - -.c24 img, -.c24 svg { - margin-right: 6px; - height: 24px; - width: 24px; - vertical-align: bottom; -} - -.c23 { - -webkit-flex-shrink: 0; - -ms-flex-negative: 0; - flex-shrink: 0; -} - -.c5 { - grid-column-start: 2; - grid-row: span 2; - padding-right: 5px; -} - -.c28 { - display: grid; - grid-template-columns: 100px auto; -} - -.c3 { - max-width: 500px; - display: grid; - grid-template-columns: 65px 30px auto; -} - -.c18 { - grid-column-start: 1; - grid-row: 1 / span 2; - padding-right: 5px; - font-size: 0.9em; -} - -.c20 { - grid-row-start: 2; - grid-column-start: 3; -} - -.c14 { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - font-size: 1.2em; - grid-row-start: 1; - grid-column-start: 3; -} - -.c16 { - font-size: inherit; - font-weight: bold; - height: 1.2em; - margin: 0; - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; - -webkit-flex: 1 1 auto; - -ms-flex: 1 1 auto; - flex: 1 1 auto; - padding: 3px 0 10px 0; -} - -.c40 { - color: #807373; - font-size: 13px; - font-weight: 300; - padding-top: 1px; - margin-bottom: 10px; - margin-top: -14px; -} - -.c32 { - display: block; - list-style: none; - padding: 0; -} - -.c35 { - margin-left: 24px; - line-height: 1.25em; - padding-top: 1px; -} - -.c35 > span { - margin-right: 1ch; -} - -.c29 { - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - -webkit-align-self: center; - -ms-flex-item-align: center; - align-self: center; - margin-top: 10px; -} - -.c29 a { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; -} - -.c30 { - color: #676767; - font-size: 13px; - font-style: normal; - padding: 0; -} - -.c34 { - fill: #676767; - float: left; - height: 16px; - width: 16px; -} - -.c33 { - font-size: 13px; - margin-top: 8px; - color: #676767; - font-style: normal; -} - -.c36 { - font-weight: 500; -} - -.c37 { - font-weight: 200; - opacity: 0.8975; - padding-left: 1ch; -} - -.c63 { - float: left; - margin-left: -36px; - color: #fff; -} - -.c64 { - color: #676767; - margin-top: 3px; -} - -.c61 { - z-index: 30; - position: relative; -} - -.c51 { - background-color: #eee; - border-radius: 4px; - color: #000; - display: block; - margin-top: 5px; - padding: 8px; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c55 { - -webkit-align-items: baseline; - -webkit-box-align: baseline; - -ms-flex-align: baseline; - align-items: baseline; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - gap: 5px; - margin-top: 0.5em; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c55:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c53 { - font-size: 12px; - margin-left: 30px; - white-space: pre-wrap; -} - -.c54 { - margin-top: 5px; - margin-left: 30px; - font-size: 12px; - font-style: italic; -} - -.c52 { - float: left; - font-size: 18px; -} - -.c50 { - display: block; - margin-top: 3px; - padding: 0; -} - -.c49 { - color: #d14727; - cursor: auto; - display: inline-block; - font-weight: 400; - margin-top: 8px; - padding: 0; -} - -.c56 { - margin-top: 5px; -} - -.c57 { - color: #676767; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; -} - -.c59 { - font-size: 14px; -} - -.c58 { - padding: 0; -} - -.c48 { - margin-top: 5px; -} - -.c48 a { - color: #337ab7; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c48 a:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c48 img { - margin-left: 5px; - vertical-align: middle; -} - -.c1 { - font-size: 16px; -} - -.c1 *:not(.fa) { - box-sizing: border-box; - font-family: Hind,sans-serif; -} - -.c1 .c44 { - background-color: rgb(15,106,172); - border-color: white; - border-image: initial; - border-radius: 12px; - border-style: solid; - border-width: 1px; - box-shadow: rgb(0,0,0) 0px 0px 0.25em; - color: white; - display: inline-block; - font-size: 14px; - font-weight: 500; - height: 24px; - line-height: 1.5; - margin-right: 8px; - min-width: 24px; - padding: 2px 3px; - text-align: center; -} - -.c1 .c4 { - display: table-cell; - max-width: 20px; - width: 20px; - padding: 0; - position: relative; -} - -.c1 .c13 { - color: #000; - font-size: 18px; - font-weight: 500; - line-height: 20px; -} - -.c1 .c15 { - height: inherit; - white-space: normal; -} - -.c1 .c2 { - width: 100%; -} - -.c1 .c62 { - margin-left: -23px; -} - -.c1 .c17 { - color: #676767; - display: table-cell; - font-size: 14px; - padding-right: 4px; - padding-top: 2px; - text-align: right; - vertical-align: top; - width: 60px; -} - -.c7 { - position: absolute; - width: 100%; - top: 3px; - z-index: 20; -} - -.c6 { - background: repeating-linear-gradient( 0deg,grey,grey 8px,white 8px,white 12.5px ); - left: 7.5px; - right: 7.5px; - bottom: -11px; - position: absolute; - top: 11px; - z-index: 10; -} - -.c38 { - background: radial-gradient(ellipse at center,#87cefa 40%,transparent 10%); - background-position: center -5px; - background-repeat: repeat-y; - background-size: 12px 12px; - left: 6px; - right: 6px; - bottom: -11px; - position: absolute; - top: 11px; - z-index: 10; -} - -.c39 { - background-color: gray; - left: 5px; - right: 5px; - background-color: #084C8D; - bottom: -11px; - position: absolute; - top: 11px; - z-index: 10; -} - -.c9 { - left: 0; - line-height: inherit; - position: absolute; - text-align: center; - width: 100%; -} - -.c10 { - top: 3px; -} - -.c12 { - left: 0; - position: absolute; - text-align: center; - width: 100%; -} - -
      -
    1. -
      -
      - - - - -
      -
      - - 330 SW Murray Blvd, Washington County, OR, USA 97005 - -
      -
      - 3:50 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - - - - - - - Drive 2.4 miles to - - P+R Sunset TC - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - SOUTHWEST - on - - parking aisle - - - 158 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - RIGHT - on - - SW Murray Blvd - - - 0.2 miles - - -
        -
        3. -
      3. -
        - - - -
        -
        - - CONTINUE - on - - NW Murray Blvd - - - 150 feet - - -
        -
        4. -
      4. -
        - - - -
        -
        - - SLIGHTLY_RIGHT - on - - NW Murray Blvd - - - 0.4 miles - - -
        -
        5. -
      5. -
        - - - -
        -
        - - CONTINUE - on - - NW Sunset Hwy - - - 0.6 miles - - -
        -
        6. -
      6. -
        - - - -
        -
        - - CONTINUE - on - - NW Sunset Hwy - - - 0.3 miles - - -
        -
        7. -
      7. -
        - - - -
        -
        - - LEFT - on - - SW Cedar Hills Blvd - - - 0.2 miles - - -
        -
        8. -
      8. -
        - - - -
        -
        - - RIGHT - on - - SW Barnes Rd - - - 0.5 miles - - -
        -
        9. -
      9. -
        - - - -
        -
        - - RIGHT - on - - service road - - - 0.2 miles - - -
        -
        10. -
      10. -
        - - - -
        -
        - - RIGHT - on - - Sunset TC - - - 76 feet - - -
        -
        11. -
      -
      -
      -       -
      -
      -
      2. -
    2. -
      -
      - - - -
      -
      - - P+R Sunset TC - -
      -
      - 4:02 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - - - - - - - - Walk 426 feet to - - Sunset TC MAX Station - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - SLIGHTLY_RIGHT - on - - Unnamed Path - - - 16 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - LEFT - on - - steps - - - 232 feet - - -
        -
        3. -
      3. -
        - - - -
        -
        - - LEFT - on - - Unnamed Path - - - 19 feet - - -
        -
        4. -
      4. -
        - - - -
        -
        - - RIGHT - on - - Sunset TC (path) - - - 159 feet - - -
        -
        5. -
      -
      -
      -       -
      -
      -
      3. -
    3. -
      -
      - - - - -
      -
      - - Sunset TC MAX Station - -
      -
      - 4:05 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      - Stop ID 2600 - -
      -
      -
      - - - - - - Ride - - - - - - - - - - - - MAX Blue Line - - - - - MAX Blue Line - - to - - Gresham - - - - - - - Disembark at - Oak/ SW 1st Ave MAX Station - - - - -
      -
      -
      - Service operated by - - TriMet - - -
      -
      - - - 2 alerts -
      -
      -
      - -
      -
      -
      -
      - - -
      -
      -
      -
      -
        -
      1. -
        - • -
        -
        - Washington Park MAX Station -
        -
        2. -
      2. -
        - • -
        -
        - Goose Hollow/SW Jefferson St MAX Station -
        -
        3. -
      3. -
        - • -
        -
        - Kings Hill/SW Salmon St MAX Station -
        -
        4. -
      4. -
        - • -
        -
        - Providence Park MAX Station -
        -
        5. -
      5. -
        - • -
        -
        - Library/SW 9th Ave MAX Station -
        -
        6. -
      6. -
        - • -
        -
        - Pioneer Square South MAX Station -
        -
        7. -
      7. -
        - • -
        -
        - Mall/SW 4th Ave MAX Station -
        -
        8. -
      8. -
        - • -
        -
        - Yamhill District MAX Station -
        -
        9. -
      -
      -
      -
      -
      -
      -
      -
      -
      4. -
    4. -
      -
      - - - - -
      -
      - - Oak/ SW 1st Ave MAX Station - -
      -
      - 4:27 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      - Stop ID 8337 - -
      -
      -
      - - - - - - - - - - - - - - - Walk 0.1 miles to - - 205 SW Pine St, Portland, OR, USA 97204 - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - NORTHEAST - on - - Oak/SW 1st Ave (path) - - - 13 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - CONTINUE - on - - Unnamed Path - - - 27 feet - - -
        -
        3. -
      3. -
        - - - -
        -
        - - LEFT - on - - SW Oak St - - - 37 feet - - -
        -
        4. -
      4. -
        - - - -
        -
        - - RIGHT - on - - SW 1st Ave - - - 260 feet - - -
        -
        5. -
      5. -
        - - - -
        -
        - - LEFT - on - - SW Pine St - - - 337 feet - - -
        -
        6. -
      -
      -
      -       -
      -
      -
      5. -
    5. -
      - - - - -
      -
      - - 205 SW Pine St, Portland, OR, USA 97204 - -
      -
      - 4:29 PM -
      - - Arrive at - 205 SW Pine St, Portland, OR, USA 97204 - -
      -
      6. -
    -`; - -exports[`Storyshots ItineraryBody/otp-react-redux Walk Interlined Transit Itinerary 1`] = ` - - - -`; - -exports[`Storyshots ItineraryBody/otp-react-redux Walk Interlined Transit Itinerary 2`] = ` -.c8 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c11 { - color: #333; -} - -.c57 { - color: #f44256; -} - -.c26 { - background: transparent; - border: 0; - color: inherit; - cursor: pointer; - font-size: inherit; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c40 { - color: #008; - margin-left: 5px; -} - -.c40:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c41 { - padding-left: 0px; -} - -.c41:before { - content: "|"; - color: black; - margin-right: 5px; -} - -.c31::before { - content: ""; - margin: 0 0.125em; -} - -.c51 { - display: block; - font-size: 13px; - list-style: none; - padding: 0; -} - -.c0 { - list-style: none; - padding: 0; -} - -.c21 { - color: #676767; - font-size: 13px; - padding-bottom: 12px; -} - -.c27 { - bottom: 0; - cursor: pointer; - left: 0; - position: absolute; - right: 0; - top: 0; - width: 100%; - z-index: 1; -} - -.c22 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - line-height: 16px; - min-height: 31px; - position: relative; -} - -.c19 { - display: inline-block; - grid-row-start: 2; - grid-column-start: 1; - height: 0; - overflow: hidden; - width: 0; -} - -.c25 { - font-weight: inherit; -} - -.c45 { - font-size: 13px; - font-weight: 500; -} - -.c44 { - font-weight: 800; - margin-right: 6px; -} - -.c42 { - color: #807373; - margin-top: 5px; -} - -.c24 img, -.c24 svg { - margin-right: 6px; - height: 24px; - width: 24px; - vertical-align: bottom; -} - -.c23 { - -webkit-flex-shrink: 0; - -ms-flex-negative: 0; - flex-shrink: 0; -} - -.c5 { - grid-column-start: 2; - grid-row: span 2; - padding-right: 5px; -} - -.c28 { - display: grid; - grid-template-columns: 100px auto; -} - -.c3 { - max-width: 500px; - display: grid; - grid-template-columns: 65px 30px auto; -} - -.c18 { - grid-column-start: 1; - grid-row: 1 / span 2; - padding-right: 5px; - font-size: 0.9em; -} - -.c20 { - grid-row-start: 2; - grid-column-start: 3; -} - -.c14 { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - font-size: 1.2em; - grid-row-start: 1; - grid-column-start: 3; -} - -.c16 { - font-size: inherit; - font-weight: bold; - height: 1.2em; - margin: 0; - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; - -webkit-flex: 1 1 auto; - -ms-flex: 1 1 auto; - flex: 1 1 auto; - padding: 3px 0 10px 0; -} - -.c39 { - color: #807373; - font-size: 13px; - font-weight: 300; - padding-top: 1px; - margin-bottom: 10px; - margin-top: -14px; -} - -.c32 { - display: block; - list-style: none; - padding: 0; -} - -.c35 { - margin-left: 24px; - line-height: 1.25em; - padding-top: 1px; -} - -.c35 > span { - margin-right: 1ch; -} - -.c29 { - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - -webkit-align-self: center; - -ms-flex-item-align: center; - align-self: center; - margin-top: 10px; -} - -.c29 a { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; -} - -.c30 { - color: #676767; - font-size: 13px; - font-style: normal; - padding: 0; -} - -.c34 { - fill: #676767; - float: left; - height: 16px; - width: 16px; -} - -.c33 { - font-size: 13px; - margin-top: 8px; - color: #676767; - font-style: normal; -} - -.c36 { - font-weight: 500; -} - -.c37 { - font-weight: 200; - opacity: 0.8975; - padding-left: 1ch; -} - -.c54 { - float: left; - margin-left: -36px; - color: #fff; -} - -.c55 { - color: #676767; - margin-top: 3px; -} - -.c52 { - z-index: 30; - position: relative; -} - -.c47 { - margin-top: 5px; -} - -.c48 { - color: #676767; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; -} - -.c50 { - font-size: 14px; -} - -.c49 { - padding: 0; -} - -.c46 { - margin-top: 5px; -} - -.c46 a { - color: #337ab7; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c46 a:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c46 img { - margin-left: 5px; - vertical-align: middle; -} - -.c1 { - font-size: 16px; -} - -.c1 *:not(.fa) { - box-sizing: border-box; - font-family: Hind,sans-serif; -} - -.c1 .c43 { - background-color: rgb(15,106,172); - border-color: white; - border-image: initial; - border-radius: 12px; - border-style: solid; - border-width: 1px; - box-shadow: rgb(0,0,0) 0px 0px 0.25em; - color: white; - display: inline-block; - font-size: 14px; - font-weight: 500; - height: 24px; - line-height: 1.5; - margin-right: 8px; - min-width: 24px; - padding: 2px 3px; - text-align: center; -} - -.c1 .c4 { - display: table-cell; - max-width: 20px; - width: 20px; - padding: 0; - position: relative; -} - -.c1 .c13 { - color: #000; - font-size: 18px; - font-weight: 500; - line-height: 20px; -} - -.c1 .c15 { - height: inherit; - white-space: normal; -} - -.c1 .c2 { - width: 100%; -} - -.c1 .c53 { - margin-left: -23px; -} - -.c1 .c17 { - color: #676767; - display: table-cell; - font-size: 14px; - padding-right: 4px; - padding-top: 2px; - text-align: right; - vertical-align: top; - width: 60px; -} - -.c7 { - position: absolute; - width: 100%; - top: 3px; - z-index: 20; -} - -.c6 { - background: radial-gradient(ellipse at center,#87cefa 40%,transparent 10%); - background-position: center -5px; - background-repeat: repeat-y; - background-size: 12px 12px; - left: 6px; - right: 6px; - bottom: -11px; - position: absolute; - top: 11px; - z-index: 10; -} - -.c38 { - background-color: gray; - left: 5px; - right: 5px; - background-color: #0070c0; - bottom: -11px; - position: absolute; - top: 11px; - z-index: 10; -} - -.c56 { - background-color: gray; - left: 5px; - right: 5px; - background-color: #000088; - bottom: -11px; - position: absolute; - top: 11px; - z-index: 10; -} - -.c9 { - left: 0; - line-height: inherit; - position: absolute; - text-align: center; - width: 100%; -} - -.c10 { - top: 3px; -} - -.c12 { - left: 0; - position: absolute; - text-align: center; - width: 100%; -} - -
      -
    1. -
      -
      - - - - -
      -
      - - 47.97767, -122.20034 - -
      -
      - 12:57 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - - - - - - - - Walk 0.3 miles to - - Everett Station Bay C1 - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - SOUTH - on - - service road - - - 0.1 miles - - -
        -
        2. -
      2. -
        - - - -
        -
        - - RIGHT - on - - Smith Avenue - - - 129 feet - - -
        -
        3. -
      3. -
        - - - -
        -
        - - CONTINUE - on - - Paine Avenue - - - 61 feet - - -
        -
        4. -
      4. -
        - - - -
        -
        - - LEFT - on - - 32nd Street - - - 67 feet - - -
        -
        5. -
      5. -
        - - - -
        -
        - - RIGHT - on - - 32nd Street - - - 313 feet - - -
        -
        6. -
      6. -
        - - - -
        -
        - - LEFT - on - - Unnamed Path - - - 380 feet - - -
        -
        7. -
      -
      -
      -       -
      -
      -
      2. -
    2. -
      -
      - - - - -
      -
      - - Everett Station Bay C1 - -
      -
      - 1:04 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      - Stop ID 2345 - -
      -
      -
      - - - - - - Ride - - - - - - - - - - - - - - - 512 - - - - - Northgate Station - - - - - - - Disembark at - Northgate Station - - - - -
      -
      -
      - Service operated by - - Community Transit - -
      -
      -
      -
      -
      -
      - - -
      -
      -
      -
      -
        -
      1. -
        - • -
        -
        - Broadway & 34th St -
        -
        2. -
      2. -
        - • -
        -
        - South Everett Fwy Station Bay 3 -
        -
        3. -
      3. -
        - • -
        -
        - Ash Way Park & Ride Bay 1 -
        -
        4. -
      4. -
        - • -
        -
        - Lynnwood Transit Center Bay D3 -
        -
        5. -
      5. -
        - • -
        -
        - Mountlake Terrace Fwy Station Bay 6 -
        -
        6. -
      -
      -
      -
      -
      -
      -
      -
      -
      3. -
    3. -
      -
      - - - - -
      -
      - - Northgate Station - -
      -
      - 1:51 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      - Stop ID 2191 - -
      -
      -
      - - - - - - - - - - - - - - - Walk to - - Northgate Station - Bay 4 - - - - -
      - - - - -
      -
      -
        -
      -
      -       -
      -
      -
      4. -
    4. -
      -
      - - - - -
      -
      - - Northgate Station - Bay 4 - -
      -
      - 1:55 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      - Stop ID 35318 - -
      -
      -
      - - - - - - Ride - - - - - - - - - - - - - - - 40 - - - - - Downtown Seattle Ballard - - - - - - - Disembark at - N 105th St & Aurora Ave N - - - - -
      -
      -
      - Service operated by - - Metro Transit - -
      -
      -
      -
      -
      -
      - - -
      -
      -
      -
      -
        -
      1. -
        - • -
        -
        - 1st Ave NE & NE 95th St -
        -
        2. -
      2. -
        - • -
        -
        - N 92nd St & Corliss Ave N -
        -
        3. -
      3. -
        - • -
        -
        - College Way N & N 97th St -
        -
        4. -
      4. -
        - • -
        -
        - College Way N & N 103rd St -
        -
        5. -
      5. -
        - • -
        -
        - Meridian Ave N & N 105th St -
        -
        6. -
      6. -
        - • -
        -
        - N Northgate Way & Meridian Ave N -
        -
        7. -
      7. -
        - • -
        -
        - N Northgate Way & Stone Ave N -
        -
        8. -
      -
      -
      -
      -
      -
      -
      -
      -
      5. -
    5. -
      -
      - - - - -
      -
      - - N 105th St & Aurora Ave N - -
      -
      - 2:06 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      - Stop ID 40032 - -
      -
      -
      - - - - - - - - - - - - - - - Walk 259 feet to - - Aurora Ave N & N 105th St - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - EAST - on - - North 105th Street - - - 64 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - RIGHT - on - - service road - - - 14 feet - - -
        -
        3. -
      3. -
        - - - -
        -
        - - LEFT - on - - Unnamed Path - - - 180 feet - - -
        -
        4. -
      -
      -
      -       -
      -
      -
      6. -
    6. -
      -
      - - - - -
      -
      - - Aurora Ave N & N 105th St - -
      -
      - 2:07 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      - Stop ID 7080 - -
      -
      -
      - - - - - - Ride - - - - - - - - - - - - - - - E Line - - - - - Downtown Seattle - - - - - - - Disembark at - 3rd Ave & Cherry St - - - - -
      -
      -
      - Service operated by - - Metro Transit - -
      -
      -
      -
      -
      -
      - - -
      -
      -
      -
      -
        -
      1. -
        - • -
        -
        - Aurora Ave N & N 100th St -
        -
        2. -
      2. -
        - • -
        -
        - Aurora Ave N & N 95th St -
        -
        3. -
      3. -
        - • -
        -
        - Aurora Ave N & N 90th St -
        -
        4. -
      4. -
        - • -
        -
        - Aurora Ave N & N 85th St -
        -
        5. -
      5. -
        - • -
        -
        - Aurora Ave N & N 80th St -
        -
        6. -
      6. -
        - • -
        -
        - Aurora Ave N & N 76th St -
        -
        7. -
      7. -
        - • -
        -
        - Aurora Ave N & N 65th St -
        -
        8. -
      8. -
        - • -
        -
        - Aurora Ave N & N 46th St -
        -
        9. -
      9. -
        - • -
        -
        - Aurora Ave N & Lynn St -
        -
        10. -
      10. -
        - • -
        -
        - Aurora Ave N & Galer St -
        -
        11. -
      11. -
        - • -
        -
        - 7th Ave N & Thomas St -
        -
        12. -
      12. -
        - • -
        -
        - Wall St & 5th Ave -
        -
        13. -
      13. -
        - • -
        -
        - 3rd Ave & Bell St -
        -
        14. -
      14. -
        - • -
        -
        - 3rd Ave & Virginia St -
        -
        15. -
      15. -
        - • -
        -
        - 3rd Ave & Pike St -
        -
        16. -
      16. -
        - • -
        -
        - 3rd Ave & Seneca St -
        -
        17. -
      -
      -
      -
      -
      -
      -
      -
      -
      7. -
    7. -
      -
      - - - - -
      -
      - - 3rd Ave & Cherry St - -
      -
      - 2:39 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      - Stop ID 490 - -
      -
      -
      - - - - - - - - - - - - - - - Walk 443 feet to - - 208 James St, Seattle, WA 98104-2212, United States - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - SOUTHEAST - on - - sidewalk - - - 326 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - UTURN_RIGHT - on - - sidewalk - - - 117 feet - - -
        -
        3. -
      -
      -
      -       -
      -
      -
      8. -
    8. -
      - - - - -
      -
      - - 208 James St, Seattle, WA 98104-2212, United States - -
      -
      - 2:41 PM -
      - - Arrive at - 208 James St, Seattle, WA 98104-2212, United States - -
      -
      9. -
    -`; - -exports[`Storyshots ItineraryBody/otp-react-redux Walk Only Itinerary 1`] = ` - - - -`; - -exports[`Storyshots ItineraryBody/otp-react-redux Walk Only Itinerary 2`] = ` -.c8 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c11 { - color: #333; -} - -.c37 { - color: #f44256; -} - -.c26 { - background: transparent; - border: 0; - color: inherit; - cursor: pointer; - font-size: inherit; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c31::before { - content: ""; - margin: 0 0.125em; -} - -.c0 { - list-style: none; - padding: 0; -} - -.c21 { - color: #676767; - font-size: 13px; - padding-bottom: 12px; -} - -.c27 { - bottom: 0; - cursor: pointer; - left: 0; - position: absolute; - right: 0; - top: 0; - width: 100%; - z-index: 1; -} - -.c22 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - line-height: 16px; - min-height: 31px; - position: relative; -} - -.c19 { - display: inline-block; - grid-row-start: 2; - grid-column-start: 1; - height: 0; - overflow: hidden; - width: 0; -} - -.c25 { - font-weight: inherit; -} - -.c24 img, -.c24 svg { - margin-right: 6px; - height: 24px; - width: 24px; - vertical-align: bottom; -} - -.c23 { - -webkit-flex-shrink: 0; - -ms-flex-negative: 0; - flex-shrink: 0; -} - -.c5 { - grid-column-start: 2; - grid-row: span 2; - padding-right: 5px; -} - -.c28 { - display: grid; - grid-template-columns: 100px auto; -} - -.c3 { - max-width: 500px; - display: grid; - grid-template-columns: 65px 30px auto; -} - -.c18 { - grid-column-start: 1; - grid-row: 1 / span 2; - padding-right: 5px; - font-size: 0.9em; -} - -.c20 { - grid-row-start: 2; - grid-column-start: 3; -} - -.c14 { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - font-size: 1.2em; - grid-row-start: 1; - grid-column-start: 3; -} - -.c16 { - font-size: inherit; - font-weight: bold; - height: 1.2em; - margin: 0; - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; - -webkit-flex: 1 1 auto; - -ms-flex: 1 1 auto; - flex: 1 1 auto; - padding: 3px 0 10px 0; -} - -.c32 { - display: block; - list-style: none; - padding: 0; -} - -.c35 { - margin-left: 24px; - line-height: 1.25em; - padding-top: 1px; -} - -.c35 > span { - margin-right: 1ch; -} - -.c29 { - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - -webkit-align-self: center; - -ms-flex-item-align: center; - align-self: center; - margin-top: 10px; -} - -.c29 a { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; -} - -.c30 { - color: #676767; - font-size: 13px; - font-style: normal; - padding: 0; -} - -.c34 { - fill: #676767; - float: left; - height: 16px; - width: 16px; -} - -.c33 { - font-size: 13px; - margin-top: 8px; - color: #676767; - font-style: normal; -} - -.c36 { - font-weight: 500; -} - -.c1 { - font-size: 16px; -} - -.c1 *:not(.fa) { - box-sizing: border-box; - font-family: Hind,sans-serif; -} - -.c1 .c4 { - display: table-cell; - max-width: 20px; - width: 20px; - padding: 0; - position: relative; -} - -.c1 .c13 { - color: #000; - font-size: 18px; - font-weight: 500; - line-height: 20px; -} - -.c1 .c15 { - height: inherit; - white-space: normal; -} - -.c1 .c2 { - width: 100%; -} - -.c1 .c17 { - color: #676767; - display: table-cell; - font-size: 14px; - padding-right: 4px; - padding-top: 2px; - text-align: right; - vertical-align: top; - width: 60px; -} - -.c7 { - position: absolute; - width: 100%; - top: 3px; - z-index: 20; -} - -.c6 { - background: radial-gradient(ellipse at center,#87cefa 40%,transparent 10%); - background-position: center -5px; - background-repeat: repeat-y; - background-size: 12px 12px; - left: 6px; - right: 6px; - bottom: -11px; - position: absolute; - top: 11px; - z-index: 10; -} - -.c9 { - left: 0; - line-height: inherit; - position: absolute; - text-align: center; - width: 100%; -} - -.c10 { - top: 3px; -} - -.c12 { - left: 0; - position: absolute; - text-align: center; - width: 100%; -} - -
      -
    1. -
      -
      - - - - -
      -
      - - KGW Studio on the Sq, Portland, OR, USA - -
      -
      - 11:29 AM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - - - - - - - - Walk 166 feet to - - 701 SW 6th Ave, Portland, OR, USA 97204 - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - NORTHWEST - on - - Unnamed Path - - -
        -
        2. -
      2. -
        - - - -
        -
        - - LEFT - on - - Unnamed Path - - -
        -
        3. -
      -
      -
      -       -
      -
      -
      2. -
    2. -
      - - - - -
      -
      - - 701 SW 6th Ave, Portland, OR, USA 97204 - -
      -
      - 11:30 AM -
      - - Arrive at - 701 SW 6th Ave, Portland, OR, USA 97204 - -
      -
      3. -
    -`; - -exports[`Storyshots ItineraryBody/otp-react-redux Walk Transit Transfer Itinerary 1`] = ` - - - -`; - -exports[`Storyshots ItineraryBody/otp-react-redux Walk Transit Transfer Itinerary 2`] = ` -.c8 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c11 { - color: #333; -} - -.c57 { - color: #f44256; -} - -.c26 { - background: transparent; - border: 0; - color: inherit; - cursor: pointer; - font-size: inherit; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c40 { - color: #008; - margin-left: 5px; -} - -.c40:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c41 { - padding-left: 0px; -} - -.c41:before { - content: "|"; - color: black; - margin-right: 5px; -} - -.c31::before { - content: ""; - margin: 0 0.125em; -} - -.c52 { - display: block; - font-size: 13px; - list-style: none; - padding: 0; -} - -.c0 { - list-style: none; - padding: 0; -} - -.c21 { - color: #676767; - font-size: 13px; - padding-bottom: 12px; -} - -.c27 { - bottom: 0; - cursor: pointer; - left: 0; - position: absolute; - right: 0; - top: 0; - width: 100%; - z-index: 1; -} - -.c22 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - line-height: 16px; - min-height: 31px; - position: relative; -} - -.c19 { - display: inline-block; - grid-row-start: 2; - grid-column-start: 1; - height: 0; - overflow: hidden; - width: 0; -} - -.c46 { - font-weight: 200; -} - -.c25 { - font-weight: inherit; -} - -.c45 { - font-size: 13px; - font-weight: 500; -} - -.c44 { - font-weight: 800; - margin-right: 6px; -} - -.c42 { - color: #807373; - margin-top: 5px; -} - -.c24 img, -.c24 svg { - margin-right: 6px; - height: 24px; - width: 24px; - vertical-align: bottom; -} - -.c23 { - -webkit-flex-shrink: 0; - -ms-flex-negative: 0; - flex-shrink: 0; -} - -.c5 { - grid-column-start: 2; - grid-row: span 2; - padding-right: 5px; -} - -.c28 { - display: grid; - grid-template-columns: 100px auto; -} - -.c3 { - max-width: 500px; - display: grid; - grid-template-columns: 65px 30px auto; -} - -.c18 { - grid-column-start: 1; - grid-row: 1 / span 2; - padding-right: 5px; - font-size: 0.9em; -} - -.c20 { - grid-row-start: 2; - grid-column-start: 3; -} - -.c14 { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - font-size: 1.2em; - grid-row-start: 1; - grid-column-start: 3; -} - -.c16 { - font-size: inherit; - font-weight: bold; - height: 1.2em; - margin: 0; - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; - -webkit-flex: 1 1 auto; - -ms-flex: 1 1 auto; - flex: 1 1 auto; - padding: 3px 0 10px 0; -} - -.c39 { - color: #807373; - font-size: 13px; - font-weight: 300; - padding-top: 1px; - margin-bottom: 10px; - margin-top: -14px; -} - -.c32 { - display: block; - list-style: none; - padding: 0; -} - -.c35 { - margin-left: 24px; - line-height: 1.25em; - padding-top: 1px; -} - -.c35 > span { - margin-right: 1ch; -} - -.c29 { - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - -webkit-align-self: center; - -ms-flex-item-align: center; - align-self: center; - margin-top: 10px; -} - -.c29 a { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; -} - -.c30 { - color: #676767; - font-size: 13px; - font-style: normal; - padding: 0; -} - -.c34 { - fill: #676767; - float: left; - height: 16px; - width: 16px; -} - -.c33 { - font-size: 13px; - margin-top: 8px; - color: #676767; - font-style: normal; -} - -.c36 { - font-weight: 500; -} - -.c37 { - font-weight: 200; - opacity: 0.8975; - padding-left: 1ch; -} - -.c55 { - float: left; - margin-left: -36px; - color: #fff; -} - -.c56 { - color: #676767; - margin-top: 3px; -} - -.c53 { - z-index: 30; - position: relative; -} - -.c48 { - margin-top: 5px; -} - -.c49 { - color: #676767; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; -} - -.c51 { - font-size: 14px; -} - -.c50 { - padding: 0; -} - -.c47 { - margin-top: 5px; -} - -.c47 a { - color: #337ab7; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c47 a:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c47 img { - margin-left: 5px; - vertical-align: middle; -} - -.c1 { - font-size: 16px; -} - -.c1 *:not(.fa) { - box-sizing: border-box; - font-family: Hind,sans-serif; -} - -.c1 .c43 { - background-color: rgb(15,106,172); - border-color: white; - border-image: initial; - border-radius: 12px; - border-style: solid; - border-width: 1px; - box-shadow: rgb(0,0,0) 0px 0px 0.25em; - color: white; - display: inline-block; - font-size: 14px; - font-weight: 500; - height: 24px; - line-height: 1.5; - margin-right: 8px; - min-width: 24px; - padding: 2px 3px; - text-align: center; -} - -.c1 .c4 { - display: table-cell; - max-width: 20px; - width: 20px; - padding: 0; - position: relative; -} - -.c1 .c13 { - color: #000; - font-size: 18px; - font-weight: 500; - line-height: 20px; -} - -.c1 .c15 { - height: inherit; - white-space: normal; -} - -.c1 .c2 { - width: 100%; -} - -.c1 .c54 { - margin-left: -23px; -} - -.c1 .c17 { - color: #676767; - display: table-cell; - font-size: 14px; - padding-right: 4px; - padding-top: 2px; - text-align: right; - vertical-align: top; - width: 60px; -} - -.c7 { - position: absolute; - width: 100%; - top: 3px; - z-index: 20; -} - -.c6 { - background: radial-gradient(ellipse at center,#87cefa 40%,transparent 10%); - background-position: center -5px; - background-repeat: repeat-y; - background-size: 12px 12px; - left: 6px; - right: 6px; - bottom: -11px; - position: absolute; - top: 11px; - z-index: 10; -} - -.c38 { - background-color: gray; - left: 5px; - right: 5px; - background-color: #000088; - bottom: -11px; - position: absolute; - top: 11px; - z-index: 10; -} - -.c9 { - left: 0; - line-height: inherit; - position: absolute; - text-align: center; - width: 100%; -} - -.c10 { - top: 3px; -} - -.c12 { - left: 0; - position: absolute; - text-align: center; - width: 100%; -} - -
      -
    1. -
      -
      - - - - -
      -
      - - 3940 SE Brooklyn St, Portland, OR, USA 97202 - -
      -
      - 3:46 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - - - - - - - - Walk 238 feet to - - SE Cesar Chavez Blvd & Brooklyn (long address that spans multiple lines) - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - WEST - on - - SE Brooklyn St - - - 205 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - RIGHT - on - - SE Cesar E. Chavez Blvd - - - 33 feet - - -
        -
        3. -
      -
      -
      -       -
      -
      -
      2. -
    2. -
      -
      - - - - -
      -
      - - SE Cesar Chavez Blvd & Brooklyn - -
      -
      - 3:47 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      - Stop ID 7439 - -
      -
      -
      - - - - - - Ride - - - - - - - - - - - - - - - 755X - - - - - Cesar Chavez/Lombard (very long route name) - - to - - St. Johns via NAYA - - - - - - - Disembark at - SE Cesar Chavez Blvd & Hawthorne - - - - -
      -
      -
      - Service operated by - - TriMet - - -
      -
      -
      -
      -
      -
      - - -
      -
      -
      -
      -
        -
      1. -
        - • -
        -
        - SE Cesar Chavez Blvd & Clinton -
        -
        2. -
      2. -
        - • -
        -
        - SE Cesar Chavez Blvd & Division -
        -
        3. -
      3. -
        - • -
        -
        - SE Cesar Chavez Blvd & Lincoln -
        -
        4. -
      4. -
        - • -
        -
        - SE Cesar Chavez Blvd & Stephens -
        -
        5. -
      -
      -
      -
      -
      -
      -
      -
      -
      3. -
    3. -
      -
      - - - - -
      -
      - - SE Cesar Chavez Blvd & Hawthorne - -
      -
      - 3:52 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      - Stop ID 7459 - -
      -
      -
      - - - - - - - - - - - - - - - Walk 440 feet to - - SE Hawthorne & Cesar Chavez Blvd - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - SOUTH - on - - service road - - - 146 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - RIGHT - on - - SE Cesar E. Chavez Blvd - - - 198 feet - - -
        -
        3. -
      3. -
        - - - -
        -
        - - LEFT - on - - SE Hawthorne Blvd - - - 96 feet - - -
        -
        4. -
      -
      -
      -       -
      -
      -
      4. -
    4. -
      -
      - - - - -
      -
      - - SE Hawthorne & Cesar Chavez Blvd - -
      -
      - 4:00 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      - Stop ID 2626 - -
      -
      -
      - - - - - - Ride - - - - - - - - - - - - - - - 1 - - - - - Hawthorne - - to - - Portland - - - - - - - Disembark at - SE Hawthorne & 27th - - - - -
      -
      -
      - Service operated by - - TriMet - - -
      -
      -
      -
      -
      -
      - - -
      -
      -
      -
      -
        -
      1. -
        - • -
        -
        - SE Hawthorne & 37th -
        -
        2. -
      2. -
        - • -
        -
        - SE Hawthorne & 34th -
        -
        3. -
      3. -
        - • -
        -
        - SE Hawthorne & 32nd -
        -
        4. -
      4. -
        - • -
        -
        - SE Hawthorne & 30th -
        -
        5. -
      -
      -
      -
      -
      -
      -
      -
      -
      5. -
    5. -
      -
      - - - - -
      -
      - - SE Hawthorne & 27th - -
      -
      - 4:04 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      - Stop ID 2613 - -
      -
      -
      - - - - - - - - - - - - - - - Walk 479 feet to - - 1415 SE 28th Ave, Portland, OR, USA 97214 - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - WEST - on - - SE Hawthorne Blvd - - - 40 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - RIGHT - on - - SE 27th Ave - - - 294 feet - - -
        -
        3. -
      3. -
        - - - -
        -
        - - RIGHT - on - - SE Madison St - - - 146 feet - - -
        -
        4. -
      -
      -
      -       -
      -
      -
      6. -
    6. -
      - - - - -
      -
      - - 1415 SE 28th Ave, Portland, OR, USA 97214 - -
      -
      - 4:06 PM -
      - - Arrive at - 1415 SE 28th Ave, Portland, OR, USA 97214 - -
      -
      7. -
    -`; - -exports[`Storyshots ItineraryBody/otp-react-redux Walk Transit Transfer With A 11 Y Itinerary 1`] = ` - - - -`; - -exports[`Storyshots ItineraryBody/otp-react-redux Walk Transit Transfer With A 11 Y Itinerary 2`] = ` -.c8 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c11 { - color: #333; -} - -.c61 { - color: #f44256; -} - -.c28 { - background: transparent; - border: 0; - color: inherit; - cursor: pointer; - font-size: inherit; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c43 { - color: #008; - margin-left: 5px; -} - -.c43:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c44 { - padding-left: 0px; -} - -.c44:before { - content: "|"; - color: black; - margin-right: 5px; -} - -.c33::before { - content: ""; - margin: 0 0.125em; -} - -.c55 { - display: block; - font-size: 13px; - list-style: none; - padding: 0; -} - -.c0 { - list-style: none; - padding: 0; -} - -.c23 { - color: #676767; - font-size: 13px; - padding-bottom: 12px; -} - -.c29 { - bottom: 0; - cursor: pointer; - left: 0; - position: absolute; - right: 0; - top: 0; - width: 100%; - z-index: 1; -} - -.c24 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - line-height: 16px; - min-height: 31px; - position: relative; -} - -.c20 { - display: inline-block; - grid-row-start: 2; - grid-column-start: 1; - height: 0; - overflow: hidden; - width: 0; -} - -.c49 { - font-weight: 200; -} - -.c27 { - font-weight: inherit; -} - -.c48 { - font-size: 13px; - font-weight: 500; -} - -.c47 { - font-weight: 800; - margin-right: 6px; -} - -.c45 { - color: #807373; - margin-top: 5px; -} - -.c26 img, -.c26 svg { - margin-right: 6px; - height: 24px; - width: 24px; - vertical-align: bottom; -} - -.c25 { - -webkit-flex-shrink: 0; - -ms-flex-negative: 0; - flex-shrink: 0; -} - -.c5 { - grid-column-start: 2; - grid-row: span 2; - padding-right: 5px; -} - -.c30 { - display: grid; - grid-template-columns: 100px auto; -} - -.c3 { - max-width: 500px; - display: grid; - grid-template-columns: 65px 30px auto; -} - -.c18 { - grid-column-start: 1; - grid-row: 1 / span 2; - padding-right: 5px; - font-size: 0.9em; -} - -.c22 { - grid-row-start: 2; - grid-column-start: 3; -} - -.c14 { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - font-size: 1.2em; - grid-row-start: 1; - grid-column-start: 3; -} - -.c16 { - font-size: inherit; - font-weight: bold; - height: 1.2em; - margin: 0; - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; - -webkit-flex: 1 1 auto; - -ms-flex: 1 1 auto; - flex: 1 1 auto; - padding: 3px 0 10px 0; -} - -.c42 { - color: #807373; - font-size: 13px; - font-weight: 300; - padding-top: 1px; - margin-bottom: 10px; - margin-top: -14px; -} - -.c34 { - display: block; - list-style: none; - padding: 0; -} - -.c37 { - margin-left: 24px; - line-height: 1.25em; - padding-top: 1px; -} - -.c37 > span { - margin-right: 1ch; -} - -.c31 { - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - -webkit-align-self: center; - -ms-flex-item-align: center; - align-self: center; - margin-top: 10px; -} - -.c31 a { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; -} - -.c32 { - color: #676767; - font-size: 13px; - font-style: normal; - padding: 0; -} - -.c36 { - fill: #676767; - float: left; - height: 16px; - width: 16px; -} - -.c35 { - font-size: 13px; - margin-top: 8px; - color: #676767; - font-style: normal; -} - -.c38 { - font-weight: 500; -} - -.c39 { - font-weight: 200; - opacity: 0.8975; - padding-left: 1ch; -} - -.c58 { - float: left; - margin-left: -36px; - color: #fff; -} - -.c59 { - color: #676767; - margin-top: 3px; -} - -.c56 { - z-index: 30; - position: relative; -} - -.c51 { - margin-top: 5px; -} - -.c52 { - color: #676767; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; -} - -.c54 { - font-size: 14px; -} - -.c53 { - padding: 0; -} - -.c50 { - margin-top: 5px; -} - -.c50 a { - color: #337ab7; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c50 a:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c50 img { - margin-left: 5px; - vertical-align: middle; -} - -.c19 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - border: none; - background-color: #bfffb5; - border-radius: 20px; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-box-pack: justify; - -webkit-justify-content: space-between; - -ms-flex-pack: justify; - justify-content: space-between; - margin-top: 0.25em; - max-width: 75px; - height: 30px; - padding: 0.25em 0.6em 0.25em 0.4em; - word-wrap: anywhere; -} - -.c41 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - border: none; - background-color: #dbe9ff; - border-radius: 20px; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-box-pack: justify; - -webkit-justify-content: space-between; - -ms-flex-pack: justify; - justify-content: space-between; - margin-top: 0.25em; - max-width: 75px; - height: 30px; - padding: 0.25em 0.6em 0.25em 0.4em; - word-wrap: anywhere; -} - -.c60 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - border: none; - background-color: #ffe4e5; - border-radius: 20px; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-box-pack: justify; - -webkit-justify-content: space-between; - -ms-flex-pack: justify; - justify-content: space-between; - margin-top: 0.25em; - max-width: 75px; - height: 30px; - padding: 0.25em 0.6em 0.25em 0.4em; - word-wrap: anywhere; -} - -.c21 { - -webkit-flex: 1; - -ms-flex: 1; - flex: 1; -} - -.c21 span { - display: block; -} - -.c1 { - font-size: 16px; -} - -.c1 *:not(.fa) { - box-sizing: border-box; - font-family: Hind,sans-serif; -} - -.c1 .c46 { - background-color: rgb(15,106,172); - border-color: white; - border-image: initial; - border-radius: 12px; - border-style: solid; - border-width: 1px; - box-shadow: rgb(0,0,0) 0px 0px 0.25em; - color: white; - display: inline-block; - font-size: 14px; - font-weight: 500; - height: 24px; - line-height: 1.5; - margin-right: 8px; - min-width: 24px; - padding: 2px 3px; - text-align: center; -} - -.c1 .c4 { - display: table-cell; - max-width: 20px; - width: 20px; - padding: 0; - position: relative; -} - -.c1 .c13 { - color: #000; - font-size: 18px; - font-weight: 500; - line-height: 20px; -} - -.c1 .c15 { - height: inherit; - white-space: normal; -} - -.c1 .c2 { - width: 100%; -} - -.c1 .c57 { - margin-left: -23px; -} - -.c1 .c17 { - color: #676767; - display: table-cell; - font-size: 14px; - padding-right: 4px; - padding-top: 2px; - text-align: right; - vertical-align: top; - width: 60px; -} - -.c7 { - position: absolute; - width: 100%; - top: 3px; - z-index: 20; -} - -.c6 { - background: radial-gradient(ellipse at center,#87cefa 40%,transparent 10%); - background-position: center -5px; - background-repeat: repeat-y; - background-size: 12px 12px; - left: 6px; - right: 6px; - bottom: -11px; - position: absolute; - top: 11px; - z-index: 10; -} - -.c40 { - background-color: gray; - left: 5px; - right: 5px; - background-color: #000088; - bottom: -11px; - position: absolute; - top: 11px; - z-index: 10; -} - -.c9 { - left: 0; - line-height: inherit; - position: absolute; - text-align: center; - width: 100%; -} - -.c10 { - top: 3px; -} - -.c12 { - left: 0; - position: absolute; - text-align: center; - width: 100%; -} - -
      -
    1. -
      -
      - - - - -
      -
      - - 3940 SE Brooklyn St, Portland, OR, USA 97202 - -
      -
      - 3:46 PM -
      - - otpUi.ItineraryBody.tripAccessibility.legAccessibilityotpUi.ItineraryBody.tripAccessibility.likelyAccessible - - - - ✅ - -
      -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - - - - - - - - Walk 238 feet to - - SE Cesar Chavez Blvd & Brooklyn (long address that spans multiple lines) - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - WEST - on - - SE Brooklyn St - - - 205 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - RIGHT - on - - SE Cesar E. Chavez Blvd - - - 33 feet - - -
        -
        3. -
      -
      -
      -       -
      -
      -
      2. -
    2. -
      -
      - - - - -
      -
      - - SE Cesar Chavez Blvd & Brooklyn - -
      -
      - 3:47 PM -
      - - otpUi.ItineraryBody.tripAccessibility.legAccessibilityotpUi.ItineraryBody.tripAccessibility.unclear - - - - ？ - -
      -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      - Stop ID 7439 - -
      -
      -
      - - - - - - Ride - - - - - - - - - - - - - - - 755X - - - - - Cesar Chavez/Lombard (very long route name) - - to - - St. Johns via NAYA - - - - - - - Disembark at - SE Cesar Chavez Blvd & Hawthorne - - - - -
      -
      -
      - Service operated by - - TriMet - - -
      -
      -
      -
      -
      -
      - - -
      -
      -
      -
      -
        -
      1. -
        - • -
        -
        - SE Cesar Chavez Blvd & Clinton -
        -
        2. -
      2. -
        - • -
        -
        - SE Cesar Chavez Blvd & Division -
        -
        3. -
      3. -
        - • -
        -
        - SE Cesar Chavez Blvd & Lincoln -
        -
        4. -
      4. -
        - • -
        -
        - SE Cesar Chavez Blvd & Stephens -
        -
        5. -
      -
      -
      -
      -
      -
      -
      -
      -
      3. -
    3. -
      -
      - - - - -
      -
      - - SE Cesar Chavez Blvd & Hawthorne - -
      -
      - 3:52 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      - Stop ID 7459 - -
      -
      -
      - - - - - - - - - - - - - - - Walk 440 feet to - - SE Hawthorne & Cesar Chavez Blvd - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - SOUTH - on - - service road - - - 146 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - RIGHT - on - - SE Cesar E. Chavez Blvd - - - 198 feet - - -
        -
        3. -
      3. -
        - - - -
        -
        - - LEFT - on - - SE Hawthorne Blvd - - - 96 feet - - -
        -
        4. -
      -
      -
      -       -
      -
      -
      4. -
    4. -
      -
      - - - - -
      -
      - - SE Hawthorne & Cesar Chavez Blvd - -
      -
      - 4:00 PM -
      - - otpUi.ItineraryBody.tripAccessibility.legAccessibilityotpUi.ItineraryBody.tripAccessibility.inaccessible - - - - ❌ - -
      -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      - Stop ID 2626 - -
      -
      -
      - - - - - - Ride - - - - - - - - - - - - - - - 1 - - - - - Hawthorne - - to - - Portland - - - - - - - Disembark at - SE Hawthorne & 27th - - - - -
      -
      -
      - Service operated by - - TriMet - - -
      -
      -
      -
      -
      -
      - - -
      -
      -
      -
      -
        -
      1. -
        - • -
        -
        - SE Hawthorne & 37th -
        -
        2. -
      2. -
        - • -
        -
        - SE Hawthorne & 34th -
        -
        3. -
      3. -
        - • -
        -
        - SE Hawthorne & 32nd -
        -
        4. -
      4. -
        - • -
        -
        - SE Hawthorne & 30th -
        -
        5. -
      -
      -
      -
      -
      -
      -
      -
      -
      5. -
    5. -
      -
      - - - - -
      -
      - - SE Hawthorne & 27th - -
      -
      - 4:04 PM -
      - - otpUi.ItineraryBody.tripAccessibility.legAccessibilityotpUi.ItineraryBody.tripAccessibility.inaccessible - - - - ❌ - -
      -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      - Stop ID 2613 - -
      -
      -
      - - - - - - - - - - - - - - - Walk 479 feet to - - 1415 SE 28th Ave, Portland, OR, USA 97214 - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - WEST - on - - SE Hawthorne Blvd - - - 40 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - RIGHT - on - - SE 27th Ave - - - 294 feet - - -
        -
        3. -
      3. -
        - - - -
        -
        - - RIGHT - on - - SE Madison St - - - 146 feet - - -
        -
        4. -
      -
      -
      -       -
      -
      -
      6. -
    6. -
      - - - - -
      -
      - - 1415 SE 28th Ave, Portland, OR, USA 97214 - -
      -
      - 4:06 PM -
      - - Arrive at - 1415 SE 28th Ave, Portland, OR, USA 97214 - -
      -
      7. -
    -`; - -exports[`Storyshots ItineraryBody/otp-react-redux Walk Transit Walk Itinerary 1`] = ` - - - -`; - -exports[`Storyshots ItineraryBody/otp-react-redux Walk Transit Walk Itinerary 2`] = ` -.c8 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c11 { - color: #333; -} - -.c64 { - color: #f44256; -} - -.c26 { - background: transparent; - border: 0; - color: inherit; - cursor: pointer; - font-size: inherit; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c40 { - color: #008; - margin-left: 5px; -} - -.c40:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c41 { - padding-left: 0px; -} - -.c41:before { - content: "|"; - color: black; - margin-right: 5px; -} - -.c31::before { - content: ""; - margin: 0 0.125em; -} - -.c59 { - display: block; - font-size: 13px; - list-style: none; - padding: 0; -} - -.c0 { - list-style: none; - padding: 0; -} - -.c21 { - color: #676767; - font-size: 13px; - padding-bottom: 12px; -} - -.c27 { - bottom: 0; - cursor: pointer; - left: 0; - position: absolute; - right: 0; - top: 0; - width: 100%; - z-index: 1; -} - -.c22 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - line-height: 16px; - min-height: 31px; - position: relative; -} - -.c19 { - display: inline-block; - grid-row-start: 2; - grid-column-start: 1; - height: 0; - overflow: hidden; - width: 0; -} - -.c46 { - font-weight: 200; -} - -.c25 { - font-weight: inherit; -} - -.c45 { - font-size: 13px; - font-weight: 500; -} - -.c44 { - font-weight: 800; - margin-right: 6px; -} - -.c42 { - color: #807373; - margin-top: 5px; -} - -.c24 img, -.c24 svg { - margin-right: 6px; - height: 24px; - width: 24px; - vertical-align: bottom; -} - -.c23 { - -webkit-flex-shrink: 0; - -ms-flex-negative: 0; - flex-shrink: 0; -} - -.c5 { - grid-column-start: 2; - grid-row: span 2; - padding-right: 5px; -} - -.c28 { - display: grid; - grid-template-columns: 100px auto; -} - -.c3 { - max-width: 500px; - display: grid; - grid-template-columns: 65px 30px auto; -} - -.c18 { - grid-column-start: 1; - grid-row: 1 / span 2; - padding-right: 5px; - font-size: 0.9em; -} - -.c20 { - grid-row-start: 2; - grid-column-start: 3; -} - -.c14 { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - font-size: 1.2em; - grid-row-start: 1; - grid-column-start: 3; -} - -.c16 { - font-size: inherit; - font-weight: bold; - height: 1.2em; - margin: 0; - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; - -webkit-flex: 1 1 auto; - -ms-flex: 1 1 auto; - flex: 1 1 auto; - padding: 3px 0 10px 0; -} - -.c39 { - color: #807373; - font-size: 13px; - font-weight: 300; - padding-top: 1px; - margin-bottom: 10px; - margin-top: -14px; -} - -.c32 { - display: block; - list-style: none; - padding: 0; -} - -.c35 { - margin-left: 24px; - line-height: 1.25em; - padding-top: 1px; -} - -.c35 > span { - margin-right: 1ch; -} - -.c29 { - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - -webkit-align-self: center; - -ms-flex-item-align: center; - align-self: center; - margin-top: 10px; -} - -.c29 a { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; -} - -.c30 { - color: #676767; - font-size: 13px; - font-style: normal; - padding: 0; -} - -.c34 { - fill: #676767; - float: left; - height: 16px; - width: 16px; -} - -.c33 { - font-size: 13px; - margin-top: 8px; - color: #676767; - font-style: normal; -} - -.c36 { - font-weight: 500; -} - -.c37 { - font-weight: 200; - opacity: 0.8975; - padding-left: 1ch; -} - -.c62 { - float: left; - margin-left: -36px; - color: #fff; -} - -.c63 { - color: #676767; - margin-top: 3px; -} - -.c60 { - z-index: 30; - position: relative; -} - -.c50 { - background-color: #eee; - border-radius: 4px; - color: #000; - display: block; - margin-top: 5px; - padding: 8px; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c54 { - -webkit-align-items: baseline; - -webkit-box-align: baseline; - -ms-flex-align: baseline; - align-items: baseline; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - gap: 5px; - margin-top: 0.5em; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c54:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c52 { - font-size: 12px; - margin-left: 30px; - white-space: pre-wrap; -} - -.c53 { - margin-top: 5px; - margin-left: 30px; - font-size: 12px; - font-style: italic; -} - -.c51 { - float: left; - font-size: 18px; -} - -.c49 { - display: block; - margin-top: 3px; - padding: 0; -} - -.c48 { - color: #d14727; - cursor: cursor; - display: inline-block; - font-weight: 400; - margin-top: 8px; - padding: 0; -} - -.c55 { - margin-top: 5px; -} - -.c56 { - color: #676767; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; -} - -.c58 { - font-size: 14px; -} - -.c57 { - padding: 0; -} - -.c47 { - margin-top: 5px; -} - -.c47 a { - color: #337ab7; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c47 a:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c47 img { - margin-left: 5px; - vertical-align: middle; -} - -.c1 { - font-size: 16px; -} - -.c1 *:not(.fa) { - box-sizing: border-box; - font-family: Hind,sans-serif; -} - -.c1 .c43 { - background-color: rgb(15,106,172); - border-color: white; - border-image: initial; - border-radius: 12px; - border-style: solid; - border-width: 1px; - box-shadow: rgb(0,0,0) 0px 0px 0.25em; - color: white; - display: inline-block; - font-size: 14px; - font-weight: 500; - height: 24px; - line-height: 1.5; - margin-right: 8px; - min-width: 24px; - padding: 2px 3px; - text-align: center; -} - -.c1 .c4 { - display: table-cell; - max-width: 20px; - width: 20px; - padding: 0; - position: relative; -} - -.c1 .c13 { - color: #000; - font-size: 18px; - font-weight: 500; - line-height: 20px; -} - -.c1 .c15 { - height: inherit; - white-space: normal; -} - -.c1 .c2 { - width: 100%; -} - -.c1 .c61 { - margin-left: -23px; -} - -.c1 .c17 { - color: #676767; - display: table-cell; - font-size: 14px; - padding-right: 4px; - padding-top: 2px; - text-align: right; - vertical-align: top; - width: 60px; -} - -.c7 { - position: absolute; - width: 100%; - top: 3px; - z-index: 20; -} - -.c6 { - background: radial-gradient(ellipse at center,#87cefa 40%,transparent 10%); - background-position: center -5px; - background-repeat: repeat-y; - background-size: 12px 12px; - left: 6px; - right: 6px; - bottom: -11px; - position: absolute; - top: 11px; - z-index: 10; -} - -.c38 { - background-color: gray; - left: 5px; - right: 5px; - background-color: #084C8D; - bottom: -11px; - position: absolute; - top: 11px; - z-index: 10; -} - -.c9 { - left: 0; - line-height: inherit; - position: absolute; - text-align: center; - width: 100%; -} - -.c10 { - top: 3px; -} - -.c12 { - left: 0; - position: absolute; - text-align: center; - width: 100%; -} - -
      -
    1. -
      -
      - - - - -
      -
      - - KGW Studio on the Sq, Portland, OR, USA - -
      -
      - 3:44 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - - - - - - - - Walk 269 feet to - - Pioneer Square North MAX Station - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - NORTHWEST - on - - Unnamed Path - - - 167 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - LEFT - on - - Pioneer Sq N (path) - - - 101 feet - - -
        -
        3. -
      -
      -
      -       -
      -
      -
      2. -
    2. -
      -
      - - - - -
      -
      - - Pioneer Square North MAX Station - -
      -
      - 3:46 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      - Stop ID 8383 - -
      -
      -
      - - - - - - Ride - - - - - - - - - - - - MAX Blue Line - - - - - MAX Blue Line - - to - - Hillsboro - - - - - - - Disembark at - Providence Park MAX Station - - - - -
      -
      -
      - Service operated by - - TriMet - - -
      - -
      -
      - -
      -
      -
      -
      - - -
      -
      -
      -
      -
        -
      1. -
        - • -
        -
        - Galleria/SW 10th Ave MAX Station -
        -
        2. -
      -
      -
      -
      - - Typical wait: - 15 min - -
      -
      -
      -
      -
      3. -
    3. -
      -
      - - - - -
      -
      - - Providence Park MAX Station - -
      -
      - 3:49 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      - Stop ID 9757 - -
      -
      -
      - - - - - - - - - - - - - - - Walk 249 feet to - - 1737 SW Morrison St, Portland, OR, USA 97205 - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - WEST - on - - Providence Park (path) - - - 19 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - RIGHT - on - - Unnamed Path - - - 104 feet - - -
        -
        3. -
      3. -
        - - - -
        -
        - - RIGHT - on - - Unnamed Path - - - 27 feet - - -
        -
        4. -
      4. -
        - - - -
        -
        - - RIGHT - on - - SW Morrison St - - - 99 feet - - -
        -
        5. -
      -
      -
      -       -
      -
      -
      4. -
    4. -
      - - - - -
      -
      - - 1737 SW Morrison St, Portland, OR, USA 97205 - -
      -
      - 3:50 PM -
      - - Arrive at - 1737 SW Morrison St, Portland, OR, USA 97205 - -
      -
      5. -
    -`; - -exports[`Storyshots ItineraryBody/otp-react-redux Zero Alerts Always Collapsing 1`] = ` - - - -`; - -exports[`Storyshots ItineraryBody/otp-react-redux Zero Alerts Always Collapsing 2`] = ` -.c8 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c11 { - color: #333; -} - -.c57 { - color: #f44256; -} - -.c26 { - background: transparent; - border: 0; - color: inherit; - cursor: pointer; - font-size: inherit; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c40 { - color: #008; - margin-left: 5px; -} - -.c40:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c41 { - padding-left: 0px; -} - -.c41:before { - content: "|"; - color: black; - margin-right: 5px; -} - -.c31::before { - content: ""; - margin: 0 0.125em; -} - -.c51 { - display: block; - font-size: 13px; - list-style: none; - padding: 0; -} - -.c0 { - list-style: none; - padding: 0; -} - -.c21 { - color: #676767; - font-size: 13px; - padding-bottom: 12px; -} - -.c27 { - bottom: 0; - cursor: pointer; - left: 0; - position: absolute; - right: 0; - top: 0; - width: 100%; - z-index: 1; -} - -.c22 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - line-height: 16px; - min-height: 31px; - position: relative; -} - -.c19 { - display: inline-block; - grid-row-start: 2; - grid-column-start: 1; - height: 0; - overflow: hidden; - width: 0; -} - -.c25 { - font-weight: inherit; -} - -.c45 { - font-size: 13px; - font-weight: 500; -} - -.c44 { - font-weight: 800; - margin-right: 6px; -} - -.c42 { - color: #807373; - margin-top: 5px; -} - -.c24 img, -.c24 svg { - margin-right: 6px; - height: 24px; - width: 24px; - vertical-align: bottom; -} - -.c23 { - -webkit-flex-shrink: 0; - -ms-flex-negative: 0; - flex-shrink: 0; -} - -.c5 { - grid-column-start: 2; - grid-row: span 2; - padding-right: 5px; -} - -.c28 { - display: grid; - grid-template-columns: 100px auto; -} - -.c3 { - max-width: 500px; - display: grid; - grid-template-columns: 65px 30px auto; -} - -.c18 { - grid-column-start: 1; - grid-row: 1 / span 2; - padding-right: 5px; - font-size: 0.9em; -} - -.c20 { - grid-row-start: 2; - grid-column-start: 3; -} - -.c14 { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - font-size: 1.2em; - grid-row-start: 1; - grid-column-start: 3; -} - -.c16 { - font-size: inherit; - font-weight: bold; - height: 1.2em; - margin: 0; - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; - -webkit-flex: 1 1 auto; - -ms-flex: 1 1 auto; - flex: 1 1 auto; - padding: 3px 0 10px 0; -} - -.c39 { - color: #807373; - font-size: 13px; - font-weight: 300; - padding-top: 1px; - margin-bottom: 10px; - margin-top: -14px; -} - -.c32 { - display: block; - list-style: none; - padding: 0; -} - -.c35 { - margin-left: 24px; - line-height: 1.25em; - padding-top: 1px; -} - -.c35 > span { - margin-right: 1ch; -} - -.c29 { - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - -webkit-align-self: center; - -ms-flex-item-align: center; - align-self: center; - margin-top: 10px; -} - -.c29 a { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; -} - -.c30 { - color: #676767; - font-size: 13px; - font-style: normal; - padding: 0; -} - -.c34 { - fill: #676767; - float: left; - height: 16px; - width: 16px; -} - -.c33 { - font-size: 13px; - margin-top: 8px; - color: #676767; - font-style: normal; -} - -.c36 { - font-weight: 500; -} - -.c37 { - font-weight: 200; - opacity: 0.8975; - padding-left: 1ch; -} - -.c54 { - float: left; - margin-left: -36px; - color: #fff; -} - -.c55 { - color: #676767; - margin-top: 3px; -} - -.c52 { - z-index: 30; - position: relative; -} - -.c47 { - margin-top: 5px; -} - -.c48 { - color: #676767; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; -} - -.c50 { - font-size: 14px; -} - -.c49 { - padding: 0; -} - -.c46 { - margin-top: 5px; -} - -.c46 a { - color: #337ab7; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c46 a:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c46 img { - margin-left: 5px; - vertical-align: middle; -} - -.c1 { - font-size: 16px; -} - -.c1 *:not(.fa) { - box-sizing: border-box; - font-family: Hind,sans-serif; -} - -.c1 .c43 { - background-color: rgb(15,106,172); - border-color: white; - border-image: initial; - border-radius: 12px; - border-style: solid; - border-width: 1px; - box-shadow: rgb(0,0,0) 0px 0px 0.25em; - color: white; - display: inline-block; - font-size: 14px; - font-weight: 500; - height: 24px; - line-height: 1.5; - margin-right: 8px; - min-width: 24px; - padding: 2px 3px; - text-align: center; -} - -.c1 .c4 { - display: table-cell; - max-width: 20px; - width: 20px; - padding: 0; - position: relative; -} - -.c1 .c13 { - color: #000; - font-size: 18px; - font-weight: 500; - line-height: 20px; -} - -.c1 .c15 { - height: inherit; - white-space: normal; -} - -.c1 .c2 { - width: 100%; -} - -.c1 .c53 { - margin-left: -23px; -} - -.c1 .c17 { - color: #676767; - display: table-cell; - font-size: 14px; - padding-right: 4px; - padding-top: 2px; - text-align: right; - vertical-align: top; - width: 60px; -} - -.c7 { - position: absolute; - width: 100%; - top: 3px; - z-index: 20; -} - -.c6 { - background: radial-gradient(ellipse at center,#87cefa 40%,transparent 10%); - background-position: center -5px; - background-repeat: repeat-y; - background-size: 12px 12px; - left: 6px; - right: 6px; - bottom: -11px; - position: absolute; - top: 11px; - z-index: 10; -} - -.c38 { - background-color: gray; - left: 5px; - right: 5px; - background-color: #0070c0; - bottom: -11px; - position: absolute; - top: 11px; - z-index: 10; -} - -.c56 { - background-color: gray; - left: 5px; - right: 5px; - background-color: #000088; - bottom: -11px; - position: absolute; - top: 11px; - z-index: 10; -} - -.c9 { - left: 0; - line-height: inherit; - position: absolute; - text-align: center; - width: 100%; -} - -.c10 { - top: 3px; -} - -.c12 { - left: 0; - position: absolute; - text-align: center; - width: 100%; -} - -
      -
    1. -
      -
      - - - - -
      -
      - - 47.97767, -122.20034 - -
      -
      - 12:57 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - - - - - - - - Walk 0.3 miles to - - Everett Station Bay C1 - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - SOUTH - on - - service road - - - 0.1 miles - - -
        -
        2. -
      2. -
        - - - -
        -
        - - RIGHT - on - - Smith Avenue - - - 129 feet - - -
        -
        3. -
      3. -
        - - - -
        -
        - - CONTINUE - on - - Paine Avenue - - - 61 feet - - -
        -
        4. -
      4. -
        - - - -
        -
        - - LEFT - on - - 32nd Street - - - 67 feet - - -
        -
        5. -
      5. -
        - - - -
        -
        - - RIGHT - on - - 32nd Street - - - 313 feet - - -
        -
        6. -
      6. -
        - - - -
        -
        - - LEFT - on - - Unnamed Path - - - 380 feet - - -
        -
        7. -
      -
      -
      -       -
      -
      -
      2. -
    2. -
      -
      - - - - -
      -
      - - Everett Station Bay C1 - -
      -
      - 1:04 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      - Stop ID 2345 - -
      -
      -
      - - - - - - Ride - - - - - - - - - - - - - - - 512 - - - - - Northgate Station - - - - - - - Disembark at - Northgate Station - - - - -
      -
      -
      - Service operated by - - Community Transit - -
      -
      -
      -
      -
      -
      - - -
      -
      -
      -
      -
        -
      1. -
        - • -
        -
        - Broadway & 34th St -
        -
        2. -
      2. -
        - • -
        -
        - South Everett Fwy Station Bay 3 -
        -
        3. -
      3. -
        - • -
        -
        - Ash Way Park & Ride Bay 1 -
        -
        4. -
      4. -
        - • -
        -
        - Lynnwood Transit Center Bay D3 -
        -
        5. -
      5. -
        - • -
        -
        - Mountlake Terrace Fwy Station Bay 6 -
        -
        6. -
      -
      -
      -
      -
      -
      -
      -
      -
      3. -
    3. -
      -
      - - - - -
      -
      - - Northgate Station - -
      -
      - 1:51 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      - Stop ID 2191 - -
      -
      -
      - - - - - - - - - - - - - - - Walk to - - Northgate Station - Bay 4 - - - - -
      - - - - -
      -
      -
        -
      -
      -       -
      -
      -
      4. -
    4. -
      -
      - - - - -
      -
      - - Northgate Station - Bay 4 - -
      -
      - 1:55 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      - Stop ID 35318 - -
      -
      -
      - - - - - - Ride - - - - - - - - - - - - - - - 40 - - - - - Downtown Seattle Ballard - - - - - - - Disembark at - N 105th St & Aurora Ave N - - - - -
      -
      -
      - Service operated by - - Metro Transit - -
      -
      -
      -
      -
      -
      - - -
      -
      -
      -
      -
        -
      1. -
        - • -
        -
        - 1st Ave NE & NE 95th St -
        -
        2. -
      2. -
        - • -
        -
        - N 92nd St & Corliss Ave N -
        -
        3. -
      3. -
        - • -
        -
        - College Way N & N 97th St -
        -
        4. -
      4. -
        - • -
        -
        - College Way N & N 103rd St -
        -
        5. -
      5. -
        - • -
        -
        - Meridian Ave N & N 105th St -
        -
        6. -
      6. -
        - • -
        -
        - N Northgate Way & Meridian Ave N -
        -
        7. -
      7. -
        - • -
        -
        - N Northgate Way & Stone Ave N -
        -
        8. -
      -
      -
      -
      -
      -
      -
      -
      -
      5. -
    5. -
      -
      - - - - -
      -
      - - N 105th St & Aurora Ave N - -
      -
      - 2:06 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      - Stop ID 40032 - -
      -
      -
      - - - - - - - - - - - - - - - Walk 259 feet to - - Aurora Ave N & N 105th St - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - EAST - on - - North 105th Street - - - 64 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - RIGHT - on - - service road - - - 14 feet - - -
        -
        3. -
      3. -
        - - - -
        -
        - - LEFT - on - - Unnamed Path - - - 180 feet - - -
        -
        4. -
      -
      -
      -       -
      -
      -
      6. -
    6. -
      -
      - - - - -
      -
      - - Aurora Ave N & N 105th St - -
      -
      - 2:07 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      - Stop ID 7080 - -
      -
      -
      - - - - - - Ride - - - - - - - - - - - - - - - E Line - - - - - Downtown Seattle - - - - - - - Disembark at - 3rd Ave & Cherry St - - - - -
      -
      -
      - Service operated by - - Metro Transit - -
      -
      -
      -
      -
      -
      - - -
      -
      -
      -
      -
        -
      1. -
        - • -
        -
        - Aurora Ave N & N 100th St -
        -
        2. -
      2. -
        - • -
        -
        - Aurora Ave N & N 95th St -
        -
        3. -
      3. -
        - • -
        -
        - Aurora Ave N & N 90th St -
        -
        4. -
      4. -
        - • -
        -
        - Aurora Ave N & N 85th St -
        -
        5. -
      5. -
        - • -
        -
        - Aurora Ave N & N 80th St -
        -
        6. -
      6. -
        - • -
        -
        - Aurora Ave N & N 76th St -
        -
        7. -
      7. -
        - • -
        -
        - Aurora Ave N & N 65th St -
        -
        8. -
      8. -
        - • -
        -
        - Aurora Ave N & N 46th St -
        -
        9. -
      9. -
        - • -
        -
        - Aurora Ave N & Lynn St -
        -
        10. -
      10. -
        - • -
        -
        - Aurora Ave N & Galer St -
        -
        11. -
      11. -
        - • -
        -
        - 7th Ave N & Thomas St -
        -
        12. -
      12. -
        - • -
        -
        - Wall St & 5th Ave -
        -
        13. -
      13. -
        - • -
        -
        - 3rd Ave & Bell St -
        -
        14. -
      14. -
        - • -
        -
        - 3rd Ave & Virginia St -
        -
        15. -
      15. -
        - • -
        -
        - 3rd Ave & Pike St -
        -
        16. -
      16. -
        - • -
        -
        - 3rd Ave & Seneca St -
        -
        17. -
      -
      -
      -
      -
      -
      -
      -
      -
      7. -
    7. -
      -
      - - - - -
      -
      - - 3rd Ave & Cherry St - -
      -
      - 2:39 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      - Stop ID 490 - -
      -
      -
      - - - - - - - - - - - - - - - Walk 443 feet to - - 208 James St, Seattle, WA 98104-2212, United States - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - SOUTHEAST - on - - sidewalk - - - 326 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - UTURN_RIGHT - on - - sidewalk - - - 117 feet - - -
        -
        3. -
      -
      -
      -       -
      -
      -
      8. -
    8. -
      - - - - -
      -
      - - 208 James St, Seattle, WA 98104-2212, United States - -
      -
      - 2:41 PM -
      - - Arrive at - 208 James St, Seattle, WA 98104-2212, United States - -
      -
      9. -
    -`; - -exports[`Storyshots ItineraryBody/otp-react-redux Zero Alerts Not Always Collapsing 1`] = ` - - - -`; - -exports[`Storyshots ItineraryBody/otp-react-redux Zero Alerts Not Always Collapsing 2`] = ` -.c8 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c11 { - color: #333; -} - -.c57 { - color: #f44256; -} - -.c26 { - background: transparent; - border: 0; - color: inherit; - cursor: pointer; - font-size: inherit; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c40 { - color: #008; - margin-left: 5px; -} - -.c40:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c41 { - padding-left: 0px; -} - -.c41:before { - content: "|"; - color: black; - margin-right: 5px; -} - -.c31::before { - content: ""; - margin: 0 0.125em; -} - -.c51 { - display: block; - font-size: 13px; - list-style: none; - padding: 0; -} - -.c0 { - list-style: none; - padding: 0; -} - -.c21 { - color: #676767; - font-size: 13px; - padding-bottom: 12px; -} - -.c27 { - bottom: 0; - cursor: pointer; - left: 0; - position: absolute; - right: 0; - top: 0; - width: 100%; - z-index: 1; -} - -.c22 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - line-height: 16px; - min-height: 31px; - position: relative; -} - -.c19 { - display: inline-block; - grid-row-start: 2; - grid-column-start: 1; - height: 0; - overflow: hidden; - width: 0; -} - -.c25 { - font-weight: inherit; -} - -.c45 { - font-size: 13px; - font-weight: 500; -} - -.c44 { - font-weight: 800; - margin-right: 6px; -} - -.c42 { - color: #807373; - margin-top: 5px; -} - -.c24 img, -.c24 svg { - margin-right: 6px; - height: 24px; - width: 24px; - vertical-align: bottom; -} - -.c23 { - -webkit-flex-shrink: 0; - -ms-flex-negative: 0; - flex-shrink: 0; -} - -.c5 { - grid-column-start: 2; - grid-row: span 2; - padding-right: 5px; -} - -.c28 { - display: grid; - grid-template-columns: 100px auto; -} - -.c3 { - max-width: 500px; - display: grid; - grid-template-columns: 65px 30px auto; -} - -.c18 { - grid-column-start: 1; - grid-row: 1 / span 2; - padding-right: 5px; - font-size: 0.9em; -} - -.c20 { - grid-row-start: 2; - grid-column-start: 3; -} - -.c14 { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - font-size: 1.2em; - grid-row-start: 1; - grid-column-start: 3; -} - -.c16 { - font-size: inherit; - font-weight: bold; - height: 1.2em; - margin: 0; - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; - -webkit-flex: 1 1 auto; - -ms-flex: 1 1 auto; - flex: 1 1 auto; - padding: 3px 0 10px 0; -} - -.c39 { - color: #807373; - font-size: 13px; - font-weight: 300; - padding-top: 1px; - margin-bottom: 10px; - margin-top: -14px; -} - -.c32 { - display: block; - list-style: none; - padding: 0; -} - -.c35 { - margin-left: 24px; - line-height: 1.25em; - padding-top: 1px; -} - -.c35 > span { - margin-right: 1ch; -} - -.c29 { - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - -webkit-align-self: center; - -ms-flex-item-align: center; - align-self: center; - margin-top: 10px; -} - -.c29 a { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; -} - -.c30 { - color: #676767; - font-size: 13px; - font-style: normal; - padding: 0; -} - -.c34 { - fill: #676767; - float: left; - height: 16px; - width: 16px; -} - -.c33 { - font-size: 13px; - margin-top: 8px; - color: #676767; - font-style: normal; -} - -.c36 { - font-weight: 500; -} - -.c37 { - font-weight: 200; - opacity: 0.8975; - padding-left: 1ch; -} - -.c54 { - float: left; - margin-left: -36px; - color: #fff; -} - -.c55 { - color: #676767; - margin-top: 3px; -} - -.c52 { - z-index: 30; - position: relative; -} - -.c47 { - margin-top: 5px; -} - -.c48 { - color: #676767; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; -} - -.c50 { - font-size: 14px; -} - -.c49 { - padding: 0; -} - -.c46 { - margin-top: 5px; -} - -.c46 a { - color: #337ab7; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c46 a:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c46 img { - margin-left: 5px; - vertical-align: middle; -} - -.c1 { - font-size: 16px; -} - -.c1 *:not(.fa) { - box-sizing: border-box; - font-family: Hind,sans-serif; -} - -.c1 .c43 { - background-color: rgb(15,106,172); - border-color: white; - border-image: initial; - border-radius: 12px; - border-style: solid; - border-width: 1px; - box-shadow: rgb(0,0,0) 0px 0px 0.25em; - color: white; - display: inline-block; - font-size: 14px; - font-weight: 500; - height: 24px; - line-height: 1.5; - margin-right: 8px; - min-width: 24px; - padding: 2px 3px; - text-align: center; -} - -.c1 .c4 { - display: table-cell; - max-width: 20px; - width: 20px; - padding: 0; - position: relative; -} - -.c1 .c13 { - color: #000; - font-size: 18px; - font-weight: 500; - line-height: 20px; -} - -.c1 .c15 { - height: inherit; - white-space: normal; -} - -.c1 .c2 { - width: 100%; -} - -.c1 .c53 { - margin-left: -23px; -} - -.c1 .c17 { - color: #676767; - display: table-cell; - font-size: 14px; - padding-right: 4px; - padding-top: 2px; - text-align: right; - vertical-align: top; - width: 60px; -} - -.c7 { - position: absolute; - width: 100%; - top: 3px; - z-index: 20; -} - -.c6 { - background: radial-gradient(ellipse at center,#87cefa 40%,transparent 10%); - background-position: center -5px; - background-repeat: repeat-y; - background-size: 12px 12px; - left: 6px; - right: 6px; - bottom: -11px; - position: absolute; - top: 11px; - z-index: 10; -} - -.c38 { - background-color: gray; - left: 5px; - right: 5px; - background-color: #0070c0; - bottom: -11px; - position: absolute; - top: 11px; - z-index: 10; -} - -.c56 { - background-color: gray; - left: 5px; - right: 5px; - background-color: #000088; - bottom: -11px; - position: absolute; - top: 11px; - z-index: 10; -} - -.c9 { - left: 0; - line-height: inherit; - position: absolute; - text-align: center; - width: 100%; -} - -.c10 { - top: 3px; -} - -.c12 { - left: 0; - position: absolute; - text-align: center; - width: 100%; -} - -
      -
    1. -
      -
      - - - - -
      -
      - - 47.97767, -122.20034 - -
      -
      - 12:57 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - - - - - - - - Walk 0.3 miles to - - Everett Station Bay C1 - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - SOUTH - on - - service road - - - 0.1 miles - - -
        -
        2. -
      2. -
        - - - -
        -
        - - RIGHT - on - - Smith Avenue - - - 129 feet - - -
        -
        3. -
      3. -
        - - - -
        -
        - - CONTINUE - on - - Paine Avenue - - - 61 feet - - -
        -
        4. -
      4. -
        - - - -
        -
        - - LEFT - on - - 32nd Street - - - 67 feet - - -
        -
        5. -
      5. -
        - - - -
        -
        - - RIGHT - on - - 32nd Street - - - 313 feet - - -
        -
        6. -
      6. -
        - - - -
        -
        - - LEFT - on - - Unnamed Path - - - 380 feet - - -
        -
        7. -
      -
      -
      -       -
      -
      -
      2. -
    2. -
      -
      - - - - -
      -
      - - Everett Station Bay C1 - -
      -
      - 1:04 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      - Stop ID 2345 - -
      -
      -
      - - - - - - Ride - - - - - - - - - - - - - - - 512 - - - - - Northgate Station - - - - - - - Disembark at - Northgate Station - - - - -
      -
      -
      - Service operated by - - Community Transit - -
      -
      -
      -
      -
      -
      - - -
      -
      -
      -
      -
        -
      1. -
        - • -
        -
        - Broadway & 34th St -
        -
        2. -
      2. -
        - • -
        -
        - South Everett Fwy Station Bay 3 -
        -
        3. -
      3. -
        - • -
        -
        - Ash Way Park & Ride Bay 1 -
        -
        4. -
      4. -
        - • -
        -
        - Lynnwood Transit Center Bay D3 -
        -
        5. -
      5. -
        - • -
        -
        - Mountlake Terrace Fwy Station Bay 6 -
        -
        6. -
      -
      -
      -
      -
      -
      -
      -
      -
      3. -
    3. -
      -
      - - - - -
      -
      - - Northgate Station - -
      -
      - 1:51 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      - Stop ID 2191 - -
      -
      -
      - - - - - - - - - - - - - - - Walk to - - Northgate Station - Bay 4 - - - - -
      - - - - -
      -
      -
        -
      -
      -       -
      -
      -
      4. -
    4. -
      -
      - - - - -
      -
      - - Northgate Station - Bay 4 - -
      -
      - 1:55 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      - Stop ID 35318 - -
      -
      -
      - - - - - - Ride - - - - - - - - - - - - - - - 40 - - - - - Downtown Seattle Ballard - - - - - - - Disembark at - N 105th St & Aurora Ave N - - - - -
      -
      -
      - Service operated by - - Metro Transit - -
      -
      -
      -
      -
      -
      - - -
      -
      -
      -
      -
        -
      1. -
        - • -
        -
        - 1st Ave NE & NE 95th St -
        -
        2. -
      2. -
        - • -
        -
        - N 92nd St & Corliss Ave N -
        -
        3. -
      3. -
        - • -
        -
        - College Way N & N 97th St -
        -
        4. -
      4. -
        - • -
        -
        - College Way N & N 103rd St -
        -
        5. -
      5. -
        - • -
        -
        - Meridian Ave N & N 105th St -
        -
        6. -
      6. -
        - • -
        -
        - N Northgate Way & Meridian Ave N -
        -
        7. -
      7. -
        - • -
        -
        - N Northgate Way & Stone Ave N -
        -
        8. -
      -
      -
      -
      -
      -
      -
      -
      -
      5. -
    5. -
      -
      - - - - -
      -
      - - N 105th St & Aurora Ave N - -
      -
      - 2:06 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      - Stop ID 40032 - -
      -
      -
      - - - - - - - - - - - - - - - Walk 259 feet to - - Aurora Ave N & N 105th St - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - EAST - on - - North 105th Street - - - 64 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - RIGHT - on - - service road - - - 14 feet - - -
        -
        3. -
      3. -
        - - - -
        -
        - - LEFT - on - - Unnamed Path - - - 180 feet - - -
        -
        4. -
      -
      -
      -       -
      -
      -
      6. -
    6. -
      -
      - - - - -
      -
      - - Aurora Ave N & N 105th St - -
      -
      - 2:07 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      - Stop ID 7080 - -
      -
      -
      - - - - - - Ride - - - - - - - - - - - - - - - E Line - - - - - Downtown Seattle - - - - - - - Disembark at - 3rd Ave & Cherry St - - - - -
      -
      -
      - Service operated by - - Metro Transit - -
      -
      -
      -
      -
      -
      - - -
      -
      -
      -
      -
        -
      1. -
        - • -
        -
        - Aurora Ave N & N 100th St -
        -
        2. -
      2. -
        - • -
        -
        - Aurora Ave N & N 95th St -
        -
        3. -
      3. -
        - • -
        -
        - Aurora Ave N & N 90th St -
        -
        4. -
      4. -
        - • -
        -
        - Aurora Ave N & N 85th St -
        -
        5. -
      5. -
        - • -
        -
        - Aurora Ave N & N 80th St -
        -
        6. -
      6. -
        - • -
        -
        - Aurora Ave N & N 76th St -
        -
        7. -
      7. -
        - • -
        -
        - Aurora Ave N & N 65th St -
        -
        8. -
      8. -
        - • -
        -
        - Aurora Ave N & N 46th St -
        -
        9. -
      9. -
        - • -
        -
        - Aurora Ave N & Lynn St -
        -
        10. -
      10. -
        - • -
        -
        - Aurora Ave N & Galer St -
        -
        11. -
      11. -
        - • -
        -
        - 7th Ave N & Thomas St -
        -
        12. -
      12. -
        - • -
        -
        - Wall St & 5th Ave -
        -
        13. -
      13. -
        - • -
        -
        - 3rd Ave & Bell St -
        -
        14. -
      14. -
        - • -
        -
        - 3rd Ave & Virginia St -
        -
        15. -
      15. -
        - • -
        -
        - 3rd Ave & Pike St -
        -
        16. -
      16. -
        - • -
        -
        - 3rd Ave & Seneca St -
        -
        17. -
      -
      -
      -
      -
      -
      -
      -
      -
      7. -
    7. -
      -
      - - - - -
      -
      - - 3rd Ave & Cherry St - -
      -
      - 2:39 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      - Stop ID 490 - -
      -
      -
      - - - - - - - - - - - - - - - Walk 443 feet to - - 208 James St, Seattle, WA 98104-2212, United States - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - SOUTHEAST - on - - sidewalk - - - 326 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - UTURN_RIGHT - on - - sidewalk - - - 117 feet - - -
        -
        3. -
      -
      -
      -       -
      -
      -
      8. -
    8. -
      - - - - -
      -
      - - 208 James St, Seattle, WA 98104-2212, United States - -
      -
      - 2:41 PM -
      - - Arrive at - 208 James St, Seattle, WA 98104-2212, United States - -
      -
      9. -
    -`; - -exports[`Storyshots ItineraryBody/otp-react-redux Zero Alerts Without Collapsing Prop 1`] = ` - - - -`; - -exports[`Storyshots ItineraryBody/otp-react-redux Zero Alerts Without Collapsing Prop 2`] = ` -.c8 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c11 { - color: #333; -} - -.c57 { - color: #f44256; -} - -.c26 { - background: transparent; - border: 0; - color: inherit; - cursor: pointer; - font-size: inherit; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c40 { - color: #008; - margin-left: 5px; -} - -.c40:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c41 { - padding-left: 0px; -} - -.c41:before { - content: "|"; - color: black; - margin-right: 5px; -} - -.c31::before { - content: ""; - margin: 0 0.125em; -} - -.c51 { - display: block; - font-size: 13px; - list-style: none; - padding: 0; -} - -.c0 { - list-style: none; - padding: 0; -} - -.c21 { - color: #676767; - font-size: 13px; - padding-bottom: 12px; -} - -.c27 { - bottom: 0; - cursor: pointer; - left: 0; - position: absolute; - right: 0; - top: 0; - width: 100%; - z-index: 1; -} - -.c22 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - line-height: 16px; - min-height: 31px; - position: relative; -} - -.c19 { - display: inline-block; - grid-row-start: 2; - grid-column-start: 1; - height: 0; - overflow: hidden; - width: 0; -} - -.c25 { - font-weight: inherit; -} - -.c45 { - font-size: 13px; - font-weight: 500; -} - -.c44 { - font-weight: 800; - margin-right: 6px; -} - -.c42 { - color: #807373; - margin-top: 5px; -} - -.c24 img, -.c24 svg { - margin-right: 6px; - height: 24px; - width: 24px; - vertical-align: bottom; -} - -.c23 { - -webkit-flex-shrink: 0; - -ms-flex-negative: 0; - flex-shrink: 0; -} - -.c5 { - grid-column-start: 2; - grid-row: span 2; - padding-right: 5px; -} - -.c28 { - display: grid; - grid-template-columns: 100px auto; -} - -.c3 { - max-width: 500px; - display: grid; - grid-template-columns: 65px 30px auto; -} - -.c18 { - grid-column-start: 1; - grid-row: 1 / span 2; - padding-right: 5px; - font-size: 0.9em; -} - -.c20 { - grid-row-start: 2; - grid-column-start: 3; -} - -.c14 { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - font-size: 1.2em; - grid-row-start: 1; - grid-column-start: 3; -} - -.c16 { - font-size: inherit; - font-weight: bold; - height: 1.2em; - margin: 0; - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; - -webkit-flex: 1 1 auto; - -ms-flex: 1 1 auto; - flex: 1 1 auto; - padding: 3px 0 10px 0; -} - -.c39 { - color: #807373; - font-size: 13px; - font-weight: 300; - padding-top: 1px; - margin-bottom: 10px; - margin-top: -14px; -} - -.c32 { - display: block; - list-style: none; - padding: 0; -} - -.c35 { - margin-left: 24px; - line-height: 1.25em; - padding-top: 1px; -} - -.c35 > span { - margin-right: 1ch; -} - -.c29 { - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - -webkit-align-self: center; - -ms-flex-item-align: center; - align-self: center; - margin-top: 10px; -} - -.c29 a { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; -} - -.c30 { - color: #676767; - font-size: 13px; - font-style: normal; - padding: 0; -} - -.c34 { - fill: #676767; - float: left; - height: 16px; - width: 16px; -} - -.c33 { - font-size: 13px; - margin-top: 8px; - color: #676767; - font-style: normal; -} - -.c36 { - font-weight: 500; -} - -.c37 { - font-weight: 200; - opacity: 0.8975; - padding-left: 1ch; -} - -.c54 { - float: left; - margin-left: -36px; - color: #fff; -} - -.c55 { - color: #676767; - margin-top: 3px; -} - -.c52 { - z-index: 30; - position: relative; -} - -.c47 { - margin-top: 5px; -} - -.c48 { - color: #676767; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; -} - -.c50 { - font-size: 14px; -} - -.c49 { - padding: 0; -} - -.c46 { - margin-top: 5px; -} - -.c46 a { - color: #337ab7; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c46 a:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c46 img { - margin-left: 5px; - vertical-align: middle; -} - -.c1 { - font-size: 16px; -} - -.c1 *:not(.fa) { - box-sizing: border-box; - font-family: Hind,sans-serif; -} - -.c1 .c43 { - background-color: rgb(15,106,172); - border-color: white; - border-image: initial; - border-radius: 12px; - border-style: solid; - border-width: 1px; - box-shadow: rgb(0,0,0) 0px 0px 0.25em; - color: white; - display: inline-block; - font-size: 14px; - font-weight: 500; - height: 24px; - line-height: 1.5; - margin-right: 8px; - min-width: 24px; - padding: 2px 3px; - text-align: center; -} - -.c1 .c4 { - display: table-cell; - max-width: 20px; - width: 20px; - padding: 0; - position: relative; -} - -.c1 .c13 { - color: #000; - font-size: 18px; - font-weight: 500; - line-height: 20px; -} - -.c1 .c15 { - height: inherit; - white-space: normal; -} - -.c1 .c2 { - width: 100%; -} - -.c1 .c53 { - margin-left: -23px; -} - -.c1 .c17 { - color: #676767; - display: table-cell; - font-size: 14px; - padding-right: 4px; - padding-top: 2px; - text-align: right; - vertical-align: top; - width: 60px; -} - -.c7 { - position: absolute; - width: 100%; - top: 3px; - z-index: 20; -} - -.c6 { - background: radial-gradient(ellipse at center,#87cefa 40%,transparent 10%); - background-position: center -5px; - background-repeat: repeat-y; - background-size: 12px 12px; - left: 6px; - right: 6px; - bottom: -11px; - position: absolute; - top: 11px; - z-index: 10; -} - -.c38 { - background-color: gray; - left: 5px; - right: 5px; - background-color: #0070c0; - bottom: -11px; - position: absolute; - top: 11px; - z-index: 10; -} - -.c56 { - background-color: gray; - left: 5px; - right: 5px; - background-color: #000088; - bottom: -11px; - position: absolute; - top: 11px; - z-index: 10; -} - -.c9 { - left: 0; - line-height: inherit; - position: absolute; - text-align: center; - width: 100%; -} - -.c10 { - top: 3px; -} - -.c12 { - left: 0; - position: absolute; - text-align: center; - width: 100%; -} - -
      -
    1. -
      -
      - - - - -
      -
      - - 47.97767, -122.20034 - -
      -
      - 12:57 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - - - - - - - - Walk 0.3 miles to - - Everett Station Bay C1 - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - SOUTH - on - - service road - - - 0.1 miles - - -
        -
        2. -
      2. -
        - - - -
        -
        - - RIGHT - on - - Smith Avenue - - - 129 feet - - -
        -
        3. -
      3. -
        - - - -
        -
        - - CONTINUE - on - - Paine Avenue - - - 61 feet - - -
        -
        4. -
      4. -
        - - - -
        -
        - - LEFT - on - - 32nd Street - - - 67 feet - - -
        -
        5. -
      5. -
        - - - -
        -
        - - RIGHT - on - - 32nd Street - - - 313 feet - - -
        -
        6. -
      6. -
        - - - -
        -
        - - LEFT - on - - Unnamed Path - - - 380 feet - - -
        -
        7. -
      -
      -
      -       -
      -
      -
      2. -
    2. -
      -
      - - - - -
      -
      - - Everett Station Bay C1 - -
      -
      - 1:04 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      - Stop ID 2345 - -
      -
      -
      - - - - - - Ride - - - - - - - - - - - - - - - 512 - - - - - Northgate Station - - - - - - - Disembark at - Northgate Station - - - - -
      -
      -
      - Service operated by - - Community Transit - -
      -
      -
      -
      -
      -
      - - -
      -
      -
      -
      -
        -
      1. -
        - • -
        -
        - Broadway & 34th St -
        -
        2. -
      2. -
        - • -
        -
        - South Everett Fwy Station Bay 3 -
        -
        3. -
      3. -
        - • -
        -
        - Ash Way Park & Ride Bay 1 -
        -
        4. -
      4. -
        - • -
        -
        - Lynnwood Transit Center Bay D3 -
        -
        5. -
      5. -
        - • -
        -
        - Mountlake Terrace Fwy Station Bay 6 -
        -
        6. -
      -
      -
      -
      -
      -
      -
      -
      -
      3. -
    3. -
      -
      - - - - -
      -
      - - Northgate Station - -
      -
      - 1:51 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      - Stop ID 2191 - -
      -
      -
      - - - - - - - - - - - - - - - Walk to - - Northgate Station - Bay 4 - - - - -
      - - - - -
      -
      -
        -
      -
      -       -
      -
      -
      4. -
    4. -
      -
      - - - - -
      -
      - - Northgate Station - Bay 4 - -
      -
      - 1:55 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      - Stop ID 35318 - -
      -
      -
      - - - - - - Ride - - - - - - - - - - - - - - - 40 - - - - - Downtown Seattle Ballard - - - - - - - Disembark at - N 105th St & Aurora Ave N - - - - -
      -
      -
      - Service operated by - - Metro Transit - -
      -
      -
      -
      -
      -
      - - -
      -
      -
      -
      -
        -
      1. -
        - • -
        -
        - 1st Ave NE & NE 95th St -
        -
        2. -
      2. -
        - • -
        -
        - N 92nd St & Corliss Ave N -
        -
        3. -
      3. -
        - • -
        -
        - College Way N & N 97th St -
        -
        4. -
      4. -
        - • -
        -
        - College Way N & N 103rd St -
        -
        5. -
      5. -
        - • -
        -
        - Meridian Ave N & N 105th St -
        -
        6. -
      6. -
        - • -
        -
        - N Northgate Way & Meridian Ave N -
        -
        7. -
      7. -
        - • -
        -
        - N Northgate Way & Stone Ave N -
        -
        8. -
      -
      -
      -
      -
      -
      -
      -
      -
      5. -
    5. -
      -
      - - - - -
      -
      - - N 105th St & Aurora Ave N - -
      -
      - 2:06 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      - Stop ID 40032 - -
      -
      -
      - - - - - - - - - - - - - - - Walk 259 feet to - - Aurora Ave N & N 105th St - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - EAST - on - - North 105th Street - - - 64 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - RIGHT - on - - service road - - - 14 feet - - -
        -
        3. -
      3. -
        - - - -
        -
        - - LEFT - on - - Unnamed Path - - - 180 feet - - -
        -
        4. -
      -
      -
      -       -
      -
      -
      6. -
    6. -
      -
      - - - - -
      -
      - - Aurora Ave N & N 105th St - -
      -
      - 2:07 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      - Stop ID 7080 - -
      -
      -
      - - - - - - Ride - - - - - - - - - - - - - - - E Line - - - - - Downtown Seattle - - - - - - - Disembark at - 3rd Ave & Cherry St - - - - -
      -
      -
      - Service operated by - - Metro Transit - -
      -
      -
      -
      -
      -
      - - -
      -
      -
      -
      -
        -
      1. -
        - • -
        -
        - Aurora Ave N & N 100th St -
        -
        2. -
      2. -
        - • -
        -
        - Aurora Ave N & N 95th St -
        -
        3. -
      3. -
        - • -
        -
        - Aurora Ave N & N 90th St -
        -
        4. -
      4. -
        - • -
        -
        - Aurora Ave N & N 85th St -
        -
        5. -
      5. -
        - • -
        -
        - Aurora Ave N & N 80th St -
        -
        6. -
      6. -
        - • -
        -
        - Aurora Ave N & N 76th St -
        -
        7. -
      7. -
        - • -
        -
        - Aurora Ave N & N 65th St -
        -
        8. -
      8. -
        - • -
        -
        - Aurora Ave N & N 46th St -
        -
        9. -
      9. -
        - • -
        -
        - Aurora Ave N & Lynn St -
        -
        10. -
      10. -
        - • -
        -
        - Aurora Ave N & Galer St -
        -
        11. -
      11. -
        - • -
        -
        - 7th Ave N & Thomas St -
        -
        12. -
      12. -
        - • -
        -
        - Wall St & 5th Ave -
        -
        13. -
      13. -
        - • -
        -
        - 3rd Ave & Bell St -
        -
        14. -
      14. -
        - • -
        -
        - 3rd Ave & Virginia St -
        -
        15. -
      15. -
        - • -
        -
        - 3rd Ave & Pike St -
        -
        16. -
      16. -
        - • -
        -
        - 3rd Ave & Seneca St -
        -
        17. -
      -
      -
      -
      -
      -
      -
      -
      -
      7. -
    7. -
      -
      - - - - -
      -
      - - 3rd Ave & Cherry St - -
      -
      - 2:39 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      - Stop ID 490 - -
      -
      -
      - - - - - - - - - - - - - - - Walk 443 feet to - - 208 James St, Seattle, WA 98104-2212, United States - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - SOUTHEAST - on - - sidewalk - - - 326 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - UTURN_RIGHT - on - - sidewalk - - - 117 feet - - -
        -
        3. -
      -
      -
      -       -
      -
      -
      8. -
    8. -
      - - - - -
      -
      - - 208 James St, Seattle, WA 98104-2212, United States - -
      -
      - 2:41 PM -
      - - Arrive at - 208 James St, Seattle, WA 98104-2212, United States - -
      -
      9. -
    -`; - -exports[`Storyshots ItineraryBody/otp-ui Bike Only Itinerary 1`] = ` - - - -`; - -exports[`Storyshots ItineraryBody/otp-ui Bike Only Itinerary 2`] = ` -.c22 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c40 { - color: #f44256; -} - -.c35 { - border-top-style: solid; - border-top-width: 0; - padding-top: 0; - padding-bottom: 10px; -} - -.c16 { - background: transparent; - border: 0; - color: inherit; - cursor: pointer; - font-size: inherit; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c37 { - color: #008; - margin-left: 5px; -} - -.c37:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c6 { - color: black; - background-color: red; - border: 2px solid #bbb; - text-align: center; - width: 25px; - height: 25px; - font-size: 1.2em; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; -} - -.c21::before { - content: ""; - margin: 0 0.125em; -} - -.c39 { - text-align: center; -} - -.c4 { - border-left: dotted 4px red; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c0 { - list-style: none; - padding: 0; -} - -.c12 { - color: #676767; - font-size: 13px; - padding-bottom: 12px; -} - -.c17 { - bottom: 0; - cursor: pointer; - left: 0; - position: absolute; - right: 0; - top: 0; - width: 100%; - z-index: 1; -} - -.c13 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - line-height: 16px; - min-height: 31px; - position: relative; -} - -.c10 { - display: inline-block; - grid-row-start: 2; - grid-column-start: 1; - height: 0; - overflow: hidden; - width: 0; -} - -.c15 { - font-weight: inherit; -} - -.c14 { - -webkit-flex-shrink: 0; - -ms-flex-negative: 0; - flex-shrink: 0; -} - -.c3 { - position: relative; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); - height: 100%; -} - -.c5 { - width: 30px; - height: 30px; - border-radius: 50%; - position: absolute; - left: 50%; - top: 0; - -webkit-transform: translate(-51%,-10%); - -ms-transform: translate(-51%,-10%); - transform: translate(-51%,-10%); -} - -.c2 { - grid-column-start: 2; - grid-row: span 2; - padding-right: 5px; -} - -.c18 { - display: grid; - grid-template-columns: 100px auto; -} - -.c1 { - max-width: 500px; - display: grid; - grid-template-columns: 65px 30px auto; -} - -.c29 { - border-color: #fff; - border-radius: 5px; - border-style: solid; - border-width: 1px; - display: inline-block; - font-style: normal; - grid-column: 2; - grid-row: 1; - margin: 0 4px; - position: relative; - text-align: center; - -webkit-text-decoration: none; - text-decoration: none; - vertical-align: middle; - width: 75%; -} - -.c29:hover { - border-color: #d1d5da; - background-color: #f6f8fa; -} - -.c9 { - grid-column-start: 1; - grid-row: 1 / span 2; - padding-right: 5px; - font-size: 0.9em; -} - -.c38 { - padding: 3px 10px 3px 10px; - border: 0; - margin-top: -15px; - width: 35px; - height: 35px; -} - -.c38:hover { - cursor: pointer; -} - -.c36 { - -webkit-flex: 0 0 25px; - -ms-flex: 0 0 25px; - flex: 0 0 25px; - grid-column: -1; -} - -.c11 { - grid-row-start: 2; - grid-column-start: 3; -} - -.c7 { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - font-size: 1.2em; - grid-row-start: 1; - grid-column-start: 3; -} - -.c8 { - font-size: inherit; - font-weight: bold; - height: 1.2em; - margin: 0; - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; - -webkit-flex: 1 1 auto; - -ms-flex: 1 1 auto; - flex: 1 1 auto; - padding: 3px 0 10px 0; -} - -.c30 { - padding: 2px; - width: 100%; -} - -.c32 { - font-size: xx-small; -} - -.c32::before { - content: ""; - margin: 0 0.125em; -} - -.c33 { - color: #e60000; -} - -.c34 { - color: green; -} - -.c31 { - font-size: small; -} - -.c23 { - display: block; - list-style: none; - padding: 0; -} - -.c26 { - margin-left: 24px; - line-height: 1.25em; - padding-top: 1px; -} - -.c26 > span { - margin-right: 1ch; -} - -.c19 { - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - -webkit-align-self: center; - -ms-flex-item-align: center; - align-self: center; - margin-top: 10px; -} - -.c19 a { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; -} - -.c20 { - color: #676767; - font-size: 13px; - font-style: normal; - padding: 0; -} - -.c25 { - fill: #676767; - float: left; - height: 16px; - width: 16px; -} - -.c24 { - font-size: 13px; - margin-top: 8px; - color: #676767; - font-style: normal; -} - -.c27 { - font-weight: 500; -} - -.c28 { - font-weight: 200; - opacity: 0.8975; - padding-left: 1ch; -} - -
      -
    1. -
      -
      -
      -
      -
      - - - Travel by bicycle - - - - -
      -
      -
      -
      -
      - - 503 SW Alder St, Portland, OR, USA 97204 - -
      -
      - 3:42 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Bicycle 0.7 miles to - - 1737 SW Morrison St, Portland, OR, USA 97205 - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - EAST - on - - SW Alder St - - - 87 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - RIGHT - on - - SW 5th Ave - - - 257 feet - - -
        -
        3. -
      3. -
        - - - -
        -
        - - RIGHT - on - - SW Morrison St - - - 0.6 miles - - -
        -
        4. -
      -
      -
      -
      - -
      -       -
      -
      -
      - -
      -
      2. -
    2. -
      -
      -
      -
      - -
      -
      -
      -
      -
      - - 1737 SW Morrison St, Portland, OR, USA 97205 - -
      -
      - 3:49 PM -
      - - Arrive at - 1737 SW Morrison St, Portland, OR, USA 97205 - -
      -
      - -
      -
      3. -
    -`; - -exports[`Storyshots ItineraryBody/otp-ui Bike Rental Itinerary 1`] = ` - - - -`; - -exports[`Storyshots ItineraryBody/otp-ui Bike Rental Itinerary 2`] = ` -.c22 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c43 { - color: #f44256; -} - -.c29 { - border-top-style: solid; - border-top-width: 0; - padding-top: 0; - padding-bottom: 10px; -} - -.c16 { - background: transparent; - border: 0; - color: inherit; - cursor: pointer; - font-size: inherit; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c31 { - color: #008; - margin-left: 5px; -} - -.c31:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c6 { - color: black; - background-color: #e9e9e9; - border: 2px solid #bbb; - text-align: center; - width: 25px; - height: 25px; - font-size: 1.2em; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; -} - -.c34 { - color: black; - background-color: red; - border: 2px solid #bbb; - text-align: center; - width: 25px; - height: 25px; - font-size: 1.2em; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; -} - -.c21::before { - content: ""; - margin: 0 0.125em; -} - -.c42 { - text-align: center; -} - -.c4 { - border-left: dotted 4px #484848; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c33 { - border-left: dotted 4px red; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c0 { - list-style: none; - padding: 0; -} - -.c12 { - color: #676767; - font-size: 13px; - padding-bottom: 12px; -} - -.c17 { - bottom: 0; - cursor: pointer; - left: 0; - position: absolute; - right: 0; - top: 0; - width: 100%; - z-index: 1; -} - -.c13 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - line-height: 16px; - min-height: 31px; - position: relative; -} - -.c10 { - display: inline-block; - grid-row-start: 2; - grid-column-start: 1; - height: 0; - overflow: hidden; - width: 0; -} - -.c15 { - font-weight: inherit; -} - -.c14 { - -webkit-flex-shrink: 0; - -ms-flex-negative: 0; - flex-shrink: 0; -} - -.c3 { - position: relative; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); - height: 100%; -} - -.c5 { - width: 30px; - height: 30px; - border-radius: 50%; - position: absolute; - left: 50%; - top: 0; - -webkit-transform: translate(-51%,-10%); - -ms-transform: translate(-51%,-10%); - transform: translate(-51%,-10%); -} - -.c2 { - grid-column-start: 2; - grid-row: span 2; - padding-right: 5px; -} - -.c18 { - display: grid; - grid-template-columns: 100px auto; -} - -.c1 { - max-width: 500px; - display: grid; - grid-template-columns: 65px 30px auto; -} - -.c36 { - border-color: #fff; - border-radius: 5px; - border-style: solid; - border-width: 1px; - display: inline-block; - font-style: normal; - grid-column: 2; - grid-row: 1; - margin: 0 4px; - position: relative; - text-align: center; - -webkit-text-decoration: none; - text-decoration: none; - vertical-align: middle; - width: 75%; -} - -.c36:hover { - border-color: #d1d5da; - background-color: #f6f8fa; -} - -.c9 { - grid-column-start: 1; - grid-row: 1 / span 2; - padding-right: 5px; - font-size: 0.9em; -} - -.c32 { - padding: 3px 10px 3px 10px; - border: 0; - margin-top: -15px; - width: 35px; - height: 35px; -} - -.c32:hover { - cursor: pointer; -} - -.c30 { - -webkit-flex: 0 0 25px; - -ms-flex: 0 0 25px; - flex: 0 0 25px; - grid-column: -1; -} - -.c11 { - grid-row-start: 2; - grid-column-start: 3; -} - -.c7 { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - font-size: 1.2em; - grid-row-start: 1; - grid-column-start: 3; -} - -.c8 { - font-size: inherit; - font-weight: bold; - height: 1.2em; - margin: 0; - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; - -webkit-flex: 1 1 auto; - -ms-flex: 1 1 auto; - flex: 1 1 auto; - padding: 3px 0 10px 0; -} - -.c35 { - color: #807373; - font-size: 13px; - font-weight: 300; - padding-top: 1px; - margin-bottom: 10px; - margin-top: -14px; -} - -.c37 { - padding: 2px; - width: 100%; -} - -.c39 { - font-size: xx-small; -} - -.c39::before { - content: ""; - margin: 0 0.125em; -} - -.c40 { - color: #e60000; -} - -.c41 { - color: green; -} - -.c38 { - font-size: small; -} - -.c23 { - display: block; - list-style: none; - padding: 0; -} - -.c26 { - margin-left: 24px; - line-height: 1.25em; - padding-top: 1px; -} - -.c26 > span { - margin-right: 1ch; -} - -.c19 { - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - -webkit-align-self: center; - -ms-flex-item-align: center; - align-self: center; - margin-top: 10px; -} - -.c19 a { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; -} - -.c20 { - color: #676767; - font-size: 13px; - font-style: normal; - padding: 0; -} - -.c25 { - fill: #676767; - float: left; - height: 16px; - width: 16px; -} - -.c24 { - font-size: 13px; - margin-top: 8px; - color: #676767; - font-style: normal; -} - -.c27 { - font-weight: 500; -} - -.c28 { - font-weight: 200; - opacity: 0.8975; - padding-left: 1ch; -} - -
      -
    1. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - 2624 SE 30th Ave, Portland, OR, USA 97202 - -
      -
      - 3:45 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 498 feet to - - SE 30th at Division - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - WEST - on - - SE Clinton St - - - 79 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - RIGHT - on - - SE 30th Ave - - - 419 feet - - -
        -
        3. -
      -
      -
      -       -
      -
      -
      - -
      -
      2. -
    2. -
      -
      -
      -
      -
      - - - Travel by bicycle - - - - - - - - - - -
      -
      -
      -
      -
      - - SE 30th at Division - -
      -
      - 3:48 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      - Pick up - shared bike - -
      -
      -
      - - - - - - - - Bicycle 0.6 miles to - - SE 29th at Hawthorne - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - CONTINUE - on - - SE 30th Ave - - - 0.3 miles - - -
        -
        2. -
      2. -
        - - - -
        -
        - - LEFT - on - - SE Harrison St - - - 361 feet - - -
        -
        3. -
      3. -
        - - - -
        -
        - - RIGHT - on - - SE 29th Ave - - - 0.2 miles - - -
        -
        4. -
      4. -
        - - - -
        -
        - - LEFT - on - - SE Hawthorne Blvd - - - 50 feet - - -
        -
        5. -
      -
      -
      -
      - -
      -       -
      -
      -
      - -
      -
      3. -
    3. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - SE 29th at Hawthorne - -
      -
      - 3:55 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 0.1 miles to - - 1415 SE 28th Ave, Portland, OR, USA 97214 - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - CONTINUE - on - - SE Hawthorne Blvd - - - 210 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - RIGHT - on - - SE 28th Ave - - - 295 feet - - -
        -
        3. -
      3. -
        - - - -
        -
        - - LEFT - on - - SE Madison St - - - 114 feet - - -
        -
        4. -
      -
      -
      -       -
      -
      -
      - -
      -
      4. -
    4. -
      -
      -
      -
      - -
      -
      -
      -
      -
      - - 1415 SE 28th Ave, Portland, OR, USA 97214 - -
      -
      - 3:58 PM -
      - - Arrive at - 1415 SE 28th Ave, Portland, OR, USA 97214 - -
      -
      - -
      -
      5. -
    -`; - -exports[`Storyshots ItineraryBody/otp-ui Bike Rental Transit Itinerary 1`] = ` - - - -`; - -exports[`Storyshots ItineraryBody/otp-ui Bike Rental Transit Itinerary 2`] = ` -.c22 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c66 { - color: #f44256; -} - -.c29 { - border-top-style: solid; - border-top-width: 0; - padding-top: 0; - padding-bottom: 10px; -} - -.c16 { - background: transparent; - border: 0; - color: inherit; - cursor: pointer; - font-size: inherit; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c31 { - color: #008; - margin-left: 5px; -} - -.c31:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c6 { - color: black; - background-color: #e9e9e9; - border: 2px solid #bbb; - text-align: center; - width: 25px; - height: 25px; - font-size: 1.2em; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; -} - -.c34 { - color: black; - background-color: red; - border: 2px solid #bbb; - text-align: center; - width: 25px; - height: 25px; - font-size: 1.2em; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; -} - -.c21::before { - content: ""; - margin: 0 0.125em; -} - -.c65 { - text-align: center; -} - -.c4 { - border-left: dotted 4px #484848; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c33 { - border-left: dotted 4px red; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c42 { - border-left: solid 8px #008ab0; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c61 { - display: block; - font-size: 13px; - list-style: none; - padding: 0; -} - -.c0 { - list-style: none; - padding: 0; -} - -.c12 { - color: #676767; - font-size: 13px; - padding-bottom: 12px; -} - -.c17 { - bottom: 0; - cursor: pointer; - left: 0; - position: absolute; - right: 0; - top: 0; - width: 100%; - z-index: 1; -} - -.c13 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - line-height: 16px; - min-height: 31px; - position: relative; -} - -.c10 { - display: inline-block; - grid-row-start: 2; - grid-column-start: 1; - height: 0; - overflow: hidden; - width: 0; -} - -.c49 { - font-weight: 200; -} - -.c15 { - font-weight: inherit; -} - -.c48 { - font-size: 13px; - font-weight: 500; -} - -.c47 { - font-weight: 800; - margin-right: 6px; -} - -.c46 { - color: #807373; - margin-top: 5px; -} - -.c14 { - -webkit-flex-shrink: 0; - -ms-flex-negative: 0; - flex-shrink: 0; -} - -.c3 { - position: relative; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); - height: 100%; -} - -.c5 { - width: 30px; - height: 30px; - border-radius: 50%; - position: absolute; - left: 50%; - top: 0; - -webkit-transform: translate(-51%,-10%); - -ms-transform: translate(-51%,-10%); - transform: translate(-51%,-10%); -} - -.c2 { - grid-column-start: 2; - grid-row: span 2; - padding-right: 5px; -} - -.c18 { - display: grid; - grid-template-columns: 100px auto; -} - -.c1 { - max-width: 500px; - display: grid; - grid-template-columns: 65px 30px auto; -} - -.c36 { - border-color: #fff; - border-radius: 5px; - border-style: solid; - border-width: 1px; - display: inline-block; - font-style: normal; - grid-column: 2; - grid-row: 1; - margin: 0 4px; - position: relative; - text-align: center; - -webkit-text-decoration: none; - text-decoration: none; - vertical-align: middle; - width: 75%; -} - -.c36:hover { - border-color: #d1d5da; - background-color: #f6f8fa; -} - -.c9 { - grid-column-start: 1; - grid-row: 1 / span 2; - padding-right: 5px; - font-size: 0.9em; -} - -.c32 { - padding: 3px 10px 3px 10px; - border: 0; - margin-top: -15px; - width: 35px; - height: 35px; -} - -.c32:hover { - cursor: pointer; -} - -.c30 { - -webkit-flex: 0 0 25px; - -ms-flex: 0 0 25px; - flex: 0 0 25px; - grid-column: -1; -} - -.c11 { - grid-row-start: 2; - grid-column-start: 3; -} - -.c7 { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - font-size: 1.2em; - grid-row-start: 1; - grid-column-start: 3; -} - -.c8 { - font-size: inherit; - font-weight: bold; - height: 1.2em; - margin: 0; - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; - -webkit-flex: 1 1 auto; - -ms-flex: 1 1 auto; - flex: 1 1 auto; - padding: 3px 0 10px 0; -} - -.c35 { - color: #807373; - font-size: 13px; - font-weight: 300; - padding-top: 1px; - margin-bottom: 10px; - margin-top: -14px; -} - -.c37 { - padding: 2px; - width: 100%; -} - -.c39 { - font-size: xx-small; -} - -.c39::before { - content: ""; - margin: 0 0.125em; -} - -.c40 { - color: #e60000; -} - -.c41 { - color: green; -} - -.c38 { - font-size: small; -} - -.c43 { - text-align: center; - min-width: 30px; - min-height: 30px; - font-size: 1.2em; - background-color: #084c8d; - color: white; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; - border: 1px solid; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - cursor: default; -} - -.c44 { - position: absolute; - width: 1px; - height: 1px; - padding: 0; - margin: -1px; - overflow: hidden; - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - border: 0; -} - -.c23 { - display: block; - list-style: none; - padding: 0; -} - -.c26 { - margin-left: 24px; - line-height: 1.25em; - padding-top: 1px; -} - -.c26 > span { - margin-right: 1ch; -} - -.c19 { - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - -webkit-align-self: center; - -ms-flex-item-align: center; - align-self: center; - margin-top: 10px; -} - -.c19 a { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; -} - -.c20 { - color: #676767; - font-size: 13px; - font-style: normal; - padding: 0; -} - -.c25 { - fill: #676767; - float: left; - height: 16px; - width: 16px; -} - -.c24 { - font-size: 13px; - margin-top: 8px; - color: #676767; - font-style: normal; -} - -.c27 { - font-weight: 500; -} - -.c28 { - font-weight: 200; - opacity: 0.8975; - padding-left: 1ch; -} - -.c45 { - font-weight: 200; - font-size: 0.9em; - margin-left: 10px; -} - -.c63 { - float: left; - margin-left: -36px; - color: #fff; -} - -.c64 { - color: #676767; - margin-top: 3px; -} - -.c62 { - z-index: 30; - position: relative; -} - -.c52 { - background-color: #eee; - border-radius: 4px; - color: #000; - display: block; - margin-top: 5px; - padding: 8px; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c56 { - -webkit-align-items: baseline; - -webkit-box-align: baseline; - -ms-flex-align: baseline; - align-items: baseline; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - gap: 5px; - margin-top: 0.5em; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c56:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c54 { - font-size: 12px; - margin-left: 30px; - white-space: pre-wrap; -} - -.c55 { - margin-top: 5px; - margin-left: 30px; - font-size: 12px; - font-style: italic; -} - -.c53 { - float: left; - font-size: 18px; -} - -.c51 { - display: block; - margin-top: 3px; - padding: 0; -} - -.c50 { - color: #d14727; - cursor: auto; - display: inline-block; - font-weight: 400; - margin-top: 8px; - padding: 0; -} - -.c57 { - margin-top: 5px; -} - -.c58 { - color: #676767; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; -} - -.c60 { - font-size: 14px; -} - -.c59 { - padding: 0; -} - -
      -
    1. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - 2943 SE Washington St, Portland, OR, USA 97214 - -
      -
      - 3:50 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 400 feet to - - SE 29th at Stark - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - NORTH - on - - SE 30th Ave - - - 103 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - RIGHT - on - - SE Stark St - - - 277 feet - - -
        -
        3. -
      3. -
        - - - -
        -
        - - RIGHT - on - - SE 29th Ave - - - 19 feet - - -
        -
        4. -
      -
      -
      -       -
      -
      -
      - -
      -
      2. -
    2. -
      -
      -
      -
      -
      - - - Travel by bicycle - - - - - - - - - - -
      -
      -
      -
      -
      - - SE 29th at Stark - -
      -
      - 3:53 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      - Pick up - shared bike - -
      -
      -
      - - - - - - - - Bicycle 0.8 miles to - - NE Glisan at 24th - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - CONTINUE - on - - SE 29th Ave - - - 492 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - LEFT - on - - SE Pine St - - - 358 feet - - -
        -
        3. -
      3. -
        - - - -
        -
        - - RIGHT - on - - SE 28th Ave - - - 518 feet - - -
        -
        4. -
      4. -
        - - - -
        -
        - - LEFT - on - - SE Ankeny St - - - 0.2 miles - - -
        -
        5. -
      5. -
        - - - -
        -
        - - RIGHT - on - - SE 24th Ave - - - 259 feet - - -
        -
        6. -
      6. -
        - - - -
        -
        - - CONTINUE - on - - NE 24th Ave - - - 0.2 miles - - -
        -
        7. -
      7. -
        - - - -
        -
        - - LEFT - on - - NE Glisan St - - - 57 feet - - -
        -
        8. -
      -
      -
      -
      - -
      -       -
      -
      -
      - -
      -
      3. -
    3. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - NE Glisan at 24th - -
      -
      - 3:59 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 497 feet to - - NE Sandy & 24th - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - HARD_LEFT - on - - NE Glisan St - - - 57 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - LEFT - on - - NE 24th Ave - - - 382 feet - - -
        -
        3. -
      3. -
        - - - -
        -
        - - RIGHT - on - - NE Sandy Blvd - - - 58 feet - - -
        -
        4. -
      -
      -
      -       -
      -
      -
      - -
      -
      4. -
    4. -
      -
      -
      -
      -
      - - 12 - - - Barbur/Sandy Blvd - -
      -
      -
      -
      -
      - - NE Sandy & 24th - - ID 5066 - - -
      -
      - 4:02 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - Ride - - -
      - - 12 - -
      - - - Barbur/Sandy Blvd - - to - - Parkrose TC - - -       - - - - Disembark at - NE Sandy & 57th - - ID 5104 - - -       - -       -
      -
      -
      - - - 2 alerts -
      -
      -
      - -
      -
      -
      -
      - -
      -
      -
      -
      -
        -
      1. -
        - • -
        -
        - NE Sandy & Lawrence -
        -
        2. -
      2. -
        - • -
        -
        - NE Sandy & 28th -
        -
        3. -
      3. -
        - • -
        -
        - NE Sandy & 31st -
        -
        4. -
      4. -
        - • -
        -
        - NE Sandy & 33rd -
        -
        5. -
      5. -
        - • -
        -
        - NE Sandy & Imperial -
        -
        6. -
      6. -
        - • -
        -
        - NE Sandy & 38th -
        -
        7. -
      7. -
        - • -
        -
        - NE Sandy & 42nd -
        -
        8. -
      8. -
        - • -
        -
        - NE Sandy & 44th -
        -
        9. -
      9. -
        - • -
        -
        - NE Sandy & 48th -
        -
        10. -
      10. -
        - • -
        -
        - NE Sandy & 50th -
        -
        11. -
      11. -
        - • -
        -
        - NE Sandy & Sacramento -
        -
        12. -
      12. -
        - • -
        -
        - NE Sandy & 54th -
        -
        13. -
      -
      -
      -
      -
      -
      -
      -
      -
      - -
      -
      5. -
    5. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - NE Sandy & 57th - - ID 5104 - - -
      -
      - 4:14 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 279 feet to - - 0086 BIKETOWN - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - NORTHEAST - on - - NE Sandy Blvd - - - 75 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - HARD_LEFT - on - - NE Alameda St - - - 203 feet - - -
        -
        3. -
      -
      -
      -       -
      -
      -
      - -
      -
      6. -
    6. -
      -
      -
      -
      -
      - - - Travel by bicycle - - - - - - - - - - -
      -
      -
      -
      -
      - - 0086 BIKETOWN - -
      -
      - 4:16 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      - Pick up - shared bike - -
      -
      -
      - - - - - - - - Bicycle 1 mile to - - NE 60th at Cully - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - HARD_LEFT - on - - NE Alameda St - - - 203 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - HARD_LEFT - on - - NE 57th Ave - - - 0.6 miles - - -
        -
        3. -
      3. -
        - - - -
        -
        - - CONTINUE - on - - NE Cully Blvd - - - 0.3 miles - - -
        -
        4. -
      4. -
        - - - -
        -
        - - LEFT - on - - NE 60th Ave - - - 171 feet - - -
        -
        5. -
      -
      -
      -
      - -
      -       -
      -
      -
      - -
      -
      7. -
    7. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - NE 60th at Cully - -
      -
      - 4:24 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 494 feet to - - 5916 NE Going St, Portland, OR, USA 97218 - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - CONTINUE - on - - NE 60th Ave - - - 270 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - LEFT - on - - NE Going St - - - 225 feet - - -
        -
        3. -
      -
      -
      -       -
      -
      -
      - -
      -
      8. -
    8. -
      -
      -
      -
      - -
      -
      -
      -
      -
      - - 5916 NE Going St, Portland, OR, USA 97218 - -
      -
      - 4:26 PM -
      - - Arrive at - 5916 NE Going St, Portland, OR, USA 97218 - -
      -
      - -
      -
      9. -
    -`; - -exports[`Storyshots ItineraryBody/otp-ui Bike Transit Bike Itinerary 1`] = ` - - - -`; - -exports[`Storyshots ItineraryBody/otp-ui Bike Transit Bike Itinerary 2`] = ` -.c22 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c59 { - color: #f44256; -} - -.c29 { - border-top-style: solid; - border-top-width: 0; - padding-top: 0; - padding-bottom: 10px; -} - -.c16 { - background: transparent; - border: 0; - color: inherit; - cursor: pointer; - font-size: inherit; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c31 { - color: #008; - margin-left: 5px; -} - -.c31:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c6 { - color: black; - background-color: #e9e9e9; - border: 2px solid #bbb; - text-align: center; - width: 25px; - height: 25px; - font-size: 1.2em; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; -} - -.c34 { - color: black; - background-color: red; - border: 2px solid #bbb; - text-align: center; - width: 25px; - height: 25px; - font-size: 1.2em; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; -} - -.c21::before { - content: ""; - margin: 0 0.125em; -} - -.c58 { - text-align: center; -} - -.c4 { - border-left: dotted 4px #484848; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c33 { - border-left: dotted 4px red; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c35 { - border-left: solid 8px #084C8D; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c54 { - display: block; - font-size: 13px; - list-style: none; - padding: 0; -} - -.c0 { - list-style: none; - padding: 0; -} - -.c12 { - color: #676767; - font-size: 13px; - padding-bottom: 12px; -} - -.c17 { - bottom: 0; - cursor: pointer; - left: 0; - position: absolute; - right: 0; - top: 0; - width: 100%; - z-index: 1; -} - -.c13 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - line-height: 16px; - min-height: 31px; - position: relative; -} - -.c10 { - display: inline-block; - grid-row-start: 2; - grid-column-start: 1; - height: 0; - overflow: hidden; - width: 0; -} - -.c42 { - font-weight: 200; -} - -.c15 { - font-weight: inherit; -} - -.c41 { - font-size: 13px; - font-weight: 500; -} - -.c40 { - font-weight: 800; - margin-right: 6px; -} - -.c39 { - color: #807373; - margin-top: 5px; -} - -.c14 { - -webkit-flex-shrink: 0; - -ms-flex-negative: 0; - flex-shrink: 0; -} - -.c3 { - position: relative; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); - height: 100%; -} - -.c5 { - width: 30px; - height: 30px; - border-radius: 50%; - position: absolute; - left: 50%; - top: 0; - -webkit-transform: translate(-51%,-10%); - -ms-transform: translate(-51%,-10%); - transform: translate(-51%,-10%); -} - -.c2 { - grid-column-start: 2; - grid-row: span 2; - padding-right: 5px; -} - -.c18 { - display: grid; - grid-template-columns: 100px auto; -} - -.c1 { - max-width: 500px; - display: grid; - grid-template-columns: 65px 30px auto; -} - -.c9 { - grid-column-start: 1; - grid-row: 1 / span 2; - padding-right: 5px; - font-size: 0.9em; -} - -.c32 { - padding: 3px 10px 3px 10px; - border: 0; - margin-top: -15px; - width: 35px; - height: 35px; -} - -.c32:hover { - cursor: pointer; -} - -.c30 { - -webkit-flex: 0 0 25px; - -ms-flex: 0 0 25px; - flex: 0 0 25px; - grid-column: -1; -} - -.c11 { - grid-row-start: 2; - grid-column-start: 3; -} - -.c7 { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - font-size: 1.2em; - grid-row-start: 1; - grid-column-start: 3; -} - -.c8 { - font-size: inherit; - font-weight: bold; - height: 1.2em; - margin: 0; - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; - -webkit-flex: 1 1 auto; - -ms-flex: 1 1 auto; - flex: 1 1 auto; - padding: 3px 0 10px 0; -} - -.c36 { - text-align: center; - min-width: 30px; - min-height: 30px; - font-size: 1.2em; - background-color: #084C8D; - color: white; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; - border: 1px solid; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - cursor: default; -} - -.c37 { - position: absolute; - width: 1px; - height: 1px; - padding: 0; - margin: -1px; - overflow: hidden; - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - border: 0; -} - -.c23 { - display: block; - list-style: none; - padding: 0; -} - -.c26 { - margin-left: 24px; - line-height: 1.25em; - padding-top: 1px; -} - -.c26 > span { - margin-right: 1ch; -} - -.c19 { - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - -webkit-align-self: center; - -ms-flex-item-align: center; - align-self: center; - margin-top: 10px; -} - -.c19 a { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; -} - -.c20 { - color: #676767; - font-size: 13px; - font-style: normal; - padding: 0; -} - -.c25 { - fill: #676767; - float: left; - height: 16px; - width: 16px; -} - -.c24 { - font-size: 13px; - margin-top: 8px; - color: #676767; - font-style: normal; -} - -.c27 { - font-weight: 500; -} - -.c28 { - font-weight: 200; - opacity: 0.8975; - padding-left: 1ch; -} - -.c38 { - font-weight: 200; - font-size: 0.9em; - margin-left: 10px; -} - -.c56 { - float: left; - margin-left: -36px; - color: #fff; -} - -.c57 { - color: #676767; - margin-top: 3px; -} - -.c55 { - z-index: 30; - position: relative; -} - -.c45 { - background-color: #eee; - border-radius: 4px; - color: #000; - display: block; - margin-top: 5px; - padding: 8px; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c49 { - -webkit-align-items: baseline; - -webkit-box-align: baseline; - -ms-flex-align: baseline; - align-items: baseline; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - gap: 5px; - margin-top: 0.5em; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c49:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c47 { - font-size: 12px; - margin-left: 30px; - white-space: pre-wrap; -} - -.c48 { - margin-top: 5px; - margin-left: 30px; - font-size: 12px; - font-style: italic; -} - -.c46 { - float: left; - font-size: 18px; -} - -.c44 { - display: block; - margin-top: 3px; - padding: 0; -} - -.c43 { - color: #d14727; - cursor: auto; - display: inline-block; - font-weight: 400; - margin-top: 8px; - padding: 0; -} - -.c50 { - margin-top: 5px; -} - -.c51 { - color: #676767; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; -} - -.c53 { - font-size: 14px; -} - -.c52 { - padding: 0; -} - -
      -
    1. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - KGW Studio on the Sq, Portland, OR, USA - -
      -
      - 3:44 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 91 feet to - - corner of path and Pioneer Courthouse Sq (pedestrian street) - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - SOUTHEAST - on - - Unnamed Path - - - 91 feet - - -
        -
        2. -
      -
      -
      -       -
      -
      -
      - -
      -
      2. -
    2. -
      -
      -
      -
      -
      - - - Travel by bicycle - - - - -
      -
      -
      -
      -
      - - corner of path and Pioneer Courthouse Sq (pedestrian street) - -
      -
      - 3:44 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Bicycle 0.1 miles to - - corner of path and Pioneer Sq N (path) - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - LEFT - on - - Unnamed Path - - - 20 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - LEFT - on - - SW 6th Ave - - - 245 feet - - -
        -
        3. -
      3. -
        - - - -
        -
        - - LEFT - on - - SW Morrison St - - - 241 feet - - -
        -
        4. -
      4. -
        - - - -
        -
        - - LEFT - on - - Unnamed Path - - - 27 feet - - -
        -
        5. -
      -
      -
      -       -
      -
      -
      - -
      -
      3. -
    3. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - corner of path and Pioneer Sq N (path) - -
      -
      - 3:45 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 22 feet to - - Pioneer Square North MAX Station - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - LEFT - on - - Pioneer Sq N (path) - - - 22 feet - - -
        -
        2. -
      -
      -
      -       -
      -
      -
      - -
      -
      4. -
    4. -
      -
      -
      -
      -
      - - MA - - - MAX Blue Line - -
      -
      -
      -
      -
      - - Pioneer Square North MAX Station - - ID 8383 - - -
      -
      - 3:46 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - Ride - - -
      - - MAX Blue Line - -
      - - - MAX Blue Line - - to - - Hillsboro - - -       - - - - Disembark at - Providence Park MAX Station - - ID 9757 - - -       - -       -
      -
      -
      - - - 2 alerts -
      -
      -
      - -
      -
      -
      -
      - -
      -
      -
      -
      -
        -
      1. -
        - • -
        -
        - Galleria/SW 10th Ave MAX Station -
        -
        2. -
      -
      -
      -
      -
      -
      -
      -
      -
      - -
      -
      5. -
    5. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - Providence Park MAX Station - - ID 9757 - - -
      -
      - 3:49 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 19 feet to - - corner of path and Providence Park (path) - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - WEST - on - - Providence Park (path) - - - 19 feet - - -
        -
        2. -
      -
      -
      -       -
      -
      -
      - -
      -
      6. -
    6. -
      -
      -
      -
      -
      - - - Travel by bicycle - - - - -
      -
      -
      -
      -
      - - corner of path and Providence Park (path) - -
      -
      - 3:49 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Bicycle 230 feet to - - 1737 SW Morrison St, Portland, OR, USA 97205 - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - RIGHT - on - - Unnamed Path - - - 104 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - RIGHT - on - - Unnamed Path - - - 27 feet - - -
        -
        3. -
      3. -
        - - - -
        -
        - - RIGHT - on - - SW Morrison St - - - 99 feet - - -
        -
        4. -
      -
      -
      -       -
      -
      -
      - -
      -
      7. -
    7. -
      -
      -
      -
      - -
      -
      -
      -
      -
      - - 1737 SW Morrison St, Portland, OR, USA 97205 - -
      -
      - 3:50 PM -
      - - Arrive at - 1737 SW Morrison St, Portland, OR, USA 97205 - -
      -
      - -
      -
      8. -
    -`; - -exports[`Storyshots ItineraryBody/otp-ui Custom Alert Icons Itinerary 1`] = ` - - - -`; - -exports[`Storyshots ItineraryBody/otp-ui Custom Alert Icons Itinerary 2`] = ` -.c22 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c57 { - color: #f44256; -} - -.c29 { - border-top-style: solid; - border-top-width: 0; - padding-top: 0; - padding-bottom: 10px; -} - -.c16 { - background: transparent; - border: 0; - color: inherit; - cursor: pointer; - font-size: inherit; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c31 { - color: #008; - margin-left: 5px; -} - -.c31:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c6 { - color: black; - background-color: #e9e9e9; - border: 2px solid #bbb; - text-align: center; - width: 25px; - height: 25px; - font-size: 1.2em; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; -} - -.c21::before { - content: ""; - margin: 0 0.125em; -} - -.c56 { - text-align: center; -} - -.c4 { - border-left: dotted 4px #484848; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c33 { - border-left: solid 8px #084C8D; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c52 { - display: block; - font-size: 13px; - list-style: none; - padding: 0; -} - -.c0 { - list-style: none; - padding: 0; -} - -.c12 { - color: #676767; - font-size: 13px; - padding-bottom: 12px; -} - -.c17 { - bottom: 0; - cursor: pointer; - left: 0; - position: absolute; - right: 0; - top: 0; - width: 100%; - z-index: 1; -} - -.c13 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - line-height: 16px; - min-height: 31px; - position: relative; -} - -.c10 { - display: inline-block; - grid-row-start: 2; - grid-column-start: 1; - height: 0; - overflow: hidden; - width: 0; -} - -.c40 { - font-weight: 200; -} - -.c15 { - font-weight: inherit; -} - -.c39 { - font-size: 13px; - font-weight: 500; -} - -.c38 { - font-weight: 800; - margin-right: 6px; -} - -.c37 { - color: #807373; - margin-top: 5px; -} - -.c14 { - -webkit-flex-shrink: 0; - -ms-flex-negative: 0; - flex-shrink: 0; -} - -.c3 { - position: relative; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); - height: 100%; -} - -.c5 { - width: 30px; - height: 30px; - border-radius: 50%; - position: absolute; - left: 50%; - top: 0; - -webkit-transform: translate(-51%,-10%); - -ms-transform: translate(-51%,-10%); - transform: translate(-51%,-10%); -} - -.c2 { - grid-column-start: 2; - grid-row: span 2; - padding-right: 5px; -} - -.c18 { - display: grid; - grid-template-columns: 100px auto; -} - -.c1 { - max-width: 500px; - display: grid; - grid-template-columns: 65px 30px auto; -} - -.c9 { - grid-column-start: 1; - grid-row: 1 / span 2; - padding-right: 5px; - font-size: 0.9em; -} - -.c32 { - padding: 3px 10px 3px 10px; - border: 0; - margin-top: -15px; - width: 35px; - height: 35px; -} - -.c32:hover { - cursor: pointer; -} - -.c30 { - -webkit-flex: 0 0 25px; - -ms-flex: 0 0 25px; - flex: 0 0 25px; - grid-column: -1; -} - -.c11 { - grid-row-start: 2; - grid-column-start: 3; -} - -.c7 { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - font-size: 1.2em; - grid-row-start: 1; - grid-column-start: 3; -} - -.c8 { - font-size: inherit; - font-weight: bold; - height: 1.2em; - margin: 0; - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; - -webkit-flex: 1 1 auto; - -ms-flex: 1 1 auto; - flex: 1 1 auto; - padding: 3px 0 10px 0; -} - -.c34 { - text-align: center; - min-width: 30px; - min-height: 30px; - font-size: 1.2em; - background-color: #084C8D; - color: white; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; - border: 1px solid; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - cursor: default; -} - -.c35 { - position: absolute; - width: 1px; - height: 1px; - padding: 0; - margin: -1px; - overflow: hidden; - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - border: 0; -} - -.c23 { - display: block; - list-style: none; - padding: 0; -} - -.c26 { - margin-left: 24px; - line-height: 1.25em; - padding-top: 1px; -} - -.c26 > span { - margin-right: 1ch; -} - -.c19 { - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - -webkit-align-self: center; - -ms-flex-item-align: center; - align-self: center; - margin-top: 10px; -} - -.c19 a { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; -} - -.c20 { - color: #676767; - font-size: 13px; - font-style: normal; - padding: 0; -} - -.c25 { - fill: #676767; - float: left; - height: 16px; - width: 16px; -} - -.c24 { - font-size: 13px; - margin-top: 8px; - color: #676767; - font-style: normal; -} - -.c27 { - font-weight: 500; -} - -.c28 { - font-weight: 200; - opacity: 0.8975; - padding-left: 1ch; -} - -.c36 { - font-weight: 200; - font-size: 0.9em; - margin-left: 10px; -} - -.c54 { - float: left; - margin-left: -36px; - color: #fff; -} - -.c55 { - color: #676767; - margin-top: 3px; -} - -.c53 { - z-index: 30; - position: relative; -} - -.c43 { - background-color: #eee; - border-radius: 4px; - color: #000; - display: block; - margin-top: 5px; - padding: 8px; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c47 { - -webkit-align-items: baseline; - -webkit-box-align: baseline; - -ms-flex-align: baseline; - align-items: baseline; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - gap: 5px; - margin-top: 0.5em; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c47:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c45 { - font-size: 12px; - margin-left: 30px; - white-space: pre-wrap; -} - -.c46 { - margin-top: 5px; - margin-left: 30px; - font-size: 12px; - font-style: italic; -} - -.c44 { - float: left; - font-size: 18px; -} - -.c42 { - display: block; - margin-top: 3px; - padding: 0; -} - -.c41 { - color: #d14727; - cursor: cursor; - display: inline-block; - font-weight: 400; - margin-top: 8px; - padding: 0; -} - -.c48 { - margin-top: 5px; -} - -.c49 { - color: #676767; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; -} - -.c51 { - font-size: 14px; -} - -.c50 { - padding: 0; -} - -
      -
    1. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - KGW Studio on the Sq, Portland, OR, USA - -
      -
      - 3:44 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 269 feet to - - Pioneer Square North MAX Station - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - NORTHWEST - on - - Unnamed Path - - - 167 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - LEFT - on - - Pioneer Sq N (path) - - - 101 feet - - -
        -
        3. -
      -
      -
      -       -
      -
      -
      - -
      -
      2. -
    2. -
      -
      -
      -
      -
      - - MA - - - MAX Blue Line - -
      -
      -
      -
      -
      - - Pioneer Square North MAX Station - - ID 8383 - - -
      -
      - 3:46 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - Ride - - -
      - - MAX Blue Line - -
      - - - MAX Blue Line - - to - - Hillsboro - - -       - - - - Disembark at - Providence Park MAX Station - - ID 9757 - - -       - -       -
      -
      - -
      -
      - -
      -
      -
      -
      - -
      -
      -
      -
      -
        -
      1. -
        - • -
        -
        - Galleria/SW 10th Ave MAX Station -
        -
        2. -
      -
      -
      -
      - - Typical wait: - 15 min - -
      -
      -
      -
      -
      - -
      -
      3. -
    3. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - Providence Park MAX Station - - ID 9757 - - -
      -
      - 3:49 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 249 feet to - - 1737 SW Morrison St, Portland, OR, USA 97205 - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - WEST - on - - Providence Park (path) - - - 19 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - RIGHT - on - - Unnamed Path - - - 104 feet - - -
        -
        3. -
      3. -
        - - - -
        -
        - - RIGHT - on - - Unnamed Path - - - 27 feet - - -
        -
        4. -
      4. -
        - - - -
        -
        - - RIGHT - on - - SW Morrison St - - - 99 feet - - -
        -
        5. -
      -
      -
      -       -
      -
      -
      - -
      -
      4. -
    4. -
      -
      -
      -
      - -
      -
      -
      -
      -
      - - 1737 SW Morrison St, Portland, OR, USA 97205 - -
      -
      - 3:50 PM -
      - - Arrive at - 1737 SW Morrison St, Portland, OR, USA 97205 - -
      -
      - -
      -
      5. -
    -`; - -exports[`Storyshots ItineraryBody/otp-ui E Scooter Rental Itinerary 1`] = ` - - - -`; - -exports[`Storyshots ItineraryBody/otp-ui E Scooter Rental Itinerary 2`] = ` -.c22 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c37 { - color: #f44256; -} - -.c29 { - border-top-style: solid; - border-top-width: 0; - padding-top: 0; - padding-bottom: 10px; -} - -.c16 { - background: transparent; - border: 0; - color: inherit; - cursor: pointer; - font-size: inherit; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c31 { - color: #008; - margin-left: 5px; -} - -.c31:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c6 { - color: black; - background-color: #e9e9e9; - border: 2px solid #bbb; - text-align: center; - width: 25px; - height: 25px; - font-size: 1.2em; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; -} - -.c34 { - color: black; - background-color: #f5a729; - border: 2px solid #bbb; - text-align: center; - width: 25px; - height: 25px; - font-size: 1.2em; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; -} - -.c21::before { - content: ""; - margin: 0 0.125em; -} - -.c36 { - text-align: center; -} - -.c4 { - border-left: dotted 4px #484848; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c33 { - border-left: dotted 4px #f5a729; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c0 { - list-style: none; - padding: 0; -} - -.c12 { - color: #676767; - font-size: 13px; - padding-bottom: 12px; -} - -.c17 { - bottom: 0; - cursor: pointer; - left: 0; - position: absolute; - right: 0; - top: 0; - width: 100%; - z-index: 1; -} - -.c13 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - line-height: 16px; - min-height: 31px; - position: relative; -} - -.c10 { - display: inline-block; - grid-row-start: 2; - grid-column-start: 1; - height: 0; - overflow: hidden; - width: 0; -} - -.c15 { - font-weight: inherit; -} - -.c14 { - -webkit-flex-shrink: 0; - -ms-flex-negative: 0; - flex-shrink: 0; -} - -.c3 { - position: relative; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); - height: 100%; -} - -.c5 { - width: 30px; - height: 30px; - border-radius: 50%; - position: absolute; - left: 50%; - top: 0; - -webkit-transform: translate(-51%,-10%); - -ms-transform: translate(-51%,-10%); - transform: translate(-51%,-10%); -} - -.c2 { - grid-column-start: 2; - grid-row: span 2; - padding-right: 5px; -} - -.c18 { - display: grid; - grid-template-columns: 100px auto; -} - -.c1 { - max-width: 500px; - display: grid; - grid-template-columns: 65px 30px auto; -} - -.c9 { - grid-column-start: 1; - grid-row: 1 / span 2; - padding-right: 5px; - font-size: 0.9em; -} - -.c32 { - padding: 3px 10px 3px 10px; - border: 0; - margin-top: -15px; - width: 35px; - height: 35px; -} - -.c32:hover { - cursor: pointer; -} - -.c30 { - -webkit-flex: 0 0 25px; - -ms-flex: 0 0 25px; - flex: 0 0 25px; - grid-column: -1; -} - -.c11 { - grid-row-start: 2; - grid-column-start: 3; -} - -.c7 { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - font-size: 1.2em; - grid-row-start: 1; - grid-column-start: 3; -} - -.c8 { - font-size: inherit; - font-weight: bold; - height: 1.2em; - margin: 0; - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; - -webkit-flex: 1 1 auto; - -ms-flex: 1 1 auto; - flex: 1 1 auto; - padding: 3px 0 10px 0; -} - -.c35 { - color: #807373; - font-size: 13px; - font-weight: 300; - padding-top: 1px; - margin-bottom: 10px; - margin-top: -14px; -} - -.c23 { - display: block; - list-style: none; - padding: 0; -} - -.c26 { - margin-left: 24px; - line-height: 1.25em; - padding-top: 1px; -} - -.c26 > span { - margin-right: 1ch; -} - -.c19 { - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - -webkit-align-self: center; - -ms-flex-item-align: center; - align-self: center; - margin-top: 10px; -} - -.c19 a { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; -} - -.c20 { - color: #676767; - font-size: 13px; - font-style: normal; - padding: 0; -} - -.c25 { - fill: #676767; - float: left; - height: 16px; - width: 16px; -} - -.c24 { - font-size: 13px; - margin-top: 8px; - color: #676767; - font-style: normal; -} - -.c27 { - font-weight: 500; -} - -.c28 { - font-weight: 200; - opacity: 0.8975; - padding-left: 1ch; -} - -
      -
    1. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - 600 SW 5th Ave, Portland, OR, USA 97204 - -
      -
      - 3:45 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 206 feet to - - EMAQ - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - EAST - on - - SW Alder St - - - 118 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - LEFT - on - - SW 4th Ave - - - 88 feet - - -
        -
        3. -
      -
      -
      -       -
      -
      -
      - -
      -
      2. -
    2. -
      -
      -
      -
      -
      - - - Travel by e-scooter - - - - - - - - - -
      -
      -
      -
      -
      - - EMAQ - -
      -
      - 3:46 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      - Pick up Razor - E-scooter - -
      -
      -
      - - - - - - - - Ride 0.3 miles to - - 205 SW Pine St, Portland, OR, USA 97204 - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - CONTINUE - on - - SW 4th Ave - - - 0.2 miles - - -
        -
        2. -
      2. -
        - - - -
        -
        - - RIGHT - on - - SW Pine St - - - 456 feet - - -
        -
        3. -
      -
      -
      -       -
      -
      -
      - -
      -
      3. -
    3. -
      -
      -
      -
      - -
      -
      -
      -
      -
      - - 205 SW Pine St, Portland, OR, USA 97204 - -
      -
      - 3:48 PM -
      - - Arrive at - 205 SW Pine St, Portland, OR, USA 97204 - -
      -
      - -
      -
      4. -
    -`; - -exports[`Storyshots ItineraryBody/otp-ui E Scooter Rental Transit Itinerary 1`] = ` - - - -`; - -exports[`Storyshots ItineraryBody/otp-ui E Scooter Rental Transit Itinerary 2`] = ` -.c22 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c59 { - color: #f44256; -} - -.c35 { - border-top-style: solid; - border-top-width: 0; - padding-top: 0; - padding-bottom: 10px; -} - -.c16 { - background: transparent; - border: 0; - color: inherit; - cursor: pointer; - font-size: inherit; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c37 { - color: #008; - margin-left: 5px; -} - -.c37:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c6 { - color: black; - background-color: #e9e9e9; - border: 2px solid #bbb; - text-align: center; - width: 25px; - height: 25px; - font-size: 1.2em; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; -} - -.c40 { - color: black; - background-color: #f5a729; - border: 2px solid #bbb; - text-align: center; - width: 25px; - height: 25px; - font-size: 1.2em; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; -} - -.c21::before { - content: ""; - margin: 0 0.125em; -} - -.c58 { - text-align: center; -} - -.c4 { - border-left: dotted 4px #484848; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c39 { - border-left: dotted 4px #f5a729; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c42 { - border-left: solid 8px #008ab0; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c54 { - display: block; - font-size: 13px; - list-style: none; - padding: 0; -} - -.c0 { - list-style: none; - padding: 0; -} - -.c12 { - color: #676767; - font-size: 13px; - padding-bottom: 12px; -} - -.c17 { - bottom: 0; - cursor: pointer; - left: 0; - position: absolute; - right: 0; - top: 0; - width: 100%; - z-index: 1; -} - -.c13 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - line-height: 16px; - min-height: 31px; - position: relative; -} - -.c10 { - display: inline-block; - grid-row-start: 2; - grid-column-start: 1; - height: 0; - overflow: hidden; - width: 0; -} - -.c49 { - font-weight: 200; -} - -.c15 { - font-weight: inherit; -} - -.c48 { - font-size: 13px; - font-weight: 500; -} - -.c47 { - font-weight: 800; - margin-right: 6px; -} - -.c46 { - color: #807373; - margin-top: 5px; -} - -.c14 { - -webkit-flex-shrink: 0; - -ms-flex-negative: 0; - flex-shrink: 0; -} - -.c3 { - position: relative; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); - height: 100%; -} - -.c5 { - width: 30px; - height: 30px; - border-radius: 50%; - position: absolute; - left: 50%; - top: 0; - -webkit-transform: translate(-51%,-10%); - -ms-transform: translate(-51%,-10%); - transform: translate(-51%,-10%); -} - -.c2 { - grid-column-start: 2; - grid-row: span 2; - padding-right: 5px; -} - -.c18 { - display: grid; - grid-template-columns: 100px auto; -} - -.c1 { - max-width: 500px; - display: grid; - grid-template-columns: 65px 30px auto; -} - -.c29 { - border-color: #fff; - border-radius: 5px; - border-style: solid; - border-width: 1px; - display: inline-block; - font-style: normal; - grid-column: 2; - grid-row: 1; - margin: 0 4px; - position: relative; - text-align: center; - -webkit-text-decoration: none; - text-decoration: none; - vertical-align: middle; - width: 75%; -} - -.c29:hover { - border-color: #d1d5da; - background-color: #f6f8fa; -} - -.c9 { - grid-column-start: 1; - grid-row: 1 / span 2; - padding-right: 5px; - font-size: 0.9em; -} - -.c38 { - padding: 3px 10px 3px 10px; - border: 0; - margin-top: -15px; - width: 35px; - height: 35px; -} - -.c38:hover { - cursor: pointer; -} - -.c36 { - -webkit-flex: 0 0 25px; - -ms-flex: 0 0 25px; - flex: 0 0 25px; - grid-column: -1; -} - -.c11 { - grid-row-start: 2; - grid-column-start: 3; -} - -.c7 { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - font-size: 1.2em; - grid-row-start: 1; - grid-column-start: 3; -} - -.c8 { - font-size: inherit; - font-weight: bold; - height: 1.2em; - margin: 0; - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; - -webkit-flex: 1 1 auto; - -ms-flex: 1 1 auto; - flex: 1 1 auto; - padding: 3px 0 10px 0; -} - -.c41 { - color: #807373; - font-size: 13px; - font-weight: 300; - padding-top: 1px; - margin-bottom: 10px; - margin-top: -14px; -} - -.c30 { - padding: 2px; - width: 100%; -} - -.c32 { - font-size: xx-small; -} - -.c32::before { - content: ""; - margin: 0 0.125em; -} - -.c33 { - color: #e60000; -} - -.c34 { - color: green; -} - -.c31 { - font-size: small; -} - -.c43 { - text-align: center; - min-width: 30px; - min-height: 30px; - font-size: 1.2em; - background-color: #084c8d; - color: white; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; - border: 1px solid; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - cursor: default; -} - -.c44 { - position: absolute; - width: 1px; - height: 1px; - padding: 0; - margin: -1px; - overflow: hidden; - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - border: 0; -} - -.c23 { - display: block; - list-style: none; - padding: 0; -} - -.c26 { - margin-left: 24px; - line-height: 1.25em; - padding-top: 1px; -} - -.c26 > span { - margin-right: 1ch; -} - -.c19 { - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - -webkit-align-self: center; - -ms-flex-item-align: center; - align-self: center; - margin-top: 10px; -} - -.c19 a { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; -} - -.c20 { - color: #676767; - font-size: 13px; - font-style: normal; - padding: 0; -} - -.c25 { - fill: #676767; - float: left; - height: 16px; - width: 16px; -} - -.c24 { - font-size: 13px; - margin-top: 8px; - color: #676767; - font-style: normal; -} - -.c27 { - font-weight: 500; -} - -.c28 { - font-weight: 200; - opacity: 0.8975; - padding-left: 1ch; -} - -.c45 { - font-weight: 200; - font-size: 0.9em; - margin-left: 10px; -} - -.c56 { - float: left; - margin-left: -36px; - color: #fff; -} - -.c57 { - color: #676767; - margin-top: 3px; -} - -.c55 { - z-index: 30; - position: relative; -} - -.c50 { - margin-top: 5px; -} - -.c51 { - color: #676767; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; -} - -.c53 { - font-size: 14px; -} - -.c52 { - padding: 0; -} - -
      -
    1. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - 2943 SE Washington St, Portland, OR, USA 97214 - -
      -
      - 3:45 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 0.4 miles to - - Shared E-scooter - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - SOUTH - on - - SE 30th Ave - - - 0.2 miles - - -
        -
        2. -
      2. -
        - - - -
        -
        - - RIGHT - on - - SE Belmont St - - - 330 feet - - -
        -
        3. -
      3. -
        - - - -
        -
        - - LEFT - on - - SE 29th Ave - - - 511 feet - - -
        -
        4. -
      4. -
        - - - -
        -
        - - RIGHT - on - - SE Taylor St - - - 235 feet - - -
        -
        5. -
      -
      -
      -
      - -
      -       -
      -
      -
      - -
      -
      2. -
    2. -
      -
      -
      -
      -
      - - - Travel by e-scooter - - - - - - - - - - -
      -
      -
      -
      -
      - - Shared E-scooter - -
      -
      - 3:54 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      - Pick up Shared - E-scooter - -
      -
      -
      - - - - - - - - Ride 1.4 miles to - - NE Broadway - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - CONTINUE - on - - SE Taylor St - - - 26 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - RIGHT - on - - SE 28th Ave - - - 0.6 miles - - -
        -
        3. -
      3. -
        - - - -
        -
        - - CONTINUE - on - - NE 28th Ave - - - 0.7 miles - - -
        -
        4. -
      4. -
        - - - -
        -
        - - SLIGHTLY_RIGHT - on - - NE Halsey St - - - 17 feet - - -
        -
        5. -
      5. -
        - - - -
        -
        - - RIGHT - on - - NE Halsey St - - - 59 feet - - -
        -
        6. -
      6. -
        - - - -
        -
        - - SLIGHTLY_LEFT - on - - NE 28th Ave - - - 28 feet - - -
        -
        7. -
      7. -
        - - - -
        -
        - - SLIGHTLY_LEFT - on - - NE 28th Ave - - - 489 feet - - -
        -
        8. -
      8. -
        - - - -
        -
        - - RIGHT - on - - NE Broadway - - - 86 feet - - -
        -
        9. -
      -
      -
      -
      - -
      -       -
      -
      -
      - -
      -
      3. -
    3. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - NE Broadway - -
      -
      - 4:03 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk to - - NE Broadway & 28th - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - RIGHT - on - - street transit link - - -
        -
        2. -
      -
      -
      -       -
      -
      -
      - -
      -
      4. -
    4. -
      -
      -
      -
      -
      - - 70 - - - 12th/NE 33rd Ave - -
      -
      -
      -
      -
      - - NE Broadway & 28th - - ID 638 - - -
      -
      - 4:08 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - Ride - - -
      - - 70 - -
      - - - 12th/NE 33rd Ave - - to - - NE Sunderland - - -       - - - - Disembark at - NE 33rd & Shaver - - ID 7393 - - -       - -       -
      -
      -
      -
      -
      -
      -
      - -
      -
      -
      -
      -
        -
      1. -
        - • -
        -
        - NE Broadway & 32nd -
        -
        2. -
      2. -
        - • -
        -
        - NE 33rd & Schuyler -
        -
        3. -
      3. -
        - • -
        -
        - NE 33rd & US Grant Pl -
        -
        4. -
      4. -
        - • -
        -
        - NE 33rd & Brazee -
        -
        5. -
      5. -
        - • -
        -
        - NE 33rd & Knott -
        -
        6. -
      6. -
        - • -
        -
        - NE 33rd & Stanton -
        -
        7. -
      7. -
        - • -
        -
        - NE 33rd & Siskiyou -
        -
        8. -
      8. -
        - • -
        -
        - NE 33rd & Alameda -
        -
        9. -
      -
      -
      -
      -
      -
      -
      -
      -
      - -
      -
      5. -
    5. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - NE 33rd & Shaver - - ID 7393 - - -
      -
      - 4:17 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 0.4 miles to - - Shared E-scooter - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - NORTH - on - - NE 33rd Ave - - - 33 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - RIGHT - on - - NE Shaver St - - - 0.3 miles - - -
        -
        3. -
      3. -
        - - - -
        -
        - - LEFT - on - - NE 38th Ave - - - 332 feet - - -
        -
        4. -
      -
      -
      -
      - -
      -       -
      -
      -
      - -
      -
      6. -
    6. -
      -
      -
      -
      -
      - - - Travel by e-scooter - - - - - - - - - - -
      -
      -
      -
      -
      - - Shared E-scooter - -
      -
      - 4:25 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      - Pick up Shared - E-scooter - -
      -
      -
      - - - - - - - - Ride 1 mile to - - 5112 NE 47th Pl, Portland, OR, USA 97218 - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - CONTINUE - on - - NE 38th Ave - - - 355 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - RIGHT - on - - NE Skidmore St - - - 0.2 miles - - -
        -
        3. -
      3. -
        - - - -
        -
        - - LEFT - on - - NE 42nd Ave - - - 0.4 miles - - -
        -
        4. -
      4. -
        - - - -
        -
        - - RIGHT - on - - NE Alberta St - - - 0.3 miles - - -
        -
        5. -
      5. -
        - - - -
        -
        - - LEFT - on - - NE 47th Pl - - - 313 feet - - -
        -
        6. -
      -
      -
      -
      - -
      -       -
      -
      -
      - -
      -
      7. -
    7. -
      -
      -
      -
      - -
      -
      -
      -
      -
      - - 5112 NE 47th Pl, Portland, OR, USA 97218 - -
      -
      - 4:31 PM -
      - - Arrive at - 5112 NE 47th Pl, Portland, OR, USA 97218 - -
      -
      - -
      -
      8. -
    -`; - -exports[`Storyshots ItineraryBody/otp-ui Hide Driving Directions 1`] = ` - - - -`; - -exports[`Storyshots ItineraryBody/otp-ui Hide Driving Directions 2`] = ` -.c29 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c60 { - color: #f44256; -} - -.c21 { - border-top-style: solid; - border-top-width: 0; - padding-top: 0; - padding-bottom: 10px; -} - -.c16 { - background: transparent; - border: 0; - color: inherit; - cursor: pointer; - font-size: inherit; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c23 { - color: #008; - margin-left: 5px; -} - -.c23:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c6 { - color: black; - background-color: grey; - border: 2px solid #bbb; - text-align: center; - width: 25px; - height: 25px; - font-size: 1.2em; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; -} - -.c26 { - color: black; - background-color: #e9e9e9; - border: 2px solid #bbb; - text-align: center; - width: 25px; - height: 25px; - font-size: 1.2em; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; -} - -.c28::before { - content: ""; - margin: 0 0.125em; -} - -.c59 { - text-align: center; -} - -.c4 { - border-left: dotted 4px grey; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c25 { - border-left: dotted 4px #484848; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c36 { - border-left: solid 8px #084C8D; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c55 { - display: block; - font-size: 13px; - list-style: none; - padding: 0; -} - -.c0 { - list-style: none; - padding: 0; -} - -.c12 { - color: #676767; - font-size: 13px; - padding-bottom: 12px; -} - -.c17 { - bottom: 0; - cursor: pointer; - left: 0; - position: absolute; - right: 0; - top: 0; - width: 100%; - z-index: 1; -} - -.c13 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - line-height: 16px; - min-height: 31px; - position: relative; -} - -.c10 { - display: inline-block; - grid-row-start: 2; - grid-column-start: 1; - height: 0; - overflow: hidden; - width: 0; -} - -.c43 { - font-weight: 200; -} - -.c15 { - font-weight: inherit; -} - -.c42 { - font-size: 13px; - font-weight: 500; -} - -.c41 { - font-weight: 800; - margin-right: 6px; -} - -.c40 { - color: #807373; - margin-top: 5px; -} - -.c14 { - -webkit-flex-shrink: 0; - -ms-flex-negative: 0; - flex-shrink: 0; -} - -.c3 { - position: relative; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); - height: 100%; -} - -.c5 { - width: 30px; - height: 30px; - border-radius: 50%; - position: absolute; - left: 50%; - top: 0; - -webkit-transform: translate(-51%,-10%); - -ms-transform: translate(-51%,-10%); - transform: translate(-51%,-10%); -} - -.c2 { - grid-column-start: 2; - grid-row: span 2; - padding-right: 5px; -} - -.c18 { - display: grid; - grid-template-columns: 100px auto; -} - -.c1 { - max-width: 500px; - display: grid; - grid-template-columns: 65px 30px auto; -} - -.c9 { - grid-column-start: 1; - grid-row: 1 / span 2; - padding-right: 5px; - font-size: 0.9em; -} - -.c24 { - padding: 3px 10px 3px 10px; - border: 0; - margin-top: -15px; - width: 35px; - height: 35px; -} - -.c24:hover { - cursor: pointer; -} - -.c22 { - -webkit-flex: 0 0 25px; - -ms-flex: 0 0 25px; - flex: 0 0 25px; - grid-column: -1; -} - -.c11 { - grid-row-start: 2; - grid-column-start: 3; -} - -.c7 { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - font-size: 1.2em; - grid-row-start: 1; - grid-column-start: 3; -} - -.c8 { - font-size: inherit; - font-weight: bold; - height: 1.2em; - margin: 0; - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; - -webkit-flex: 1 1 auto; - -ms-flex: 1 1 auto; - flex: 1 1 auto; - padding: 3px 0 10px 0; -} - -.c37 { - text-align: center; - min-width: 30px; - min-height: 30px; - font-size: 1.2em; - background-color: #084C8D; - color: white; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; - border: 1px solid; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - cursor: default; -} - -.c38 { - position: absolute; - width: 1px; - height: 1px; - padding: 0; - margin: -1px; - overflow: hidden; - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - border: 0; -} - -.c30 { - display: block; - list-style: none; - padding: 0; -} - -.c33 { - margin-left: 24px; - line-height: 1.25em; - padding-top: 1px; -} - -.c33 > span { - margin-right: 1ch; -} - -.c19 { - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - -webkit-align-self: center; - -ms-flex-item-align: center; - align-self: center; - margin-top: 10px; -} - -.c19 a { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; -} - -.c27 { - color: #676767; - font-size: 13px; - font-style: normal; - padding: 0; -} - -.c20 { - color: #676767; - font-size: 13px; - font-style: normal; - padding: 0; - margin-right: 0.4em; -} - -.c32 { - fill: #676767; - float: left; - height: 16px; - width: 16px; -} - -.c31 { - font-size: 13px; - margin-top: 8px; - color: #676767; - font-style: normal; -} - -.c34 { - font-weight: 500; -} - -.c35 { - font-weight: 200; - opacity: 0.8975; - padding-left: 1ch; -} - -.c39 { - font-weight: 200; - font-size: 0.9em; - margin-left: 10px; -} - -.c57 { - float: left; - margin-left: -36px; - color: #fff; -} - -.c58 { - color: #676767; - margin-top: 3px; -} - -.c56 { - z-index: 30; - position: relative; -} - -.c46 { - background-color: #eee; - border-radius: 4px; - color: #000; - display: block; - margin-top: 5px; - padding: 8px; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c50 { - -webkit-align-items: baseline; - -webkit-box-align: baseline; - -ms-flex-align: baseline; - align-items: baseline; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - gap: 5px; - margin-top: 0.5em; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c50:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c48 { - font-size: 12px; - margin-left: 30px; - white-space: pre-wrap; -} - -.c49 { - margin-top: 5px; - margin-left: 30px; - font-size: 12px; - font-style: italic; -} - -.c47 { - float: left; - font-size: 18px; -} - -.c45 { - display: block; - margin-top: 3px; - padding: 0; -} - -.c44 { - color: #d14727; - cursor: auto; - display: inline-block; - font-weight: 400; - margin-top: 8px; - padding: 0; -} - -.c51 { - margin-top: 5px; -} - -.c52 { - color: #676767; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; -} - -.c54 { - font-size: 14px; -} - -.c53 { - padding: 0; -} - -
      -
    1. -
      -
      -
      -
      -
      - - - Travel by car - - - - -
      -
      -
      -
      -
      - - 330 SW Murray Blvd, Washington County, OR, USA 97005 - -
      -
      - 3:50 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Drive 2.4 miles to - - P+R Sunset TC - - - - -
      - - - - 10 min - - - -
      -
      -
      - -
      -
      2. -
    2. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - P+R Sunset TC - -
      -
      - 4:02 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 426 feet to - - Sunset TC MAX Station - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - SLIGHTLY_RIGHT - on - - Unnamed Path - - - 16 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - LEFT - on - - steps - - - 232 feet - - -
        -
        3. -
      3. -
        - - - -
        -
        - - LEFT - on - - Unnamed Path - - - 19 feet - - -
        -
        4. -
      4. -
        - - - -
        -
        - - RIGHT - on - - Sunset TC (path) - - - 159 feet - - -
        -
        5. -
      -
      -
      -       -
      -
      -
      - -
      -
      3. -
    3. -
      -
      -
      -
      -
      - - MA - - - MAX Blue Line - -
      -
      -
      -
      -
      - - Sunset TC MAX Station - - ID 9969 - - -
      -
      - 4:05 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - Ride - - -
      - - MAX Blue Line - -
      - - - MAX Blue Line - - to - - Gresham - - -       - - - - Disembark at - Oak/ SW 1st Ave MAX Station - - ID 8337 - - -       - -       -
      -
      -
      - - - 2 alerts -
      -
      -
      - -
      -
      -
      -
      - -
      -
      -
      -
      -
        -
      1. -
        - • -
        -
        - Washington Park MAX Station -
        -
        2. -
      2. -
        - • -
        -
        - Goose Hollow/SW Jefferson St MAX Station -
        -
        3. -
      3. -
        - • -
        -
        - Kings Hill/SW Salmon St MAX Station -
        -
        4. -
      4. -
        - • -
        -
        - Providence Park MAX Station -
        -
        5. -
      5. -
        - • -
        -
        - Library/SW 9th Ave MAX Station -
        -
        6. -
      6. -
        - • -
        -
        - Pioneer Square South MAX Station -
        -
        7. -
      7. -
        - • -
        -
        - Mall/SW 4th Ave MAX Station -
        -
        8. -
      8. -
        - • -
        -
        - Yamhill District MAX Station -
        -
        9. -
      -
      -
      -
      -
      -
      -
      -
      -
      - -
      -
      4. -
    4. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - Oak/ SW 1st Ave MAX Station - - ID 8337 - - -
      -
      - 4:27 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 0.1 miles to - - 205 SW Pine St, Portland, OR, USA 97204 - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - NORTHEAST - on - - Oak/SW 1st Ave (path) - - - 13 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - CONTINUE - on - - Unnamed Path - - - 27 feet - - -
        -
        3. -
      3. -
        - - - -
        -
        - - LEFT - on - - SW Oak St - - - 37 feet - - -
        -
        4. -
      4. -
        - - - -
        -
        - - RIGHT - on - - SW 1st Ave - - - 260 feet - - -
        -
        5. -
      5. -
        - - - -
        -
        - - LEFT - on - - SW Pine St - - - 337 feet - - -
        -
        6. -
      -
      -
      -       -
      -
      -
      - -
      -
      5. -
    5. -
      -
      -
      -
      - -
      -
      -
      -
      -
      - - 205 SW Pine St, Portland, OR, USA 97204 - -
      -
      - 4:29 PM -
      - - Arrive at - 205 SW Pine St, Portland, OR, USA 97204 - -
      -
      - -
      -
      6. -
    -`; - -exports[`Storyshots ItineraryBody/otp-ui Individual Leg Fare Components 1`] = ` - - - -`; - -exports[`Storyshots ItineraryBody/otp-ui Individual Leg Fare Components 2`] = ` -.c22 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c56 { - color: #f44256; -} - -.c35 { - border-top-style: solid; - border-top-width: 0; - padding-top: 0; - padding-bottom: 10px; -} - -.c16 { - background: transparent; - border: 0; - color: inherit; - cursor: pointer; - font-size: inherit; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c37 { - color: #008; - margin-left: 5px; -} - -.c37:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c6 { - color: black; - background-color: #e9e9e9; - border: 2px solid #bbb; - text-align: center; - width: 25px; - height: 25px; - font-size: 1.2em; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; -} - -.c21::before { - content: ""; - margin: 0 0.125em; -} - -.c55 { - text-align: center; -} - -.c4 { - border-left: dotted 4px #484848; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c39 { - border-left: solid 8px #008ab0; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c51 { - display: block; - font-size: 13px; - list-style: none; - padding: 0; -} - -.c0 { - list-style: none; - padding: 0; -} - -.c12 { - color: #676767; - font-size: 13px; - padding-bottom: 12px; -} - -.c17 { - bottom: 0; - cursor: pointer; - left: 0; - position: absolute; - right: 0; - top: 0; - width: 100%; - z-index: 1; -} - -.c13 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - line-height: 16px; - min-height: 31px; - position: relative; -} - -.c10 { - display: inline-block; - grid-row-start: 2; - grid-column-start: 1; - height: 0; - overflow: hidden; - width: 0; -} - -.c45 { - font-weight: 200; -} - -.c15 { - font-weight: inherit; -} - -.c44 { - font-size: 13px; - font-weight: 500; -} - -.c43 { - font-weight: 800; - margin-right: 6px; -} - -.c42 { - color: #807373; - margin-top: 5px; -} - -.c14 { - -webkit-flex-shrink: 0; - -ms-flex-negative: 0; - flex-shrink: 0; -} - -.c3 { - position: relative; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); - height: 100%; -} - -.c5 { - width: 30px; - height: 30px; - border-radius: 50%; - position: absolute; - left: 50%; - top: 0; - -webkit-transform: translate(-51%,-10%); - -ms-transform: translate(-51%,-10%); - transform: translate(-51%,-10%); -} - -.c2 { - grid-column-start: 2; - grid-row: span 2; - padding-right: 5px; -} - -.c18 { - display: grid; - grid-template-columns: 100px auto; -} - -.c1 { - max-width: 500px; - display: grid; - grid-template-columns: 65px 30px auto; -} - -.c29 { - border-color: #fff; - border-radius: 5px; - border-style: solid; - border-width: 1px; - display: inline-block; - font-style: normal; - grid-column: 2; - grid-row: 1; - margin: 0 4px; - position: relative; - text-align: center; - -webkit-text-decoration: none; - text-decoration: none; - vertical-align: middle; - width: 75%; -} - -.c29:hover { - border-color: #d1d5da; - background-color: #f6f8fa; -} - -.c9 { - grid-column-start: 1; - grid-row: 1 / span 2; - padding-right: 5px; - font-size: 0.9em; -} - -.c38 { - padding: 3px 10px 3px 10px; - border: 0; - margin-top: -15px; - width: 35px; - height: 35px; -} - -.c38:hover { - cursor: pointer; -} - -.c36 { - -webkit-flex: 0 0 25px; - -ms-flex: 0 0 25px; - flex: 0 0 25px; - grid-column: -1; -} - -.c11 { - grid-row-start: 2; - grid-column-start: 3; -} - -.c7 { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - font-size: 1.2em; - grid-row-start: 1; - grid-column-start: 3; -} - -.c8 { - font-size: inherit; - font-weight: bold; - height: 1.2em; - margin: 0; - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; - -webkit-flex: 1 1 auto; - -ms-flex: 1 1 auto; - flex: 1 1 auto; - padding: 3px 0 10px 0; -} - -.c30 { - padding: 2px; - width: 100%; -} - -.c32 { - font-size: xx-small; -} - -.c32::before { - content: ""; - margin: 0 0.125em; -} - -.c33 { - color: #e60000; -} - -.c34 { - color: green; -} - -.c31 { - font-size: small; -} - -.c40 { - text-align: center; - min-width: 30px; - min-height: 30px; - font-size: 1.2em; - background-color: #084c8d; - color: white; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; - border: 1px solid; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - cursor: default; -} - -.c41 { - position: absolute; - width: 1px; - height: 1px; - padding: 0; - margin: -1px; - overflow: hidden; - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - border: 0; -} - -.c23 { - display: block; - list-style: none; - padding: 0; -} - -.c26 { - margin-left: 24px; - line-height: 1.25em; - padding-top: 1px; -} - -.c26 > span { - margin-right: 1ch; -} - -.c19 { - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - -webkit-align-self: center; - -ms-flex-item-align: center; - align-self: center; - margin-top: 10px; -} - -.c19 a { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; -} - -.c20 { - color: #676767; - font-size: 13px; - font-style: normal; - padding: 0; -} - -.c25 { - fill: #676767; - float: left; - height: 16px; - width: 16px; -} - -.c24 { - font-size: 13px; - margin-top: 8px; - color: #676767; - font-style: normal; -} - -.c27 { - font-weight: 500; -} - -.c28 { - font-weight: 200; - opacity: 0.8975; - padding-left: 1ch; -} - -.c53 { - float: left; - margin-left: -36px; - color: #fff; -} - -.c54 { - color: #676767; - margin-top: 3px; -} - -.c52 { - z-index: 30; - position: relative; -} - -.c46 { - display: block; - margin-top: 3px; - padding: 0; -} - -.c47 { - margin-top: 5px; -} - -.c48 { - color: #676767; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; -} - -.c50 { - font-size: 14px; -} - -.c49 { - padding: 0; -} - -
      -
    1. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - 100 South 11th Street, Mount Vernon, WA, USA - -
      -
      - 1:42 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 0.8 miles to - - Skagit Station Gate 3 - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - WEST - on - - East Division Street - - - 72 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - LEFT - on - - South 11th Street - - - 48 feet - - -
        -
        3. -
      3. -
        - - - -
        -
        - - RIGHT - on - - service road - - - 27 feet - - -
        -
        4. -
      4. -
        - - - -
        -
        - - LEFT - on - - sidewalk - - - 0.2 miles - - -
        -
        5. -
      5. -
        - - - -
        -
        - - LEFT - on - - South 10th Street - - - 282 feet - - -
        -
        6. -
      6. -
        - - - -
        -
        - - RIGHT - on - - Unnamed Path - - - 136 feet - - -
        -
        7. -
      7. -
        - - - -
        -
        - - LEFT - on - - alley - - - 17 feet - - -
        -
        8. -
      8. -
        - - - -
        -
        - - RIGHT - on - - East Montgomery Street - - - 109 feet - - -
        -
        9. -
      9. -
        - - - -
        -
        - - LEFT - on - - Unnamed Path - - - 0.2 miles - - -
        -
        10. -
      10. -
        - - - -
        -
        - - RIGHT - on - - sidewalk - - - 0.2 miles - - -
        -
        11. -
      11. -
        - - - -
        -
        - - RIGHT - on - - sidewalk - - - 56 feet - - -
        -
        12. -
      12. -
        - - - -
        -
        - - LEFT - on - - service road - - - 175 feet - - -
        -
        13. -
      -
      -
      -
      - -
      -       -
      -
      -
      - -
      -
      2. -
    2. -
      -
      -
      -
      -
      - - 90 - - - County Connector Snohomish/Skagit - -
      -
      -
      -
      -
      - - Skagit Station Gate 3 - -
      -
      - 2:00 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - Ride - - -
      - - 90X - -
      - - - County Connector Snohomish/Skagit - - to - - Everett - - -       - - - - Disembark at - Everett Station - -       - -       -
      -
      -
      -
      -
        -
      -
      -
      -
      - -
      -
      -
      -
      -
        -
      1. -
        - • -
        -
        - South Mount Vernon Park & Ride -
        -
        2. -
      2. -
        - • -
        -
        - Broadway - Everett Community College -
        -
        3. -
      3. -
        - • -
        -
        - Broadway & 14th (near hospital) -
        -
        4. -
      4. -
        - • -
        -
        - Broadway just South of the Event Center -
        -
        5. -
      -
      -
      -
      -
      -
      -
      -
      -
      - -
      -
      3. -
    3. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - Everett Station - -
      -
      - 3:00 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 318 feet to - - Everett Station Bay C1 - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - NORTH - on - - Unnamed Path - - - 318 feet - - -
        -
        2. -
      -
      -
      -       -
      -
      -
      - -
      -
      4. -
    4. -
      -
      -
      -
      -
      - - 51 - - - Everett - Northgate Station - -
      -
      -
      -
      -
      - - Everett Station Bay C1 - -
      -
      - 3:03 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - Ride - - -
      - - 512 - -
      - - - Northgate Station - - -       - - - - Disembark at - Lynnwood Transit Center Bay D3 - -       - -       -
      -
      -
      -
      -
        -
      -
      -
      -
      - -
      -
      -
      -
      -
        -
      1. -
        - • -
        -
        - Broadway & 34th St -
        -
        2. -
      2. -
        - • -
        -
        - South Everett Fwy Station Bay 3 -
        -
        3. -
      3. -
        - • -
        -
        - Ash Way Park & Ride Bay 1 -
        -
        4. -
      -
      -
      -
      -
      -
      -
      -
      -
      - -
      -
      5. -
    5. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - Lynnwood Transit Center Bay D3 - -
      -
      - 3:29 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 176 feet to - - Lynnwood Transit Center Bay D1 - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - WEST - on - - platform - - - 176 feet - - -
        -
        2. -
      -
      -
      -       -
      -
      -
      - -
      -
      6. -
    6. -
      -
      -
      -
      -
      - - 53 - - - Lynnwood - Bellevue - -
      -
      -
      -
      -
      - - Lynnwood Transit Center Bay D1 - -
      -
      - 3:40 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - Ride - - -
      - - 535 - -
      - - - Bellevue - - -       - - - - Disembark at - Bothell Park & Ride Bay 2 - -       - -       -
      -
      -
      -
      -
        -
      -
      -
      -
      - -
      -
      -
      -
      -
        -
      1. -
        - • -
        -
        - Alderwood Mall Pkwy & Beech Rd -
        -
        2. -
      2. -
        - • -
        -
        - Alderwood Mall Pkwy & 184th St SW -
        -
        3. -
      3. -
        - • -
        -
        - Canyon Park Fwy Station Bay 4 -
        -
        4. -
      4. -
        - • -
        -
        - Beardslee Blvd & Ross Rd -
        -
        5. -
      5. -
        - • -
        -
        - UW Bothell & Cascadia College -
        -
        6. -
      -
      -
      -
      -
      -
      -
      -
      -
      - -
      -
      7. -
    7. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - Bothell Park & Ride Bay 2 - -
      -
      - 4:05 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 1 foot to - - Kaysner Way & Woodinville Dr - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - NORTHWEST - on - - sidewalk - - - 1 foot - - -
        -
        2. -
      -
      -
      -       -
      -
      -
      - -
      -
      8. -
    8. -
      -
      -
      -
      -
      - - 37 - - - - -
      -
      -
      -
      -
      - - Kaysner Way & Woodinville Dr - -
      -
      - 4:18 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - Ride - - -
      - - 372 - -
      - - - U-District Station Lake City - - -       - - - - Disembark at - NE Bothell Way & 61st Ave NE - -       - -       -
      -
      -
      -
      -
        -
      -
      -
      -
      - -
      -
      -
      -
      -
        -
      1. -
        - • -
        -
        - Woodinville Dr & Kaysner Way -
        -
        2. -
      2. -
        - • -
        -
        - Bothell Way NE & NE 180th St -
        -
        3. -
      3. -
        - • -
        -
        - NE Bothell Way & 96th Ave NE -
        -
        4. -
      4. -
        - • -
        -
        - NE Bothell Way & 91st Ave NE -
        -
        5. -
      5. -
        - • -
        -
        - NE Bothell Way & 83rd Pl NE -
        -
        6. -
      6. -
        - • -
        -
        - NE Bothell Way & 80th Ave NE -
        -
        7. -
      7. -
        - • -
        -
        - NE Bothell Way & 77th Ct NE -
        -
        8. -
      8. -
        - • -
        -
        - NE Bothell Way & Kenmore Park & Ride -
        -
        9. -
      9. -
        - • -
        -
        - NE Bothell Way & 68th Ave NE -
        -
        10. -
      -
      -
      -
      -
      -
      -
      -
      -
      - -
      -
      9. -
    9. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - NE Bothell Way & 61st Ave NE - -
      -
      - 4:29 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 0.4 miles to - - 18311 57th Avenue NE, Kenmore, WA, USA - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - WEST - on - - Bothell Way Northeast - - - 74 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - RIGHT - on - - 60th Avenue Northeast - - - 190 feet - - -
        -
        3. -
      3. -
        - - - -
        -
        - - LEFT - on - - Northeast 180th Street - - - 0.2 miles - - -
        -
        4. -
      4. -
        - - - -
        -
        - - RIGHT - on - - 57th Avenue Northeast - - - 0.2 miles - - -
        -
        5. -
      -
      -
      -
      - -
      -       -
      -
      -
      - -
      -
      10. -
    10. -
      -
      -
      -
      - -
      -
      -
      -
      -
      - - 18311 57th Avenue NE, Kenmore, WA, USA - -
      -
      - 4:38 PM -
      - - Arrive at - 18311 57th Avenue NE, Kenmore, WA, USA - -
      -
      - -
      -
      11. -
    -`; - -exports[`Storyshots ItineraryBody/otp-ui OTP 2 Flex Itinerary 1`] = ` - - - -`; - -exports[`Storyshots ItineraryBody/otp-ui OTP 2 Flex Itinerary 2`] = ` -.c22 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c61 { - color: #f44256; -} - -.c35 { - border-top-style: solid; - border-top-width: 0; - padding-top: 0; - padding-bottom: 10px; -} - -.c16 { - background: transparent; - border: 0; - color: inherit; - cursor: pointer; - font-size: inherit; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c37 { - color: #008; - margin-left: 5px; -} - -.c37:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c6 { - color: black; - background-color: #e9e9e9; - border: 2px solid #bbb; - text-align: center; - width: 25px; - height: 25px; - font-size: 1.2em; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; -} - -.c59 { - color: #b22727; - margin-top: 5px; -} - -.c21::before { - content: ""; - margin: 0 0.125em; -} - -.c60 { - text-align: center; -} - -.c4 { - border-left: dotted 4px #484848; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c39 { - border-left: solid 8px #111; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c55 { - border-left: solid 8px #0076CE; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c57 { - border-left: solid 8px #008ab0; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c51 { - display: block; - font-size: 13px; - list-style: none; - padding: 0; -} - -.c0 { - list-style: none; - padding: 0; -} - -.c12 { - color: #676767; - font-size: 13px; - padding-bottom: 12px; -} - -.c17 { - bottom: 0; - cursor: pointer; - left: 0; - position: absolute; - right: 0; - top: 0; - width: 100%; - z-index: 1; -} - -.c13 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - line-height: 16px; - min-height: 31px; - position: relative; -} - -.c10 { - display: inline-block; - grid-row-start: 2; - grid-column-start: 1; - height: 0; - overflow: hidden; - width: 0; -} - -.c46 { - font-weight: 200; -} - -.c15 { - font-weight: inherit; -} - -.c45 { - font-size: 13px; - font-weight: 500; -} - -.c44 { - font-weight: 800; - margin-right: 6px; -} - -.c43 { - color: #807373; - margin-top: 5px; -} - -.c14 { - -webkit-flex-shrink: 0; - -ms-flex-negative: 0; - flex-shrink: 0; -} - -.c3 { - position: relative; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); - height: 100%; -} - -.c5 { - width: 30px; - height: 30px; - border-radius: 50%; - position: absolute; - left: 50%; - top: 0; - -webkit-transform: translate(-51%,-10%); - -ms-transform: translate(-51%,-10%); - transform: translate(-51%,-10%); -} - -.c2 { - grid-column-start: 2; - grid-row: span 2; - padding-right: 5px; -} - -.c18 { - display: grid; - grid-template-columns: 100px auto; -} - -.c1 { - max-width: 500px; - display: grid; - grid-template-columns: 65px 30px auto; -} - -.c29 { - border-color: #fff; - border-radius: 5px; - border-style: solid; - border-width: 1px; - display: inline-block; - font-style: normal; - grid-column: 2; - grid-row: 1; - margin: 0 4px; - position: relative; - text-align: center; - -webkit-text-decoration: none; - text-decoration: none; - vertical-align: middle; - width: 75%; -} - -.c29:hover { - border-color: #d1d5da; - background-color: #f6f8fa; -} - -.c9 { - grid-column-start: 1; - grid-row: 1 / span 2; - padding-right: 5px; - font-size: 0.9em; -} - -.c38 { - padding: 3px 10px 3px 10px; - border: 0; - margin-top: -15px; - width: 35px; - height: 35px; -} - -.c38:hover { - cursor: pointer; -} - -.c36 { - -webkit-flex: 0 0 25px; - -ms-flex: 0 0 25px; - flex: 0 0 25px; - grid-column: -1; -} - -.c11 { - grid-row-start: 2; - grid-column-start: 3; -} - -.c7 { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - font-size: 1.2em; - grid-row-start: 1; - grid-column-start: 3; -} - -.c8 { - font-size: inherit; - font-weight: bold; - height: 1.2em; - margin: 0; - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; - -webkit-flex: 1 1 auto; - -ms-flex: 1 1 auto; - flex: 1 1 auto; - padding: 3px 0 10px 0; -} - -.c30 { - padding: 2px; - width: 100%; -} - -.c32 { - font-size: xx-small; -} - -.c32::before { - content: ""; - margin: 0 0.125em; -} - -.c33 { - color: #e60000; -} - -.c34 { - color: green; -} - -.c31 { - font-size: small; -} - -.c40 { - text-align: center; - min-width: 30px; - min-height: 30px; - font-size: 1.2em; - background-color: #111; - color: white; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; - border: 1px solid; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - cursor: default; -} - -.c56 { - text-align: center; - min-width: 30px; - min-height: 30px; - font-size: 1.2em; - background-color: #0076CE; - color: white; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; - border: 1px solid; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - cursor: default; -} - -.c58 { - text-align: center; - min-width: 30px; - min-height: 30px; - font-size: 1.2em; - background-color: #084c8d; - color: white; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; - border: 1px solid; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - cursor: default; -} - -.c41 { - position: absolute; - width: 1px; - height: 1px; - padding: 0; - margin: -1px; - overflow: hidden; - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - border: 0; -} - -.c23 { - display: block; - list-style: none; - padding: 0; -} - -.c26 { - margin-left: 24px; - line-height: 1.25em; - padding-top: 1px; -} - -.c26 > span { - margin-right: 1ch; -} - -.c19 { - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - -webkit-align-self: center; - -ms-flex-item-align: center; - align-self: center; - margin-top: 10px; -} - -.c19 a { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; -} - -.c20 { - color: #676767; - font-size: 13px; - font-style: normal; - padding: 0; -} - -.c25 { - fill: #676767; - float: left; - height: 16px; - width: 16px; -} - -.c24 { - font-size: 13px; - margin-top: 8px; - color: #676767; - font-style: normal; -} - -.c27 { - font-weight: 500; -} - -.c28 { - font-weight: 200; - opacity: 0.8975; - padding-left: 1ch; -} - -.c42 { - font-weight: 200; - font-size: 0.9em; - margin-left: 10px; -} - -.c53 { - float: left; - margin-left: -36px; - color: #fff; -} - -.c54 { - color: #676767; - margin-top: 3px; -} - -.c52 { - z-index: 30; - position: relative; -} - -.c47 { - margin-top: 5px; -} - -.c48 { - color: #676767; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; -} - -.c50 { - font-size: 14px; -} - -.c49 { - padding: 0; -} - -
      -
    1. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - 2nd Avenue, Longmont, CO, USA - -
      -
      - 4:59 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 0.3 miles to - - S Main St & 1st Ave - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - WEST - on - - parking aisle - - - 148 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - LEFT - on - - Emery Street - - - 0.1 miles - - -
        -
        3. -
      3. -
        - - - -
        -
        - - RIGHT - on - - 1st Avenue - - - 0.1 miles - - -
        -
        4. -
      4. -
        - - - -
        -
        - - LEFT - on - - parking aisle - - - 280 feet - - -
        -
        5. -
      -
      -
      -
      - -
      -       -
      -
      -
      - -
      -
      2. -
    2. -
      -
      -
      -
      -
      - - LD - - - Longmont / Denver - -
      -
      -
      -
      -
      - - S Main St & 1st Ave - - ID 25633 - - -
      -
      - 5:06 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - Ride - - -
      - - LD3 - -
      - - - Longmont / Denver - - to - - US36/Broomfield Stn - - -       - - - - Disembark at - US 287 & Arapahoe Rd - - ID 33109 - - -       - -       -
      -
      -
      -
      -
      -
      -
      - -
      -
      -
      -
      -
        -
      1. -
        - • -
        -
        - S Main St & Ken Pratt Blvd -
        -
        2. -
      2. -
        - • -
        -
        - S Main St & Jersey Ave -
        -
        3. -
      3. -
        - • -
        -
        - S Main St & Missouri Ave -
        -
        4. -
      4. -
        - • -
        -
        - S Main St & Quebec Ave -
        -
        5. -
      5. -
        - • -
        -
        - US 287 & Pike Rd -
        -
        6. -
      6. -
        - • -
        -
        - US 287 & Niwot Rd -
        -
        7. -
      7. -
        - • -
        -
        - US 287 & Hwy 52 -
        -
        8. -
      8. -
        - • -
        -
        - US 287 & Lookout Rd -
        -
        9. -
      9. -
        - • -
        -
        - US 287 & Dawson Dr -
        -
        10. -
      10. -
        - • -
        -
        - US 287 & Goose Haven Dr -
        -
        11. -
      11. -
        - • -
        -
        - US 287 & Isabelle Rd -
        -
        12. -
      -
      -
      -
      -
      -
      -
      -
      -
      - -
      -
      3. -
    3. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - US 287 & Arapahoe Rd - - ID 33109 - - -
      -
      - 5:25 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 0.2 miles to - - Arapahoe Rd & Stonehenge Dr - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - SOUTH - on - - US Highway 287 - - - 0.1 miles - - -
        -
        2. -
      2. -
        - - - -
        -
        - - RIGHT - on - - Arapahoe Road - - - 485 feet - - -
        -
        3. -
      -
      -
      -       -
      -
      -
      - -
      -
      4. -
    4. -
      -
      -
      -
      -
      - - JU - - - Boulder / Lafayette via Arapahoe - -
      -
      -
      -
      -
      - - Arapahoe Rd & Stonehenge Dr - - ID 33465 - - -
      -
      - 6:00 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - Ride - - -
      - - JUMP - -
      - - - Boulder / Lafayette via Arapahoe - - to - - Erie Community Center - - -       - - - - Disembark at - Erie Community Center - - ID 33200 - - -       - -       -
      -
      -
      -
      -
      -
      -
      - -
      -
      -
      -
      -
        -
      1. -
        - • -
        -
        - Arapahoe Rd & US 287 -
        -
        2. -
      2. -
        - • -
        -
        - Arapahoe Rd & 111th St -
        -
        3. -
      3. -
        - • -
        -
        - Arapahoe Rd & Hawkridge Rd -
        -
        4. -
      4. -
        - • -
        -
        - 2800 Block 119th St -
        -
        5. -
      5. -
        - • -
        -
        - 119th St & Austin Ave -
        -
        6. -
      6. -
        - • -
        -
        - Erie Pkwy & Brennan St -
        -
        7. -
      7. -
        - • -
        -
        - Erie Pkwy & Meller St -
        -
        8. -
      -
      -
      -
      -
      -
      -
      -
      -
      - -
      -
      5. -
    5. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - Erie Community Center - - ID 33200 - - -
      -
      - 6:12 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 124 feet to - - corner of path and Powers Street - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - WEST - on - - sidewalk - - - 86 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - LEFT - on - - Unnamed Path - - - 38 feet - - -
        -
        3. -
      -
      -
      -       -
      -
      -
      - -
      -
      6. -
    6. -
      -
      -
      -
      -
      - - 60 - - - 60+ Ride - -
      -
      -
      -
      -
      - - 60plusride-co-us:area_626 - - ID area_626 - - -
      -
      - 6:12 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - Ride - - -
      - - 60+ Ride - -
      - - - 60+ Ride - - -       - - - - Disembark at - 60plusride-co-us:area_626 - - ID area_626_flexed_to - - -       - -       -
      -
      -
      - To take this route, you must - call 555-352-9348 - at least 7 days in advance - . -
      -
      -
      -
      -
      -
      -
      -
      - -
      -
      7. -
    7. -
      -
      -
      -
      - -
      -
      -
      -
      -
      - - 60plusride-co-us:area_626 - - ID area_626_flexed_to - - -
      -
      - 6:37 PM -
      - - Arrive at - 60plusride-co-us:area_626 - - ID area_626_flexed_to - - -
      -
      - -
      -
      8. -
    -`; - -exports[`Storyshots ItineraryBody/otp-ui OTP 2 Scooter Itinerary 1`] = ` - - - -`; - -exports[`Storyshots ItineraryBody/otp-ui OTP 2 Scooter Itinerary 2`] = ` -.c22 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c43 { - color: #f44256; -} - -.c29 { - border-top-style: solid; - border-top-width: 0; - padding-top: 0; - padding-bottom: 10px; -} - -.c16 { - background: transparent; - border: 0; - color: inherit; - cursor: pointer; - font-size: inherit; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c31 { - color: #008; - margin-left: 5px; -} - -.c31:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c6 { - color: black; - background-color: #e9e9e9; - border: 2px solid #bbb; - text-align: center; - width: 25px; - height: 25px; - font-size: 1.2em; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; -} - -.c34 { - color: black; - background-color: #f5a729; - border: 2px solid #bbb; - text-align: center; - width: 25px; - height: 25px; - font-size: 1.2em; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; -} - -.c21::before { - content: ""; - margin: 0 0.125em; -} - -.c42 { - text-align: center; -} - -.c4 { - border-left: dotted 4px #484848; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c33 { - border-left: dotted 4px #f5a729; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c0 { - list-style: none; - padding: 0; -} - -.c12 { - color: #676767; - font-size: 13px; - padding-bottom: 12px; -} - -.c17 { - bottom: 0; - cursor: pointer; - left: 0; - position: absolute; - right: 0; - top: 0; - width: 100%; - z-index: 1; -} - -.c13 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - line-height: 16px; - min-height: 31px; - position: relative; -} - -.c10 { - display: inline-block; - grid-row-start: 2; - grid-column-start: 1; - height: 0; - overflow: hidden; - width: 0; -} - -.c15 { - font-weight: inherit; -} - -.c14 { - -webkit-flex-shrink: 0; - -ms-flex-negative: 0; - flex-shrink: 0; -} - -.c3 { - position: relative; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); - height: 100%; -} - -.c5 { - width: 30px; - height: 30px; - border-radius: 50%; - position: absolute; - left: 50%; - top: 0; - -webkit-transform: translate(-51%,-10%); - -ms-transform: translate(-51%,-10%); - transform: translate(-51%,-10%); -} - -.c2 { - grid-column-start: 2; - grid-row: span 2; - padding-right: 5px; -} - -.c18 { - display: grid; - grid-template-columns: 100px auto; -} - -.c1 { - max-width: 500px; - display: grid; - grid-template-columns: 65px 30px auto; -} - -.c36 { - border-color: #fff; - border-radius: 5px; - border-style: solid; - border-width: 1px; - display: inline-block; - font-style: normal; - grid-column: 2; - grid-row: 1; - margin: 0 4px; - position: relative; - text-align: center; - -webkit-text-decoration: none; - text-decoration: none; - vertical-align: middle; - width: 75%; -} - -.c36:hover { - border-color: #d1d5da; - background-color: #f6f8fa; -} - -.c9 { - grid-column-start: 1; - grid-row: 1 / span 2; - padding-right: 5px; - font-size: 0.9em; -} - -.c32 { - padding: 3px 10px 3px 10px; - border: 0; - margin-top: -15px; - width: 35px; - height: 35px; -} - -.c32:hover { - cursor: pointer; -} - -.c30 { - -webkit-flex: 0 0 25px; - -ms-flex: 0 0 25px; - flex: 0 0 25px; - grid-column: -1; -} - -.c11 { - grid-row-start: 2; - grid-column-start: 3; -} - -.c7 { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - font-size: 1.2em; - grid-row-start: 1; - grid-column-start: 3; -} - -.c8 { - font-size: inherit; - font-weight: bold; - height: 1.2em; - margin: 0; - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; - -webkit-flex: 1 1 auto; - -ms-flex: 1 1 auto; - flex: 1 1 auto; - padding: 3px 0 10px 0; -} - -.c35 { - color: #807373; - font-size: 13px; - font-weight: 300; - padding-top: 1px; - margin-bottom: 10px; - margin-top: -14px; -} - -.c37 { - padding: 2px; - width: 100%; -} - -.c39 { - font-size: xx-small; -} - -.c39::before { - content: ""; - margin: 0 0.125em; -} - -.c40 { - color: #e60000; -} - -.c41 { - color: green; -} - -.c38 { - font-size: small; -} - -.c23 { - display: block; - list-style: none; - padding: 0; -} - -.c26 { - margin-left: 24px; - line-height: 1.25em; - padding-top: 1px; -} - -.c26 > span { - margin-right: 1ch; -} - -.c19 { - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - -webkit-align-self: center; - -ms-flex-item-align: center; - align-self: center; - margin-top: 10px; -} - -.c19 a { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; -} - -.c20 { - color: #676767; - font-size: 13px; - font-style: normal; - padding: 0; -} - -.c25 { - fill: #676767; - float: left; - height: 16px; - width: 16px; -} - -.c24 { - font-size: 13px; - margin-top: 8px; - color: #676767; - font-style: normal; -} - -.c27 { - font-weight: 500; -} - -.c28 { - font-weight: 200; - opacity: 0.8975; - padding-left: 1ch; -} - -
      -
    1. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - 300 Courtland St NE, Atlanta, GA 30303-12ND, United States - -
      -
      - 9:15 AM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 0.2 miles to - - Razor Vehicle - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - SOUTH - on - - Courtland Street Northeast - - - 172 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - RIGHT - on - - Unnamed Path - - - 0.1 miles - - -
        -
        3. -
      3. -
        - - - -
        -
        - - LEFT - on - - Peachtree Center Avenue Northeast - - - 140 feet - - -
        -
        4. -
      -
      -
      -       -
      -
      -
      - -
      -
      2. -
    2. -
      -
      -
      -
      -
      - - - Travel by e-scooter - - - - -
      -
      -
      -
      -
      - - Razor E-scooter - -
      -
      - 9:19 AM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      - Pick up Razor - E-scooter - -
      -
      -
      - - - - - - - - Ride 1 mile to - - 126 Mitchell St SW, Atlanta, GA 30303-3524, United States - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - HARD_RIGHT - on - - Peachtree Center Avenue Northeast - - - 12 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - LEFT - on - - service road - - - 10 feet - - -
        -
        3. -
      3. -
        - - - -
        -
        - - LEFT - on - - Peachtree Center Cycle Track - - - 0.5 miles - - -
        -
        4. -
      4. -
        - - - -
        -
        - - RIGHT - on - - Edgewood Avenue Northeast - - - 0.1 miles - - -
        -
        5. -
      5. -
        - - - -
        -
        - - LEFT - on - - Pryor Street Southwest - - - 269 feet - - -
        -
        6. -
      6. -
        - - - -
        -
        - - CONTINUE - on - - Pryor Street - - - 518 feet - - -
        -
        7. -
      7. -
        - - - -
        -
        - - CONTINUE - on - - Pryor Street Southwest - - - 0.2 miles - - -
        -
        8. -
      8. -
        - - - -
        -
        - - RIGHT - on - - Unnamed Path - - - 19 feet - - -
        -
        9. -
      9. -
        - - - -
        -
        - - RIGHT - on - - sidewalk - - - 22 feet - - -
        -
        10. -
      -
      -
      -
      - -
      -       -
      -
      -
      - -
      -
      3. -
    3. -
      -
      -
      -
      - -
      -
      -
      -
      -
      - - 126 Mitchell St SW, Atlanta, GA 30303-3524, United States - -
      -
      - 9:26 AM -
      - - Arrive at - 126 Mitchell St SW, Atlanta, GA 30303-3524, United States - -
      -
      - -
      -
      4. -
    -`; - -exports[`Storyshots ItineraryBody/otp-ui Park And Ride Itinerary 1`] = ` - - - -`; - -exports[`Storyshots ItineraryBody/otp-ui Park And Ride Itinerary 2`] = ` -.c22 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c59 { - color: #f44256; -} - -.c29 { - border-top-style: solid; - border-top-width: 0; - padding-top: 0; - padding-bottom: 10px; -} - -.c16 { - background: transparent; - border: 0; - color: inherit; - cursor: pointer; - font-size: inherit; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c31 { - color: #008; - margin-left: 5px; -} - -.c31:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c6 { - color: black; - background-color: grey; - border: 2px solid #bbb; - text-align: center; - width: 25px; - height: 25px; - font-size: 1.2em; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; -} - -.c34 { - color: black; - background-color: #e9e9e9; - border: 2px solid #bbb; - text-align: center; - width: 25px; - height: 25px; - font-size: 1.2em; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; -} - -.c21::before { - content: ""; - margin: 0 0.125em; -} - -.c58 { - text-align: center; -} - -.c4 { - border-left: dotted 4px grey; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c33 { - border-left: dotted 4px #484848; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c35 { - border-left: solid 8px #084C8D; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c54 { - display: block; - font-size: 13px; - list-style: none; - padding: 0; -} - -.c0 { - list-style: none; - padding: 0; -} - -.c12 { - color: #676767; - font-size: 13px; - padding-bottom: 12px; -} - -.c17 { - bottom: 0; - cursor: pointer; - left: 0; - position: absolute; - right: 0; - top: 0; - width: 100%; - z-index: 1; -} - -.c13 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - line-height: 16px; - min-height: 31px; - position: relative; -} - -.c10 { - display: inline-block; - grid-row-start: 2; - grid-column-start: 1; - height: 0; - overflow: hidden; - width: 0; -} - -.c42 { - font-weight: 200; -} - -.c15 { - font-weight: inherit; -} - -.c41 { - font-size: 13px; - font-weight: 500; -} - -.c40 { - font-weight: 800; - margin-right: 6px; -} - -.c39 { - color: #807373; - margin-top: 5px; -} - -.c14 { - -webkit-flex-shrink: 0; - -ms-flex-negative: 0; - flex-shrink: 0; -} - -.c3 { - position: relative; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); - height: 100%; -} - -.c5 { - width: 30px; - height: 30px; - border-radius: 50%; - position: absolute; - left: 50%; - top: 0; - -webkit-transform: translate(-51%,-10%); - -ms-transform: translate(-51%,-10%); - transform: translate(-51%,-10%); -} - -.c2 { - grid-column-start: 2; - grid-row: span 2; - padding-right: 5px; -} - -.c18 { - display: grid; - grid-template-columns: 100px auto; -} - -.c1 { - max-width: 500px; - display: grid; - grid-template-columns: 65px 30px auto; -} - -.c9 { - grid-column-start: 1; - grid-row: 1 / span 2; - padding-right: 5px; - font-size: 0.9em; -} - -.c32 { - padding: 3px 10px 3px 10px; - border: 0; - margin-top: -15px; - width: 35px; - height: 35px; -} - -.c32:hover { - cursor: pointer; -} - -.c30 { - -webkit-flex: 0 0 25px; - -ms-flex: 0 0 25px; - flex: 0 0 25px; - grid-column: -1; -} - -.c11 { - grid-row-start: 2; - grid-column-start: 3; -} - -.c7 { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - font-size: 1.2em; - grid-row-start: 1; - grid-column-start: 3; -} - -.c8 { - font-size: inherit; - font-weight: bold; - height: 1.2em; - margin: 0; - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; - -webkit-flex: 1 1 auto; - -ms-flex: 1 1 auto; - flex: 1 1 auto; - padding: 3px 0 10px 0; -} - -.c36 { - text-align: center; - min-width: 30px; - min-height: 30px; - font-size: 1.2em; - background-color: #084C8D; - color: white; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; - border: 1px solid; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - cursor: default; -} - -.c37 { - position: absolute; - width: 1px; - height: 1px; - padding: 0; - margin: -1px; - overflow: hidden; - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - border: 0; -} - -.c23 { - display: block; - list-style: none; - padding: 0; -} - -.c26 { - margin-left: 24px; - line-height: 1.25em; - padding-top: 1px; -} - -.c26 > span { - margin-right: 1ch; -} - -.c19 { - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - -webkit-align-self: center; - -ms-flex-item-align: center; - align-self: center; - margin-top: 10px; -} - -.c19 a { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; -} - -.c20 { - color: #676767; - font-size: 13px; - font-style: normal; - padding: 0; -} - -.c25 { - fill: #676767; - float: left; - height: 16px; - width: 16px; -} - -.c24 { - font-size: 13px; - margin-top: 8px; - color: #676767; - font-style: normal; -} - -.c27 { - font-weight: 500; -} - -.c28 { - font-weight: 200; - opacity: 0.8975; - padding-left: 1ch; -} - -.c38 { - font-weight: 200; - font-size: 0.9em; - margin-left: 10px; -} - -.c56 { - float: left; - margin-left: -36px; - color: #fff; -} - -.c57 { - color: #676767; - margin-top: 3px; -} - -.c55 { - z-index: 30; - position: relative; -} - -.c45 { - background-color: #eee; - border-radius: 4px; - color: #000; - display: block; - margin-top: 5px; - padding: 8px; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c49 { - -webkit-align-items: baseline; - -webkit-box-align: baseline; - -ms-flex-align: baseline; - align-items: baseline; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - gap: 5px; - margin-top: 0.5em; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c49:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c47 { - font-size: 12px; - margin-left: 30px; - white-space: pre-wrap; -} - -.c48 { - margin-top: 5px; - margin-left: 30px; - font-size: 12px; - font-style: italic; -} - -.c46 { - float: left; - font-size: 18px; -} - -.c44 { - display: block; - margin-top: 3px; - padding: 0; -} - -.c43 { - color: #d14727; - cursor: auto; - display: inline-block; - font-weight: 400; - margin-top: 8px; - padding: 0; -} - -.c50 { - margin-top: 5px; -} - -.c51 { - color: #676767; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; -} - -.c53 { - font-size: 14px; -} - -.c52 { - padding: 0; -} - -
      -
    1. -
      -
      -
      -
      -
      - - - Travel by car - - - - -
      -
      -
      -
      -
      - - 330 SW Murray Blvd, Washington County, OR, USA 97005 - -
      -
      - 3:50 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Drive 2.4 miles to - - P+R Sunset TC - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - SOUTHWEST - on - - parking aisle - - - 158 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - RIGHT - on - - SW Murray Blvd - - - 0.2 miles - - -
        -
        3. -
      3. -
        - - - -
        -
        - - CONTINUE - on - - NW Murray Blvd - - - 150 feet - - -
        -
        4. -
      4. -
        - - - -
        -
        - - SLIGHTLY_RIGHT - on - - NW Murray Blvd - - - 0.4 miles - - -
        -
        5. -
      5. -
        - - - -
        -
        - - CONTINUE - on - - NW Sunset Hwy - - - 0.6 miles - - -
        -
        6. -
      6. -
        - - - -
        -
        - - CONTINUE - on - - NW Sunset Hwy - - - 0.3 miles - - -
        -
        7. -
      7. -
        - - - -
        -
        - - LEFT - on - - SW Cedar Hills Blvd - - - 0.2 miles - - -
        -
        8. -
      8. -
        - - - -
        -
        - - RIGHT - on - - SW Barnes Rd - - - 0.5 miles - - -
        -
        9. -
      9. -
        - - - -
        -
        - - RIGHT - on - - service road - - - 0.2 miles - - -
        -
        10. -
      10. -
        - - - -
        -
        - - RIGHT - on - - Sunset TC - - - 76 feet - - -
        -
        11. -
      -
      -
      -       -
      -
      -
      - -
      -
      2. -
    2. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - P+R Sunset TC - -
      -
      - 4:02 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 426 feet to - - Sunset TC MAX Station - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - SLIGHTLY_RIGHT - on - - Unnamed Path - - - 16 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - LEFT - on - - steps - - - 232 feet - - -
        -
        3. -
      3. -
        - - - -
        -
        - - LEFT - on - - Unnamed Path - - - 19 feet - - -
        -
        4. -
      4. -
        - - - -
        -
        - - RIGHT - on - - Sunset TC (path) - - - 159 feet - - -
        -
        5. -
      -
      -
      -       -
      -
      -
      - -
      -
      3. -
    3. -
      -
      -
      -
      -
      - - MA - - - MAX Blue Line - -
      -
      -
      -
      -
      - - Sunset TC MAX Station - - ID 9969 - - -
      -
      - 4:05 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - Ride - - -
      - - MAX Blue Line - -
      - - - MAX Blue Line - - to - - Gresham - - -       - - - - Disembark at - Oak/ SW 1st Ave MAX Station - - ID 8337 - - -       - -       -
      -
      -
      - - - 2 alerts -
      -
      -
      - -
      -
      -
      -
      - -
      -
      -
      -
      -
        -
      1. -
        - • -
        -
        - Washington Park MAX Station -
        -
        2. -
      2. -
        - • -
        -
        - Goose Hollow/SW Jefferson St MAX Station -
        -
        3. -
      3. -
        - • -
        -
        - Kings Hill/SW Salmon St MAX Station -
        -
        4. -
      4. -
        - • -
        -
        - Providence Park MAX Station -
        -
        5. -
      5. -
        - • -
        -
        - Library/SW 9th Ave MAX Station -
        -
        6. -
      6. -
        - • -
        -
        - Pioneer Square South MAX Station -
        -
        7. -
      7. -
        - • -
        -
        - Mall/SW 4th Ave MAX Station -
        -
        8. -
      8. -
        - • -
        -
        - Yamhill District MAX Station -
        -
        9. -
      -
      -
      -
      -
      -
      -
      -
      -
      - -
      -
      4. -
    4. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - Oak/ SW 1st Ave MAX Station - - ID 8337 - - -
      -
      - 4:27 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 0.1 miles to - - 205 SW Pine St, Portland, OR, USA 97204 - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - NORTHEAST - on - - Oak/SW 1st Ave (path) - - - 13 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - CONTINUE - on - - Unnamed Path - - - 27 feet - - -
        -
        3. -
      3. -
        - - - -
        -
        - - LEFT - on - - SW Oak St - - - 37 feet - - -
        -
        4. -
      4. -
        - - - -
        -
        - - RIGHT - on - - SW 1st Ave - - - 260 feet - - -
        -
        5. -
      5. -
        - - - -
        -
        - - LEFT - on - - SW Pine St - - - 337 feet - - -
        -
        6. -
      -
      -
      -       -
      -
      -
      - -
      -
      5. -
    5. -
      -
      -
      -
      - -
      -
      -
      -
      -
      - - 205 SW Pine St, Portland, OR, USA 97204 - -
      -
      - 4:29 PM -
      - - Arrive at - 205 SW Pine St, Portland, OR, USA 97204 - -
      -
      - -
      -
      6. -
    -`; - -exports[`Storyshots ItineraryBody/otp-ui Styled Walk Transit Walk Itinerary 1`] = ` - - - -`; - -exports[`Storyshots ItineraryBody/otp-ui Styled Walk Transit Walk Itinerary 2`] = ` -.c25 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c60 { - color: #f44256; -} - -.c32 { - border-top-style: solid; - border-top-width: 0; - padding-top: 0; - padding-bottom: 10px; -} - -.c19 { - background: transparent; - border: 0; - color: inherit; - cursor: pointer; - font-size: inherit; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c34 { - color: #008; - margin-left: 5px; -} - -.c34:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c7 { - color: black; - background-color: #e9e9e9; - border: 2px solid #bbb; - text-align: center; - width: 25px; - height: 25px; - font-size: 1.2em; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; -} - -.c24::before { - content: ""; - margin: 0 0.125em; -} - -.c59 { - text-align: center; -} - -.c5 { - border-left: dotted 4px #484848; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c36 { - border-left: solid 8px #084C8D; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c55 { - display: block; - font-size: 13px; - list-style: none; - padding: 0; -} - -.c0 { - list-style: none; - padding: 0; -} - -.c15 { - color: #676767; - font-size: 13px; - padding-bottom: 12px; -} - -.c20 { - bottom: 0; - cursor: pointer; - left: 0; - position: absolute; - right: 0; - top: 0; - width: 100%; - z-index: 1; -} - -.c16 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - line-height: 16px; - min-height: 31px; - position: relative; -} - -.c12 { - display: inline-block; - grid-row-start: 2; - grid-column-start: 1; - height: 0; - overflow: hidden; - width: 0; -} - -.c43 { - font-weight: 200; -} - -.c18 { - font-weight: inherit; -} - -.c42 { - font-size: 13px; - font-weight: 500; -} - -.c41 { - font-weight: 800; - margin-right: 6px; -} - -.c40 { - color: #807373; - margin-top: 5px; -} - -.c17 { - -webkit-flex-shrink: 0; - -ms-flex-negative: 0; - flex-shrink: 0; -} - -.c4 { - position: relative; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); - height: 100%; -} - -.c6 { - width: 30px; - height: 30px; - border-radius: 50%; - position: absolute; - left: 50%; - top: 0; - -webkit-transform: translate(-51%,-10%); - -ms-transform: translate(-51%,-10%); - transform: translate(-51%,-10%); -} - -.c3 { - grid-column-start: 2; - grid-row: span 2; - padding-right: 5px; -} - -.c21 { - display: grid; - grid-template-columns: 100px auto; -} - -.c2 { - max-width: 500px; - display: grid; - grid-template-columns: 65px 30px auto; -} - -.c11 { - grid-column-start: 1; - grid-row: 1 / span 2; - padding-right: 5px; - font-size: 0.9em; -} - -.c35 { - padding: 3px 10px 3px 10px; - border: 0; - margin-top: -15px; - width: 35px; - height: 35px; -} - -.c35:hover { - cursor: pointer; -} - -.c33 { - -webkit-flex: 0 0 25px; - -ms-flex: 0 0 25px; - flex: 0 0 25px; - grid-column: -1; -} - -.c13 { - grid-row-start: 2; - grid-column-start: 3; -} - -.c8 { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - font-size: 1.2em; - grid-row-start: 1; - grid-column-start: 3; -} - -.c9 { - font-size: inherit; - font-weight: bold; - height: 1.2em; - margin: 0; - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; - -webkit-flex: 1 1 auto; - -ms-flex: 1 1 auto; - flex: 1 1 auto; - padding: 3px 0 10px 0; -} - -.c37 { - text-align: center; - min-width: 30px; - min-height: 30px; - font-size: 1.2em; - background-color: #084C8D; - color: white; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; - border: 1px solid; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - cursor: default; -} - -.c38 { - position: absolute; - width: 1px; - height: 1px; - padding: 0; - margin: -1px; - overflow: hidden; - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - border: 0; -} - -.c26 { - display: block; - list-style: none; - padding: 0; -} - -.c29 { - margin-left: 24px; - line-height: 1.25em; - padding-top: 1px; -} - -.c29 > span { - margin-right: 1ch; -} - -.c22 { - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - -webkit-align-self: center; - -ms-flex-item-align: center; - align-self: center; - margin-top: 10px; -} - -.c22 a { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; -} - -.c23 { - color: #676767; - font-size: 13px; - font-style: normal; - padding: 0; -} - -.c28 { - fill: #676767; - float: left; - height: 16px; - width: 16px; -} - -.c27 { - font-size: 13px; - margin-top: 8px; - color: #676767; - font-style: normal; -} - -.c30 { - font-weight: 500; -} - -.c31 { - font-weight: 200; - opacity: 0.8975; - padding-left: 1ch; -} - -.c39 { - font-weight: 200; - font-size: 0.9em; - margin-left: 10px; -} - -.c57 { - float: left; - margin-left: -36px; - color: #fff; -} - -.c58 { - color: #676767; - margin-top: 3px; -} - -.c56 { - z-index: 30; - position: relative; -} - -.c46 { - background-color: #eee; - border-radius: 4px; - color: #000; - display: block; - margin-top: 5px; - padding: 8px; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c50 { - -webkit-align-items: baseline; - -webkit-box-align: baseline; - -ms-flex-align: baseline; - align-items: baseline; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - gap: 5px; - margin-top: 0.5em; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c50:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c48 { - font-size: 12px; - margin-left: 30px; - white-space: pre-wrap; -} - -.c49 { - margin-top: 5px; - margin-left: 30px; - font-size: 12px; - font-style: italic; -} - -.c47 { - float: left; - font-size: 18px; -} - -.c45 { - display: block; - margin-top: 3px; - padding: 0; -} - -.c44 { - color: #d14727; - cursor: cursor; - display: inline-block; - font-weight: 400; - margin-top: 8px; - padding: 0; -} - -.c51 { - margin-top: 5px; -} - -.c52 { - color: #676767; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; -} - -.c54 { - font-size: 14px; -} - -.c53 { - padding: 0; -} - -.c1 .c14 { - background-color: pink; -} - -.c1 .c10 { - color: #676767; - font-size: 14px; - padding-right: 4px; - padding-top: 1px; - text-align: right; - vertical-align: top; - width: 60px; -} - -
      -
    1. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - KGW Studio on the Sq, Portland, OR, USA - -
      -
      - 3:44 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 269 feet to - - Pioneer Square North MAX Station - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - NORTHWEST - on - - Unnamed Path - - - 167 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - LEFT - on - - Pioneer Sq N (path) - - - 101 feet - - -
        -
        3. -
      -
      -
      -       -
      -
      -
      - -
      -
      2. -
    2. -
      -
      -
      -
      -
      - - MA - - - MAX Blue Line - -
      -
      -
      -
      -
      - - Pioneer Square North MAX Station - - ID 8383 - - -
      -
      - 3:46 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - Ride - - -
      - - MAX Blue Line - -
      - - - MAX Blue Line - - to - - Hillsboro - - -       - - - - Disembark at - Providence Park MAX Station - - ID 9757 - - -       - -       -
      -
      - -
      -
      - -
      -
      -
      -
      - -
      -
      -
      -
      -
        -
      1. -
        - • -
        -
        - Galleria/SW 10th Ave MAX Station -
        -
        2. -
      -
      -
      -
      - - Typical wait: - 15 min - -
      -
      -
      -
      -
      - -
      -
      3. -
    3. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - Providence Park MAX Station - - ID 9757 - - -
      -
      - 3:49 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 249 feet to - - 1737 SW Morrison St, Portland, OR, USA 97205 - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - WEST - on - - Providence Park (path) - - - 19 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - RIGHT - on - - Unnamed Path - - - 104 feet - - -
        -
        3. -
      3. -
        - - - -
        -
        - - RIGHT - on - - Unnamed Path - - - 27 feet - - -
        -
        4. -
      4. -
        - - - -
        -
        - - RIGHT - on - - SW Morrison St - - - 99 feet - - -
        -
        5. -
      -
      -
      -       -
      -
      -
      - -
      -
      4. -
    4. -
      -
      -
      -
      - -
      -
      -
      -
      -
      - - 1737 SW Morrison St, Portland, OR, USA 97205 - -
      -
      - 3:50 PM -
      - - Arrive at - 1737 SW Morrison St, Portland, OR, USA 97205 - -
      -
      - -
      -
      5. -
    -`; - -exports[`Storyshots ItineraryBody/otp-ui Three Alerts Always Collapsing 1`] = ` - - - -`; - -exports[`Storyshots ItineraryBody/otp-ui Three Alerts Always Collapsing 2`] = ` -.c22 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c57 { - color: #f44256; -} - -.c29 { - border-top-style: solid; - border-top-width: 0; - padding-top: 0; - padding-bottom: 10px; -} - -.c16 { - background: transparent; - border: 0; - color: inherit; - cursor: pointer; - font-size: inherit; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c31 { - color: #008; - margin-left: 5px; -} - -.c31:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c6 { - color: black; - background-color: #e9e9e9; - border: 2px solid #bbb; - text-align: center; - width: 25px; - height: 25px; - font-size: 1.2em; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; -} - -.c21::before { - content: ""; - margin: 0 0.125em; -} - -.c56 { - text-align: center; -} - -.c4 { - border-left: dotted 4px #484848; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c33 { - border-left: solid 8px #084C8D; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c52 { - display: block; - font-size: 13px; - list-style: none; - padding: 0; -} - -.c0 { - list-style: none; - padding: 0; -} - -.c12 { - color: #676767; - font-size: 13px; - padding-bottom: 12px; -} - -.c17 { - bottom: 0; - cursor: pointer; - left: 0; - position: absolute; - right: 0; - top: 0; - width: 100%; - z-index: 1; -} - -.c13 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - line-height: 16px; - min-height: 31px; - position: relative; -} - -.c10 { - display: inline-block; - grid-row-start: 2; - grid-column-start: 1; - height: 0; - overflow: hidden; - width: 0; -} - -.c40 { - font-weight: 200; -} - -.c15 { - font-weight: inherit; -} - -.c39 { - font-size: 13px; - font-weight: 500; -} - -.c38 { - font-weight: 800; - margin-right: 6px; -} - -.c37 { - color: #807373; - margin-top: 5px; -} - -.c14 { - -webkit-flex-shrink: 0; - -ms-flex-negative: 0; - flex-shrink: 0; -} - -.c3 { - position: relative; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); - height: 100%; -} - -.c5 { - width: 30px; - height: 30px; - border-radius: 50%; - position: absolute; - left: 50%; - top: 0; - -webkit-transform: translate(-51%,-10%); - -ms-transform: translate(-51%,-10%); - transform: translate(-51%,-10%); -} - -.c2 { - grid-column-start: 2; - grid-row: span 2; - padding-right: 5px; -} - -.c18 { - display: grid; - grid-template-columns: 100px auto; -} - -.c1 { - max-width: 500px; - display: grid; - grid-template-columns: 65px 30px auto; -} - -.c9 { - grid-column-start: 1; - grid-row: 1 / span 2; - padding-right: 5px; - font-size: 0.9em; -} - -.c32 { - padding: 3px 10px 3px 10px; - border: 0; - margin-top: -15px; - width: 35px; - height: 35px; -} - -.c32:hover { - cursor: pointer; -} - -.c30 { - -webkit-flex: 0 0 25px; - -ms-flex: 0 0 25px; - flex: 0 0 25px; - grid-column: -1; -} - -.c11 { - grid-row-start: 2; - grid-column-start: 3; -} - -.c7 { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - font-size: 1.2em; - grid-row-start: 1; - grid-column-start: 3; -} - -.c8 { - font-size: inherit; - font-weight: bold; - height: 1.2em; - margin: 0; - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; - -webkit-flex: 1 1 auto; - -ms-flex: 1 1 auto; - flex: 1 1 auto; - padding: 3px 0 10px 0; -} - -.c34 { - text-align: center; - min-width: 30px; - min-height: 30px; - font-size: 1.2em; - background-color: #084C8D; - color: white; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; - border: 1px solid; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - cursor: default; -} - -.c35 { - position: absolute; - width: 1px; - height: 1px; - padding: 0; - margin: -1px; - overflow: hidden; - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - border: 0; -} - -.c23 { - display: block; - list-style: none; - padding: 0; -} - -.c26 { - margin-left: 24px; - line-height: 1.25em; - padding-top: 1px; -} - -.c26 > span { - margin-right: 1ch; -} - -.c19 { - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - -webkit-align-self: center; - -ms-flex-item-align: center; - align-self: center; - margin-top: 10px; -} - -.c19 a { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; -} - -.c20 { - color: #676767; - font-size: 13px; - font-style: normal; - padding: 0; -} - -.c25 { - fill: #676767; - float: left; - height: 16px; - width: 16px; -} - -.c24 { - font-size: 13px; - margin-top: 8px; - color: #676767; - font-style: normal; -} - -.c27 { - font-weight: 500; -} - -.c28 { - font-weight: 200; - opacity: 0.8975; - padding-left: 1ch; -} - -.c36 { - font-weight: 200; - font-size: 0.9em; - margin-left: 10px; -} - -.c54 { - float: left; - margin-left: -36px; - color: #fff; -} - -.c55 { - color: #676767; - margin-top: 3px; -} - -.c53 { - z-index: 30; - position: relative; -} - -.c43 { - background-color: #eee; - border-radius: 4px; - color: #000; - display: block; - margin-top: 5px; - padding: 8px; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c47 { - -webkit-align-items: baseline; - -webkit-box-align: baseline; - -ms-flex-align: baseline; - align-items: baseline; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - gap: 5px; - margin-top: 0.5em; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c47:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c45 { - font-size: 12px; - margin-left: 30px; - white-space: pre-wrap; -} - -.c46 { - margin-top: 5px; - margin-left: 30px; - font-size: 12px; - font-style: italic; -} - -.c44 { - float: left; - font-size: 18px; -} - -.c42 { - display: block; - margin-top: 3px; - padding: 0; -} - -.c41 { - color: #d14727; - cursor: cursor; - display: inline-block; - font-weight: 400; - margin-top: 8px; - padding: 0; -} - -.c48 { - margin-top: 5px; -} - -.c49 { - color: #676767; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; -} - -.c51 { - font-size: 14px; -} - -.c50 { - padding: 0; -} - -
      -
    1. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - KGW Studio on the Sq, Portland, OR, USA - -
      -
      - 3:44 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 269 feet to - - Pioneer Square North MAX Station - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - NORTHWEST - on - - Unnamed Path - - - 167 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - LEFT - on - - Pioneer Sq N (path) - - - 101 feet - - -
        -
        3. -
      -
      -
      -       -
      -
      -
      - -
      -
      2. -
    2. -
      -
      -
      -
      -
      - - MA - - - MAX Blue Line - -
      -
      -
      -
      -
      - - Pioneer Square North MAX Station - - ID 8383 - - -
      -
      - 3:46 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - Ride - - -
      - - MAX Blue Line - -
      - - - MAX Blue Line - - to - - Hillsboro - - -       - - - - Disembark at - Providence Park MAX Station - - ID 9757 - - -       - -       -
      -
      - -
      -
      - -
      -
      -
      -
      - -
      -
      -
      -
      -
        -
      1. -
        - • -
        -
        - Galleria/SW 10th Ave MAX Station -
        -
        2. -
      -
      -
      -
      - - Typical wait: - 15 min - -
      -
      -
      -
      -
      - -
      -
      3. -
    3. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - Providence Park MAX Station - - ID 9757 - - -
      -
      - 3:49 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 249 feet to - - 1737 SW Morrison St, Portland, OR, USA 97205 - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - WEST - on - - Providence Park (path) - - - 19 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - RIGHT - on - - Unnamed Path - - - 104 feet - - -
        -
        3. -
      3. -
        - - - -
        -
        - - RIGHT - on - - Unnamed Path - - - 27 feet - - -
        -
        4. -
      4. -
        - - - -
        -
        - - RIGHT - on - - SW Morrison St - - - 99 feet - - -
        -
        5. -
      -
      -
      -       -
      -
      -
      - -
      -
      4. -
    4. -
      -
      -
      -
      - -
      -
      -
      -
      -
      - - 1737 SW Morrison St, Portland, OR, USA 97205 - -
      -
      - 3:50 PM -
      - - Arrive at - 1737 SW Morrison St, Portland, OR, USA 97205 - -
      -
      - -
      -
      5. -
    -`; - -exports[`Storyshots ItineraryBody/otp-ui Three Alerts Not Always Collapsing 1`] = ` - - - -`; - -exports[`Storyshots ItineraryBody/otp-ui Three Alerts Not Always Collapsing 2`] = ` -.c22 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c57 { - color: #f44256; -} - -.c29 { - border-top-style: solid; - border-top-width: 0; - padding-top: 0; - padding-bottom: 10px; -} - -.c16 { - background: transparent; - border: 0; - color: inherit; - cursor: pointer; - font-size: inherit; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c31 { - color: #008; - margin-left: 5px; -} - -.c31:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c6 { - color: black; - background-color: #e9e9e9; - border: 2px solid #bbb; - text-align: center; - width: 25px; - height: 25px; - font-size: 1.2em; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; -} - -.c21::before { - content: ""; - margin: 0 0.125em; -} - -.c56 { - text-align: center; -} - -.c4 { - border-left: dotted 4px #484848; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c33 { - border-left: solid 8px #084C8D; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c52 { - display: block; - font-size: 13px; - list-style: none; - padding: 0; -} - -.c0 { - list-style: none; - padding: 0; -} - -.c12 { - color: #676767; - font-size: 13px; - padding-bottom: 12px; -} - -.c17 { - bottom: 0; - cursor: pointer; - left: 0; - position: absolute; - right: 0; - top: 0; - width: 100%; - z-index: 1; -} - -.c13 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - line-height: 16px; - min-height: 31px; - position: relative; -} - -.c10 { - display: inline-block; - grid-row-start: 2; - grid-column-start: 1; - height: 0; - overflow: hidden; - width: 0; -} - -.c40 { - font-weight: 200; -} - -.c15 { - font-weight: inherit; -} - -.c39 { - font-size: 13px; - font-weight: 500; -} - -.c38 { - font-weight: 800; - margin-right: 6px; -} - -.c37 { - color: #807373; - margin-top: 5px; -} - -.c14 { - -webkit-flex-shrink: 0; - -ms-flex-negative: 0; - flex-shrink: 0; -} - -.c3 { - position: relative; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); - height: 100%; -} - -.c5 { - width: 30px; - height: 30px; - border-radius: 50%; - position: absolute; - left: 50%; - top: 0; - -webkit-transform: translate(-51%,-10%); - -ms-transform: translate(-51%,-10%); - transform: translate(-51%,-10%); -} - -.c2 { - grid-column-start: 2; - grid-row: span 2; - padding-right: 5px; -} - -.c18 { - display: grid; - grid-template-columns: 100px auto; -} - -.c1 { - max-width: 500px; - display: grid; - grid-template-columns: 65px 30px auto; -} - -.c9 { - grid-column-start: 1; - grid-row: 1 / span 2; - padding-right: 5px; - font-size: 0.9em; -} - -.c32 { - padding: 3px 10px 3px 10px; - border: 0; - margin-top: -15px; - width: 35px; - height: 35px; -} - -.c32:hover { - cursor: pointer; -} - -.c30 { - -webkit-flex: 0 0 25px; - -ms-flex: 0 0 25px; - flex: 0 0 25px; - grid-column: -1; -} - -.c11 { - grid-row-start: 2; - grid-column-start: 3; -} - -.c7 { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - font-size: 1.2em; - grid-row-start: 1; - grid-column-start: 3; -} - -.c8 { - font-size: inherit; - font-weight: bold; - height: 1.2em; - margin: 0; - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; - -webkit-flex: 1 1 auto; - -ms-flex: 1 1 auto; - flex: 1 1 auto; - padding: 3px 0 10px 0; -} - -.c34 { - text-align: center; - min-width: 30px; - min-height: 30px; - font-size: 1.2em; - background-color: #084C8D; - color: white; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; - border: 1px solid; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - cursor: default; -} - -.c35 { - position: absolute; - width: 1px; - height: 1px; - padding: 0; - margin: -1px; - overflow: hidden; - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - border: 0; -} - -.c23 { - display: block; - list-style: none; - padding: 0; -} - -.c26 { - margin-left: 24px; - line-height: 1.25em; - padding-top: 1px; -} - -.c26 > span { - margin-right: 1ch; -} - -.c19 { - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - -webkit-align-self: center; - -ms-flex-item-align: center; - align-self: center; - margin-top: 10px; -} - -.c19 a { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; -} - -.c20 { - color: #676767; - font-size: 13px; - font-style: normal; - padding: 0; -} - -.c25 { - fill: #676767; - float: left; - height: 16px; - width: 16px; -} - -.c24 { - font-size: 13px; - margin-top: 8px; - color: #676767; - font-style: normal; -} - -.c27 { - font-weight: 500; -} - -.c28 { - font-weight: 200; - opacity: 0.8975; - padding-left: 1ch; -} - -.c36 { - font-weight: 200; - font-size: 0.9em; - margin-left: 10px; -} - -.c54 { - float: left; - margin-left: -36px; - color: #fff; -} - -.c55 { - color: #676767; - margin-top: 3px; -} - -.c53 { - z-index: 30; - position: relative; -} - -.c43 { - background-color: #eee; - border-radius: 4px; - color: #000; - display: block; - margin-top: 5px; - padding: 8px; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c47 { - -webkit-align-items: baseline; - -webkit-box-align: baseline; - -ms-flex-align: baseline; - align-items: baseline; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - gap: 5px; - margin-top: 0.5em; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c47:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c45 { - font-size: 12px; - margin-left: 30px; - white-space: pre-wrap; -} - -.c46 { - margin-top: 5px; - margin-left: 30px; - font-size: 12px; - font-style: italic; -} - -.c44 { - float: left; - font-size: 18px; -} - -.c42 { - display: block; - margin-top: 3px; - padding: 0; -} - -.c41 { - color: #d14727; - cursor: cursor; - display: inline-block; - font-weight: 400; - margin-top: 8px; - padding: 0; -} - -.c48 { - margin-top: 5px; -} - -.c49 { - color: #676767; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; -} - -.c51 { - font-size: 14px; -} - -.c50 { - padding: 0; -} - -
      -
    1. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - KGW Studio on the Sq, Portland, OR, USA - -
      -
      - 3:44 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 269 feet to - - Pioneer Square North MAX Station - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - NORTHWEST - on - - Unnamed Path - - - 167 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - LEFT - on - - Pioneer Sq N (path) - - - 101 feet - - -
        -
        3. -
      -
      -
      -       -
      -
      -
      - -
      -
      2. -
    2. -
      -
      -
      -
      -
      - - MA - - - MAX Blue Line - -
      -
      -
      -
      -
      - - Pioneer Square North MAX Station - - ID 8383 - - -
      -
      - 3:46 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - Ride - - -
      - - MAX Blue Line - -
      - - - MAX Blue Line - - to - - Hillsboro - - -       - - - - Disembark at - Providence Park MAX Station - - ID 9757 - - -       - -       -
      -
      - -
      -
      - -
      -
      -
      -
      - -
      -
      -
      -
      -
        -
      1. -
        - • -
        -
        - Galleria/SW 10th Ave MAX Station -
        -
        2. -
      -
      -
      -
      - - Typical wait: - 15 min - -
      -
      -
      -
      -
      - -
      -
      3. -
    3. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - Providence Park MAX Station - - ID 9757 - - -
      -
      - 3:49 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 249 feet to - - 1737 SW Morrison St, Portland, OR, USA 97205 - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - WEST - on - - Providence Park (path) - - - 19 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - RIGHT - on - - Unnamed Path - - - 104 feet - - -
        -
        3. -
      3. -
        - - - -
        -
        - - RIGHT - on - - Unnamed Path - - - 27 feet - - -
        -
        4. -
      4. -
        - - - -
        -
        - - RIGHT - on - - SW Morrison St - - - 99 feet - - -
        -
        5. -
      -
      -
      -       -
      -
      -
      - -
      -
      4. -
    4. -
      -
      -
      -
      - -
      -
      -
      -
      -
      - - 1737 SW Morrison St, Portland, OR, USA 97205 - -
      -
      - 3:50 PM -
      - - Arrive at - 1737 SW Morrison St, Portland, OR, USA 97205 - -
      -
      - -
      -
      5. -
    -`; - -exports[`Storyshots ItineraryBody/otp-ui Three Alerts Without Collapsing Prop 1`] = ` - - - -`; - -exports[`Storyshots ItineraryBody/otp-ui Three Alerts Without Collapsing Prop 2`] = ` -.c22 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c57 { - color: #f44256; -} - -.c29 { - border-top-style: solid; - border-top-width: 0; - padding-top: 0; - padding-bottom: 10px; -} - -.c16 { - background: transparent; - border: 0; - color: inherit; - cursor: pointer; - font-size: inherit; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c31 { - color: #008; - margin-left: 5px; -} - -.c31:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c6 { - color: black; - background-color: #e9e9e9; - border: 2px solid #bbb; - text-align: center; - width: 25px; - height: 25px; - font-size: 1.2em; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; -} - -.c21::before { - content: ""; - margin: 0 0.125em; -} - -.c56 { - text-align: center; -} - -.c4 { - border-left: dotted 4px #484848; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c33 { - border-left: solid 8px #084C8D; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c52 { - display: block; - font-size: 13px; - list-style: none; - padding: 0; -} - -.c0 { - list-style: none; - padding: 0; -} - -.c12 { - color: #676767; - font-size: 13px; - padding-bottom: 12px; -} - -.c17 { - bottom: 0; - cursor: pointer; - left: 0; - position: absolute; - right: 0; - top: 0; - width: 100%; - z-index: 1; -} - -.c13 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - line-height: 16px; - min-height: 31px; - position: relative; -} - -.c10 { - display: inline-block; - grid-row-start: 2; - grid-column-start: 1; - height: 0; - overflow: hidden; - width: 0; -} - -.c40 { - font-weight: 200; -} - -.c15 { - font-weight: inherit; -} - -.c39 { - font-size: 13px; - font-weight: 500; -} - -.c38 { - font-weight: 800; - margin-right: 6px; -} - -.c37 { - color: #807373; - margin-top: 5px; -} - -.c14 { - -webkit-flex-shrink: 0; - -ms-flex-negative: 0; - flex-shrink: 0; -} - -.c3 { - position: relative; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); - height: 100%; -} - -.c5 { - width: 30px; - height: 30px; - border-radius: 50%; - position: absolute; - left: 50%; - top: 0; - -webkit-transform: translate(-51%,-10%); - -ms-transform: translate(-51%,-10%); - transform: translate(-51%,-10%); -} - -.c2 { - grid-column-start: 2; - grid-row: span 2; - padding-right: 5px; -} - -.c18 { - display: grid; - grid-template-columns: 100px auto; -} - -.c1 { - max-width: 500px; - display: grid; - grid-template-columns: 65px 30px auto; -} - -.c9 { - grid-column-start: 1; - grid-row: 1 / span 2; - padding-right: 5px; - font-size: 0.9em; -} - -.c32 { - padding: 3px 10px 3px 10px; - border: 0; - margin-top: -15px; - width: 35px; - height: 35px; -} - -.c32:hover { - cursor: pointer; -} - -.c30 { - -webkit-flex: 0 0 25px; - -ms-flex: 0 0 25px; - flex: 0 0 25px; - grid-column: -1; -} - -.c11 { - grid-row-start: 2; - grid-column-start: 3; -} - -.c7 { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - font-size: 1.2em; - grid-row-start: 1; - grid-column-start: 3; -} - -.c8 { - font-size: inherit; - font-weight: bold; - height: 1.2em; - margin: 0; - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; - -webkit-flex: 1 1 auto; - -ms-flex: 1 1 auto; - flex: 1 1 auto; - padding: 3px 0 10px 0; -} - -.c34 { - text-align: center; - min-width: 30px; - min-height: 30px; - font-size: 1.2em; - background-color: #084C8D; - color: white; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; - border: 1px solid; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - cursor: default; -} - -.c35 { - position: absolute; - width: 1px; - height: 1px; - padding: 0; - margin: -1px; - overflow: hidden; - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - border: 0; -} - -.c23 { - display: block; - list-style: none; - padding: 0; -} - -.c26 { - margin-left: 24px; - line-height: 1.25em; - padding-top: 1px; -} - -.c26 > span { - margin-right: 1ch; -} - -.c19 { - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - -webkit-align-self: center; - -ms-flex-item-align: center; - align-self: center; - margin-top: 10px; -} - -.c19 a { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; -} - -.c20 { - color: #676767; - font-size: 13px; - font-style: normal; - padding: 0; -} - -.c25 { - fill: #676767; - float: left; - height: 16px; - width: 16px; -} - -.c24 { - font-size: 13px; - margin-top: 8px; - color: #676767; - font-style: normal; -} - -.c27 { - font-weight: 500; -} - -.c28 { - font-weight: 200; - opacity: 0.8975; - padding-left: 1ch; -} - -.c36 { - font-weight: 200; - font-size: 0.9em; - margin-left: 10px; -} - -.c54 { - float: left; - margin-left: -36px; - color: #fff; -} - -.c55 { - color: #676767; - margin-top: 3px; -} - -.c53 { - z-index: 30; - position: relative; -} - -.c43 { - background-color: #eee; - border-radius: 4px; - color: #000; - display: block; - margin-top: 5px; - padding: 8px; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c47 { - -webkit-align-items: baseline; - -webkit-box-align: baseline; - -ms-flex-align: baseline; - align-items: baseline; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - gap: 5px; - margin-top: 0.5em; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c47:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c45 { - font-size: 12px; - margin-left: 30px; - white-space: pre-wrap; -} - -.c46 { - margin-top: 5px; - margin-left: 30px; - font-size: 12px; - font-style: italic; -} - -.c44 { - float: left; - font-size: 18px; -} - -.c42 { - display: block; - margin-top: 3px; - padding: 0; -} - -.c41 { - color: #d14727; - cursor: cursor; - display: inline-block; - font-weight: 400; - margin-top: 8px; - padding: 0; -} - -.c48 { - margin-top: 5px; -} - -.c49 { - color: #676767; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; -} - -.c51 { - font-size: 14px; -} - -.c50 { - padding: 0; -} - -
      -
    1. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - KGW Studio on the Sq, Portland, OR, USA - -
      -
      - 3:44 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 269 feet to - - Pioneer Square North MAX Station - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - NORTHWEST - on - - Unnamed Path - - - 167 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - LEFT - on - - Pioneer Sq N (path) - - - 101 feet - - -
        -
        3. -
      -
      -
      -       -
      -
      -
      - -
      -
      2. -
    2. -
      -
      -
      -
      -
      - - MA - - - MAX Blue Line - -
      -
      -
      -
      -
      - - Pioneer Square North MAX Station - - ID 8383 - - -
      -
      - 3:46 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - Ride - - -
      - - MAX Blue Line - -
      - - - MAX Blue Line - - to - - Hillsboro - - -       - - - - Disembark at - Providence Park MAX Station - - ID 9757 - - -       - -       -
      -
      - -
      -
      - -
      -
      -
      -
      - -
      -
      -
      -
      -
        -
      1. -
        - • -
        -
        - Galleria/SW 10th Ave MAX Station -
        -
        2. -
      -
      -
      -
      - - Typical wait: - 15 min - -
      -
      -
      -
      -
      - -
      -
      3. -
    3. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - Providence Park MAX Station - - ID 9757 - - -
      -
      - 3:49 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 249 feet to - - 1737 SW Morrison St, Portland, OR, USA 97205 - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - WEST - on - - Providence Park (path) - - - 19 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - RIGHT - on - - Unnamed Path - - - 104 feet - - -
        -
        3. -
      3. -
        - - - -
        -
        - - RIGHT - on - - Unnamed Path - - - 27 feet - - -
        -
        4. -
      4. -
        - - - -
        -
        - - RIGHT - on - - SW Morrison St - - - 99 feet - - -
        -
        5. -
      -
      -
      -       -
      -
      -
      - -
      -
      4. -
    4. -
      -
      -
      -
      - -
      -
      -
      -
      -
      - - 1737 SW Morrison St, Portland, OR, USA 97205 - -
      -
      - 3:50 PM -
      - - Arrive at - 1737 SW Morrison St, Portland, OR, USA 97205 - -
      -
      - -
      -
      5. -
    -`; - -exports[`Storyshots ItineraryBody/otp-ui Tnc Transit Itinerary 1`] = ` - - - -`; - -exports[`Storyshots ItineraryBody/otp-ui Tnc Transit Itinerary 2`] = ` -.c41 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c52 { - color: #f44256; -} - -.c21 { - border-top-style: solid; - border-top-width: 0; - padding-top: 0; - padding-bottom: 10px; -} - -.c17 { - background: transparent; - border: 0; - color: inherit; - cursor: pointer; - font-size: inherit; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c20 { - background-color: #fff; - background-image: none; - border-radius: 4px; - border: 1px solid #ccc; - color: #333; - cursor: pointer; - display: inline-block; - font-size: 14px; - font-weight: 400; - padding: 4px 6px; - text-align: center; - -webkit-text-decoration: none; - text-decoration: none; - touch-action: manipulation; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - white-space: nowrap; -} - -.c20:hover { - color: #333; - background-color: #e6e6e6; - border-color: #adadad; -} - -.c20:active { - color: #333; - background-color: #e6e6e6; - background-image: none; - border-color: #adadad; - outline: 0; - box-shadow: inset 0 3px 5px rgba(0,0,0,0.125); -} - -.c20:focus { - color: #333; - background-color: #e6e6e6; - border-color: #8c8c8c; -} - -.c20:active:hover { - color: #333; - background-color: #d4d4d4; - border-color: #8c8c8c; -} - -.c23 { - color: #008; - margin-left: 5px; -} - -.c23:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c6 { - color: black; - background-color: grey; - border: 2px solid #bbb; - text-align: center; - width: 25px; - height: 25px; - font-size: 1.2em; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; -} - -.c26 { - color: black; - background-color: #e9e9e9; - border: 2px solid #bbb; - text-align: center; - width: 25px; - height: 25px; - font-size: 1.2em; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; -} - -.c48 { - bottom: 0; - left: 110px; - position: absolute; - right: 0; - top: 0; -} - -.c49 { - background-color: #fcf9d3; - display: table; - height: 100%; - width: 100%; -} - -.c47 { - border-bottom: 16px solid transparent; - border-right: 16px solid #fcf9d3; - border-top: 16px solid transparent; - height: 0; - left: 94px; - position: absolute; - top: 0; - width: 0; -} - -.c50 { - color: #444; - display: table-cell; - font-style: italic; - line-height: 0.95; - padding: 0px 2px; - vertical-align: middle; -} - -.c19 { - height: 32px; - margin-bottom: 10px; - margin-top: 10px; - position: relative; -} - -.c40::before { - content: ""; - margin: 0 0.125em; -} - -.c51 { - text-align: center; -} - -.c4 { - border-left: dotted 4px grey; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c25 { - border-left: dotted 4px #484848; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c31 { - border-left: solid 8px #008ab0; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c43 { - display: block; - font-size: 13px; - list-style: none; - padding: 0; -} - -.c0 { - list-style: none; - padding: 0; -} - -.c13 { - color: #676767; - font-size: 13px; - padding-bottom: 12px; -} - -.c18 { - bottom: 0; - cursor: pointer; - left: 0; - position: absolute; - right: 0; - top: 0; - width: 100%; - z-index: 1; -} - -.c14 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - line-height: 16px; - min-height: 31px; - position: relative; -} - -.c10 { - display: inline-block; - grid-row-start: 2; - grid-column-start: 1; - height: 0; - overflow: hidden; - width: 0; -} - -.c16 { - font-weight: inherit; -} - -.c36 { - font-size: 13px; - font-weight: 500; -} - -.c35 { - font-weight: 800; - margin-right: 6px; -} - -.c34 { - color: #807373; - margin-top: 5px; -} - -.c15 { - -webkit-flex-shrink: 0; - -ms-flex-negative: 0; - flex-shrink: 0; -} - -.c3 { - position: relative; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); - height: 100%; -} - -.c5 { - width: 30px; - height: 30px; - border-radius: 50%; - position: absolute; - left: 50%; - top: 0; - -webkit-transform: translate(-51%,-10%); - -ms-transform: translate(-51%,-10%); - transform: translate(-51%,-10%); -} - -.c2 { - grid-column-start: 2; - grid-row: span 2; - padding-right: 5px; -} - -.c27 { - display: grid; - grid-template-columns: 100px auto; -} - -.c1 { - max-width: 500px; - display: grid; - grid-template-columns: 65px 30px auto; -} - -.c9 { - grid-column-start: 1; - grid-row: 1 / span 2; - padding-right: 5px; - font-size: 0.9em; -} - -.c24 { - padding: 3px 10px 3px 10px; - border: 0; - margin-top: -15px; - width: 35px; - height: 35px; -} - -.c24:hover { - cursor: pointer; -} - -.c22 { - -webkit-flex: 0 0 25px; - -ms-flex: 0 0 25px; - flex: 0 0 25px; - grid-column: -1; -} - -.c11 { - grid-row-start: 2; - grid-column-start: 3; -} - -.c7 { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - font-size: 1.2em; - grid-row-start: 1; - grid-column-start: 3; -} - -.c8 { - font-size: inherit; - font-weight: bold; - height: 1.2em; - margin: 0; - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; - -webkit-flex: 1 1 auto; - -ms-flex: 1 1 auto; - flex: 1 1 auto; - padding: 3px 0 10px 0; -} - -.c12 { - color: #807373; - font-size: 13px; - font-weight: 300; - padding-top: 1px; - margin-bottom: 10px; - margin-top: -14px; -} - -.c32 { - text-align: center; - min-width: 30px; - min-height: 30px; - font-size: 1.2em; - background-color: #084c8d; - color: white; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; - border: 1px solid; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - cursor: default; -} - -.c33 { - position: absolute; - width: 1px; - height: 1px; - padding: 0; - margin: -1px; - overflow: hidden; - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - border: 0; -} - -.c30 { - display: block; - list-style: none; - padding: 0; -} - -.c28 { - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - -webkit-align-self: center; - -ms-flex-item-align: center; - align-self: center; - margin-top: 10px; -} - -.c28 a { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; -} - -.c29 { - color: #676767; - font-size: 13px; - font-style: normal; - padding: 0; -} - -.c45 { - float: left; - margin-left: -36px; - color: #fff; -} - -.c46 { - color: #676767; - margin-top: 3px; -} - -.c44 { - z-index: 30; - position: relative; -} - -.c37 { - margin-top: 5px; -} - -.c38 { - color: #676767; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; -} - -.c42 { - font-size: 14px; -} - -.c39 { - padding: 0; -} - -
      -
    1. -
      -
      -
      -
      -
      - - - Travel by car - - - - - - -
      -
      -
      -
      -
      - - 128 NW 12th Ave, Portland - -
      -
      - 10:58 AM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - Wait 4 minutes for pickup -
      -
      -
      - - - - - - - - Ride 0.4 miles to - - West Burnside Street - - - - -
      - -
      - Estimated travel time: - 2 min - (does not account for traffic) -
      -
      - Estimated cost: - $17.00 - - - $19.00 -
      -
      -
      -
      -
      - -
      -
      2. -
    2. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - West Burnside Street - -
      -
      - 11:01 AM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk to - - W Burnside & SW 6th - - - - -
      - - - - -
      -
      -
        -
      -
      -       -
      -
      -
      - -
      -
      3. -
    3. -
      -
      -
      -
      -
      - - 20 - - - Burnside/Stark - -
      -
      -
      -
      -
      - - W Burnside & SW 6th - -
      -
      - 11:02 AM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - Ride - - -
      - - 20 - -
      - - - Burnside/Stark - - -       - - - - Disembark at - E Burnside & SE 12th - -       - -       -
      -
      -
      -
      -
      -
      -
      - -
      -
      -
      -
      -
        -
      1. -
        - • -
        -
        - W Burnside & SW 2nd -
        -
        2. -
      2. -
        - • -
        -
        - E Burnside & SE 8th -
        -
        3. -
      -
      -
      -
      -
      -
      -
      -
      -
      - -
      -
      4. -
    4. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - E Burnside & SE 12th - -
      -
      - 11:08 AM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk to - - East Burnside Street - - - - -
      - - - - -
      -
      -
        -
      -
      -       -
      -
      -
      - -
      -
      5. -
    5. -
      -
      -
      -
      -
      - - - Travel by car - - - - - - -
      -
      -
      -
      -
      - - East Burnside Street - -
      -
      - 11:09 AM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - Wait for pickup -
      -
      -
      - - - - - - - - Ride 0.2 miles to - - 407 NE 12th Ave, Portland - - - - -
      -
      - - Book Ride - -
      -
      -
      -
      - Wait until 11:08 AM to book -
      -
      -
      -
      -
      - Estimated travel time: - 1 min - (does not account for traffic) -
      -
      - Estimated cost: - $17.00 - - - $18.00 -
      -
      -
      -
      -
      - -
      -
      6. -
    6. -
      -
      -
      -
      - -
      -
      -
      -
      -
      - - 407 NE 12th Ave, Portland - -
      -
      - 11:10 AM -
      - - Arrive at - 407 NE 12th Ave, Portland - -
      -
      - -
      -
      7. -
    -`; - -exports[`Storyshots ItineraryBody/otp-ui Two Alert Without Collapsing Prop 1`] = ` - - - -`; - -exports[`Storyshots ItineraryBody/otp-ui Two Alert Without Collapsing Prop 2`] = ` -.c22 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c59 { - color: #f44256; -} - -.c29 { - border-top-style: solid; - border-top-width: 0; - padding-top: 0; - padding-bottom: 10px; -} - -.c16 { - background: transparent; - border: 0; - color: inherit; - cursor: pointer; - font-size: inherit; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c31 { - color: #008; - margin-left: 5px; -} - -.c31:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c6 { - color: black; - background-color: grey; - border: 2px solid #bbb; - text-align: center; - width: 25px; - height: 25px; - font-size: 1.2em; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; -} - -.c34 { - color: black; - background-color: #e9e9e9; - border: 2px solid #bbb; - text-align: center; - width: 25px; - height: 25px; - font-size: 1.2em; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; -} - -.c21::before { - content: ""; - margin: 0 0.125em; -} - -.c58 { - text-align: center; -} - -.c4 { - border-left: dotted 4px grey; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c33 { - border-left: dotted 4px #484848; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c35 { - border-left: solid 8px #084C8D; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c54 { - display: block; - font-size: 13px; - list-style: none; - padding: 0; -} - -.c0 { - list-style: none; - padding: 0; -} - -.c12 { - color: #676767; - font-size: 13px; - padding-bottom: 12px; -} - -.c17 { - bottom: 0; - cursor: pointer; - left: 0; - position: absolute; - right: 0; - top: 0; - width: 100%; - z-index: 1; -} - -.c13 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - line-height: 16px; - min-height: 31px; - position: relative; -} - -.c10 { - display: inline-block; - grid-row-start: 2; - grid-column-start: 1; - height: 0; - overflow: hidden; - width: 0; -} - -.c42 { - font-weight: 200; -} - -.c15 { - font-weight: inherit; -} - -.c41 { - font-size: 13px; - font-weight: 500; -} - -.c40 { - font-weight: 800; - margin-right: 6px; -} - -.c39 { - color: #807373; - margin-top: 5px; -} - -.c14 { - -webkit-flex-shrink: 0; - -ms-flex-negative: 0; - flex-shrink: 0; -} - -.c3 { - position: relative; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); - height: 100%; -} - -.c5 { - width: 30px; - height: 30px; - border-radius: 50%; - position: absolute; - left: 50%; - top: 0; - -webkit-transform: translate(-51%,-10%); - -ms-transform: translate(-51%,-10%); - transform: translate(-51%,-10%); -} - -.c2 { - grid-column-start: 2; - grid-row: span 2; - padding-right: 5px; -} - -.c18 { - display: grid; - grid-template-columns: 100px auto; -} - -.c1 { - max-width: 500px; - display: grid; - grid-template-columns: 65px 30px auto; -} - -.c9 { - grid-column-start: 1; - grid-row: 1 / span 2; - padding-right: 5px; - font-size: 0.9em; -} - -.c32 { - padding: 3px 10px 3px 10px; - border: 0; - margin-top: -15px; - width: 35px; - height: 35px; -} - -.c32:hover { - cursor: pointer; -} - -.c30 { - -webkit-flex: 0 0 25px; - -ms-flex: 0 0 25px; - flex: 0 0 25px; - grid-column: -1; -} - -.c11 { - grid-row-start: 2; - grid-column-start: 3; -} - -.c7 { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - font-size: 1.2em; - grid-row-start: 1; - grid-column-start: 3; -} - -.c8 { - font-size: inherit; - font-weight: bold; - height: 1.2em; - margin: 0; - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; - -webkit-flex: 1 1 auto; - -ms-flex: 1 1 auto; - flex: 1 1 auto; - padding: 3px 0 10px 0; -} - -.c36 { - text-align: center; - min-width: 30px; - min-height: 30px; - font-size: 1.2em; - background-color: #084C8D; - color: white; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; - border: 1px solid; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - cursor: default; -} - -.c37 { - position: absolute; - width: 1px; - height: 1px; - padding: 0; - margin: -1px; - overflow: hidden; - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - border: 0; -} - -.c23 { - display: block; - list-style: none; - padding: 0; -} - -.c26 { - margin-left: 24px; - line-height: 1.25em; - padding-top: 1px; -} - -.c26 > span { - margin-right: 1ch; -} - -.c19 { - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - -webkit-align-self: center; - -ms-flex-item-align: center; - align-self: center; - margin-top: 10px; -} - -.c19 a { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; -} - -.c20 { - color: #676767; - font-size: 13px; - font-style: normal; - padding: 0; -} - -.c25 { - fill: #676767; - float: left; - height: 16px; - width: 16px; -} - -.c24 { - font-size: 13px; - margin-top: 8px; - color: #676767; - font-style: normal; -} - -.c27 { - font-weight: 500; -} - -.c28 { - font-weight: 200; - opacity: 0.8975; - padding-left: 1ch; -} - -.c38 { - font-weight: 200; - font-size: 0.9em; - margin-left: 10px; -} - -.c56 { - float: left; - margin-left: -36px; - color: #fff; -} - -.c57 { - color: #676767; - margin-top: 3px; -} - -.c55 { - z-index: 30; - position: relative; -} - -.c45 { - background-color: #eee; - border-radius: 4px; - color: #000; - display: block; - margin-top: 5px; - padding: 8px; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c49 { - -webkit-align-items: baseline; - -webkit-box-align: baseline; - -ms-flex-align: baseline; - align-items: baseline; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - gap: 5px; - margin-top: 0.5em; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c49:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c47 { - font-size: 12px; - margin-left: 30px; - white-space: pre-wrap; -} - -.c48 { - margin-top: 5px; - margin-left: 30px; - font-size: 12px; - font-style: italic; -} - -.c46 { - float: left; - font-size: 18px; -} - -.c44 { - display: block; - margin-top: 3px; - padding: 0; -} - -.c43 { - color: #d14727; - cursor: auto; - display: inline-block; - font-weight: 400; - margin-top: 8px; - padding: 0; -} - -.c50 { - margin-top: 5px; -} - -.c51 { - color: #676767; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; -} - -.c53 { - font-size: 14px; -} - -.c52 { - padding: 0; -} - -
      -
    1. -
      -
      -
      -
      -
      - - - Travel by car - - - - -
      -
      -
      -
      -
      - - 330 SW Murray Blvd, Washington County, OR, USA 97005 - -
      -
      - 3:50 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Drive 2.4 miles to - - P+R Sunset TC - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - SOUTHWEST - on - - parking aisle - - - 158 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - RIGHT - on - - SW Murray Blvd - - - 0.2 miles - - -
        -
        3. -
      3. -
        - - - -
        -
        - - CONTINUE - on - - NW Murray Blvd - - - 150 feet - - -
        -
        4. -
      4. -
        - - - -
        -
        - - SLIGHTLY_RIGHT - on - - NW Murray Blvd - - - 0.4 miles - - -
        -
        5. -
      5. -
        - - - -
        -
        - - CONTINUE - on - - NW Sunset Hwy - - - 0.6 miles - - -
        -
        6. -
      6. -
        - - - -
        -
        - - CONTINUE - on - - NW Sunset Hwy - - - 0.3 miles - - -
        -
        7. -
      7. -
        - - - -
        -
        - - LEFT - on - - SW Cedar Hills Blvd - - - 0.2 miles - - -
        -
        8. -
      8. -
        - - - -
        -
        - - RIGHT - on - - SW Barnes Rd - - - 0.5 miles - - -
        -
        9. -
      9. -
        - - - -
        -
        - - RIGHT - on - - service road - - - 0.2 miles - - -
        -
        10. -
      10. -
        - - - -
        -
        - - RIGHT - on - - Sunset TC - - - 76 feet - - -
        -
        11. -
      -
      -
      -       -
      -
      -
      - -
      -
      2. -
    2. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - P+R Sunset TC - -
      -
      - 4:02 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 426 feet to - - Sunset TC MAX Station - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - SLIGHTLY_RIGHT - on - - Unnamed Path - - - 16 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - LEFT - on - - steps - - - 232 feet - - -
        -
        3. -
      3. -
        - - - -
        -
        - - LEFT - on - - Unnamed Path - - - 19 feet - - -
        -
        4. -
      4. -
        - - - -
        -
        - - RIGHT - on - - Sunset TC (path) - - - 159 feet - - -
        -
        5. -
      -
      -
      -       -
      -
      -
      - -
      -
      3. -
    3. -
      -
      -
      -
      -
      - - MA - - - MAX Blue Line - -
      -
      -
      -
      -
      - - Sunset TC MAX Station - - ID 9969 - - -
      -
      - 4:05 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - Ride - - -
      - - MAX Blue Line - -
      - - - MAX Blue Line - - to - - Gresham - - -       - - - - Disembark at - Oak/ SW 1st Ave MAX Station - - ID 8337 - - -       - -       -
      -
      -
      - - - 2 alerts -
      -
      -
      - -
      -
      -
      -
      - -
      -
      -
      -
      -
        -
      1. -
        - • -
        -
        - Washington Park MAX Station -
        -
        2. -
      2. -
        - • -
        -
        - Goose Hollow/SW Jefferson St MAX Station -
        -
        3. -
      3. -
        - • -
        -
        - Kings Hill/SW Salmon St MAX Station -
        -
        4. -
      4. -
        - • -
        -
        - Providence Park MAX Station -
        -
        5. -
      5. -
        - • -
        -
        - Library/SW 9th Ave MAX Station -
        -
        6. -
      6. -
        - • -
        -
        - Pioneer Square South MAX Station -
        -
        7. -
      7. -
        - • -
        -
        - Mall/SW 4th Ave MAX Station -
        -
        8. -
      8. -
        - • -
        -
        - Yamhill District MAX Station -
        -
        9. -
      -
      -
      -
      -
      -
      -
      -
      -
      - -
      -
      4. -
    4. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - Oak/ SW 1st Ave MAX Station - - ID 8337 - - -
      -
      - 4:27 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 0.1 miles to - - 205 SW Pine St, Portland, OR, USA 97204 - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - NORTHEAST - on - - Oak/SW 1st Ave (path) - - - 13 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - CONTINUE - on - - Unnamed Path - - - 27 feet - - -
        -
        3. -
      3. -
        - - - -
        -
        - - LEFT - on - - SW Oak St - - - 37 feet - - -
        -
        4. -
      4. -
        - - - -
        -
        - - RIGHT - on - - SW 1st Ave - - - 260 feet - - -
        -
        5. -
      5. -
        - - - -
        -
        - - LEFT - on - - SW Pine St - - - 337 feet - - -
        -
        6. -
      -
      -
      -       -
      -
      -
      - -
      -
      5. -
    5. -
      -
      -
      -
      - -
      -
      -
      -
      -
      - - 205 SW Pine St, Portland, OR, USA 97204 - -
      -
      - 4:29 PM -
      - - Arrive at - 205 SW Pine St, Portland, OR, USA 97204 - -
      -
      - -
      -
      6. -
    -`; - -exports[`Storyshots ItineraryBody/otp-ui Two Alerts Always Collapsing 1`] = ` - - - -`; - -exports[`Storyshots ItineraryBody/otp-ui Two Alerts Always Collapsing 2`] = ` -.c22 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c59 { - color: #f44256; -} - -.c29 { - border-top-style: solid; - border-top-width: 0; - padding-top: 0; - padding-bottom: 10px; -} - -.c16 { - background: transparent; - border: 0; - color: inherit; - cursor: pointer; - font-size: inherit; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c31 { - color: #008; - margin-left: 5px; -} - -.c31:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c6 { - color: black; - background-color: grey; - border: 2px solid #bbb; - text-align: center; - width: 25px; - height: 25px; - font-size: 1.2em; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; -} - -.c34 { - color: black; - background-color: #e9e9e9; - border: 2px solid #bbb; - text-align: center; - width: 25px; - height: 25px; - font-size: 1.2em; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; -} - -.c21::before { - content: ""; - margin: 0 0.125em; -} - -.c58 { - text-align: center; -} - -.c4 { - border-left: dotted 4px grey; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c33 { - border-left: dotted 4px #484848; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c35 { - border-left: solid 8px #084C8D; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c54 { - display: block; - font-size: 13px; - list-style: none; - padding: 0; -} - -.c0 { - list-style: none; - padding: 0; -} - -.c12 { - color: #676767; - font-size: 13px; - padding-bottom: 12px; -} - -.c17 { - bottom: 0; - cursor: pointer; - left: 0; - position: absolute; - right: 0; - top: 0; - width: 100%; - z-index: 1; -} - -.c13 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - line-height: 16px; - min-height: 31px; - position: relative; -} - -.c10 { - display: inline-block; - grid-row-start: 2; - grid-column-start: 1; - height: 0; - overflow: hidden; - width: 0; -} - -.c42 { - font-weight: 200; -} - -.c15 { - font-weight: inherit; -} - -.c41 { - font-size: 13px; - font-weight: 500; -} - -.c40 { - font-weight: 800; - margin-right: 6px; -} - -.c39 { - color: #807373; - margin-top: 5px; -} - -.c14 { - -webkit-flex-shrink: 0; - -ms-flex-negative: 0; - flex-shrink: 0; -} - -.c3 { - position: relative; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); - height: 100%; -} - -.c5 { - width: 30px; - height: 30px; - border-radius: 50%; - position: absolute; - left: 50%; - top: 0; - -webkit-transform: translate(-51%,-10%); - -ms-transform: translate(-51%,-10%); - transform: translate(-51%,-10%); -} - -.c2 { - grid-column-start: 2; - grid-row: span 2; - padding-right: 5px; -} - -.c18 { - display: grid; - grid-template-columns: 100px auto; -} - -.c1 { - max-width: 500px; - display: grid; - grid-template-columns: 65px 30px auto; -} - -.c9 { - grid-column-start: 1; - grid-row: 1 / span 2; - padding-right: 5px; - font-size: 0.9em; -} - -.c32 { - padding: 3px 10px 3px 10px; - border: 0; - margin-top: -15px; - width: 35px; - height: 35px; -} - -.c32:hover { - cursor: pointer; -} - -.c30 { - -webkit-flex: 0 0 25px; - -ms-flex: 0 0 25px; - flex: 0 0 25px; - grid-column: -1; -} - -.c11 { - grid-row-start: 2; - grid-column-start: 3; -} - -.c7 { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - font-size: 1.2em; - grid-row-start: 1; - grid-column-start: 3; -} - -.c8 { - font-size: inherit; - font-weight: bold; - height: 1.2em; - margin: 0; - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; - -webkit-flex: 1 1 auto; - -ms-flex: 1 1 auto; - flex: 1 1 auto; - padding: 3px 0 10px 0; -} - -.c36 { - text-align: center; - min-width: 30px; - min-height: 30px; - font-size: 1.2em; - background-color: #084C8D; - color: white; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; - border: 1px solid; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - cursor: default; -} - -.c37 { - position: absolute; - width: 1px; - height: 1px; - padding: 0; - margin: -1px; - overflow: hidden; - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - border: 0; -} - -.c23 { - display: block; - list-style: none; - padding: 0; -} - -.c26 { - margin-left: 24px; - line-height: 1.25em; - padding-top: 1px; -} - -.c26 > span { - margin-right: 1ch; -} - -.c19 { - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - -webkit-align-self: center; - -ms-flex-item-align: center; - align-self: center; - margin-top: 10px; -} - -.c19 a { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; -} - -.c20 { - color: #676767; - font-size: 13px; - font-style: normal; - padding: 0; -} - -.c25 { - fill: #676767; - float: left; - height: 16px; - width: 16px; -} - -.c24 { - font-size: 13px; - margin-top: 8px; - color: #676767; - font-style: normal; -} - -.c27 { - font-weight: 500; -} - -.c28 { - font-weight: 200; - opacity: 0.8975; - padding-left: 1ch; -} - -.c38 { - font-weight: 200; - font-size: 0.9em; - margin-left: 10px; -} - -.c56 { - float: left; - margin-left: -36px; - color: #fff; -} - -.c57 { - color: #676767; - margin-top: 3px; -} - -.c55 { - z-index: 30; - position: relative; -} - -.c45 { - background-color: #eee; - border-radius: 4px; - color: #000; - display: block; - margin-top: 5px; - padding: 8px; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c49 { - -webkit-align-items: baseline; - -webkit-box-align: baseline; - -ms-flex-align: baseline; - align-items: baseline; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - gap: 5px; - margin-top: 0.5em; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c49:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c47 { - font-size: 12px; - margin-left: 30px; - white-space: pre-wrap; -} - -.c48 { - margin-top: 5px; - margin-left: 30px; - font-size: 12px; - font-style: italic; -} - -.c46 { - float: left; - font-size: 18px; -} - -.c44 { - display: block; - margin-top: 3px; - padding: 0; -} - -.c43 { - color: #d14727; - cursor: cursor; - display: inline-block; - font-weight: 400; - margin-top: 8px; - padding: 0; -} - -.c50 { - margin-top: 5px; -} - -.c51 { - color: #676767; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; -} - -.c53 { - font-size: 14px; -} - -.c52 { - padding: 0; -} - -
      -
    1. -
      -
      -
      -
      -
      - - - Travel by car - - - - -
      -
      -
      -
      -
      - - 330 SW Murray Blvd, Washington County, OR, USA 97005 - -
      -
      - 3:50 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Drive 2.4 miles to - - P+R Sunset TC - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - SOUTHWEST - on - - parking aisle - - - 158 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - RIGHT - on - - SW Murray Blvd - - - 0.2 miles - - -
        -
        3. -
      3. -
        - - - -
        -
        - - CONTINUE - on - - NW Murray Blvd - - - 150 feet - - -
        -
        4. -
      4. -
        - - - -
        -
        - - SLIGHTLY_RIGHT - on - - NW Murray Blvd - - - 0.4 miles - - -
        -
        5. -
      5. -
        - - - -
        -
        - - CONTINUE - on - - NW Sunset Hwy - - - 0.6 miles - - -
        -
        6. -
      6. -
        - - - -
        -
        - - CONTINUE - on - - NW Sunset Hwy - - - 0.3 miles - - -
        -
        7. -
      7. -
        - - - -
        -
        - - LEFT - on - - SW Cedar Hills Blvd - - - 0.2 miles - - -
        -
        8. -
      8. -
        - - - -
        -
        - - RIGHT - on - - SW Barnes Rd - - - 0.5 miles - - -
        -
        9. -
      9. -
        - - - -
        -
        - - RIGHT - on - - service road - - - 0.2 miles - - -
        -
        10. -
      10. -
        - - - -
        -
        - - RIGHT - on - - Sunset TC - - - 76 feet - - -
        -
        11. -
      -
      -
      -       -
      -
      -
      - -
      -
      2. -
    2. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - P+R Sunset TC - -
      -
      - 4:02 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 426 feet to - - Sunset TC MAX Station - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - SLIGHTLY_RIGHT - on - - Unnamed Path - - - 16 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - LEFT - on - - steps - - - 232 feet - - -
        -
        3. -
      3. -
        - - - -
        -
        - - LEFT - on - - Unnamed Path - - - 19 feet - - -
        -
        4. -
      4. -
        - - - -
        -
        - - RIGHT - on - - Sunset TC (path) - - - 159 feet - - -
        -
        5. -
      -
      -
      -       -
      -
      -
      - -
      -
      3. -
    3. -
      -
      -
      -
      -
      - - MA - - - MAX Blue Line - -
      -
      -
      -
      -
      - - Sunset TC MAX Station - - ID 9969 - - -
      -
      - 4:05 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - Ride - - -
      - - MAX Blue Line - -
      - - - MAX Blue Line - - to - - Gresham - - -       - - - - Disembark at - Oak/ SW 1st Ave MAX Station - - ID 8337 - - -       - -       -
      -
      - -
      -
      - -
      -
      -
      -
      - -
      -
      -
      -
      -
        -
      1. -
        - • -
        -
        - Washington Park MAX Station -
        -
        2. -
      2. -
        - • -
        -
        - Goose Hollow/SW Jefferson St MAX Station -
        -
        3. -
      3. -
        - • -
        -
        - Kings Hill/SW Salmon St MAX Station -
        -
        4. -
      4. -
        - • -
        -
        - Providence Park MAX Station -
        -
        5. -
      5. -
        - • -
        -
        - Library/SW 9th Ave MAX Station -
        -
        6. -
      6. -
        - • -
        -
        - Pioneer Square South MAX Station -
        -
        7. -
      7. -
        - • -
        -
        - Mall/SW 4th Ave MAX Station -
        -
        8. -
      8. -
        - • -
        -
        - Yamhill District MAX Station -
        -
        9. -
      -
      -
      -
      -
      -
      -
      -
      -
      - -
      -
      4. -
    4. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - Oak/ SW 1st Ave MAX Station - - ID 8337 - - -
      -
      - 4:27 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 0.1 miles to - - 205 SW Pine St, Portland, OR, USA 97204 - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - NORTHEAST - on - - Oak/SW 1st Ave (path) - - - 13 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - CONTINUE - on - - Unnamed Path - - - 27 feet - - -
        -
        3. -
      3. -
        - - - -
        -
        - - LEFT - on - - SW Oak St - - - 37 feet - - -
        -
        4. -
      4. -
        - - - -
        -
        - - RIGHT - on - - SW 1st Ave - - - 260 feet - - -
        -
        5. -
      5. -
        - - - -
        -
        - - LEFT - on - - SW Pine St - - - 337 feet - - -
        -
        6. -
      -
      -
      -       -
      -
      -
      - -
      -
      5. -
    5. -
      -
      -
      -
      - -
      -
      -
      -
      -
      - - 205 SW Pine St, Portland, OR, USA 97204 - -
      -
      - 4:29 PM -
      - - Arrive at - 205 SW Pine St, Portland, OR, USA 97204 - -
      -
      - -
      -
      6. -
    -`; - -exports[`Storyshots ItineraryBody/otp-ui Two Alerts Not Always Collapsing 1`] = ` - - - -`; - -exports[`Storyshots ItineraryBody/otp-ui Two Alerts Not Always Collapsing 2`] = ` -.c22 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c59 { - color: #f44256; -} - -.c29 { - border-top-style: solid; - border-top-width: 0; - padding-top: 0; - padding-bottom: 10px; -} - -.c16 { - background: transparent; - border: 0; - color: inherit; - cursor: pointer; - font-size: inherit; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c31 { - color: #008; - margin-left: 5px; -} - -.c31:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c6 { - color: black; - background-color: grey; - border: 2px solid #bbb; - text-align: center; - width: 25px; - height: 25px; - font-size: 1.2em; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; -} - -.c34 { - color: black; - background-color: #e9e9e9; - border: 2px solid #bbb; - text-align: center; - width: 25px; - height: 25px; - font-size: 1.2em; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; -} - -.c21::before { - content: ""; - margin: 0 0.125em; -} - -.c58 { - text-align: center; -} - -.c4 { - border-left: dotted 4px grey; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c33 { - border-left: dotted 4px #484848; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c35 { - border-left: solid 8px #084C8D; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c54 { - display: block; - font-size: 13px; - list-style: none; - padding: 0; -} - -.c0 { - list-style: none; - padding: 0; -} - -.c12 { - color: #676767; - font-size: 13px; - padding-bottom: 12px; -} - -.c17 { - bottom: 0; - cursor: pointer; - left: 0; - position: absolute; - right: 0; - top: 0; - width: 100%; - z-index: 1; -} - -.c13 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - line-height: 16px; - min-height: 31px; - position: relative; -} - -.c10 { - display: inline-block; - grid-row-start: 2; - grid-column-start: 1; - height: 0; - overflow: hidden; - width: 0; -} - -.c42 { - font-weight: 200; -} - -.c15 { - font-weight: inherit; -} - -.c41 { - font-size: 13px; - font-weight: 500; -} - -.c40 { - font-weight: 800; - margin-right: 6px; -} - -.c39 { - color: #807373; - margin-top: 5px; -} - -.c14 { - -webkit-flex-shrink: 0; - -ms-flex-negative: 0; - flex-shrink: 0; -} - -.c3 { - position: relative; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); - height: 100%; -} - -.c5 { - width: 30px; - height: 30px; - border-radius: 50%; - position: absolute; - left: 50%; - top: 0; - -webkit-transform: translate(-51%,-10%); - -ms-transform: translate(-51%,-10%); - transform: translate(-51%,-10%); -} - -.c2 { - grid-column-start: 2; - grid-row: span 2; - padding-right: 5px; -} - -.c18 { - display: grid; - grid-template-columns: 100px auto; -} - -.c1 { - max-width: 500px; - display: grid; - grid-template-columns: 65px 30px auto; -} - -.c9 { - grid-column-start: 1; - grid-row: 1 / span 2; - padding-right: 5px; - font-size: 0.9em; -} - -.c32 { - padding: 3px 10px 3px 10px; - border: 0; - margin-top: -15px; - width: 35px; - height: 35px; -} - -.c32:hover { - cursor: pointer; -} - -.c30 { - -webkit-flex: 0 0 25px; - -ms-flex: 0 0 25px; - flex: 0 0 25px; - grid-column: -1; -} - -.c11 { - grid-row-start: 2; - grid-column-start: 3; -} - -.c7 { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - font-size: 1.2em; - grid-row-start: 1; - grid-column-start: 3; -} - -.c8 { - font-size: inherit; - font-weight: bold; - height: 1.2em; - margin: 0; - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; - -webkit-flex: 1 1 auto; - -ms-flex: 1 1 auto; - flex: 1 1 auto; - padding: 3px 0 10px 0; -} - -.c36 { - text-align: center; - min-width: 30px; - min-height: 30px; - font-size: 1.2em; - background-color: #084C8D; - color: white; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; - border: 1px solid; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - cursor: default; -} - -.c37 { - position: absolute; - width: 1px; - height: 1px; - padding: 0; - margin: -1px; - overflow: hidden; - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - border: 0; -} - -.c23 { - display: block; - list-style: none; - padding: 0; -} - -.c26 { - margin-left: 24px; - line-height: 1.25em; - padding-top: 1px; -} - -.c26 > span { - margin-right: 1ch; -} - -.c19 { - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - -webkit-align-self: center; - -ms-flex-item-align: center; - align-self: center; - margin-top: 10px; -} - -.c19 a { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; -} - -.c20 { - color: #676767; - font-size: 13px; - font-style: normal; - padding: 0; -} - -.c25 { - fill: #676767; - float: left; - height: 16px; - width: 16px; -} - -.c24 { - font-size: 13px; - margin-top: 8px; - color: #676767; - font-style: normal; -} - -.c27 { - font-weight: 500; -} - -.c28 { - font-weight: 200; - opacity: 0.8975; - padding-left: 1ch; -} - -.c38 { - font-weight: 200; - font-size: 0.9em; - margin-left: 10px; -} - -.c56 { - float: left; - margin-left: -36px; - color: #fff; -} - -.c57 { - color: #676767; - margin-top: 3px; -} - -.c55 { - z-index: 30; - position: relative; -} - -.c45 { - background-color: #eee; - border-radius: 4px; - color: #000; - display: block; - margin-top: 5px; - padding: 8px; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c49 { - -webkit-align-items: baseline; - -webkit-box-align: baseline; - -ms-flex-align: baseline; - align-items: baseline; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - gap: 5px; - margin-top: 0.5em; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c49:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c47 { - font-size: 12px; - margin-left: 30px; - white-space: pre-wrap; -} - -.c48 { - margin-top: 5px; - margin-left: 30px; - font-size: 12px; - font-style: italic; -} - -.c46 { - float: left; - font-size: 18px; -} - -.c44 { - display: block; - margin-top: 3px; - padding: 0; -} - -.c43 { - color: #d14727; - cursor: auto; - display: inline-block; - font-weight: 400; - margin-top: 8px; - padding: 0; -} - -.c50 { - margin-top: 5px; -} - -.c51 { - color: #676767; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; -} - -.c53 { - font-size: 14px; -} - -.c52 { - padding: 0; -} - -
      -
    1. -
      -
      -
      -
      -
      - - - Travel by car - - - - -
      -
      -
      -
      -
      - - 330 SW Murray Blvd, Washington County, OR, USA 97005 - -
      -
      - 3:50 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Drive 2.4 miles to - - P+R Sunset TC - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - SOUTHWEST - on - - parking aisle - - - 158 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - RIGHT - on - - SW Murray Blvd - - - 0.2 miles - - -
        -
        3. -
      3. -
        - - - -
        -
        - - CONTINUE - on - - NW Murray Blvd - - - 150 feet - - -
        -
        4. -
      4. -
        - - - -
        -
        - - SLIGHTLY_RIGHT - on - - NW Murray Blvd - - - 0.4 miles - - -
        -
        5. -
      5. -
        - - - -
        -
        - - CONTINUE - on - - NW Sunset Hwy - - - 0.6 miles - - -
        -
        6. -
      6. -
        - - - -
        -
        - - CONTINUE - on - - NW Sunset Hwy - - - 0.3 miles - - -
        -
        7. -
      7. -
        - - - -
        -
        - - LEFT - on - - SW Cedar Hills Blvd - - - 0.2 miles - - -
        -
        8. -
      8. -
        - - - -
        -
        - - RIGHT - on - - SW Barnes Rd - - - 0.5 miles - - -
        -
        9. -
      9. -
        - - - -
        -
        - - RIGHT - on - - service road - - - 0.2 miles - - -
        -
        10. -
      10. -
        - - - -
        -
        - - RIGHT - on - - Sunset TC - - - 76 feet - - -
        -
        11. -
      -
      -
      -       -
      -
      -
      - -
      -
      2. -
    2. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - P+R Sunset TC - -
      -
      - 4:02 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 426 feet to - - Sunset TC MAX Station - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - SLIGHTLY_RIGHT - on - - Unnamed Path - - - 16 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - LEFT - on - - steps - - - 232 feet - - -
        -
        3. -
      3. -
        - - - -
        -
        - - LEFT - on - - Unnamed Path - - - 19 feet - - -
        -
        4. -
      4. -
        - - - -
        -
        - - RIGHT - on - - Sunset TC (path) - - - 159 feet - - -
        -
        5. -
      -
      -
      -       -
      -
      -
      - -
      -
      3. -
    3. -
      -
      -
      -
      -
      - - MA - - - MAX Blue Line - -
      -
      -
      -
      -
      - - Sunset TC MAX Station - - ID 9969 - - -
      -
      - 4:05 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - Ride - - -
      - - MAX Blue Line - -
      - - - MAX Blue Line - - to - - Gresham - - -       - - - - Disembark at - Oak/ SW 1st Ave MAX Station - - ID 8337 - - -       - -       -
      -
      -
      - - - 2 alerts -
      -
      -
      - -
      -
      -
      -
      - -
      -
      -
      -
      -
        -
      1. -
        - • -
        -
        - Washington Park MAX Station -
        -
        2. -
      2. -
        - • -
        -
        - Goose Hollow/SW Jefferson St MAX Station -
        -
        3. -
      3. -
        - • -
        -
        - Kings Hill/SW Salmon St MAX Station -
        -
        4. -
      4. -
        - • -
        -
        - Providence Park MAX Station -
        -
        5. -
      5. -
        - • -
        -
        - Library/SW 9th Ave MAX Station -
        -
        6. -
      6. -
        - • -
        -
        - Pioneer Square South MAX Station -
        -
        7. -
      7. -
        - • -
        -
        - Mall/SW 4th Ave MAX Station -
        -
        8. -
      8. -
        - • -
        -
        - Yamhill District MAX Station -
        -
        9. -
      -
      -
      -
      -
      -
      -
      -
      -
      - -
      -
      4. -
    4. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - Oak/ SW 1st Ave MAX Station - - ID 8337 - - -
      -
      - 4:27 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 0.1 miles to - - 205 SW Pine St, Portland, OR, USA 97204 - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - NORTHEAST - on - - Oak/SW 1st Ave (path) - - - 13 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - CONTINUE - on - - Unnamed Path - - - 27 feet - - -
        -
        3. -
      3. -
        - - - -
        -
        - - LEFT - on - - SW Oak St - - - 37 feet - - -
        -
        4. -
      4. -
        - - - -
        -
        - - RIGHT - on - - SW 1st Ave - - - 260 feet - - -
        -
        5. -
      5. -
        - - - -
        -
        - - LEFT - on - - SW Pine St - - - 337 feet - - -
        -
        6. -
      -
      -
      -       -
      -
      -
      - -
      -
      5. -
    5. -
      -
      -
      -
      - -
      -
      -
      -
      -
      - - 205 SW Pine St, Portland, OR, USA 97204 - -
      -
      - 4:29 PM -
      - - Arrive at - 205 SW Pine St, Portland, OR, USA 97204 - -
      -
      - -
      -
      6. -
    -`; - -exports[`Storyshots ItineraryBody/otp-ui Walk Interlined Transit Itinerary 1`] = ` - - - -`; - -exports[`Storyshots ItineraryBody/otp-ui Walk Interlined Transit Itinerary 2`] = ` -.c22 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c51 { - color: #f44256; -} - -.c29 { - border-top-style: solid; - border-top-width: 0; - padding-top: 0; - padding-bottom: 10px; -} - -.c16 { - background: transparent; - border: 0; - color: inherit; - cursor: pointer; - font-size: inherit; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c31 { - color: #008; - margin-left: 5px; -} - -.c31:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c6 { - color: black; - background-color: #e9e9e9; - border: 2px solid #bbb; - text-align: center; - width: 25px; - height: 25px; - font-size: 1.2em; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; -} - -.c21::before { - content: ""; - margin: 0 0.125em; -} - -.c50 { - text-align: center; -} - -.c4 { - border-left: dotted 4px #484848; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c33 { - border-left: solid 8px #0070c0; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c48 { - border-left: solid 8px #008ab0; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c44 { - display: block; - font-size: 13px; - list-style: none; - padding: 0; -} - -.c0 { - list-style: none; - padding: 0; -} - -.c12 { - color: #676767; - font-size: 13px; - padding-bottom: 12px; -} - -.c17 { - bottom: 0; - cursor: pointer; - left: 0; - position: absolute; - right: 0; - top: 0; - width: 100%; - z-index: 1; -} - -.c13 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - line-height: 16px; - min-height: 31px; - position: relative; -} - -.c10 { - display: inline-block; - grid-row-start: 2; - grid-column-start: 1; - height: 0; - overflow: hidden; - width: 0; -} - -.c15 { - font-weight: inherit; -} - -.c39 { - font-size: 13px; - font-weight: 500; -} - -.c38 { - font-weight: 800; - margin-right: 6px; -} - -.c37 { - color: #807373; - margin-top: 5px; -} - -.c14 { - -webkit-flex-shrink: 0; - -ms-flex-negative: 0; - flex-shrink: 0; -} - -.c3 { - position: relative; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); - height: 100%; -} - -.c5 { - width: 30px; - height: 30px; - border-radius: 50%; - position: absolute; - left: 50%; - top: 0; - -webkit-transform: translate(-51%,-10%); - -ms-transform: translate(-51%,-10%); - transform: translate(-51%,-10%); -} - -.c2 { - grid-column-start: 2; - grid-row: span 2; - padding-right: 5px; -} - -.c18 { - display: grid; - grid-template-columns: 100px auto; -} - -.c1 { - max-width: 500px; - display: grid; - grid-template-columns: 65px 30px auto; -} - -.c9 { - grid-column-start: 1; - grid-row: 1 / span 2; - padding-right: 5px; - font-size: 0.9em; -} - -.c32 { - padding: 3px 10px 3px 10px; - border: 0; - margin-top: -15px; - width: 35px; - height: 35px; -} - -.c32:hover { - cursor: pointer; -} - -.c30 { - -webkit-flex: 0 0 25px; - -ms-flex: 0 0 25px; - flex: 0 0 25px; - grid-column: -1; -} - -.c11 { - grid-row-start: 2; - grid-column-start: 3; -} - -.c7 { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - font-size: 1.2em; - grid-row-start: 1; - grid-column-start: 3; -} - -.c8 { - font-size: inherit; - font-weight: bold; - height: 1.2em; - margin: 0; - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; - -webkit-flex: 1 1 auto; - -ms-flex: 1 1 auto; - flex: 1 1 auto; - padding: 3px 0 10px 0; -} - -.c34 { - text-align: center; - min-width: 30px; - min-height: 30px; - font-size: 1.2em; - background-color: #0070c0; - color: white; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; - border: 1px solid; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - cursor: default; -} - -.c49 { - text-align: center; - min-width: 30px; - min-height: 30px; - font-size: 1.2em; - background-color: #084c8d; - color: white; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; - border: 1px solid; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - cursor: default; -} - -.c35 { - position: absolute; - width: 1px; - height: 1px; - padding: 0; - margin: -1px; - overflow: hidden; - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - border: 0; -} - -.c23 { - display: block; - list-style: none; - padding: 0; -} - -.c26 { - margin-left: 24px; - line-height: 1.25em; - padding-top: 1px; -} - -.c26 > span { - margin-right: 1ch; -} - -.c19 { - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - -webkit-align-self: center; - -ms-flex-item-align: center; - align-self: center; - margin-top: 10px; -} - -.c19 a { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; -} - -.c20 { - color: #676767; - font-size: 13px; - font-style: normal; - padding: 0; -} - -.c25 { - fill: #676767; - float: left; - height: 16px; - width: 16px; -} - -.c24 { - font-size: 13px; - margin-top: 8px; - color: #676767; - font-style: normal; -} - -.c27 { - font-weight: 500; -} - -.c28 { - font-weight: 200; - opacity: 0.8975; - padding-left: 1ch; -} - -.c36 { - font-weight: 200; - font-size: 0.9em; - margin-left: 10px; -} - -.c46 { - float: left; - margin-left: -36px; - color: #fff; -} - -.c47 { - color: #676767; - margin-top: 3px; -} - -.c45 { - z-index: 30; - position: relative; -} - -.c40 { - margin-top: 5px; -} - -.c41 { - color: #676767; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; -} - -.c43 { - font-size: 14px; -} - -.c42 { - padding: 0; -} - -
      -
    1. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - 47.97767, -122.20034 - -
      -
      - 12:57 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 0.3 miles to - - Everett Station Bay C1 - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - SOUTH - on - - service road - - - 0.1 miles - - -
        -
        2. -
      2. -
        - - - -
        -
        - - RIGHT - on - - Smith Avenue - - - 129 feet - - -
        -
        3. -
      3. -
        - - - -
        -
        - - CONTINUE - on - - Paine Avenue - - - 61 feet - - -
        -
        4. -
      4. -
        - - - -
        -
        - - LEFT - on - - 32nd Street - - - 67 feet - - -
        -
        5. -
      5. -
        - - - -
        -
        - - RIGHT - on - - 32nd Street - - - 313 feet - - -
        -
        6. -
      6. -
        - - - -
        -
        - - LEFT - on - - Unnamed Path - - - 380 feet - - -
        -
        7. -
      -
      -
      -       -
      -
      -
      - -
      -
      2. -
    2. -
      -
      -
      -
      -
      - - 51 - - - Everett - Northgate Station - -
      -
      -
      -
      -
      - - Everett Station Bay C1 - - ID 2345 - - -
      -
      - 1:04 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - Ride - - -
      - - 512 - -
      - - - Northgate Station - - -       - - - - Disembark at - Northgate Station - - ID 2191 - - -       - -       -
      -
      -
      -
      -
      -
      -
      - -
      -
      -
      -
      -
        -
      1. -
        - • -
        -
        - Broadway & 34th St -
        -
        2. -
      2. -
        - • -
        -
        - South Everett Fwy Station Bay 3 -
        -
        3. -
      3. -
        - • -
        -
        - Ash Way Park & Ride Bay 1 -
        -
        4. -
      4. -
        - • -
        -
        - Lynnwood Transit Center Bay D3 -
        -
        5. -
      5. -
        - • -
        -
        - Mountlake Terrace Fwy Station Bay 6 -
        -
        6. -
      -
      -
      -
      -
      -
      -
      -
      -
      - -
      -
      3. -
    3. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - Northgate Station - - ID 2191 - - -
      -
      - 1:51 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk to - - Northgate Station - Bay 4 - - - - -
      - - - - -
      -
      -
        -
      -
      -       -
      -
      -
      - -
      -
      4. -
    4. -
      -
      -
      -
      -
      - - 40 - - - - -
      -
      -
      -
      -
      - - Northgate Station - Bay 4 - - ID 35318 - - -
      -
      - 1:55 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - Ride - - -
      - - 40 - -
      - - - Downtown Seattle Ballard - - -       - - - - Disembark at - N 105th St & Aurora Ave N - - ID 40032 - - -       - -       -
      -
      -
      -
      -
      -
      -
      - -
      -
      -
      -
      -
        -
      1. -
        - • -
        -
        - 1st Ave NE & NE 95th St -
        -
        2. -
      2. -
        - • -
        -
        - N 92nd St & Corliss Ave N -
        -
        3. -
      3. -
        - • -
        -
        - College Way N & N 97th St -
        -
        4. -
      4. -
        - • -
        -
        - College Way N & N 103rd St -
        -
        5. -
      5. -
        - • -
        -
        - Meridian Ave N & N 105th St -
        -
        6. -
      6. -
        - • -
        -
        - N Northgate Way & Meridian Ave N -
        -
        7. -
      7. -
        - • -
        -
        - N Northgate Way & Stone Ave N -
        -
        8. -
      -
      -
      -
      -
      -
      -
      -
      -
      - -
      -
      5. -
    5. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - N 105th St & Aurora Ave N - - ID 40032 - - -
      -
      - 2:06 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 259 feet to - - Aurora Ave N & N 105th St - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - EAST - on - - North 105th Street - - - 64 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - RIGHT - on - - service road - - - 14 feet - - -
        -
        3. -
      3. -
        - - - -
        -
        - - LEFT - on - - Unnamed Path - - - 180 feet - - -
        -
        4. -
      -
      -
      -       -
      -
      -
      - -
      -
      6. -
    6. -
      -
      -
      -
      -
      - - E - - - - -
      -
      -
      -
      -
      - - Aurora Ave N & N 105th St - - ID 7080 - - -
      -
      - 2:07 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - Ride - - -
      - - E Line - -
      - - - Downtown Seattle - - -       - - - - Disembark at - 3rd Ave & Cherry St - - ID 490 - - -       - -       -
      -
      -
      -
      -
      -
      -
      - -
      -
      -
      -
      -
        -
      1. -
        - • -
        -
        - Aurora Ave N & N 100th St -
        -
        2. -
      2. -
        - • -
        -
        - Aurora Ave N & N 95th St -
        -
        3. -
      3. -
        - • -
        -
        - Aurora Ave N & N 90th St -
        -
        4. -
      4. -
        - • -
        -
        - Aurora Ave N & N 85th St -
        -
        5. -
      5. -
        - • -
        -
        - Aurora Ave N & N 80th St -
        -
        6. -
      6. -
        - • -
        -
        - Aurora Ave N & N 76th St -
        -
        7. -
      7. -
        - • -
        -
        - Aurora Ave N & N 65th St -
        -
        8. -
      8. -
        - • -
        -
        - Aurora Ave N & N 46th St -
        -
        9. -
      9. -
        - • -
        -
        - Aurora Ave N & Lynn St -
        -
        10. -
      10. -
        - • -
        -
        - Aurora Ave N & Galer St -
        -
        11. -
      11. -
        - • -
        -
        - 7th Ave N & Thomas St -
        -
        12. -
      12. -
        - • -
        -
        - Wall St & 5th Ave -
        -
        13. -
      13. -
        - • -
        -
        - 3rd Ave & Bell St -
        -
        14. -
      14. -
        - • -
        -
        - 3rd Ave & Virginia St -
        -
        15. -
      15. -
        - • -
        -
        - 3rd Ave & Pike St -
        -
        16. -
      16. -
        - • -
        -
        - 3rd Ave & Seneca St -
        -
        17. -
      -
      -
      -
      -
      -
      -
      -
      -
      - -
      -
      7. -
    7. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - 3rd Ave & Cherry St - - ID 490 - - -
      -
      - 2:39 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 443 feet to - - 208 James St, Seattle, WA 98104-2212, United States - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - SOUTHEAST - on - - sidewalk - - - 326 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - UTURN_RIGHT - on - - sidewalk - - - 117 feet - - -
        -
        3. -
      -
      -
      -       -
      -
      -
      - -
      -
      8. -
    8. -
      -
      -
      -
      - -
      -
      -
      -
      -
      - - 208 James St, Seattle, WA 98104-2212, United States - -
      -
      - 2:41 PM -
      - - Arrive at - 208 James St, Seattle, WA 98104-2212, United States - -
      -
      - -
      -
      9. -
    -`; - -exports[`Storyshots ItineraryBody/otp-ui Walk Only Itinerary 1`] = ` - - - -`; - -exports[`Storyshots ItineraryBody/otp-ui Walk Only Itinerary 2`] = ` -.c22 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c33 { - color: #f44256; -} - -.c28 { - border-top-style: solid; - border-top-width: 0; - padding-top: 0; - padding-bottom: 10px; -} - -.c16 { - background: transparent; - border: 0; - color: inherit; - cursor: pointer; - font-size: inherit; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c30 { - color: #008; - margin-left: 5px; -} - -.c30:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c6 { - color: black; - background-color: #e9e9e9; - border: 2px solid #bbb; - text-align: center; - width: 25px; - height: 25px; - font-size: 1.2em; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; -} - -.c21::before { - content: ""; - margin: 0 0.125em; -} - -.c32 { - text-align: center; -} - -.c4 { - border-left: dotted 4px #484848; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c0 { - list-style: none; - padding: 0; -} - -.c12 { - color: #676767; - font-size: 13px; - padding-bottom: 12px; -} - -.c17 { - bottom: 0; - cursor: pointer; - left: 0; - position: absolute; - right: 0; - top: 0; - width: 100%; - z-index: 1; -} - -.c13 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - line-height: 16px; - min-height: 31px; - position: relative; -} - -.c10 { - display: inline-block; - grid-row-start: 2; - grid-column-start: 1; - height: 0; - overflow: hidden; - width: 0; -} - -.c15 { - font-weight: inherit; -} - -.c14 { - -webkit-flex-shrink: 0; - -ms-flex-negative: 0; - flex-shrink: 0; -} - -.c3 { - position: relative; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); - height: 100%; -} - -.c5 { - width: 30px; - height: 30px; - border-radius: 50%; - position: absolute; - left: 50%; - top: 0; - -webkit-transform: translate(-51%,-10%); - -ms-transform: translate(-51%,-10%); - transform: translate(-51%,-10%); -} - -.c2 { - grid-column-start: 2; - grid-row: span 2; - padding-right: 5px; -} - -.c18 { - display: grid; - grid-template-columns: 100px auto; -} - -.c1 { - max-width: 500px; - display: grid; - grid-template-columns: 65px 30px auto; -} - -.c9 { - grid-column-start: 1; - grid-row: 1 / span 2; - padding-right: 5px; - font-size: 0.9em; -} - -.c31 { - padding: 3px 10px 3px 10px; - border: 0; - margin-top: -15px; - width: 35px; - height: 35px; -} - -.c31:hover { - cursor: pointer; -} - -.c29 { - -webkit-flex: 0 0 25px; - -ms-flex: 0 0 25px; - flex: 0 0 25px; - grid-column: -1; -} - -.c11 { - grid-row-start: 2; - grid-column-start: 3; -} - -.c7 { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - font-size: 1.2em; - grid-row-start: 1; - grid-column-start: 3; -} - -.c8 { - font-size: inherit; - font-weight: bold; - height: 1.2em; - margin: 0; - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; - -webkit-flex: 1 1 auto; - -ms-flex: 1 1 auto; - flex: 1 1 auto; - padding: 3px 0 10px 0; -} - -.c23 { - display: block; - list-style: none; - padding: 0; -} - -.c26 { - margin-left: 24px; - line-height: 1.25em; - padding-top: 1px; -} - -.c26 > span { - margin-right: 1ch; -} - -.c19 { - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - -webkit-align-self: center; - -ms-flex-item-align: center; - align-self: center; - margin-top: 10px; -} - -.c19 a { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; -} - -.c20 { - color: #676767; - font-size: 13px; - font-style: normal; - padding: 0; -} - -.c25 { - fill: #676767; - float: left; - height: 16px; - width: 16px; -} - -.c24 { - font-size: 13px; - margin-top: 8px; - color: #676767; - font-style: normal; -} - -.c27 { - font-weight: 500; -} - -
      -
    1. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - KGW Studio on the Sq, Portland, OR, USA - -
      -
      - 11:29 AM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 166 feet to - - 701 SW 6th Ave, Portland, OR, USA 97204 - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - NORTHWEST - on - - Unnamed Path - - -
        -
        2. -
      2. -
        - - - -
        -
        - - LEFT - on - - Unnamed Path - - -
        -
        3. -
      -
      -
      -       -
      -
      -
      - -
      -
      2. -
    2. -
      -
      -
      -
      - -
      -
      -
      -
      -
      - - 701 SW 6th Ave, Portland, OR, USA 97204 - -
      -
      - 11:30 AM -
      - - Arrive at - 701 SW 6th Ave, Portland, OR, USA 97204 - -
      -
      - -
      -
      3. -
    -`; - -exports[`Storyshots ItineraryBody/otp-ui Walk Transit Transfer Itinerary 1`] = ` - - - -`; - -exports[`Storyshots ItineraryBody/otp-ui Walk Transit Transfer Itinerary 2`] = ` -.c22 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c50 { - color: #f44256; -} - -.c29 { - border-top-style: solid; - border-top-width: 0; - padding-top: 0; - padding-bottom: 10px; -} - -.c16 { - background: transparent; - border: 0; - color: inherit; - cursor: pointer; - font-size: inherit; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c31 { - color: #008; - margin-left: 5px; -} - -.c31:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c6 { - color: black; - background-color: #e9e9e9; - border: 2px solid #bbb; - text-align: center; - width: 25px; - height: 25px; - font-size: 1.2em; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; -} - -.c21::before { - content: ""; - margin: 0 0.125em; -} - -.c49 { - text-align: center; -} - -.c4 { - border-left: dotted 4px #484848; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c33 { - border-left: solid 8px #008ab0; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c45 { - display: block; - font-size: 13px; - list-style: none; - padding: 0; -} - -.c0 { - list-style: none; - padding: 0; -} - -.c12 { - color: #676767; - font-size: 13px; - padding-bottom: 12px; -} - -.c17 { - bottom: 0; - cursor: pointer; - left: 0; - position: absolute; - right: 0; - top: 0; - width: 100%; - z-index: 1; -} - -.c13 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - line-height: 16px; - min-height: 31px; - position: relative; -} - -.c10 { - display: inline-block; - grid-row-start: 2; - grid-column-start: 1; - height: 0; - overflow: hidden; - width: 0; -} - -.c40 { - font-weight: 200; -} - -.c15 { - font-weight: inherit; -} - -.c39 { - font-size: 13px; - font-weight: 500; -} - -.c38 { - font-weight: 800; - margin-right: 6px; -} - -.c37 { - color: #807373; - margin-top: 5px; -} - -.c14 { - -webkit-flex-shrink: 0; - -ms-flex-negative: 0; - flex-shrink: 0; -} - -.c3 { - position: relative; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); - height: 100%; -} - -.c5 { - width: 30px; - height: 30px; - border-radius: 50%; - position: absolute; - left: 50%; - top: 0; - -webkit-transform: translate(-51%,-10%); - -ms-transform: translate(-51%,-10%); - transform: translate(-51%,-10%); -} - -.c2 { - grid-column-start: 2; - grid-row: span 2; - padding-right: 5px; -} - -.c18 { - display: grid; - grid-template-columns: 100px auto; -} - -.c1 { - max-width: 500px; - display: grid; - grid-template-columns: 65px 30px auto; -} - -.c9 { - grid-column-start: 1; - grid-row: 1 / span 2; - padding-right: 5px; - font-size: 0.9em; -} - -.c32 { - padding: 3px 10px 3px 10px; - border: 0; - margin-top: -15px; - width: 35px; - height: 35px; -} - -.c32:hover { - cursor: pointer; -} - -.c30 { - -webkit-flex: 0 0 25px; - -ms-flex: 0 0 25px; - flex: 0 0 25px; - grid-column: -1; -} - -.c11 { - grid-row-start: 2; - grid-column-start: 3; -} - -.c7 { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - font-size: 1.2em; - grid-row-start: 1; - grid-column-start: 3; -} - -.c8 { - font-size: inherit; - font-weight: bold; - height: 1.2em; - margin: 0; - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; - -webkit-flex: 1 1 auto; - -ms-flex: 1 1 auto; - flex: 1 1 auto; - padding: 3px 0 10px 0; -} - -.c34 { - text-align: center; - min-width: 30px; - min-height: 30px; - font-size: 1.2em; - background-color: #084c8d; - color: white; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; - border: 1px solid; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - cursor: default; -} - -.c35 { - position: absolute; - width: 1px; - height: 1px; - padding: 0; - margin: -1px; - overflow: hidden; - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - border: 0; -} - -.c23 { - display: block; - list-style: none; - padding: 0; -} - -.c26 { - margin-left: 24px; - line-height: 1.25em; - padding-top: 1px; -} - -.c26 > span { - margin-right: 1ch; -} - -.c19 { - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - -webkit-align-self: center; - -ms-flex-item-align: center; - align-self: center; - margin-top: 10px; -} - -.c19 a { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; -} - -.c20 { - color: #676767; - font-size: 13px; - font-style: normal; - padding: 0; -} - -.c25 { - fill: #676767; - float: left; - height: 16px; - width: 16px; -} - -.c24 { - font-size: 13px; - margin-top: 8px; - color: #676767; - font-style: normal; -} - -.c27 { - font-weight: 500; -} - -.c28 { - font-weight: 200; - opacity: 0.8975; - padding-left: 1ch; -} - -.c36 { - font-weight: 200; - font-size: 0.9em; - margin-left: 10px; -} - -.c47 { - float: left; - margin-left: -36px; - color: #fff; -} - -.c48 { - color: #676767; - margin-top: 3px; -} - -.c46 { - z-index: 30; - position: relative; -} - -.c41 { - margin-top: 5px; -} - -.c42 { - color: #676767; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; -} - -.c44 { - font-size: 14px; -} - -.c43 { - padding: 0; -} - -
      -
    1. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - 3940 SE Brooklyn St, Portland, OR, USA 97202 - -
      -
      - 3:46 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 238 feet to - - SE Cesar Chavez Blvd & Brooklyn (long address that spans multiple lines) - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - WEST - on - - SE Brooklyn St - - - 205 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - RIGHT - on - - SE Cesar E. Chavez Blvd - - - 33 feet - - -
        -
        3. -
      -
      -
      -       -
      -
      -
      - -
      -
      2. -
    2. -
      -
      -
      -
      -
      - - 75 - - - Cesar Chavez/Lombard (very long route name) - -
      -
      -
      -
      -
      - - SE Cesar Chavez Blvd & Brooklyn - - ID 7439 - - -
      -
      - 3:47 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - Ride - - -
      - - 755X - -
      - - - Cesar Chavez/Lombard (very long route name) - - to - - St. Johns via NAYA - - -       - - - - Disembark at - SE Cesar Chavez Blvd & Hawthorne - - ID 7459 - - -       - -       -
      -
      -
      -
      -
      -
      -
      - -
      -
      -
      -
      -
        -
      1. -
        - • -
        -
        - SE Cesar Chavez Blvd & Clinton -
        -
        2. -
      2. -
        - • -
        -
        - SE Cesar Chavez Blvd & Division -
        -
        3. -
      3. -
        - • -
        -
        - SE Cesar Chavez Blvd & Lincoln -
        -
        4. -
      4. -
        - • -
        -
        - SE Cesar Chavez Blvd & Stephens -
        -
        5. -
      -
      -
      -
      -
      -
      -
      -
      -
      - -
      -
      3. -
    3. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - SE Cesar Chavez Blvd & Hawthorne - - ID 7459 - - -
      -
      - 3:52 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 440 feet to - - SE Hawthorne & Cesar Chavez Blvd - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - SOUTH - on - - service road - - - 146 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - RIGHT - on - - SE Cesar E. Chavez Blvd - - - 198 feet - - -
        -
        3. -
      3. -
        - - - -
        -
        - - LEFT - on - - SE Hawthorne Blvd - - - 96 feet - - -
        -
        4. -
      -
      -
      -       -
      -
      -
      - -
      -
      4. -
    4. -
      -
      -
      -
      -
      - - 1 - - - Hawthorne - -
      -
      -
      -
      -
      - - SE Hawthorne & Cesar Chavez Blvd - - ID 2626 - - -
      -
      - 4:00 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - Ride - - -
      - - 1 - -
      - - - Hawthorne - - to - - Portland - - -       - - - - Disembark at - SE Hawthorne & 27th - - ID 2613 - - -       - -       -
      -
      -
      -
      -
      -
      -
      - -
      -
      -
      -
      -
        -
      1. -
        - • -
        -
        - SE Hawthorne & 37th -
        -
        2. -
      2. -
        - • -
        -
        - SE Hawthorne & 34th -
        -
        3. -
      3. -
        - • -
        -
        - SE Hawthorne & 32nd -
        -
        4. -
      4. -
        - • -
        -
        - SE Hawthorne & 30th -
        -
        5. -
      -
      -
      -
      -
      -
      -
      -
      -
      - -
      -
      5. -
    5. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - SE Hawthorne & 27th - - ID 2613 - - -
      -
      - 4:04 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 479 feet to - - 1415 SE 28th Ave, Portland, OR, USA 97214 - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - WEST - on - - SE Hawthorne Blvd - - - 40 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - RIGHT - on - - SE 27th Ave - - - 294 feet - - -
        -
        3. -
      3. -
        - - - -
        -
        - - RIGHT - on - - SE Madison St - - - 146 feet - - -
        -
        4. -
      -
      -
      -       -
      -
      -
      - -
      -
      6. -
    6. -
      -
      -
      -
      - -
      -
      -
      -
      -
      - - 1415 SE 28th Ave, Portland, OR, USA 97214 - -
      -
      - 4:06 PM -
      - - Arrive at - 1415 SE 28th Ave, Portland, OR, USA 97214 - -
      -
      - -
      -
      7. -
    -`; - -exports[`Storyshots ItineraryBody/otp-ui Walk Transit Transfer With A 11 Y Itinerary 1`] = ` - - - -`; - -exports[`Storyshots ItineraryBody/otp-ui Walk Transit Transfer With A 11 Y Itinerary 2`] = ` -.c12 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c55 { - color: #f44256; -} - -.c31 { - border-top-style: solid; - border-top-width: 0; - padding-top: 0; - padding-bottom: 10px; -} - -.c19 { - background: transparent; - border: 0; - color: inherit; - cursor: pointer; - font-size: inherit; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c33 { - color: #008; - margin-left: 5px; -} - -.c33:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c6 { - color: black; - background-color: #e9e9e9; - border: 2px solid #bbb; - text-align: center; - width: 25px; - height: 25px; - font-size: 1.2em; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; -} - -.c44 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - background: none; - border: none; - color: #007899; - cursor: pointer; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - font-size: 0.9em; - font-family: inherit; - margin: 0; - margin-top: 5px; - outline: inherit; - padding: 0; - text-align: inherit; -} - -.c24::before { - content: ""; - margin: 0 0.125em; -} - -.c54 { - text-align: center; -} - -.c4 { - border-left: dotted 4px #484848; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c35 { - border-left: solid 8px #008ab0; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c49 { - display: block; - font-size: 13px; - list-style: none; - padding: 0; -} - -.c0 { - list-style: none; - padding: 0; -} - -.c15 { - color: #676767; - font-size: 13px; - padding-bottom: 12px; -} - -.c20 { - bottom: 0; - cursor: pointer; - left: 0; - position: absolute; - right: 0; - top: 0; - width: 100%; - z-index: 1; -} - -.c16 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - line-height: 16px; - min-height: 31px; - position: relative; -} - -.c11 { - display: inline-block; - grid-row-start: 2; - grid-column-start: 1; - height: 0; - overflow: hidden; - width: 0; -} - -.c43 { - font-weight: 200; -} - -.c18 { - font-weight: inherit; -} - -.c42 { - font-size: 13px; - font-weight: 500; -} - -.c41 { - font-weight: 800; - margin-right: 6px; -} - -.c40 { - color: #807373; - margin-top: 5px; -} - -.c17 { - -webkit-flex-shrink: 0; - -ms-flex-negative: 0; - flex-shrink: 0; -} - -.c3 { - position: relative; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); - height: 100%; -} - -.c5 { - width: 30px; - height: 30px; - border-radius: 50%; - position: absolute; - left: 50%; - top: 0; - -webkit-transform: translate(-51%,-10%); - -ms-transform: translate(-51%,-10%); - transform: translate(-51%,-10%); -} - -.c2 { - grid-column-start: 2; - grid-row: span 2; - padding-right: 5px; -} - -.c21 { - display: grid; - grid-template-columns: 100px auto; -} - -.c1 { - max-width: 500px; - display: grid; - grid-template-columns: 65px 30px auto; -} - -.c9 { - grid-column-start: 1; - grid-row: 1 / span 2; - padding-right: 5px; - font-size: 0.9em; -} - -.c34 { - padding: 3px 10px 3px 10px; - border: 0; - margin-top: -15px; - width: 35px; - height: 35px; -} - -.c34:hover { - cursor: pointer; -} - -.c32 { - -webkit-flex: 0 0 25px; - -ms-flex: 0 0 25px; - flex: 0 0 25px; - grid-column: -1; -} - -.c14 { - grid-row-start: 2; - grid-column-start: 3; -} - -.c7 { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - font-size: 1.2em; - grid-row-start: 1; - grid-column-start: 3; -} - -.c8 { - font-size: inherit; - font-weight: bold; - height: 1.2em; - margin: 0; - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; - -webkit-flex: 1 1 auto; - -ms-flex: 1 1 auto; - flex: 1 1 auto; - padding: 3px 0 10px 0; -} - -.c36 { - text-align: center; - min-width: 30px; - min-height: 30px; - font-size: 1.2em; - background-color: #084c8d; - color: white; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; - border: 1px solid; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - cursor: default; -} - -.c37 { - position: absolute; - width: 1px; - height: 1px; - padding: 0; - margin: -1px; - overflow: hidden; - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - border: 0; -} - -.c25 { - display: block; - list-style: none; - padding: 0; -} - -.c28 { - margin-left: 24px; - line-height: 1.25em; - padding-top: 1px; -} - -.c28 > span { - margin-right: 1ch; -} - -.c22 { - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - -webkit-align-self: center; - -ms-flex-item-align: center; - align-self: center; - margin-top: 10px; -} - -.c22 a { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; -} - -.c23 { - color: #676767; - font-size: 13px; - font-style: normal; - padding: 0; -} - -.c27 { - fill: #676767; - float: left; - height: 16px; - width: 16px; -} - -.c26 { - font-size: 13px; - margin-top: 8px; - color: #676767; - font-style: normal; -} - -.c29 { - font-weight: 500; -} - -.c30 { - font-weight: 200; - opacity: 0.8975; - padding-left: 1ch; -} - -.c38 { - font-weight: 200; - font-size: 0.9em; - margin-left: 10px; -} - -.c51 { - float: left; - margin-left: -36px; - color: #fff; -} - -.c52 { - color: #676767; - margin-top: 3px; -} - -.c50 { - z-index: 30; - position: relative; -} - -.c45 { - margin-top: 5px; -} - -.c46 { - color: #676767; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; -} - -.c48 { - font-size: 14px; -} - -.c47 { - padding: 0; -} - -.c10 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - border: none; - background-color: #bfffb5; - border-radius: 20px; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-box-pack: justify; - -webkit-justify-content: space-between; - -ms-flex-pack: justify; - justify-content: space-between; - margin-top: 0.25em; - max-width: 75px; - height: 30px; - padding: 0.25em 0.6em 0.25em 0.4em; - word-wrap: anywhere; -} - -.c39 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - border: none; - background-color: #dbe9ff; - border-radius: 20px; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-box-pack: justify; - -webkit-justify-content: space-between; - -ms-flex-pack: justify; - justify-content: space-between; - margin-top: 0.25em; - max-width: 75px; - height: 30px; - padding: 0.25em 0.6em 0.25em 0.4em; - word-wrap: anywhere; -} - -.c53 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - border: none; - background-color: #ffe4e5; - border-radius: 20px; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-box-pack: justify; - -webkit-justify-content: space-between; - -ms-flex-pack: justify; - justify-content: space-between; - margin-top: 0.25em; - max-width: 75px; - height: 30px; - padding: 0.25em 0.6em 0.25em 0.4em; - word-wrap: anywhere; -} - -.c13 { - -webkit-flex: 1; - -ms-flex: 1; - flex: 1; -} - -.c13 span { - display: block; -} - -
      -
    1. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - 3940 SE Brooklyn St, Portland, OR, USA 97202 - -
      -
      - 3:46 PM -
      - - otpUi.ItineraryBody.tripAccessibility.legAccessibilityotpUi.ItineraryBody.tripAccessibility.likelyAccessible - - - - ✅ - -
      -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 238 feet to - - SE Cesar Chavez Blvd & Brooklyn (long address that spans multiple lines) - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - WEST - on - - SE Brooklyn St - - - 205 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - RIGHT - on - - SE Cesar E. Chavez Blvd - - - 33 feet - - -
        -
        3. -
      -
      -
      -       -
      -
      -
      - -
      -
      2. -
    2. -
      -
      -
      -
      -
      - - 75 - - - Cesar Chavez/Lombard (very long route name) - -
      -
      -
      -
      -
      - - SE Cesar Chavez Blvd & Brooklyn - - ID 7439 - - -
      -
      - 3:47 PM -
      - - otpUi.ItineraryBody.tripAccessibility.legAccessibilityotpUi.ItineraryBody.tripAccessibility.unclear - - - - ？ - -
      -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - Ride - - -
      - - 755X - -
      - - - Cesar Chavez/Lombard (very long route name) - - to - - St. Johns via NAYA - - -       - - - - Disembark at - SE Cesar Chavez Blvd & Hawthorne - - ID 7459 - - -       - -       -
      - -
      -
      -
      -
      -
      -
      - -
      -
      -
      -
      -
        -
      1. -
        - • -
        -
        - SE Cesar Chavez Blvd & Clinton -
        -
        2. -
      2. -
        - • -
        -
        - SE Cesar Chavez Blvd & Division -
        -
        3. -
      3. -
        - • -
        -
        - SE Cesar Chavez Blvd & Lincoln -
        -
        4. -
      4. -
        - • -
        -
        - SE Cesar Chavez Blvd & Stephens -
        -
        5. -
      -
      -
      -
      -
      -
      -
      -
      -
      - -
      -
      3. -
    3. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - SE Cesar Chavez Blvd & Hawthorne - - ID 7459 - - -
      -
      - 3:52 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 440 feet to - - SE Hawthorne & Cesar Chavez Blvd - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - SOUTH - on - - service road - - - 146 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - RIGHT - on - - SE Cesar E. Chavez Blvd - - - 198 feet - - -
        -
        3. -
      3. -
        - - - -
        -
        - - LEFT - on - - SE Hawthorne Blvd - - - 96 feet - - -
        -
        4. -
      -
      -
      -       -
      -
      -
      - -
      -
      4. -
    4. -
      -
      -
      -
      -
      - - 1 - - - Hawthorne - -
      -
      -
      -
      -
      - - SE Hawthorne & Cesar Chavez Blvd - - ID 2626 - - -
      -
      - 4:00 PM -
      - - otpUi.ItineraryBody.tripAccessibility.legAccessibilityotpUi.ItineraryBody.tripAccessibility.inaccessible - - - - ❌ - -
      -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - Ride - - -
      - - 1 - -
      - - - Hawthorne - - to - - Portland - - -       - - - - Disembark at - SE Hawthorne & 27th - - ID 2613 - - -       - -       -
      - -
      -
      -
      -
      -
      -
      - -
      -
      -
      -
      -
        -
      1. -
        - • -
        -
        - SE Hawthorne & 37th -
        -
        2. -
      2. -
        - • -
        -
        - SE Hawthorne & 34th -
        -
        3. -
      3. -
        - • -
        -
        - SE Hawthorne & 32nd -
        -
        4. -
      4. -
        - • -
        -
        - SE Hawthorne & 30th -
        -
        5. -
      -
      -
      -
      -
      -
      -
      -
      -
      - -
      -
      5. -
    5. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - SE Hawthorne & 27th - - ID 2613 - - -
      -
      - 4:04 PM -
      - - otpUi.ItineraryBody.tripAccessibility.legAccessibilityotpUi.ItineraryBody.tripAccessibility.inaccessible - - - - ❌ - -
      -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 479 feet to - - 1415 SE 28th Ave, Portland, OR, USA 97214 - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - WEST - on - - SE Hawthorne Blvd - - - 40 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - RIGHT - on - - SE 27th Ave - - - 294 feet - - -
        -
        3. -
      3. -
        - - - -
        -
        - - RIGHT - on - - SE Madison St - - - 146 feet - - -
        -
        4. -
      -
      -
      -       -
      -
      -
      - -
      -
      6. -
    6. -
      -
      -
      -
      - -
      -
      -
      -
      -
      - - 1415 SE 28th Ave, Portland, OR, USA 97214 - -
      -
      - 4:06 PM -
      - - Arrive at - 1415 SE 28th Ave, Portland, OR, USA 97214 - -
      -
      - -
      -
      7. -
    -`; - -exports[`Storyshots ItineraryBody/otp-ui Walk Transit Walk Itinerary 1`] = ` - - - -`; - -exports[`Storyshots ItineraryBody/otp-ui Walk Transit Walk Itinerary 2`] = ` -.c22 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c58 { - color: #f44256; -} - -.c29 { - border-top-style: solid; - border-top-width: 0; - padding-top: 0; - padding-bottom: 10px; -} - -.c16 { - background: transparent; - border: 0; - color: inherit; - cursor: pointer; - font-size: inherit; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c31 { - color: #008; - margin-left: 5px; -} - -.c31:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c6 { - color: black; - background-color: #e9e9e9; - border: 2px solid #bbb; - text-align: center; - width: 25px; - height: 25px; - font-size: 1.2em; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; -} - -.c41 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - background: none; - border: none; - color: #007899; - cursor: pointer; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - font-size: 0.9em; - font-family: inherit; - margin: 0; - margin-top: 5px; - outline: inherit; - padding: 0; - text-align: inherit; -} - -.c21::before { - content: ""; - margin: 0 0.125em; -} - -.c57 { - text-align: center; -} - -.c4 { - border-left: dotted 4px #484848; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c33 { - border-left: solid 8px #084C8D; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c53 { - display: block; - font-size: 13px; - list-style: none; - padding: 0; -} - -.c0 { - list-style: none; - padding: 0; -} - -.c12 { - color: #676767; - font-size: 13px; - padding-bottom: 12px; -} - -.c17 { - bottom: 0; - cursor: pointer; - left: 0; - position: absolute; - right: 0; - top: 0; - width: 100%; - z-index: 1; -} - -.c13 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - line-height: 16px; - min-height: 31px; - position: relative; -} - -.c10 { - display: inline-block; - grid-row-start: 2; - grid-column-start: 1; - height: 0; - overflow: hidden; - width: 0; -} - -.c40 { - font-weight: 200; -} - -.c15 { - font-weight: inherit; -} - -.c39 { - font-size: 13px; - font-weight: 500; -} - -.c38 { - font-weight: 800; - margin-right: 6px; -} - -.c37 { - color: #807373; - margin-top: 5px; -} - -.c14 { - -webkit-flex-shrink: 0; - -ms-flex-negative: 0; - flex-shrink: 0; -} - -.c3 { - position: relative; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); - height: 100%; -} - -.c5 { - width: 30px; - height: 30px; - border-radius: 50%; - position: absolute; - left: 50%; - top: 0; - -webkit-transform: translate(-51%,-10%); - -ms-transform: translate(-51%,-10%); - transform: translate(-51%,-10%); -} - -.c2 { - grid-column-start: 2; - grid-row: span 2; - padding-right: 5px; -} - -.c18 { - display: grid; - grid-template-columns: 100px auto; -} - -.c1 { - max-width: 500px; - display: grid; - grid-template-columns: 65px 30px auto; -} - -.c9 { - grid-column-start: 1; - grid-row: 1 / span 2; - padding-right: 5px; - font-size: 0.9em; -} - -.c32 { - padding: 3px 10px 3px 10px; - border: 0; - margin-top: -15px; - width: 35px; - height: 35px; -} - -.c32:hover { - cursor: pointer; -} - -.c30 { - -webkit-flex: 0 0 25px; - -ms-flex: 0 0 25px; - flex: 0 0 25px; - grid-column: -1; -} - -.c11 { - grid-row-start: 2; - grid-column-start: 3; -} - -.c7 { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - font-size: 1.2em; - grid-row-start: 1; - grid-column-start: 3; -} - -.c8 { - font-size: inherit; - font-weight: bold; - height: 1.2em; - margin: 0; - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; - -webkit-flex: 1 1 auto; - -ms-flex: 1 1 auto; - flex: 1 1 auto; - padding: 3px 0 10px 0; -} - -.c34 { - text-align: center; - min-width: 30px; - min-height: 30px; - font-size: 1.2em; - background-color: #084C8D; - color: white; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; - border: 1px solid; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - cursor: default; -} - -.c35 { - position: absolute; - width: 1px; - height: 1px; - padding: 0; - margin: -1px; - overflow: hidden; - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - border: 0; -} - -.c23 { - display: block; - list-style: none; - padding: 0; -} - -.c26 { - margin-left: 24px; - line-height: 1.25em; - padding-top: 1px; -} - -.c26 > span { - margin-right: 1ch; -} - -.c19 { - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - -webkit-align-self: center; - -ms-flex-item-align: center; - align-self: center; - margin-top: 10px; -} - -.c19 a { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; -} - -.c20 { - color: #676767; - font-size: 13px; - font-style: normal; - padding: 0; -} - -.c25 { - fill: #676767; - float: left; - height: 16px; - width: 16px; -} - -.c24 { - font-size: 13px; - margin-top: 8px; - color: #676767; - font-style: normal; -} - -.c27 { - font-weight: 500; -} - -.c28 { - font-weight: 200; - opacity: 0.8975; - padding-left: 1ch; -} - -.c36 { - font-weight: 200; - font-size: 0.9em; - margin-left: 10px; -} - -.c55 { - float: left; - margin-left: -36px; - color: #fff; -} - -.c56 { - color: #676767; - margin-top: 3px; -} - -.c54 { - z-index: 30; - position: relative; -} - -.c44 { - background-color: #eee; - border-radius: 4px; - color: #000; - display: block; - margin-top: 5px; - padding: 8px; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c48 { - -webkit-align-items: baseline; - -webkit-box-align: baseline; - -ms-flex-align: baseline; - align-items: baseline; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - gap: 5px; - margin-top: 0.5em; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c48:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c46 { - font-size: 12px; - margin-left: 30px; - white-space: pre-wrap; -} - -.c47 { - margin-top: 5px; - margin-left: 30px; - font-size: 12px; - font-style: italic; -} - -.c45 { - float: left; - font-size: 18px; -} - -.c43 { - display: block; - margin-top: 3px; - padding: 0; -} - -.c42 { - color: #d14727; - cursor: cursor; - display: inline-block; - font-weight: 400; - margin-top: 8px; - padding: 0; -} - -.c49 { - margin-top: 5px; -} - -.c50 { - color: #676767; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; -} - -.c52 { - font-size: 14px; -} - -.c51 { - padding: 0; -} - -
      -
    1. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - KGW Studio on the Sq, Portland, OR, USA - -
      -
      - 3:44 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 269 feet to - - Pioneer Square North MAX Station - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - NORTHWEST - on - - Unnamed Path - - - 167 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - LEFT - on - - Pioneer Sq N (path) - - - 101 feet - - -
        -
        3. -
      -
      -
      -       -
      -
      -
      - -
      -
      2. -
    2. -
      -
      -
      -
      -
      - - MA - - - MAX Blue Line - -
      -
      -
      -
      -
      - - Pioneer Square North MAX Station - - ID 8383 - - -
      -
      - 3:46 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - Ride - - -
      - - MAX Blue Line - -
      - - - MAX Blue Line - - to - - Hillsboro - - -       - - - - Disembark at - Providence Park MAX Station - - ID 9757 - - -       - -       -
      - -
      - -
      -
      - -
      -
      -
      -
      - -
      -
      -
      -
      -
        -
      1. -
        - • -
        -
        - Galleria/SW 10th Ave MAX Station -
        -
        2. -
      -
      -
      -
      - - Typical wait: - 15 min - -
      -
      -
      -
      -
      - -
      -
      3. -
    3. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - Providence Park MAX Station - - ID 9757 - - -
      -
      - 3:49 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 249 feet to - - 1737 SW Morrison St, Portland, OR, USA 97205 - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - WEST - on - - Providence Park (path) - - - 19 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - RIGHT - on - - Unnamed Path - - - 104 feet - - -
        -
        3. -
      3. -
        - - - -
        -
        - - RIGHT - on - - Unnamed Path - - - 27 feet - - -
        -
        4. -
      4. -
        - - - -
        -
        - - RIGHT - on - - SW Morrison St - - - 99 feet - - -
        -
        5. -
      -
      -
      -       -
      -
      -
      - -
      -
      4. -
    4. -
      -
      -
      -
      - -
      -
      -
      -
      -
      - - 1737 SW Morrison St, Portland, OR, USA 97205 - -
      -
      - 3:50 PM -
      - - Arrive at - 1737 SW Morrison St, Portland, OR, USA 97205 - -
      -
      - -
      -
      5. -
    -`; - -exports[`Storyshots ItineraryBody/otp-ui Walk Transit Walk Itinerary With Agency Information 1`] = ` - - - -`; - -exports[`Storyshots ItineraryBody/otp-ui Walk Transit Walk Itinerary With Agency Information 2`] = ` -.c22 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c58 { - color: #f44256; -} - -.c29 { - border-top-style: solid; - border-top-width: 0; - padding-top: 0; - padding-bottom: 10px; -} - -.c16 { - background: transparent; - border: 0; - color: inherit; - cursor: pointer; - font-size: inherit; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c31 { - color: #008; - margin-left: 5px; -} - -.c31:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c6 { - color: black; - background-color: #e9e9e9; - border: 2px solid #bbb; - text-align: center; - width: 25px; - height: 25px; - font-size: 1.2em; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; -} - -.c21::before { - content: ""; - margin: 0 0.125em; -} - -.c57 { - text-align: center; -} - -.c4 { - border-left: dotted 4px #484848; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c33 { - border-left: solid 8px #084C8D; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c53 { - display: block; - font-size: 13px; - list-style: none; - padding: 0; -} - -.c0 { - list-style: none; - padding: 0; -} - -.c12 { - color: #676767; - font-size: 13px; - padding-bottom: 12px; -} - -.c17 { - bottom: 0; - cursor: pointer; - left: 0; - position: absolute; - right: 0; - top: 0; - width: 100%; - z-index: 1; -} - -.c13 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - line-height: 16px; - min-height: 31px; - position: relative; -} - -.c10 { - display: inline-block; - grid-row-start: 2; - grid-column-start: 1; - height: 0; - overflow: hidden; - width: 0; -} - -.c40 { - font-weight: 200; -} - -.c15 { - font-weight: inherit; -} - -.c39 { - font-size: 13px; - font-weight: 500; -} - -.c38 { - font-weight: 800; - margin-right: 6px; -} - -.c37 { - color: #807373; - margin-top: 5px; -} - -.c14 { - -webkit-flex-shrink: 0; - -ms-flex-negative: 0; - flex-shrink: 0; -} - -.c3 { - position: relative; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); - height: 100%; -} - -.c5 { - width: 30px; - height: 30px; - border-radius: 50%; - position: absolute; - left: 50%; - top: 0; - -webkit-transform: translate(-51%,-10%); - -ms-transform: translate(-51%,-10%); - transform: translate(-51%,-10%); -} - -.c2 { - grid-column-start: 2; - grid-row: span 2; - padding-right: 5px; -} - -.c18 { - display: grid; - grid-template-columns: 100px auto; -} - -.c1 { - max-width: 500px; - display: grid; - grid-template-columns: 65px 30px auto; -} - -.c9 { - grid-column-start: 1; - grid-row: 1 / span 2; - padding-right: 5px; - font-size: 0.9em; -} - -.c32 { - padding: 3px 10px 3px 10px; - border: 0; - margin-top: -15px; - width: 35px; - height: 35px; -} - -.c32:hover { - cursor: pointer; -} - -.c30 { - -webkit-flex: 0 0 25px; - -ms-flex: 0 0 25px; - flex: 0 0 25px; - grid-column: -1; -} - -.c11 { - grid-row-start: 2; - grid-column-start: 3; -} - -.c7 { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - font-size: 1.2em; - grid-row-start: 1; - grid-column-start: 3; -} - -.c8 { - font-size: inherit; - font-weight: bold; - height: 1.2em; - margin: 0; - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; - -webkit-flex: 1 1 auto; - -ms-flex: 1 1 auto; - flex: 1 1 auto; - padding: 3px 0 10px 0; -} - -.c34 { - text-align: center; - min-width: 30px; - min-height: 30px; - font-size: 1.2em; - background-color: #084C8D; - color: white; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; - border: 1px solid; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - cursor: default; -} - -.c35 { - position: absolute; - width: 1px; - height: 1px; - padding: 0; - margin: -1px; - overflow: hidden; - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - border: 0; -} - -.c23 { - display: block; - list-style: none; - padding: 0; -} - -.c26 { - margin-left: 24px; - line-height: 1.25em; - padding-top: 1px; -} - -.c26 > span { - margin-right: 1ch; -} - -.c19 { - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - -webkit-align-self: center; - -ms-flex-item-align: center; - align-self: center; - margin-top: 10px; -} - -.c19 a { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; -} - -.c20 { - color: #676767; - font-size: 13px; - font-style: normal; - padding: 0; -} - -.c25 { - fill: #676767; - float: left; - height: 16px; - width: 16px; -} - -.c24 { - font-size: 13px; - margin-top: 8px; - color: #676767; - font-style: normal; -} - -.c27 { - font-weight: 500; -} - -.c28 { - font-weight: 200; - opacity: 0.8975; - padding-left: 1ch; -} - -.c36 { - font-weight: 200; - font-size: 0.9em; - margin-left: 10px; -} - -.c55 { - float: left; - margin-left: -36px; - color: #fff; -} - -.c56 { - color: #676767; - margin-top: 3px; -} - -.c54 { - z-index: 30; - position: relative; -} - -.c44 { - background-color: #eee; - border-radius: 4px; - color: #000; - display: block; - margin-top: 5px; - padding: 8px; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c48 { - -webkit-align-items: baseline; - -webkit-box-align: baseline; - -ms-flex-align: baseline; - align-items: baseline; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - gap: 5px; - margin-top: 0.5em; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c48:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c46 { - font-size: 12px; - margin-left: 30px; - white-space: pre-wrap; -} - -.c47 { - margin-top: 5px; - margin-left: 30px; - font-size: 12px; - font-style: italic; -} - -.c45 { - float: left; - font-size: 18px; -} - -.c43 { - display: block; - margin-top: 3px; - padding: 0; -} - -.c42 { - color: #d14727; - cursor: cursor; - display: inline-block; - font-weight: 400; - margin-top: 8px; - padding: 0; -} - -.c49 { - margin-top: 5px; -} - -.c50 { - color: #676767; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; -} - -.c52 { - font-size: 14px; -} - -.c51 { - padding: 0; -} - -.c41 { - margin-top: 5px; -} - -.c41 a { - color: #337ab7; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c41 a:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c41 img { - margin-left: 5px; - vertical-align: middle; -} - -
      -
    1. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - KGW Studio on the Sq, Portland, OR, USA - -
      -
      - 3:44 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 269 feet to - - Pioneer Square North MAX Station - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - NORTHWEST - on - - Unnamed Path - - - 167 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - LEFT - on - - Pioneer Sq N (path) - - - 101 feet - - -
        -
        3. -
      -
      -
      -       -
      -
      -
      - -
      -
      2. -
    2. -
      -
      -
      -
      -
      - - MA - - - MAX Blue Line - -
      -
      -
      -
      -
      - - Pioneer Square North MAX Station - - ID 8383 - - -
      -
      - 3:46 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - Ride - - -
      - - MAX Blue Line - -
      - - - MAX Blue Line - - to - - Hillsboro - - -       - - - - Disembark at - Providence Park MAX Station - - ID 9757 - - -       - -       -
      -
      -
      - Service operated by - - TriMet - - -
      - -
      -
      - -
      -
      -
      -
      - -
      -
      -
      -
      -
        -
      1. -
        - • -
        -
        - Galleria/SW 10th Ave MAX Station -
        -
        2. -
      -
      -
      -
      - - Typical wait: - 15 min - -
      -
      -
      -
      -
      - -
      -
      3. -
    3. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - Providence Park MAX Station - - ID 9757 - - -
      -
      - 3:49 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 249 feet to - - 1737 SW Morrison St, Portland, OR, USA 97205 - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - WEST - on - - Providence Park (path) - - - 19 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - RIGHT - on - - Unnamed Path - - - 104 feet - - -
        -
        3. -
      3. -
        - - - -
        -
        - - RIGHT - on - - Unnamed Path - - - 27 feet - - -
        -
        4. -
      4. -
        - - - -
        -
        - - RIGHT - on - - SW Morrison St - - - 99 feet - - -
        -
        5. -
      -
      -
      -       -
      -
      -
      - -
      -
      4. -
    4. -
      -
      -
      -
      - -
      -
      -
      -
      -
      - - 1737 SW Morrison St, Portland, OR, USA 97205 - -
      -
      - 3:50 PM -
      - - Arrive at - 1737 SW Morrison St, Portland, OR, USA 97205 - -
      -
      - -
      -
      5. -
    -`; - -exports[`Storyshots ItineraryBody/otp-ui Walk Transit Walk Itinerary With Custom Place Name Component 1`] = ` - - - -`; - -exports[`Storyshots ItineraryBody/otp-ui Walk Transit Walk Itinerary With Custom Place Name Component 2`] = ` -.c22 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c56 { - color: #f44256; -} - -.c29 { - border-top-style: solid; - border-top-width: 0; - padding-top: 0; - padding-bottom: 10px; -} - -.c16 { - background: transparent; - border: 0; - color: inherit; - cursor: pointer; - font-size: inherit; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c31 { - color: #008; - margin-left: 5px; -} - -.c31:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c6 { - color: black; - background-color: #e9e9e9; - border: 2px solid #bbb; - text-align: center; - width: 25px; - height: 25px; - font-size: 1.2em; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; -} - -.c21::before { - content: ""; - margin: 0 0.125em; -} - -.c55 { - text-align: center; -} - -.c4 { - border-left: dotted 4px #484848; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c33 { - border-left: solid 8px #084C8D; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c51 { - display: block; - font-size: 13px; - list-style: none; - padding: 0; -} - -.c0 { - list-style: none; - padding: 0; -} - -.c12 { - color: #676767; - font-size: 13px; - padding-bottom: 12px; -} - -.c17 { - bottom: 0; - cursor: pointer; - left: 0; - position: absolute; - right: 0; - top: 0; - width: 100%; - z-index: 1; -} - -.c13 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - line-height: 16px; - min-height: 31px; - position: relative; -} - -.c10 { - display: inline-block; - grid-row-start: 2; - grid-column-start: 1; - height: 0; - overflow: hidden; - width: 0; -} - -.c39 { - font-weight: 200; -} - -.c15 { - font-weight: inherit; -} - -.c38 { - font-size: 13px; - font-weight: 500; -} - -.c37 { - font-weight: 800; - margin-right: 6px; -} - -.c36 { - color: #807373; - margin-top: 5px; -} - -.c14 { - -webkit-flex-shrink: 0; - -ms-flex-negative: 0; - flex-shrink: 0; -} - -.c3 { - position: relative; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); - height: 100%; -} - -.c5 { - width: 30px; - height: 30px; - border-radius: 50%; - position: absolute; - left: 50%; - top: 0; - -webkit-transform: translate(-51%,-10%); - -ms-transform: translate(-51%,-10%); - transform: translate(-51%,-10%); -} - -.c2 { - grid-column-start: 2; - grid-row: span 2; - padding-right: 5px; -} - -.c18 { - display: grid; - grid-template-columns: 100px auto; -} - -.c1 { - max-width: 500px; - display: grid; - grid-template-columns: 65px 30px auto; -} - -.c9 { - grid-column-start: 1; - grid-row: 1 / span 2; - padding-right: 5px; - font-size: 0.9em; -} - -.c32 { - padding: 3px 10px 3px 10px; - border: 0; - margin-top: -15px; - width: 35px; - height: 35px; -} - -.c32:hover { - cursor: pointer; -} - -.c30 { - -webkit-flex: 0 0 25px; - -ms-flex: 0 0 25px; - flex: 0 0 25px; - grid-column: -1; -} - -.c11 { - grid-row-start: 2; - grid-column-start: 3; -} - -.c7 { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - font-size: 1.2em; - grid-row-start: 1; - grid-column-start: 3; -} - -.c8 { - font-size: inherit; - font-weight: bold; - height: 1.2em; - margin: 0; - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; - -webkit-flex: 1 1 auto; - -ms-flex: 1 1 auto; - flex: 1 1 auto; - padding: 3px 0 10px 0; -} - -.c34 { - text-align: center; - min-width: 30px; - min-height: 30px; - font-size: 1.2em; - background-color: #084C8D; - color: white; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; - border: 1px solid; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - cursor: default; -} - -.c35 { - position: absolute; - width: 1px; - height: 1px; - padding: 0; - margin: -1px; - overflow: hidden; - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - border: 0; -} - -.c23 { - display: block; - list-style: none; - padding: 0; -} - -.c26 { - margin-left: 24px; - line-height: 1.25em; - padding-top: 1px; -} - -.c26 > span { - margin-right: 1ch; -} - -.c19 { - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - -webkit-align-self: center; - -ms-flex-item-align: center; - align-self: center; - margin-top: 10px; -} - -.c19 a { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; -} - -.c20 { - color: #676767; - font-size: 13px; - font-style: normal; - padding: 0; -} - -.c25 { - fill: #676767; - float: left; - height: 16px; - width: 16px; -} - -.c24 { - font-size: 13px; - margin-top: 8px; - color: #676767; - font-style: normal; -} - -.c27 { - font-weight: 500; -} - -.c28 { - font-weight: 200; - opacity: 0.8975; - padding-left: 1ch; -} - -.c53 { - float: left; - margin-left: -36px; - color: #fff; -} - -.c54 { - color: #676767; - margin-top: 3px; -} - -.c52 { - z-index: 30; - position: relative; -} - -.c42 { - background-color: #eee; - border-radius: 4px; - color: #000; - display: block; - margin-top: 5px; - padding: 8px; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c46 { - -webkit-align-items: baseline; - -webkit-box-align: baseline; - -ms-flex-align: baseline; - align-items: baseline; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - gap: 5px; - margin-top: 0.5em; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c46:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c44 { - font-size: 12px; - margin-left: 30px; - white-space: pre-wrap; -} - -.c45 { - margin-top: 5px; - margin-left: 30px; - font-size: 12px; - font-style: italic; -} - -.c43 { - float: left; - font-size: 18px; -} - -.c41 { - display: block; - margin-top: 3px; - padding: 0; -} - -.c40 { - color: #d14727; - cursor: cursor; - display: inline-block; - font-weight: 400; - margin-top: 8px; - padding: 0; -} - -.c47 { - margin-top: 5px; -} - -.c48 { - color: #676767; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; -} - -.c50 { - font-size: 14px; -} - -.c49 { - padding: 0; -} - -
      -
    1. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - 🎉✨🎊 KGW Studio on the Sq, Portland, OR, USA 🎉✨🎊 - -
      -
      - 3:44 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 269 feet to - - Pioneer Square North MAX Station - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - NORTHWEST - on - - Unnamed Path - - - 167 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - LEFT - on - - Pioneer Sq N (path) - - - 101 feet - - -
        -
        3. -
      -
      -
      -       -
      -
      -
      - -
      -
      2. -
    2. -
      -
      -
      -
      -
      - - MA - - - MAX Blue Line - -
      -
      -
      -
      -
      - - 🎉✨🎊 Pioneer Square North MAX Station 🎉✨🎊 - -
      -
      - 3:46 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - Ride - - -
      - - MAX Blue Line - -
      - - - MAX Blue Line - - to - - Hillsboro - - -       - - - - Disembark at - 🎉✨🎊 Providence Park MAX Station 🎉✨🎊 - -       - -       -
      -
      - -
      -
      - -
      -
      -
      -
      - -
      -
      -
      -
      -
        -
      1. -
        - • -
        -
        - Galleria/SW 10th Ave MAX Station -
        -
        2. -
      -
      -
      -
      - - Typical wait: - 15 min - -
      -
      -
      -
      -
      - -
      -
      3. -
    3. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - 🎉✨🎊 Providence Park MAX Station 🎉✨🎊 - -
      -
      - 3:49 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 249 feet to - - 1737 SW Morrison St, Portland, OR, USA 97205 - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - WEST - on - - Providence Park (path) - - - 19 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - RIGHT - on - - Unnamed Path - - - 104 feet - - -
        -
        3. -
      3. -
        - - - -
        -
        - - RIGHT - on - - Unnamed Path - - - 27 feet - - -
        -
        4. -
      4. -
        - - - -
        -
        - - RIGHT - on - - SW Morrison St - - - 99 feet - - -
        -
        5. -
      -
      -
      -       -
      -
      -
      - -
      -
      4. -
    4. -
      -
      -
      -
      - -
      -
      -
      -
      -
      - - 🎉✨🎊 1737 SW Morrison St, Portland, OR, USA 97205 🎉✨🎊 - -
      -
      - 3:50 PM -
      - - Arrive at - 🎉✨🎊 1737 SW Morrison St, Portland, OR, USA 97205 🎉✨🎊 - -
      -
      - -
      -
      5. -
    -`; - -exports[`Storyshots ItineraryBody/otp-ui Walk Transit Walk Itinerary With Custom Transit Leg Summary Component 1`] = ` - - - -`; - -exports[`Storyshots ItineraryBody/otp-ui Walk Transit Walk Itinerary With Custom Transit Leg Summary Component 2`] = ` -.c22 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c56 { - color: #f44256; -} - -.c29 { - border-top-style: solid; - border-top-width: 0; - padding-top: 0; - padding-bottom: 10px; -} - -.c16 { - background: transparent; - border: 0; - color: inherit; - cursor: pointer; - font-size: inherit; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c31 { - color: #008; - margin-left: 5px; -} - -.c31:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c6 { - color: black; - background-color: #e9e9e9; - border: 2px solid #bbb; - text-align: center; - width: 25px; - height: 25px; - font-size: 1.2em; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; -} - -.c21::before { - content: ""; - margin: 0 0.125em; -} - -.c55 { - text-align: center; -} - -.c4 { - border-left: dotted 4px #484848; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c33 { - border-left: solid 8px #084C8D; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c51 { - display: block; - font-size: 13px; - list-style: none; - padding: 0; -} - -.c0 { - list-style: none; - padding: 0; -} - -.c12 { - color: #676767; - font-size: 13px; - padding-bottom: 12px; -} - -.c17 { - bottom: 0; - cursor: pointer; - left: 0; - position: absolute; - right: 0; - top: 0; - width: 100%; - z-index: 1; -} - -.c13 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - line-height: 16px; - min-height: 31px; - position: relative; -} - -.c10 { - display: inline-block; - grid-row-start: 2; - grid-column-start: 1; - height: 0; - overflow: hidden; - width: 0; -} - -.c40 { - font-weight: 200; -} - -.c15 { - font-weight: inherit; -} - -.c39 { - font-size: 13px; - font-weight: 500; -} - -.c38 { - font-weight: 800; - margin-right: 6px; -} - -.c37 { - color: #807373; - margin-top: 5px; -} - -.c14 { - -webkit-flex-shrink: 0; - -ms-flex-negative: 0; - flex-shrink: 0; -} - -.c3 { - position: relative; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); - height: 100%; -} - -.c5 { - width: 30px; - height: 30px; - border-radius: 50%; - position: absolute; - left: 50%; - top: 0; - -webkit-transform: translate(-51%,-10%); - -ms-transform: translate(-51%,-10%); - transform: translate(-51%,-10%); -} - -.c2 { - grid-column-start: 2; - grid-row: span 2; - padding-right: 5px; -} - -.c18 { - display: grid; - grid-template-columns: 100px auto; -} - -.c1 { - max-width: 500px; - display: grid; - grid-template-columns: 65px 30px auto; -} - -.c9 { - grid-column-start: 1; - grid-row: 1 / span 2; - padding-right: 5px; - font-size: 0.9em; -} - -.c32 { - padding: 3px 10px 3px 10px; - border: 0; - margin-top: -15px; - width: 35px; - height: 35px; -} - -.c32:hover { - cursor: pointer; -} - -.c30 { - -webkit-flex: 0 0 25px; - -ms-flex: 0 0 25px; - flex: 0 0 25px; - grid-column: -1; -} - -.c11 { - grid-row-start: 2; - grid-column-start: 3; -} - -.c7 { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - font-size: 1.2em; - grid-row-start: 1; - grid-column-start: 3; -} - -.c8 { - font-size: inherit; - font-weight: bold; - height: 1.2em; - margin: 0; - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; - -webkit-flex: 1 1 auto; - -ms-flex: 1 1 auto; - flex: 1 1 auto; - padding: 3px 0 10px 0; -} - -.c34 { - text-align: center; - min-width: 30px; - min-height: 30px; - font-size: 1.2em; - background-color: #084C8D; - color: white; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; - border: 1px solid; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - cursor: default; -} - -.c35 { - position: absolute; - width: 1px; - height: 1px; - padding: 0; - margin: -1px; - overflow: hidden; - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - border: 0; -} - -.c23 { - display: block; - list-style: none; - padding: 0; -} - -.c26 { - margin-left: 24px; - line-height: 1.25em; - padding-top: 1px; -} - -.c26 > span { - margin-right: 1ch; -} - -.c19 { - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - -webkit-align-self: center; - -ms-flex-item-align: center; - align-self: center; - margin-top: 10px; -} - -.c19 a { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; -} - -.c20 { - color: #676767; - font-size: 13px; - font-style: normal; - padding: 0; -} - -.c25 { - fill: #676767; - float: left; - height: 16px; - width: 16px; -} - -.c24 { - font-size: 13px; - margin-top: 8px; - color: #676767; - font-style: normal; -} - -.c27 { - font-weight: 500; -} - -.c28 { - font-weight: 200; - opacity: 0.8975; - padding-left: 1ch; -} - -.c36 { - font-weight: 200; - font-size: 0.9em; - margin-left: 10px; -} - -.c53 { - float: left; - margin-left: -36px; - color: #fff; -} - -.c54 { - color: #676767; - margin-top: 3px; -} - -.c52 { - z-index: 30; - position: relative; -} - -.c43 { - background-color: #eee; - border-radius: 4px; - color: #000; - display: block; - margin-top: 5px; - padding: 8px; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c47 { - -webkit-align-items: baseline; - -webkit-box-align: baseline; - -ms-flex-align: baseline; - align-items: baseline; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - gap: 5px; - margin-top: 0.5em; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c47:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c45 { - font-size: 12px; - margin-left: 30px; - white-space: pre-wrap; -} - -.c46 { - margin-top: 5px; - margin-left: 30px; - font-size: 12px; - font-style: italic; -} - -.c44 { - float: left; - font-size: 18px; -} - -.c42 { - display: block; - margin-top: 3px; - padding: 0; -} - -.c41 { - color: #d14727; - cursor: cursor; - display: inline-block; - font-weight: 400; - margin-top: 8px; - padding: 0; -} - -.c48 { - margin-top: 5px; -} - -.c49 { - color: #676767; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; -} - -.c50 { - font-size: 14px; -} - -
      -
    1. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - KGW Studio on the Sq, Portland, OR, USA - -
      -
      - 3:44 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 269 feet to - - Pioneer Square North MAX Station - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - NORTHWEST - on - - Unnamed Path - - - 167 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - LEFT - on - - Pioneer Sq N (path) - - - 101 feet - - -
        -
        3. -
      -
      -
      -       -
      -
      -
      - -
      -
      2. -
    2. -
      -
      -
      -
      -
      - - MA - - - MAX Blue Line - -
      -
      -
      -
      -
      - - Pioneer Square North MAX Station - - ID 8383 - - -
      -
      - 3:46 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - Ride - - -
      - - MAX Blue Line - -
      - - - MAX Blue Line - - to - - Hillsboro - - -       - - - - Disembark at - Providence Park MAX Station - - ID 9757 - - -       - -       -
      -
      - -
      -
      - -
      -
      -
      -
      -
      - - Ride for a custom duration of - 3.583 - minutes - - - (2 stops) - - - - -
      -
      -
      -
      -
      -
        -
      1. -
        - • -
        -
        - Galleria/SW 10th Ave MAX Station -
        -
        2. -
      -
      -
      -
      - - Typical wait: - 15 min - -
      -
      -
      -
      -
      - -
      -
      3. -
    3. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - Providence Park MAX Station - - ID 9757 - - -
      -
      - 3:49 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 249 feet to - - 1737 SW Morrison St, Portland, OR, USA 97205 - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - WEST - on - - Providence Park (path) - - - 19 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - RIGHT - on - - Unnamed Path - - - 104 feet - - -
        -
        3. -
      3. -
        - - - -
        -
        - - RIGHT - on - - Unnamed Path - - - 27 feet - - -
        -
        4. -
      4. -
        - - - -
        -
        - - RIGHT - on - - SW Morrison St - - - 99 feet - - -
        -
        5. -
      -
      -
      -       -
      -
      -
      - -
      -
      4. -
    4. -
      -
      -
      -
      - -
      -
      -
      -
      -
      - - 1737 SW Morrison St, Portland, OR, USA 97205 - -
      -
      - 3:50 PM -
      - - Arrive at - 1737 SW Morrison St, Portland, OR, USA 97205 - -
      -
      - -
      -
      5. -
    -`; - -exports[`Storyshots ItineraryBody/otp-ui Walk Transit Walk Itinerary With Custom View Trip Button Activated And Custom Route Abbreviation 1`] = ` - - - -`; - -exports[`Storyshots ItineraryBody/otp-ui Walk Transit Walk Itinerary With Custom View Trip Button Activated And Custom Route Abbreviation 2`] = ` -.c22 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c58 { - color: #f44256; -} - -.c29 { - border-top-style: solid; - border-top-width: 0; - padding-top: 0; - padding-bottom: 10px; -} - -.c16 { - background: transparent; - border: 0; - color: inherit; - cursor: pointer; - font-size: inherit; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c31 { - color: #008; - margin-left: 5px; -} - -.c31:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c51 { - padding-left: 0px; -} - -.c51:before { - content: "|"; - color: black; - margin-right: 5px; -} - -.c6 { - color: black; - background-color: #e9e9e9; - border: 2px solid #bbb; - text-align: center; - width: 25px; - height: 25px; - font-size: 1.2em; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; -} - -.c21::before { - content: ""; - margin: 0 0.125em; -} - -.c57 { - text-align: center; -} - -.c4 { - border-left: dotted 4px #484848; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c33 { - border-left: solid 8px #084C8D; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c53 { - display: block; - font-size: 13px; - list-style: none; - padding: 0; -} - -.c0 { - list-style: none; - padding: 0; -} - -.c12 { - color: #676767; - font-size: 13px; - padding-bottom: 12px; -} - -.c17 { - bottom: 0; - cursor: pointer; - left: 0; - position: absolute; - right: 0; - top: 0; - width: 100%; - z-index: 1; -} - -.c13 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - line-height: 16px; - min-height: 31px; - position: relative; -} - -.c10 { - display: inline-block; - grid-row-start: 2; - grid-column-start: 1; - height: 0; - overflow: hidden; - width: 0; -} - -.c40 { - font-weight: 200; -} - -.c15 { - font-weight: inherit; -} - -.c39 { - font-size: 13px; - font-weight: 500; -} - -.c38 { - font-weight: 800; - margin-right: 6px; -} - -.c37 { - color: #807373; - margin-top: 5px; -} - -.c14 { - -webkit-flex-shrink: 0; - -ms-flex-negative: 0; - flex-shrink: 0; -} - -.c3 { - position: relative; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); - height: 100%; -} - -.c5 { - width: 30px; - height: 30px; - border-radius: 50%; - position: absolute; - left: 50%; - top: 0; - -webkit-transform: translate(-51%,-10%); - -ms-transform: translate(-51%,-10%); - transform: translate(-51%,-10%); -} - -.c2 { - grid-column-start: 2; - grid-row: span 2; - padding-right: 5px; -} - -.c18 { - display: grid; - grid-template-columns: 100px auto; -} - -.c1 { - max-width: 500px; - display: grid; - grid-template-columns: 65px 30px auto; -} - -.c9 { - grid-column-start: 1; - grid-row: 1 / span 2; - padding-right: 5px; - font-size: 0.9em; -} - -.c32 { - padding: 3px 10px 3px 10px; - border: 0; - margin-top: -15px; - width: 35px; - height: 35px; -} - -.c32:hover { - cursor: pointer; -} - -.c30 { - -webkit-flex: 0 0 25px; - -ms-flex: 0 0 25px; - flex: 0 0 25px; - grid-column: -1; -} - -.c11 { - grid-row-start: 2; - grid-column-start: 3; -} - -.c7 { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - font-size: 1.2em; - grid-row-start: 1; - grid-column-start: 3; -} - -.c8 { - font-size: inherit; - font-weight: bold; - height: 1.2em; - margin: 0; - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; - -webkit-flex: 1 1 auto; - -ms-flex: 1 1 auto; - flex: 1 1 auto; - padding: 3px 0 10px 0; -} - -.c34 { - text-align: center; - min-width: 30px; - min-height: 30px; - font-size: 1.2em; - background-color: #084C8D; - color: white; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; - border: 1px solid; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - cursor: default; -} - -.c35 { - position: absolute; - width: 1px; - height: 1px; - padding: 0; - margin: -1px; - overflow: hidden; - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - border: 0; -} - -.c23 { - display: block; - list-style: none; - padding: 0; -} - -.c26 { - margin-left: 24px; - line-height: 1.25em; - padding-top: 1px; -} - -.c26 > span { - margin-right: 1ch; -} - -.c19 { - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - -webkit-align-self: center; - -ms-flex-item-align: center; - align-self: center; - margin-top: 10px; -} - -.c19 a { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; -} - -.c20 { - color: #676767; - font-size: 13px; - font-style: normal; - padding: 0; -} - -.c25 { - fill: #676767; - float: left; - height: 16px; - width: 16px; -} - -.c24 { - font-size: 13px; - margin-top: 8px; - color: #676767; - font-style: normal; -} - -.c27 { - font-weight: 500; -} - -.c28 { - font-weight: 200; - opacity: 0.8975; - padding-left: 1ch; -} - -.c36 { - font-weight: 200; - font-size: 0.9em; - margin-left: 10px; -} - -.c55 { - float: left; - margin-left: -36px; - color: #fff; -} - -.c56 { - color: #676767; - margin-top: 3px; -} - -.c54 { - z-index: 30; - position: relative; -} - -.c43 { - background-color: #eee; - border-radius: 4px; - color: #000; - display: block; - margin-top: 5px; - padding: 8px; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c47 { - -webkit-align-items: baseline; - -webkit-box-align: baseline; - -ms-flex-align: baseline; - align-items: baseline; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - gap: 5px; - margin-top: 0.5em; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c47:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c45 { - font-size: 12px; - margin-left: 30px; - white-space: pre-wrap; -} - -.c46 { - margin-top: 5px; - margin-left: 30px; - font-size: 12px; - font-style: italic; -} - -.c44 { - float: left; - font-size: 18px; -} - -.c42 { - display: block; - margin-top: 3px; - padding: 0; -} - -.c41 { - color: #d14727; - cursor: cursor; - display: inline-block; - font-weight: 400; - margin-top: 8px; - padding: 0; -} - -.c48 { - margin-top: 5px; -} - -.c49 { - color: #676767; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; -} - -.c52 { - font-size: 14px; -} - -.c50 { - padding: 0; -} - -
      -
    1. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - KGW Studio on the Sq, Portland, OR, USA - -
      -
      - 3:44 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 269 feet to - - Pioneer Square North MAX Station - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - NORTHWEST - on - - Unnamed Path - - - 167 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - LEFT - on - - Pioneer Sq N (path) - - - 101 feet - - -
        -
        3. -
      -
      -
      -       -
      -
      -
      - -
      -
      2. -
    2. -
      -
      -
      -
      -
      - - - MAX Blue Line - -
      -
      -
      -
      -
      - - Pioneer Square North MAX Station - - ID 8383 - - -
      -
      - 3:46 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - Ride - - -
      - - MAX Blue Line - -
      - - - MAX Blue Line - - to - - Hillsboro - - -       - - - - Disembark at - Providence Park MAX Station - - ID 9757 - - -       - -       -
      -
      - -
      -
      - -
      -
      -
      -
      - - -
      -
      -
      -
      -
        -
      1. -
        - • -
        -
        - Galleria/SW 10th Ave MAX Station -
        -
        2. -
      -
      -
      -
      - - Typical wait: - 15 min - -
      -
      -
      -
      -
      - -
      -
      3. -
    3. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - Providence Park MAX Station - - ID 9757 - - -
      -
      - 3:49 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 249 feet to - - 1737 SW Morrison St, Portland, OR, USA 97205 - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - WEST - on - - Providence Park (path) - - - 19 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - RIGHT - on - - Unnamed Path - - - 104 feet - - -
        -
        3. -
      3. -
        - - - -
        -
        - - RIGHT - on - - Unnamed Path - - - 27 feet - - -
        -
        4. -
      4. -
        - - - -
        -
        - - RIGHT - on - - SW Morrison St - - - 99 feet - - -
        -
        5. -
      -
      -
      -       -
      -
      -
      - -
      -
      4. -
    4. -
      -
      -
      -
      - -
      -
      -
      -
      -
      - - 1737 SW Morrison St, Portland, OR, USA 97205 - -
      -
      - 3:50 PM -
      - - Arrive at - 1737 SW Morrison St, Portland, OR, USA 97205 - -
      -
      - -
      -
      5. -
    -`; - -exports[`Storyshots ItineraryBody/otp-ui Zero Alerts Always Collapsing 1`] = ` - - - -`; - -exports[`Storyshots ItineraryBody/otp-ui Zero Alerts Always Collapsing 2`] = ` -.c22 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c51 { - color: #f44256; -} - -.c29 { - border-top-style: solid; - border-top-width: 0; - padding-top: 0; - padding-bottom: 10px; -} - -.c16 { - background: transparent; - border: 0; - color: inherit; - cursor: pointer; - font-size: inherit; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c31 { - color: #008; - margin-left: 5px; -} - -.c31:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c6 { - color: black; - background-color: #e9e9e9; - border: 2px solid #bbb; - text-align: center; - width: 25px; - height: 25px; - font-size: 1.2em; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; -} - -.c21::before { - content: ""; - margin: 0 0.125em; -} - -.c50 { - text-align: center; -} - -.c4 { - border-left: dotted 4px #484848; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c33 { - border-left: solid 8px #0070c0; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c48 { - border-left: solid 8px #008ab0; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c44 { - display: block; - font-size: 13px; - list-style: none; - padding: 0; -} - -.c0 { - list-style: none; - padding: 0; -} - -.c12 { - color: #676767; - font-size: 13px; - padding-bottom: 12px; -} - -.c17 { - bottom: 0; - cursor: pointer; - left: 0; - position: absolute; - right: 0; - top: 0; - width: 100%; - z-index: 1; -} - -.c13 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - line-height: 16px; - min-height: 31px; - position: relative; -} - -.c10 { - display: inline-block; - grid-row-start: 2; - grid-column-start: 1; - height: 0; - overflow: hidden; - width: 0; -} - -.c15 { - font-weight: inherit; -} - -.c39 { - font-size: 13px; - font-weight: 500; -} - -.c38 { - font-weight: 800; - margin-right: 6px; -} - -.c37 { - color: #807373; - margin-top: 5px; -} - -.c14 { - -webkit-flex-shrink: 0; - -ms-flex-negative: 0; - flex-shrink: 0; -} - -.c3 { - position: relative; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); - height: 100%; -} - -.c5 { - width: 30px; - height: 30px; - border-radius: 50%; - position: absolute; - left: 50%; - top: 0; - -webkit-transform: translate(-51%,-10%); - -ms-transform: translate(-51%,-10%); - transform: translate(-51%,-10%); -} - -.c2 { - grid-column-start: 2; - grid-row: span 2; - padding-right: 5px; -} - -.c18 { - display: grid; - grid-template-columns: 100px auto; -} - -.c1 { - max-width: 500px; - display: grid; - grid-template-columns: 65px 30px auto; -} - -.c9 { - grid-column-start: 1; - grid-row: 1 / span 2; - padding-right: 5px; - font-size: 0.9em; -} - -.c32 { - padding: 3px 10px 3px 10px; - border: 0; - margin-top: -15px; - width: 35px; - height: 35px; -} - -.c32:hover { - cursor: pointer; -} - -.c30 { - -webkit-flex: 0 0 25px; - -ms-flex: 0 0 25px; - flex: 0 0 25px; - grid-column: -1; -} - -.c11 { - grid-row-start: 2; - grid-column-start: 3; -} - -.c7 { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - font-size: 1.2em; - grid-row-start: 1; - grid-column-start: 3; -} - -.c8 { - font-size: inherit; - font-weight: bold; - height: 1.2em; - margin: 0; - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; - -webkit-flex: 1 1 auto; - -ms-flex: 1 1 auto; - flex: 1 1 auto; - padding: 3px 0 10px 0; -} - -.c34 { - text-align: center; - min-width: 30px; - min-height: 30px; - font-size: 1.2em; - background-color: #0070c0; - color: white; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; - border: 1px solid; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - cursor: default; -} - -.c49 { - text-align: center; - min-width: 30px; - min-height: 30px; - font-size: 1.2em; - background-color: #084c8d; - color: white; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; - border: 1px solid; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - cursor: default; -} - -.c35 { - position: absolute; - width: 1px; - height: 1px; - padding: 0; - margin: -1px; - overflow: hidden; - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - border: 0; -} - -.c23 { - display: block; - list-style: none; - padding: 0; -} - -.c26 { - margin-left: 24px; - line-height: 1.25em; - padding-top: 1px; -} - -.c26 > span { - margin-right: 1ch; -} - -.c19 { - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - -webkit-align-self: center; - -ms-flex-item-align: center; - align-self: center; - margin-top: 10px; -} - -.c19 a { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; -} - -.c20 { - color: #676767; - font-size: 13px; - font-style: normal; - padding: 0; -} - -.c25 { - fill: #676767; - float: left; - height: 16px; - width: 16px; -} - -.c24 { - font-size: 13px; - margin-top: 8px; - color: #676767; - font-style: normal; -} - -.c27 { - font-weight: 500; -} - -.c28 { - font-weight: 200; - opacity: 0.8975; - padding-left: 1ch; -} - -.c36 { - font-weight: 200; - font-size: 0.9em; - margin-left: 10px; -} - -.c46 { - float: left; - margin-left: -36px; - color: #fff; -} - -.c47 { - color: #676767; - margin-top: 3px; -} - -.c45 { - z-index: 30; - position: relative; -} - -.c40 { - margin-top: 5px; -} - -.c41 { - color: #676767; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; -} - -.c43 { - font-size: 14px; -} - -.c42 { - padding: 0; -} - -
      -
    1. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - 47.97767, -122.20034 - -
      -
      - 12:57 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 0.3 miles to - - Everett Station Bay C1 - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - SOUTH - on - - service road - - - 0.1 miles - - -
        -
        2. -
      2. -
        - - - -
        -
        - - RIGHT - on - - Smith Avenue - - - 129 feet - - -
        -
        3. -
      3. -
        - - - -
        -
        - - CONTINUE - on - - Paine Avenue - - - 61 feet - - -
        -
        4. -
      4. -
        - - - -
        -
        - - LEFT - on - - 32nd Street - - - 67 feet - - -
        -
        5. -
      5. -
        - - - -
        -
        - - RIGHT - on - - 32nd Street - - - 313 feet - - -
        -
        6. -
      6. -
        - - - -
        -
        - - LEFT - on - - Unnamed Path - - - 380 feet - - -
        -
        7. -
      -
      -
      -       -
      -
      -
      - -
      -
      2. -
    2. -
      -
      -
      -
      -
      - - 51 - - - Everett - Northgate Station - -
      -
      -
      -
      -
      - - Everett Station Bay C1 - - ID 2345 - - -
      -
      - 1:04 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - Ride - - -
      - - 512 - -
      - - - Northgate Station - - -       - - - - Disembark at - Northgate Station - - ID 2191 - - -       - -       -
      -
      -
      -
      -
      -
      -
      - -
      -
      -
      -
      -
        -
      1. -
        - • -
        -
        - Broadway & 34th St -
        -
        2. -
      2. -
        - • -
        -
        - South Everett Fwy Station Bay 3 -
        -
        3. -
      3. -
        - • -
        -
        - Ash Way Park & Ride Bay 1 -
        -
        4. -
      4. -
        - • -
        -
        - Lynnwood Transit Center Bay D3 -
        -
        5. -
      5. -
        - • -
        -
        - Mountlake Terrace Fwy Station Bay 6 -
        -
        6. -
      -
      -
      -
      -
      -
      -
      -
      -
      - -
      -
      3. -
    3. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - Northgate Station - - ID 2191 - - -
      -
      - 1:51 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk to - - Northgate Station - Bay 4 - - - - -
      - - - - -
      -
      -
        -
      -
      -       -
      -
      -
      - -
      -
      4. -
    4. -
      -
      -
      -
      -
      - - 40 - - - - -
      -
      -
      -
      -
      - - Northgate Station - Bay 4 - - ID 35318 - - -
      -
      - 1:55 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - Ride - - -
      - - 40 - -
      - - - Downtown Seattle Ballard - - -       - - - - Disembark at - N 105th St & Aurora Ave N - - ID 40032 - - -       - -       -
      -
      -
      -
      -
      -
      -
      - -
      -
      -
      -
      -
        -
      1. -
        - • -
        -
        - 1st Ave NE & NE 95th St -
        -
        2. -
      2. -
        - • -
        -
        - N 92nd St & Corliss Ave N -
        -
        3. -
      3. -
        - • -
        -
        - College Way N & N 97th St -
        -
        4. -
      4. -
        - • -
        -
        - College Way N & N 103rd St -
        -
        5. -
      5. -
        - • -
        -
        - Meridian Ave N & N 105th St -
        -
        6. -
      6. -
        - • -
        -
        - N Northgate Way & Meridian Ave N -
        -
        7. -
      7. -
        - • -
        -
        - N Northgate Way & Stone Ave N -
        -
        8. -
      -
      -
      -
      -
      -
      -
      -
      -
      - -
      -
      5. -
    5. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - N 105th St & Aurora Ave N - - ID 40032 - - -
      -
      - 2:06 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 259 feet to - - Aurora Ave N & N 105th St - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - EAST - on - - North 105th Street - - - 64 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - RIGHT - on - - service road - - - 14 feet - - -
        -
        3. -
      3. -
        - - - -
        -
        - - LEFT - on - - Unnamed Path - - - 180 feet - - -
        -
        4. -
      -
      -
      -       -
      -
      -
      - -
      -
      6. -
    6. -
      -
      -
      -
      -
      - - E - - - - -
      -
      -
      -
      -
      - - Aurora Ave N & N 105th St - - ID 7080 - - -
      -
      - 2:07 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - Ride - - -
      - - E Line - -
      - - - Downtown Seattle - - -       - - - - Disembark at - 3rd Ave & Cherry St - - ID 490 - - -       - -       -
      -
      -
      -
      -
      -
      -
      - -
      -
      -
      -
      -
        -
      1. -
        - • -
        -
        - Aurora Ave N & N 100th St -
        -
        2. -
      2. -
        - • -
        -
        - Aurora Ave N & N 95th St -
        -
        3. -
      3. -
        - • -
        -
        - Aurora Ave N & N 90th St -
        -
        4. -
      4. -
        - • -
        -
        - Aurora Ave N & N 85th St -
        -
        5. -
      5. -
        - • -
        -
        - Aurora Ave N & N 80th St -
        -
        6. -
      6. -
        - • -
        -
        - Aurora Ave N & N 76th St -
        -
        7. -
      7. -
        - • -
        -
        - Aurora Ave N & N 65th St -
        -
        8. -
      8. -
        - • -
        -
        - Aurora Ave N & N 46th St -
        -
        9. -
      9. -
        - • -
        -
        - Aurora Ave N & Lynn St -
        -
        10. -
      10. -
        - • -
        -
        - Aurora Ave N & Galer St -
        -
        11. -
      11. -
        - • -
        -
        - 7th Ave N & Thomas St -
        -
        12. -
      12. -
        - • -
        -
        - Wall St & 5th Ave -
        -
        13. -
      13. -
        - • -
        -
        - 3rd Ave & Bell St -
        -
        14. -
      14. -
        - • -
        -
        - 3rd Ave & Virginia St -
        -
        15. -
      15. -
        - • -
        -
        - 3rd Ave & Pike St -
        -
        16. -
      16. -
        - • -
        -
        - 3rd Ave & Seneca St -
        -
        17. -
      -
      -
      -
      -
      -
      -
      -
      -
      - -
      -
      7. -
    7. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - 3rd Ave & Cherry St - - ID 490 - - -
      -
      - 2:39 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 443 feet to - - 208 James St, Seattle, WA 98104-2212, United States - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - SOUTHEAST - on - - sidewalk - - - 326 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - UTURN_RIGHT - on - - sidewalk - - - 117 feet - - -
        -
        3. -
      -
      -
      -       -
      -
      -
      - -
      -
      8. -
    8. -
      -
      -
      -
      - -
      -
      -
      -
      -
      - - 208 James St, Seattle, WA 98104-2212, United States - -
      -
      - 2:41 PM -
      - - Arrive at - 208 James St, Seattle, WA 98104-2212, United States - -
      -
      - -
      -
      9. -
    -`; - -exports[`Storyshots ItineraryBody/otp-ui Zero Alerts Not Always Collapsing 1`] = ` - - - -`; - -exports[`Storyshots ItineraryBody/otp-ui Zero Alerts Not Always Collapsing 2`] = ` -.c22 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c51 { - color: #f44256; -} - -.c29 { - border-top-style: solid; - border-top-width: 0; - padding-top: 0; - padding-bottom: 10px; -} - -.c16 { - background: transparent; - border: 0; - color: inherit; - cursor: pointer; - font-size: inherit; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c31 { - color: #008; - margin-left: 5px; -} - -.c31:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c6 { - color: black; - background-color: #e9e9e9; - border: 2px solid #bbb; - text-align: center; - width: 25px; - height: 25px; - font-size: 1.2em; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; -} - -.c21::before { - content: ""; - margin: 0 0.125em; -} - -.c50 { - text-align: center; -} - -.c4 { - border-left: dotted 4px #484848; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c33 { - border-left: solid 8px #0070c0; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c48 { - border-left: solid 8px #008ab0; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c44 { - display: block; - font-size: 13px; - list-style: none; - padding: 0; -} - -.c0 { - list-style: none; - padding: 0; -} - -.c12 { - color: #676767; - font-size: 13px; - padding-bottom: 12px; -} - -.c17 { - bottom: 0; - cursor: pointer; - left: 0; - position: absolute; - right: 0; - top: 0; - width: 100%; - z-index: 1; -} - -.c13 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - line-height: 16px; - min-height: 31px; - position: relative; -} - -.c10 { - display: inline-block; - grid-row-start: 2; - grid-column-start: 1; - height: 0; - overflow: hidden; - width: 0; -} - -.c15 { - font-weight: inherit; -} - -.c39 { - font-size: 13px; - font-weight: 500; -} - -.c38 { - font-weight: 800; - margin-right: 6px; -} - -.c37 { - color: #807373; - margin-top: 5px; -} - -.c14 { - -webkit-flex-shrink: 0; - -ms-flex-negative: 0; - flex-shrink: 0; -} - -.c3 { - position: relative; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); - height: 100%; -} - -.c5 { - width: 30px; - height: 30px; - border-radius: 50%; - position: absolute; - left: 50%; - top: 0; - -webkit-transform: translate(-51%,-10%); - -ms-transform: translate(-51%,-10%); - transform: translate(-51%,-10%); -} - -.c2 { - grid-column-start: 2; - grid-row: span 2; - padding-right: 5px; -} - -.c18 { - display: grid; - grid-template-columns: 100px auto; -} - -.c1 { - max-width: 500px; - display: grid; - grid-template-columns: 65px 30px auto; -} - -.c9 { - grid-column-start: 1; - grid-row: 1 / span 2; - padding-right: 5px; - font-size: 0.9em; -} - -.c32 { - padding: 3px 10px 3px 10px; - border: 0; - margin-top: -15px; - width: 35px; - height: 35px; -} - -.c32:hover { - cursor: pointer; -} - -.c30 { - -webkit-flex: 0 0 25px; - -ms-flex: 0 0 25px; - flex: 0 0 25px; - grid-column: -1; -} - -.c11 { - grid-row-start: 2; - grid-column-start: 3; -} - -.c7 { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - font-size: 1.2em; - grid-row-start: 1; - grid-column-start: 3; -} - -.c8 { - font-size: inherit; - font-weight: bold; - height: 1.2em; - margin: 0; - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; - -webkit-flex: 1 1 auto; - -ms-flex: 1 1 auto; - flex: 1 1 auto; - padding: 3px 0 10px 0; -} - -.c34 { - text-align: center; - min-width: 30px; - min-height: 30px; - font-size: 1.2em; - background-color: #0070c0; - color: white; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; - border: 1px solid; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - cursor: default; -} - -.c49 { - text-align: center; - min-width: 30px; - min-height: 30px; - font-size: 1.2em; - background-color: #084c8d; - color: white; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; - border: 1px solid; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - cursor: default; -} - -.c35 { - position: absolute; - width: 1px; - height: 1px; - padding: 0; - margin: -1px; - overflow: hidden; - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - border: 0; -} - -.c23 { - display: block; - list-style: none; - padding: 0; -} - -.c26 { - margin-left: 24px; - line-height: 1.25em; - padding-top: 1px; -} - -.c26 > span { - margin-right: 1ch; -} - -.c19 { - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - -webkit-align-self: center; - -ms-flex-item-align: center; - align-self: center; - margin-top: 10px; -} - -.c19 a { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; -} - -.c20 { - color: #676767; - font-size: 13px; - font-style: normal; - padding: 0; -} - -.c25 { - fill: #676767; - float: left; - height: 16px; - width: 16px; -} - -.c24 { - font-size: 13px; - margin-top: 8px; - color: #676767; - font-style: normal; -} - -.c27 { - font-weight: 500; -} - -.c28 { - font-weight: 200; - opacity: 0.8975; - padding-left: 1ch; -} - -.c36 { - font-weight: 200; - font-size: 0.9em; - margin-left: 10px; -} - -.c46 { - float: left; - margin-left: -36px; - color: #fff; -} - -.c47 { - color: #676767; - margin-top: 3px; -} - -.c45 { - z-index: 30; - position: relative; -} - -.c40 { - margin-top: 5px; -} - -.c41 { - color: #676767; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; -} - -.c43 { - font-size: 14px; -} - -.c42 { - padding: 0; -} - -
      -
    1. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - 47.97767, -122.20034 - -
      -
      - 12:57 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 0.3 miles to - - Everett Station Bay C1 - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - SOUTH - on - - service road - - - 0.1 miles - - -
        -
        2. -
      2. -
        - - - -
        -
        - - RIGHT - on - - Smith Avenue - - - 129 feet - - -
        -
        3. -
      3. -
        - - - -
        -
        - - CONTINUE - on - - Paine Avenue - - - 61 feet - - -
        -
        4. -
      4. -
        - - - -
        -
        - - LEFT - on - - 32nd Street - - - 67 feet - - -
        -
        5. -
      5. -
        - - - -
        -
        - - RIGHT - on - - 32nd Street - - - 313 feet - - -
        -
        6. -
      6. -
        - - - -
        -
        - - LEFT - on - - Unnamed Path - - - 380 feet - - -
        -
        7. -
      -
      -
      -       -
      -
      -
      - -
      -
      2. -
    2. -
      -
      -
      -
      -
      - - 51 - - - Everett - Northgate Station - -
      -
      -
      -
      -
      - - Everett Station Bay C1 - - ID 2345 - - -
      -
      - 1:04 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - Ride - - -
      - - 512 - -
      - - - Northgate Station - - -       - - - - Disembark at - Northgate Station - - ID 2191 - - -       - -       -
      -
      -
      -
      -
      -
      -
      - -
      -
      -
      -
      -
        -
      1. -
        - • -
        -
        - Broadway & 34th St -
        -
        2. -
      2. -
        - • -
        -
        - South Everett Fwy Station Bay 3 -
        -
        3. -
      3. -
        - • -
        -
        - Ash Way Park & Ride Bay 1 -
        -
        4. -
      4. -
        - • -
        -
        - Lynnwood Transit Center Bay D3 -
        -
        5. -
      5. -
        - • -
        -
        - Mountlake Terrace Fwy Station Bay 6 -
        -
        6. -
      -
      -
      -
      -
      -
      -
      -
      -
      - -
      -
      3. -
    3. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - Northgate Station - - ID 2191 - - -
      -
      - 1:51 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk to - - Northgate Station - Bay 4 - - - - -
      - - - - -
      -
      -
        -
      -
      -       -
      -
      -
      - -
      -
      4. -
    4. -
      -
      -
      -
      -
      - - 40 - - - - -
      -
      -
      -
      -
      - - Northgate Station - Bay 4 - - ID 35318 - - -
      -
      - 1:55 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - Ride - - -
      - - 40 - -
      - - - Downtown Seattle Ballard - - -       - - - - Disembark at - N 105th St & Aurora Ave N - - ID 40032 - - -       - -       -
      -
      -
      -
      -
      -
      -
      - -
      -
      -
      -
      -
        -
      1. -
        - • -
        -
        - 1st Ave NE & NE 95th St -
        -
        2. -
      2. -
        - • -
        -
        - N 92nd St & Corliss Ave N -
        -
        3. -
      3. -
        - • -
        -
        - College Way N & N 97th St -
        -
        4. -
      4. -
        - • -
        -
        - College Way N & N 103rd St -
        -
        5. -
      5. -
        - • -
        -
        - Meridian Ave N & N 105th St -
        -
        6. -
      6. -
        - • -
        -
        - N Northgate Way & Meridian Ave N -
        -
        7. -
      7. -
        - • -
        -
        - N Northgate Way & Stone Ave N -
        -
        8. -
      -
      -
      -
      -
      -
      -
      -
      -
      - -
      -
      5. -
    5. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - N 105th St & Aurora Ave N - - ID 40032 - - -
      -
      - 2:06 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 259 feet to - - Aurora Ave N & N 105th St - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - EAST - on - - North 105th Street - - - 64 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - RIGHT - on - - service road - - - 14 feet - - -
        -
        3. -
      3. -
        - - - -
        -
        - - LEFT - on - - Unnamed Path - - - 180 feet - - -
        -
        4. -
      -
      -
      -       -
      -
      -
      - -
      -
      6. -
    6. -
      -
      -
      -
      -
      - - E - - - - -
      -
      -
      -
      -
      - - Aurora Ave N & N 105th St - - ID 7080 - - -
      -
      - 2:07 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - Ride - - -
      - - E Line - -
      - - - Downtown Seattle - - -       - - - - Disembark at - 3rd Ave & Cherry St - - ID 490 - - -       - -       -
      -
      -
      -
      -
      -
      -
      - -
      -
      -
      -
      -
        -
      1. -
        - • -
        -
        - Aurora Ave N & N 100th St -
        -
        2. -
      2. -
        - • -
        -
        - Aurora Ave N & N 95th St -
        -
        3. -
      3. -
        - • -
        -
        - Aurora Ave N & N 90th St -
        -
        4. -
      4. -
        - • -
        -
        - Aurora Ave N & N 85th St -
        -
        5. -
      5. -
        - • -
        -
        - Aurora Ave N & N 80th St -
        -
        6. -
      6. -
        - • -
        -
        - Aurora Ave N & N 76th St -
        -
        7. -
      7. -
        - • -
        -
        - Aurora Ave N & N 65th St -
        -
        8. -
      8. -
        - • -
        -
        - Aurora Ave N & N 46th St -
        -
        9. -
      9. -
        - • -
        -
        - Aurora Ave N & Lynn St -
        -
        10. -
      10. -
        - • -
        -
        - Aurora Ave N & Galer St -
        -
        11. -
      11. -
        - • -
        -
        - 7th Ave N & Thomas St -
        -
        12. -
      12. -
        - • -
        -
        - Wall St & 5th Ave -
        -
        13. -
      13. -
        - • -
        -
        - 3rd Ave & Bell St -
        -
        14. -
      14. -
        - • -
        -
        - 3rd Ave & Virginia St -
        -
        15. -
      15. -
        - • -
        -
        - 3rd Ave & Pike St -
        -
        16. -
      16. -
        - • -
        -
        - 3rd Ave & Seneca St -
        -
        17. -
      -
      -
      -
      -
      -
      -
      -
      -
      - -
      -
      7. -
    7. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - 3rd Ave & Cherry St - - ID 490 - - -
      -
      - 2:39 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 443 feet to - - 208 James St, Seattle, WA 98104-2212, United States - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - SOUTHEAST - on - - sidewalk - - - 326 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - UTURN_RIGHT - on - - sidewalk - - - 117 feet - - -
        -
        3. -
      -
      -
      -       -
      -
      -
      - -
      -
      8. -
    8. -
      -
      -
      -
      - -
      -
      -
      -
      -
      - - 208 James St, Seattle, WA 98104-2212, United States - -
      -
      - 2:41 PM -
      - - Arrive at - 208 James St, Seattle, WA 98104-2212, United States - -
      -
      - -
      -
      9. -
    -`; - -exports[`Storyshots ItineraryBody/otp-ui Zero Alerts Without Collapsing Prop 1`] = ` - - - -`; - -exports[`Storyshots ItineraryBody/otp-ui Zero Alerts Without Collapsing Prop 2`] = ` -.c22 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c51 { - color: #f44256; -} - -.c29 { - border-top-style: solid; - border-top-width: 0; - padding-top: 0; - padding-bottom: 10px; -} - -.c16 { - background: transparent; - border: 0; - color: inherit; - cursor: pointer; - font-size: inherit; - -webkit-text-decoration: none; - text-decoration: none; -} - -.c31 { - color: #008; - margin-left: 5px; -} - -.c31:hover { - -webkit-text-decoration: underline; - text-decoration: underline; -} - -.c6 { - color: black; - background-color: #e9e9e9; - border: 2px solid #bbb; - text-align: center; - width: 25px; - height: 25px; - font-size: 1.2em; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; -} - -.c21::before { - content: ""; - margin: 0 0.125em; -} - -.c50 { - text-align: center; -} - -.c4 { - border-left: dotted 4px #484848; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c33 { - border-left: solid 8px #0070c0; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c48 { - border-left: solid 8px #008ab0; - height: 100%; - width: 0; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); -} - -.c44 { - display: block; - font-size: 13px; - list-style: none; - padding: 0; -} - -.c0 { - list-style: none; - padding: 0; -} - -.c12 { - color: #676767; - font-size: 13px; - padding-bottom: 12px; -} - -.c17 { - bottom: 0; - cursor: pointer; - left: 0; - position: absolute; - right: 0; - top: 0; - width: 100%; - z-index: 1; -} - -.c13 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - line-height: 16px; - min-height: 31px; - position: relative; -} - -.c10 { - display: inline-block; - grid-row-start: 2; - grid-column-start: 1; - height: 0; - overflow: hidden; - width: 0; -} - -.c15 { - font-weight: inherit; -} - -.c39 { - font-size: 13px; - font-weight: 500; -} - -.c38 { - font-weight: 800; - margin-right: 6px; -} - -.c37 { - color: #807373; - margin-top: 5px; -} - -.c14 { - -webkit-flex-shrink: 0; - -ms-flex-negative: 0; - flex-shrink: 0; -} - -.c3 { - position: relative; - left: 50%; - -webkit-transform: translateX(-50%); - -ms-transform: translateX(-50%); - transform: translateX(-50%); - height: 100%; -} - -.c5 { - width: 30px; - height: 30px; - border-radius: 50%; - position: absolute; - left: 50%; - top: 0; - -webkit-transform: translate(-51%,-10%); - -ms-transform: translate(-51%,-10%); - transform: translate(-51%,-10%); -} - -.c2 { - grid-column-start: 2; - grid-row: span 2; - padding-right: 5px; -} - -.c18 { - display: grid; - grid-template-columns: 100px auto; -} - -.c1 { - max-width: 500px; - display: grid; - grid-template-columns: 65px 30px auto; -} - -.c9 { - grid-column-start: 1; - grid-row: 1 / span 2; - padding-right: 5px; - font-size: 0.9em; -} - -.c32 { - padding: 3px 10px 3px 10px; - border: 0; - margin-top: -15px; - width: 35px; - height: 35px; -} - -.c32:hover { - cursor: pointer; -} - -.c30 { - -webkit-flex: 0 0 25px; - -ms-flex: 0 0 25px; - flex: 0 0 25px; - grid-column: -1; -} - -.c11 { - grid-row-start: 2; - grid-column-start: 3; -} - -.c7 { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - font-size: 1.2em; - grid-row-start: 1; - grid-column-start: 3; -} - -.c8 { - font-size: inherit; - font-weight: bold; - height: 1.2em; - margin: 0; - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; - -webkit-flex: 1 1 auto; - -ms-flex: 1 1 auto; - flex: 1 1 auto; - padding: 3px 0 10px 0; -} - -.c34 { - text-align: center; - min-width: 30px; - min-height: 30px; - font-size: 1.2em; - background-color: #0070c0; - color: white; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; - border: 1px solid; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - cursor: default; -} - -.c49 { - text-align: center; - min-width: 30px; - min-height: 30px; - font-size: 1.2em; - background-color: #084c8d; - color: white; - border-radius: 50%; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - padding-left: 1px; - border: 1px solid; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - cursor: default; -} - -.c35 { - position: absolute; - width: 1px; - height: 1px; - padding: 0; - margin: -1px; - overflow: hidden; - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - border: 0; -} - -.c23 { - display: block; - list-style: none; - padding: 0; -} - -.c26 { - margin-left: 24px; - line-height: 1.25em; - padding-top: 1px; -} - -.c26 > span { - margin-right: 1ch; -} - -.c19 { - display: -webkit-inline-box; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - -webkit-align-self: center; - -ms-flex-item-align: center; - align-self: center; - margin-top: 10px; -} - -.c19 a { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; -} - -.c20 { - color: #676767; - font-size: 13px; - font-style: normal; - padding: 0; -} - -.c25 { - fill: #676767; - float: left; - height: 16px; - width: 16px; -} - -.c24 { - font-size: 13px; - margin-top: 8px; - color: #676767; - font-style: normal; -} - -.c27 { - font-weight: 500; -} - -.c28 { - font-weight: 200; - opacity: 0.8975; - padding-left: 1ch; -} - -.c36 { - font-weight: 200; - font-size: 0.9em; - margin-left: 10px; -} - -.c46 { - float: left; - margin-left: -36px; - color: #fff; -} - -.c47 { - color: #676767; - margin-top: 3px; -} - -.c45 { - z-index: 30; - position: relative; -} - -.c40 { - margin-top: 5px; -} - -.c41 { - color: #676767; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; -} - -.c43 { - font-size: 14px; -} - -.c42 { - padding: 0; -} - -
      -
    1. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - 47.97767, -122.20034 - -
      -
      - 12:57 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 0.3 miles to - - Everett Station Bay C1 - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - SOUTH - on - - service road - - - 0.1 miles - - -
        -
        2. -
      2. -
        - - - -
        -
        - - RIGHT - on - - Smith Avenue - - - 129 feet - - -
        -
        3. -
      3. -
        - - - -
        -
        - - CONTINUE - on - - Paine Avenue - - - 61 feet - - -
        -
        4. -
      4. -
        - - - -
        -
        - - LEFT - on - - 32nd Street - - - 67 feet - - -
        -
        5. -
      5. -
        - - - -
        -
        - - RIGHT - on - - 32nd Street - - - 313 feet - - -
        -
        6. -
      6. -
        - - - -
        -
        - - LEFT - on - - Unnamed Path - - - 380 feet - - -
        -
        7. -
      -
      -
      -       -
      -
      -
      - -
      -
      2. -
    2. -
      -
      -
      -
      -
      - - 51 - - - Everett - Northgate Station - -
      -
      -
      -
      -
      - - Everett Station Bay C1 - - ID 2345 - - -
      -
      - 1:04 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - Ride - - -
      - - 512 - -
      - - - Northgate Station - - -       - - - - Disembark at - Northgate Station - - ID 2191 - - -       - -       -
      -
      -
      -
      -
      -
      -
      - -
      -
      -
      -
      -
        -
      1. -
        - • -
        -
        - Broadway & 34th St -
        -
        2. -
      2. -
        - • -
        -
        - South Everett Fwy Station Bay 3 -
        -
        3. -
      3. -
        - • -
        -
        - Ash Way Park & Ride Bay 1 -
        -
        4. -
      4. -
        - • -
        -
        - Lynnwood Transit Center Bay D3 -
        -
        5. -
      5. -
        - • -
        -
        - Mountlake Terrace Fwy Station Bay 6 -
        -
        6. -
      -
      -
      -
      -
      -
      -
      -
      -
      - -
      -
      3. -
    3. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - Northgate Station - - ID 2191 - - -
      -
      - 1:51 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk to - - Northgate Station - Bay 4 - - - - -
      - - - - -
      -
      -
        -
      -
      -       -
      -
      -
      - -
      -
      4. -
    4. -
      -
      -
      -
      -
      - - 40 - - - - -
      -
      -
      -
      -
      - - Northgate Station - Bay 4 - - ID 35318 - - -
      -
      - 1:55 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - Ride - - -
      - - 40 - -
      - - - Downtown Seattle Ballard - - -       - - - - Disembark at - N 105th St & Aurora Ave N - - ID 40032 - - -       - -       -
      -
      -
      -
      -
      -
      -
      - -
      -
      -
      -
      -
        -
      1. -
        - • -
        -
        - 1st Ave NE & NE 95th St -
        -
        2. -
      2. -
        - • -
        -
        - N 92nd St & Corliss Ave N -
        -
        3. -
      3. -
        - • -
        -
        - College Way N & N 97th St -
        -
        4. -
      4. -
        - • -
        -
        - College Way N & N 103rd St -
        -
        5. -
      5. -
        - • -
        -
        - Meridian Ave N & N 105th St -
        -
        6. -
      6. -
        - • -
        -
        - N Northgate Way & Meridian Ave N -
        -
        7. -
      7. -
        - • -
        -
        - N Northgate Way & Stone Ave N -
        -
        8. -
      -
      -
      -
      -
      -
      -
      -
      -
      - -
      -
      5. -
    5. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - N 105th St & Aurora Ave N - - ID 40032 - - -
      -
      - 2:06 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 259 feet to - - Aurora Ave N & N 105th St - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - EAST - on - - North 105th Street - - - 64 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - RIGHT - on - - service road - - - 14 feet - - -
        -
        3. -
      3. -
        - - - -
        -
        - - LEFT - on - - Unnamed Path - - - 180 feet - - -
        -
        4. -
      -
      -
      -       -
      -
      -
      - -
      -
      6. -
    6. -
      -
      -
      -
      -
      - - E - - - - -
      -
      -
      -
      -
      - - Aurora Ave N & N 105th St - - ID 7080 - - -
      -
      - 2:07 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - Ride - - -
      - - E Line - -
      - - - Downtown Seattle - - -       - - - - Disembark at - 3rd Ave & Cherry St - - ID 490 - - -       - -       -
      -
      -
      -
      -
      -
      -
      - -
      -
      -
      -
      -
        -
      1. -
        - • -
        -
        - Aurora Ave N & N 100th St -
        -
        2. -
      2. -
        - • -
        -
        - Aurora Ave N & N 95th St -
        -
        3. -
      3. -
        - • -
        -
        - Aurora Ave N & N 90th St -
        -
        4. -
      4. -
        - • -
        -
        - Aurora Ave N & N 85th St -
        -
        5. -
      5. -
        - • -
        -
        - Aurora Ave N & N 80th St -
        -
        6. -
      6. -
        - • -
        -
        - Aurora Ave N & N 76th St -
        -
        7. -
      7. -
        - • -
        -
        - Aurora Ave N & N 65th St -
        -
        8. -
      8. -
        - • -
        -
        - Aurora Ave N & N 46th St -
        -
        9. -
      9. -
        - • -
        -
        - Aurora Ave N & Lynn St -
        -
        10. -
      10. -
        - • -
        -
        - Aurora Ave N & Galer St -
        -
        11. -
      11. -
        - • -
        -
        - 7th Ave N & Thomas St -
        -
        12. -
      12. -
        - • -
        -
        - Wall St & 5th Ave -
        -
        13. -
      13. -
        - • -
        -
        - 3rd Ave & Bell St -
        -
        14. -
      14. -
        - • -
        -
        - 3rd Ave & Virginia St -
        -
        15. -
      15. -
        - • -
        -
        - 3rd Ave & Pike St -
        -
        16. -
      16. -
        - • -
        -
        - 3rd Ave & Seneca St -
        -
        17. -
      -
      -
      -
      -
      -
      -
      -
      -
      - -
      -
      7. -
    7. -
      -
      -
      -
      -
      - - - Travel by walking - - - -
      -
      -
      -
      -
      - - 3rd Ave & Cherry St - - ID 490 - - -
      -
      - 2:39 PM -
      - - otpUi.TransitLegBody.fromLocation - -
      -
      -
      - - - - - - - - Walk 443 feet to - - 208 James St, Seattle, WA 98104-2212, United States - - - - -
      - - - - -
      -
      -
        -
      1. -
        - - - -
        -
        - - Head - SOUTHEAST - on - - sidewalk - - - 326 feet - - -
        -
        2. -
      2. -
        - - - -
        -
        - - UTURN_RIGHT - on - - sidewalk - - - 117 feet - - -
        -
        3. -
      -
      -
      -       -
      -
      -
      - -
      -
      8. -
    8. -
      -
      -
      -
      - -
      -
      -
      -
      -
      - - 208 James St, Seattle, WA 98104-2212, United States - -
      -
      - 2:41 PM -
      - - Arrive at - 208 James St, Seattle, WA 98104-2212, United States - -
      -
      - -
      -
      9. -
    -`; - -exports[`Storyshots LocationField/Desktop Context Auto Focus With Multiple Controls 1`] = ` - -
    - - - -
    -     -`; - -exports[`Storyshots LocationField/Desktop Context Auto Focus With Multiple Controls 2`] = ` -.c3 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c4 { - color: #333; -} - -.c6 { - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - display: inline-block; - height: 0; - overflow: hidden; - width: 0; -} - -.c1 { - border: none; - background: none; -} - -.c2 { - width: 30px; -} - -.c8 { - background-clip: padding-box; - background-color: #fff; - border-radius: 4px; - border: 1px solid rgba(0,0,0,0.15); - box-shadow: 0 6px 12px rgba(0,0,0,0.175); - float: left; - font-size: 14px; - left: 0; - list-style: none; - margin: 2px 0 0; - min-width: 160px; - max-height: 75vh; - padding: 5px 0; - position: absolute; - overflow: scroll; - text-align: left; - top: 100%; - z-index: 1000000; -} - -input[aria-expanded="false"] ~ .c7 { - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - display: inline-block; - height: 0; - overflow: hidden; - width: 0; -} - -.c5 { - border: none; - box-shadow: none; - font-size: 17px; - outline: none; -} - -.c0 { - border-bottom: 1px solid #000; - border-collapse: separate; - display: table; - margin-bottom: 15px; - position: relative; -} - -
    - - -
    - - - -
      -
    -
    -`; - -exports[`Storyshots LocationField/Desktop Context Blank 1`] = ` - - - -`; - -exports[`Storyshots LocationField/Desktop Context Blank 2`] = ` -.c3 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c4 { - color: #333; -} - -.c6 { - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - display: inline-block; - height: 0; - overflow: hidden; - width: 0; -} - -.c1 { - border: none; - background: none; -} - -.c2 { - width: 30px; -} - -.c8 { - background-clip: padding-box; - background-color: #fff; - border-radius: 4px; - border: 1px solid rgba(0,0,0,0.15); - box-shadow: 0 6px 12px rgba(0,0,0,0.175); - float: left; - font-size: 14px; - left: 0; - list-style: none; - margin: 2px 0 0; - min-width: 160px; - max-height: 75vh; - padding: 5px 0; - position: absolute; - overflow: scroll; - text-align: left; - top: 100%; - z-index: 1000000; -} - -input[aria-expanded="false"] ~ .c7 { - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - display: inline-block; - height: 0; - overflow: hidden; - width: 0; -} - -.c5 { - border: none; - box-shadow: none; - font-size: 17px; - outline: none; -} - -.c0 { - border-bottom: 1px solid #000; - border-collapse: separate; - display: table; - margin-bottom: 15px; - position: relative; -} - -
    - - - -
      -
    -`; - -exports[`Storyshots LocationField/Desktop Context Geocoder No Results 1`] = ` - - - -`; - -exports[`Storyshots LocationField/Desktop Context Geocoder No Results 2`] = ` -.c3 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c4 { - color: #333; -} - -.c6 { - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - display: inline-block; - height: 0; - overflow: hidden; - width: 0; -} - -.c1 { - border: none; - background: none; -} - -.c2 { - width: 30px; -} - -.c8 { - background-clip: padding-box; - background-color: #fff; - border-radius: 4px; - border: 1px solid rgba(0,0,0,0.15); - box-shadow: 0 6px 12px rgba(0,0,0,0.175); - float: left; - font-size: 14px; - left: 0; - list-style: none; - margin: 2px 0 0; - min-width: 160px; - max-height: 75vh; - padding: 5px 0; - position: absolute; - overflow: scroll; - text-align: left; - top: 100%; - z-index: 1000000; -} - -input[aria-expanded="false"] ~ .c7 { - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - display: inline-block; - height: 0; - overflow: hidden; - width: 0; -} - -.c5 { - border: none; - box-shadow: none; - font-size: 17px; - outline: none; -} - -.c0 { - border-bottom: 1px solid #000; - border-collapse: separate; - display: table; - margin-bottom: 15px; - position: relative; -} - -
    - - - -
      -
    -`; - -exports[`Storyshots LocationField/Desktop Context Geocoder Unreachable 1`] = ` - - - -`; - -exports[`Storyshots LocationField/Desktop Context Geocoder Unreachable 2`] = ` -.c3 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c4 { - color: #333; -} - -.c6 { - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - display: inline-block; - height: 0; - overflow: hidden; - width: 0; -} - -.c1 { - border: none; - background: none; -} - -.c2 { - width: 30px; -} - -.c8 { - background-clip: padding-box; - background-color: #fff; - border-radius: 4px; - border: 1px solid rgba(0,0,0,0.15); - box-shadow: 0 6px 12px rgba(0,0,0,0.175); - float: left; - font-size: 14px; - left: 0; - list-style: none; - margin: 2px 0 0; - min-width: 160px; - max-height: 75vh; - padding: 5px 0; - position: absolute; - overflow: scroll; - text-align: left; - top: 100%; - z-index: 1000000; -} - -input[aria-expanded="false"] ~ .c7 { - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - display: inline-block; - height: 0; - overflow: hidden; - width: 0; -} - -.c5 { - border: none; - box-shadow: none; - font-size: 17px; - outline: none; -} - -.c0 { - border-bottom: 1px solid #000; - border-collapse: separate; - display: table; - margin-bottom: 15px; - position: relative; -} - -
    - - - -
      -
    -`; - -exports[`Storyshots LocationField/Desktop Context Here Geocoder 1`] = ` - - - -`; - -exports[`Storyshots LocationField/Desktop Context Here Geocoder 2`] = ` -.c3 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c4 { - color: #333; -} - -.c6 { - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - display: inline-block; - height: 0; - overflow: hidden; - width: 0; -} - -.c1 { - border: none; - background: none; -} - -.c2 { - width: 30px; -} - -.c8 { - background-clip: padding-box; - background-color: #fff; - border-radius: 4px; - border: 1px solid rgba(0,0,0,0.15); - box-shadow: 0 6px 12px rgba(0,0,0,0.175); - float: left; - font-size: 14px; - left: 0; - list-style: none; - margin: 2px 0 0; - min-width: 160px; - max-height: 75vh; - padding: 5px 0; - position: absolute; - overflow: scroll; - text-align: left; - top: 100%; - z-index: 1000000; -} - -input[aria-expanded="false"] ~ .c7 { - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - display: inline-block; - height: 0; - overflow: hidden; - width: 0; -} - -.c5 { - border: none; - box-shadow: none; - font-size: 17px; - outline: none; -} - -.c0 { - border-bottom: 1px solid #000; - border-collapse: separate; - display: table; - margin-bottom: 15px; - position: relative; -} - -
    - - - -
      -
    -`; - -exports[`Storyshots LocationField/Desktop Context Location Unavailable 1`] = ` - - - -`; - -exports[`Storyshots LocationField/Desktop Context Location Unavailable 2`] = ` -.c3 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c4 { - color: #333; -} - -.c6 { - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - display: inline-block; - height: 0; - overflow: hidden; - width: 0; -} - -.c1 { - border: none; - background: none; -} - -.c2 { - width: 30px; -} - -.c8 { - background-clip: padding-box; - background-color: #fff; - border-radius: 4px; - border: 1px solid rgba(0,0,0,0.15); - box-shadow: 0 6px 12px rgba(0,0,0,0.175); - float: left; - font-size: 14px; - left: 0; - list-style: none; - margin: 2px 0 0; - min-width: 160px; - max-height: 75vh; - padding: 5px 0; - position: absolute; - overflow: scroll; - text-align: left; - top: 100%; - z-index: 1000000; -} - -input[aria-expanded="false"] ~ .c7 { - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - display: inline-block; - height: 0; - overflow: hidden; - width: 0; -} - -.c5 { - border: none; - box-shadow: none; - font-size: 17px; - outline: none; -} - -.c0 { - border-bottom: 1px solid #000; - border-collapse: separate; - display: table; - margin-bottom: 15px; - position: relative; -} - -
    - - - -
      -
    -`; - -exports[`Storyshots LocationField/Desktop Context No Auto Focus With Multiple Controls 1`] = ` - -
    - - - -
    -     -`; - -exports[`Storyshots LocationField/Desktop Context No Auto Focus With Multiple Controls 2`] = ` -.c3 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c4 { - color: #333; -} - -.c6 { - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - display: inline-block; - height: 0; - overflow: hidden; - width: 0; -} - -.c1 { - border: none; - background: none; -} - -.c2 { - width: 30px; -} - -.c8 { - background-clip: padding-box; - background-color: #fff; - border-radius: 4px; - border: 1px solid rgba(0,0,0,0.15); - box-shadow: 0 6px 12px rgba(0,0,0,0.175); - float: left; - font-size: 14px; - left: 0; - list-style: none; - margin: 2px 0 0; - min-width: 160px; - max-height: 75vh; - padding: 5px 0; - position: absolute; - overflow: scroll; - text-align: left; - top: 100%; - z-index: 1000000; -} - -input[aria-expanded="false"] ~ .c7 { - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - display: inline-block; - height: 0; - overflow: hidden; - width: 0; -} - -.c5 { - border: none; - box-shadow: none; - font-size: 17px; - outline: none; -} - -.c0 { - border-bottom: 1px solid #000; - border-collapse: separate; - display: table; - margin-bottom: 15px; - position: relative; -} - -
    - - -
    - - - -
      -
    -
    -`; - -exports[`Storyshots LocationField/Desktop Context Required And Invalid State 1`] = ` - - - -`; - -exports[`Storyshots LocationField/Desktop Context Required And Invalid State 2`] = ` -.c3 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c4 { - color: #333; -} - -.c6 { - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - display: inline-block; - height: 0; - overflow: hidden; - width: 0; -} - -.c1 { - border: none; - background: none; -} - -.c2 { - width: 30px; -} - -.c8 { - background-clip: padding-box; - background-color: #fff; - border-radius: 4px; - border: 1px solid rgba(0,0,0,0.15); - box-shadow: 0 6px 12px rgba(0,0,0,0.175); - float: left; - font-size: 14px; - left: 0; - list-style: none; - margin: 2px 0 0; - min-width: 160px; - max-height: 75vh; - padding: 5px 0; - position: absolute; - overflow: scroll; - text-align: left; - top: 100%; - z-index: 1000000; -} - -input[aria-expanded="false"] ~ .c7 { - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - display: inline-block; - height: 0; - overflow: hidden; - width: 0; -} - -.c5 { - border: none; - box-shadow: none; - font-size: 17px; - outline: none; -} - -.c0 { - border-bottom: 1px solid #000; - border-collapse: separate; - display: table; - margin-bottom: 15px; - position: relative; -} - -
    - - - -
      -
    -`; - -exports[`Storyshots LocationField/Desktop Context Selected Location 1`] = ` - - - -`; - -exports[`Storyshots LocationField/Desktop Context Selected Location 2`] = ` -.c3 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c4 { - color: #f44256; -} - -.c7 { - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - display: inline-block; - height: 0; - overflow: hidden; - width: 0; -} - -.c1 { - border: none; - background: none; -} - -.c6 { - color: #888; - cursor: pointer; - width: 30px; -} - -.c2 { - width: 30px; -} - -.c9 { - background-clip: padding-box; - background-color: #fff; - border-radius: 4px; - border: 1px solid rgba(0,0,0,0.15); - box-shadow: 0 6px 12px rgba(0,0,0,0.175); - float: left; - font-size: 14px; - left: 0; - list-style: none; - margin: 2px 0 0; - min-width: 160px; - max-height: 75vh; - padding: 5px 0; - position: absolute; - overflow: scroll; - text-align: left; - top: 100%; - z-index: 1000000; -} - -input[aria-expanded="false"] ~ .c8 { - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - display: inline-block; - height: 0; - overflow: hidden; - width: 0; -} - -.c5 { - border: none; - box-shadow: none; - font-size: 17px; - outline: none; -} - -.c0 { - border-bottom: 1px solid #000; - border-collapse: separate; - display: table; - margin-bottom: 15px; - position: relative; -} - -
    - - - - -
      -
    -`; - -exports[`Storyshots LocationField/Desktop Context Selected Location Custom Clear 1`] = ` - - - } - currentPosition={ - Object { - "coords": Object { - "latitude": 45.508246, - "longitude": -122.711574, - }, - } - } - geocoderConfig={ - Object { - "baseUrl": "https://ws-st.trimet.org/pelias/v1", - "boundary": Object { - "rect": Object { - "maxLat": 45.7445, - "maxLon": -122.135, - "minLat": 45.273, - "minLon": -123.2034, - }, - }, - "maxNearbyStops": 4, - "type": "PELIAS", - } - } - getCurrentPosition={[Function]} - location={ - Object { - "lat": 0, - "lon": 0, - "name": "123 Main St", - } - } - locationType="to" - onLocationSelected={[Function]} - /> - -`; - -exports[`Storyshots LocationField/Desktop Context Selected Location Custom Clear 2`] = ` -.c3 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c4 { - color: #f44256; -} - -.c7 { - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - display: inline-block; - height: 0; - overflow: hidden; - width: 0; -} - -.c1 { - border: none; - background: none; -} - -.c6 { - color: #888; - cursor: pointer; - width: 30px; -} - -.c2 { - width: 30px; -} - -.c9 { - background-clip: padding-box; - background-color: #fff; - border-radius: 4px; - border: 1px solid rgba(0,0,0,0.15); - box-shadow: 0 6px 12px rgba(0,0,0,0.175); - float: left; - font-size: 14px; - left: 0; - list-style: none; - margin: 2px 0 0; - min-width: 160px; - max-height: 75vh; - padding: 5px 0; - position: absolute; - overflow: scroll; - text-align: left; - top: 100%; - z-index: 1000000; -} - -input[aria-expanded="false"] ~ .c8 { - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - display: inline-block; - height: 0; - overflow: hidden; - width: 0; -} - -.c5 { - border: none; - box-shadow: none; - font-size: 17px; - outline: none; -} - -.c0 { - border-bottom: 1px solid #000; - border-collapse: separate; - display: table; - margin-bottom: 15px; - position: relative; -} - -
    - - - - -
      -
    -`; - -exports[`Storyshots LocationField/Desktop Context Slow Geocoder 1`] = ` - - - -`; - -exports[`Storyshots LocationField/Desktop Context Slow Geocoder 2`] = ` -.c3 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c4 { - color: #333; -} - -.c6 { - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - display: inline-block; - height: 0; - overflow: hidden; - width: 0; -} - -.c1 { - border: none; - background: none; -} - -.c2 { - width: 30px; -} - -.c8 { - background-clip: padding-box; - background-color: #fff; - border-radius: 4px; - border: 1px solid rgba(0,0,0,0.15); - box-shadow: 0 6px 12px rgba(0,0,0,0.175); - float: left; - font-size: 14px; - left: 0; - list-style: none; - margin: 2px 0 0; - min-width: 160px; - max-height: 75vh; - padding: 5px 0; - position: absolute; - overflow: scroll; - text-align: left; - top: 100%; - z-index: 1000000; -} - -input[aria-expanded="false"] ~ .c7 { - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - display: inline-block; - height: 0; - overflow: hidden; - width: 0; -} - -.c5 { - border: none; - box-shadow: none; - font-size: 17px; - outline: none; -} - -.c0 { - border-bottom: 1px solid #000; - border-collapse: separate; - display: table; - margin-bottom: 15px; - position: relative; -} - -
    - - - -
      -
    -`; - -exports[`Storyshots LocationField/Desktop Context With Bad Api Key Handles Bad Autocomplete 1`] = ` - - - -`; - -exports[`Storyshots LocationField/Desktop Context With Bad Api Key Handles Bad Autocomplete 2`] = ` -.c3 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c4 { - color: #333; -} - -.c6 { - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - display: inline-block; - height: 0; - overflow: hidden; - width: 0; -} - -.c1 { - border: none; - background: none; -} - -.c2 { - width: 30px; -} - -.c8 { - background-clip: padding-box; - background-color: #fff; - border-radius: 4px; - border: 1px solid rgba(0,0,0,0.15); - box-shadow: 0 6px 12px rgba(0,0,0,0.175); - float: left; - font-size: 14px; - left: 0; - list-style: none; - margin: 2px 0 0; - min-width: 160px; - max-height: 75vh; - padding: 5px 0; - position: absolute; - overflow: scroll; - text-align: left; - top: 100%; - z-index: 1000000; -} - -input[aria-expanded="false"] ~ .c7 { - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - display: inline-block; - height: 0; - overflow: hidden; - width: 0; -} - -.c5 { - border: none; - box-shadow: none; - font-size: 17px; - outline: none; -} - -.c0 { - border-bottom: 1px solid #000; - border-collapse: separate; - display: table; - margin-bottom: 15px; - position: relative; -} - -
    - - - -
      -
    -`; - -exports[`Storyshots LocationField/Desktop Context With Custom Result Colors And Icons 1`] = ` - - , - } - } - /> - -`; - -exports[`Storyshots LocationField/Desktop Context With Custom Result Colors And Icons 2`] = ` -.c3 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c4 { - color: #333; -} - -.c6 { - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - display: inline-block; - height: 0; - overflow: hidden; - width: 0; -} - -.c1 { - border: none; - background: none; -} - -.c2 { - width: 30px; -} - -.c8 { - background-clip: padding-box; - background-color: #fff; - border-radius: 4px; - border: 1px solid rgba(0,0,0,0.15); - box-shadow: 0 6px 12px rgba(0,0,0,0.175); - float: left; - font-size: 14px; - left: 0; - list-style: none; - margin: 2px 0 0; - min-width: 160px; - max-height: 75vh; - padding: 5px 0; - position: absolute; - overflow: scroll; - text-align: left; - top: 100%; - z-index: 1000000; -} - -input[aria-expanded="false"] ~ .c7 { - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - display: inline-block; - height: 0; - overflow: hidden; - width: 0; -} - -.c5 { - border: none; - box-shadow: none; - font-size: 17px; - outline: none; -} - -.c0 { - border-bottom: 1px solid #000; - border-collapse: separate; - display: table; - margin-bottom: 15px; - position: relative; -} - -
    - - - -
      -
    -`; - -exports[`Storyshots LocationField/Desktop Context With Prefilled Search 1`] = ` - - - -`; - -exports[`Storyshots LocationField/Desktop Context With Prefilled Search 2`] = ` -.c3 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c4 { - color: #333; -} - -.c6 { - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - display: inline-block; - height: 0; - overflow: hidden; - width: 0; -} - -.c1 { - border: none; - background: none; -} - -.c2 { - width: 30px; -} - -.c8 { - background-clip: padding-box; - background-color: #fff; - border-radius: 4px; - border: 1px solid rgba(0,0,0,0.15); - box-shadow: 0 6px 12px rgba(0,0,0,0.175); - float: left; - font-size: 14px; - left: 0; - list-style: none; - margin: 2px 0 0; - min-width: 160px; - max-height: 75vh; - padding: 5px 0; - position: absolute; - overflow: scroll; - text-align: left; - top: 100%; - z-index: 1000000; -} - -input[aria-expanded="false"] ~ .c7 { - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - display: inline-block; - height: 0; - overflow: hidden; - width: 0; -} - -.c5 { - border: none; - box-shadow: none; - font-size: 17px; - outline: none; -} - -.c0 { - border-bottom: 1px solid #000; - border-collapse: separate; - display: table; - margin-bottom: 15px; - position: relative; -} - -
    - - - -
      -
    -`; - -exports[`Storyshots LocationField/Desktop Context With User Settings 1`] = ` - - - -`; - -exports[`Storyshots LocationField/Desktop Context With User Settings 2`] = ` -.c3 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c4 { - color: #333; -} - -.c6 { - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - display: inline-block; - height: 0; - overflow: hidden; - width: 0; -} - -.c1 { - border: none; - background: none; -} - -.c2 { - width: 30px; -} - -.c8 { - background-clip: padding-box; - background-color: #fff; - border-radius: 4px; - border: 1px solid rgba(0,0,0,0.15); - box-shadow: 0 6px 12px rgba(0,0,0,0.175); - float: left; - font-size: 14px; - left: 0; - list-style: none; - margin: 2px 0 0; - min-width: 160px; - max-height: 75vh; - padding: 5px 0; - position: absolute; - overflow: scroll; - text-align: left; - top: 100%; - z-index: 1000000; -} - -input[aria-expanded="false"] ~ .c7 { - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - display: inline-block; - height: 0; - overflow: hidden; - width: 0; -} - -.c5 { - border: none; - box-shadow: none; - font-size: 17px; - outline: none; -} - -.c0 { - border-bottom: 1px solid #000; - border-collapse: separate; - display: table; - margin-bottom: 15px; - position: relative; -} - -
    - - - -
      -
    -`; - -exports[`Storyshots LocationField/Mobile Context Blank 1`] = ` - - - -`; - -exports[`Storyshots LocationField/Mobile Context Blank 2`] = ` -.c3 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c4 { - color: #333; -} - -.c6 { - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - display: inline-block; - height: 0; - overflow: hidden; - width: 0; -} - -.c1 { - border: none; - background: none; -} - -.c2 { - width: 30px; -} - -.c8 { - background-clip: padding-box; - background-color: #fff; - border-radius: 4px; - border: 1px solid rgba(0,0,0,0.15); - box-shadow: 0 6px 12px rgba(0,0,0,0.175); - float: left; - font-size: 14px; - left: 0; - list-style: none; - margin: 2px 0 0; - min-width: 160px; - max-height: 75vh; - padding: 5px 0; - position: absolute; - overflow: scroll; - text-align: left; - top: 100%; - z-index: 1000000; -} - -input[aria-expanded="false"] ~ .c7 { - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - display: inline-block; - height: 0; - overflow: hidden; - width: 0; -} - -.c5 { - border: none; - box-shadow: none; - font-size: 17px; - outline: none; -} - -.c0 { - border-bottom: 1px solid #000; - border-collapse: separate; - display: table; - margin-bottom: 15px; - position: relative; -} - -.c10 { - background-color: transparent; - clear: both; - color: #333; - display: block; - font-weight: 400; - line-height: 1.42857143; - padding: 3px 20px; - -webkit-text-decoration: none; - text-decoration: none; - white-space: nowrap; -} - -.c10:hover { - background-color: #f5f5f5; - cursor: pointer; -} - -.c10[aria-hidden="true"]:hover { - background-color: unset; - cursor: default; -} - -.c11 { - display: block; - padding-top: 5px; - padding-bottom: 3px; -} - -.c13 { - margin-left: 30px; - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; -} - -.c12 { - float: left; -} - -.c9 { - border: none; - box-shadow: none; - display: block; -} - -
    - - - -
      -
    • - - - - - - otpUi.LocationField.useCurrentLocation - - -
      • -
    -
    -`; - -exports[`Storyshots LocationField/Mobile Context Geocoder No Results 1`] = ` - - - -`; - -exports[`Storyshots LocationField/Mobile Context Geocoder No Results 2`] = ` -.c3 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c4 { - color: #333; -} - -.c6 { - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - display: inline-block; - height: 0; - overflow: hidden; - width: 0; -} - -.c1 { - border: none; - background: none; -} - -.c2 { - width: 30px; -} - -.c8 { - background-clip: padding-box; - background-color: #fff; - border-radius: 4px; - border: 1px solid rgba(0,0,0,0.15); - box-shadow: 0 6px 12px rgba(0,0,0,0.175); - float: left; - font-size: 14px; - left: 0; - list-style: none; - margin: 2px 0 0; - min-width: 160px; - max-height: 75vh; - padding: 5px 0; - position: absolute; - overflow: scroll; - text-align: left; - top: 100%; - z-index: 1000000; -} - -input[aria-expanded="false"] ~ .c7 { - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - display: inline-block; - height: 0; - overflow: hidden; - width: 0; -} - -.c5 { - border: none; - box-shadow: none; - font-size: 17px; - outline: none; -} - -.c0 { - border-bottom: 1px solid #000; - border-collapse: separate; - display: table; - margin-bottom: 15px; - position: relative; -} - -.c10 { - background-color: transparent; - clear: both; - color: #333; - display: block; - font-weight: 400; - line-height: 1.42857143; - padding: 3px 20px; - -webkit-text-decoration: none; - text-decoration: none; - white-space: nowrap; -} - -.c10:hover { - background-color: #f5f5f5; - cursor: pointer; -} - -.c10[aria-hidden="true"]:hover { - background-color: unset; - cursor: default; -} - -.c11 { - display: block; - padding-top: 5px; - padding-bottom: 3px; -} - -.c13 { - margin-left: 30px; - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; -} - -.c12 { - float: left; -} - -.c9 { - border: none; - box-shadow: none; - display: block; -} - -
    - - - -
      -
    • - - - - - - otpUi.LocationField.useCurrentLocation - - -
      • -
    -
    -`; - -exports[`Storyshots LocationField/Mobile Context Geocoder Unreachable 1`] = ` - - - -`; - -exports[`Storyshots LocationField/Mobile Context Geocoder Unreachable 2`] = ` -.c3 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c4 { - color: #333; -} - -.c6 { - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - display: inline-block; - height: 0; - overflow: hidden; - width: 0; -} - -.c1 { - border: none; - background: none; -} - -.c2 { - width: 30px; -} - -.c8 { - background-clip: padding-box; - background-color: #fff; - border-radius: 4px; - border: 1px solid rgba(0,0,0,0.15); - box-shadow: 0 6px 12px rgba(0,0,0,0.175); - float: left; - font-size: 14px; - left: 0; - list-style: none; - margin: 2px 0 0; - min-width: 160px; - max-height: 75vh; - padding: 5px 0; - position: absolute; - overflow: scroll; - text-align: left; - top: 100%; - z-index: 1000000; -} - -input[aria-expanded="false"] ~ .c7 { - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - display: inline-block; - height: 0; - overflow: hidden; - width: 0; -} - -.c5 { - border: none; - box-shadow: none; - font-size: 17px; - outline: none; -} - -.c0 { - border-bottom: 1px solid #000; - border-collapse: separate; - display: table; - margin-bottom: 15px; - position: relative; -} - -.c10 { - background-color: transparent; - clear: both; - color: #333; - display: block; - font-weight: 400; - line-height: 1.42857143; - padding: 3px 20px; - -webkit-text-decoration: none; - text-decoration: none; - white-space: nowrap; -} - -.c10:hover { - background-color: #f5f5f5; - cursor: pointer; -} - -.c10[aria-hidden="true"]:hover { - background-color: unset; - cursor: default; -} - -.c11 { - display: block; - padding-top: 5px; - padding-bottom: 3px; -} - -.c13 { - margin-left: 30px; - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; -} - -.c12 { - float: left; -} - -.c9 { - border: none; - box-shadow: none; - display: block; -} - -
    - - - -
      -
    • - - - - - - otpUi.LocationField.useCurrentLocation - - -
      • -
    -
    -`; - -exports[`Storyshots LocationField/Mobile Context Location Unavailable 1`] = ` - - - -`; - -exports[`Storyshots LocationField/Mobile Context Location Unavailable 2`] = ` -.c3 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c4 { - color: #333; -} - -.c6 { - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - display: inline-block; - height: 0; - overflow: hidden; - width: 0; -} - -.c1 { - border: none; - background: none; -} - -.c2 { - width: 30px; -} - -.c8 { - background-clip: padding-box; - background-color: #fff; - border-radius: 4px; - border: 1px solid rgba(0,0,0,0.15); - box-shadow: 0 6px 12px rgba(0,0,0,0.175); - float: left; - font-size: 14px; - left: 0; - list-style: none; - margin: 2px 0 0; - min-width: 160px; - max-height: 75vh; - padding: 5px 0; - position: absolute; - overflow: scroll; - text-align: left; - top: 100%; - z-index: 1000000; -} - -input[aria-expanded="false"] ~ .c7 { - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - display: inline-block; - height: 0; - overflow: hidden; - width: 0; -} - -.c5 { - border: none; - box-shadow: none; - font-size: 17px; - outline: none; -} - -.c0 { - border-bottom: 1px solid #000; - border-collapse: separate; - display: table; - margin-bottom: 15px; - position: relative; -} - -.c10 { - background-color: transparent; - clear: both; - color: #333; - display: block; - font-weight: 400; - line-height: 1.42857143; - padding: 3px 20px; - -webkit-text-decoration: none; - text-decoration: none; - white-space: nowrap; -} - -.c10:hover { - background-color: #f5f5f5; - cursor: pointer; -} - -.c10[aria-hidden="true"]:hover { - background-color: unset; - cursor: default; -} - -.c11 { - display: block; - padding-top: 5px; - padding-bottom: 3px; -} - -.c13 { - margin-left: 30px; - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; -} - -.c12 { - float: left; -} - -.c9 { - border: none; - box-shadow: none; - display: block; -} - -
    - - - - otpUi.LocationField.currentLocationUnavailable - -
      -
    • - - - - - - otpUi.LocationField.currentLocationUnavailable - - -
      • -
    -
    -`; - -exports[`Storyshots LocationField/Mobile Context Selected Location 1`] = ` - - - -`; - -exports[`Storyshots LocationField/Mobile Context Selected Location 2`] = ` -.c3 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c4 { - color: #f44256; -} - -.c7 { - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - display: inline-block; - height: 0; - overflow: hidden; - width: 0; -} - -.c1 { - border: none; - background: none; -} - -.c6 { - color: #888; - cursor: pointer; - width: 30px; -} - -.c2 { - width: 30px; -} - -.c9 { - background-clip: padding-box; - background-color: #fff; - border-radius: 4px; - border: 1px solid rgba(0,0,0,0.15); - box-shadow: 0 6px 12px rgba(0,0,0,0.175); - float: left; - font-size: 14px; - left: 0; - list-style: none; - margin: 2px 0 0; - min-width: 160px; - max-height: 75vh; - padding: 5px 0; - position: absolute; - overflow: scroll; - text-align: left; - top: 100%; - z-index: 1000000; -} - -input[aria-expanded="false"] ~ .c8 { - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - display: inline-block; - height: 0; - overflow: hidden; - width: 0; -} - -.c5 { - border: none; - box-shadow: none; - font-size: 17px; - outline: none; -} - -.c0 { - border-bottom: 1px solid #000; - border-collapse: separate; - display: table; - margin-bottom: 15px; - position: relative; -} - -.c11 { - background-color: transparent; - clear: both; - color: #333; - display: block; - font-weight: 400; - line-height: 1.42857143; - padding: 3px 20px; - -webkit-text-decoration: none; - text-decoration: none; - white-space: nowrap; -} - -.c11:hover { - background-color: #f5f5f5; - cursor: pointer; -} - -.c11[aria-hidden="true"]:hover { - background-color: unset; - cursor: default; -} - -.c12 { - display: block; - padding-top: 5px; - padding-bottom: 3px; -} - -.c14 { - margin-left: 30px; - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; -} - -.c13 { - float: left; -} - -.c10 { - border: none; - box-shadow: none; - display: block; -} - -
    - - - - -
      -
    • - - - - - - otpUi.LocationField.useCurrentLocation - - -
      • -
    -
    -`; - -exports[`Storyshots LocationField/Mobile Context Selected Location Custom Clear 1`] = ` - - - } - currentPosition={ - Object { - "coords": Object { - "latitude": 45.508246, - "longitude": -122.711574, - }, - } - } - geocoderConfig={ - Object { - "baseUrl": "https://ws-st.trimet.org/pelias/v1", - "boundary": Object { - "rect": Object { - "maxLat": 45.7445, - "maxLon": -122.135, - "minLat": 45.273, - "minLon": -123.2034, - }, - }, - "maxNearbyStops": 4, - "type": "PELIAS", - } - } - getCurrentPosition={[Function]} - isStatic={true} - location={ - Object { - "lat": 0, - "lon": 0, - "name": "123 Main St", - } - } - locationType="to" - onLocationSelected={[Function]} - /> - -`; - -exports[`Storyshots LocationField/Mobile Context Selected Location Custom Clear 2`] = ` -.c3 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c4 { - color: #f44256; -} - -.c7 { - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - display: inline-block; - height: 0; - overflow: hidden; - width: 0; -} - -.c1 { - border: none; - background: none; -} - -.c6 { - color: #888; - cursor: pointer; - width: 30px; -} - -.c2 { - width: 30px; -} - -.c9 { - background-clip: padding-box; - background-color: #fff; - border-radius: 4px; - border: 1px solid rgba(0,0,0,0.15); - box-shadow: 0 6px 12px rgba(0,0,0,0.175); - float: left; - font-size: 14px; - left: 0; - list-style: none; - margin: 2px 0 0; - min-width: 160px; - max-height: 75vh; - padding: 5px 0; - position: absolute; - overflow: scroll; - text-align: left; - top: 100%; - z-index: 1000000; -} - -input[aria-expanded="false"] ~ .c8 { - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - display: inline-block; - height: 0; - overflow: hidden; - width: 0; -} - -.c5 { - border: none; - box-shadow: none; - font-size: 17px; - outline: none; -} - -.c0 { - border-bottom: 1px solid #000; - border-collapse: separate; - display: table; - margin-bottom: 15px; - position: relative; -} - -.c11 { - background-color: transparent; - clear: both; - color: #333; - display: block; - font-weight: 400; - line-height: 1.42857143; - padding: 3px 20px; - -webkit-text-decoration: none; - text-decoration: none; - white-space: nowrap; -} - -.c11:hover { - background-color: #f5f5f5; - cursor: pointer; -} - -.c11[aria-hidden="true"]:hover { - background-color: unset; - cursor: default; -} - -.c12 { - display: block; - padding-top: 5px; - padding-bottom: 3px; -} - -.c14 { - margin-left: 30px; - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; -} - -.c13 { - float: left; -} - -.c10 { - border: none; - box-shadow: none; - display: block; -} - -
    - - - - -
      -
    • - - - - - - otpUi.LocationField.useCurrentLocation - - -
      • -
    -
    -`; - -exports[`Storyshots LocationField/Mobile Context Slow Geocoder 1`] = ` - - - -`; - -exports[`Storyshots LocationField/Mobile Context Slow Geocoder 2`] = ` -.c3 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c4 { - color: #333; -} - -.c6 { - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - display: inline-block; - height: 0; - overflow: hidden; - width: 0; -} - -.c1 { - border: none; - background: none; -} - -.c2 { - width: 30px; -} - -.c8 { - background-clip: padding-box; - background-color: #fff; - border-radius: 4px; - border: 1px solid rgba(0,0,0,0.15); - box-shadow: 0 6px 12px rgba(0,0,0,0.175); - float: left; - font-size: 14px; - left: 0; - list-style: none; - margin: 2px 0 0; - min-width: 160px; - max-height: 75vh; - padding: 5px 0; - position: absolute; - overflow: scroll; - text-align: left; - top: 100%; - z-index: 1000000; -} - -input[aria-expanded="false"] ~ .c7 { - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - display: inline-block; - height: 0; - overflow: hidden; - width: 0; -} - -.c5 { - border: none; - box-shadow: none; - font-size: 17px; - outline: none; -} - -.c0 { - border-bottom: 1px solid #000; - border-collapse: separate; - display: table; - margin-bottom: 15px; - position: relative; -} - -.c10 { - background-color: transparent; - clear: both; - color: #333; - display: block; - font-weight: 400; - line-height: 1.42857143; - padding: 3px 20px; - -webkit-text-decoration: none; - text-decoration: none; - white-space: nowrap; -} - -.c10:hover { - background-color: #f5f5f5; - cursor: pointer; -} - -.c10[aria-hidden="true"]:hover { - background-color: unset; - cursor: default; -} - -.c11 { - display: block; - padding-top: 5px; - padding-bottom: 3px; -} - -.c13 { - margin-left: 30px; - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; -} - -.c12 { - float: left; -} - -.c9 { - border: none; - box-shadow: none; - display: block; -} - -
    - - - -
      -
    • - - - - - - otpUi.LocationField.useCurrentLocation - - -
      • -
    -
    -`; - -exports[`Storyshots LocationField/Mobile Context Styled 1`] = ` - - - -`; - -exports[`Storyshots LocationField/Mobile Context Styled 2`] = ` -.c4 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c5 { - color: #333; -} - -.c7 { - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - display: inline-block; - height: 0; - overflow: hidden; - width: 0; -} - -.c2 { - border: none; - background: none; -} - -.c3 { - width: 30px; -} - -.c9 { - background-clip: padding-box; - background-color: #fff; - border-radius: 4px; - border: 1px solid rgba(0,0,0,0.15); - box-shadow: 0 6px 12px rgba(0,0,0,0.175); - float: left; - font-size: 14px; - left: 0; - list-style: none; - margin: 2px 0 0; - min-width: 160px; - max-height: 75vh; - padding: 5px 0; - position: absolute; - overflow: scroll; - text-align: left; - top: 100%; - z-index: 1000000; -} - -input[aria-expanded="false"] ~ .c8 { - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - display: inline-block; - height: 0; - overflow: hidden; - width: 0; -} - -.c6 { - border: none; - box-shadow: none; - font-size: 17px; - outline: none; -} - -.c0 { - border-bottom: 1px solid #000; - border-collapse: separate; - display: table; - margin-bottom: 15px; - position: relative; -} - -.c11 { - background-color: transparent; - clear: both; - color: #333; - display: block; - font-weight: 400; - line-height: 1.42857143; - padding: 3px 20px; - -webkit-text-decoration: none; - text-decoration: none; - white-space: nowrap; -} - -.c11:hover { - background-color: #f5f5f5; - cursor: pointer; -} - -.c11[aria-hidden="true"]:hover { - background-color: unset; - cursor: default; -} - -.c13 { - display: block; - padding-top: 5px; - padding-bottom: 3px; -} - -.c15 { - margin-left: 30px; - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; -} - -.c14 { - float: left; -} - -.c10 { - border: none; - box-shadow: none; - display: block; -} - -.c1 .c12 { - background-color: pink; - font-size: 24px; -} - -
    - - - -
      -
    • - - - - - - otpUi.LocationField.useCurrentLocation - - -
      • -
    -
    -`; - -exports[`Storyshots LocationField/Mobile Context With Custom Icons 1`] = ` - - - } - currentPositionUnavailableIcon={ - - } - geocoderConfig={ - Object { - "baseUrl": "https://ws-st.trimet.org/pelias/v1", - "boundary": Object { - "rect": Object { - "maxLat": 45.7445, - "maxLon": -122.135, - "minLat": 45.273, - "minLon": -123.2034, - }, - }, - "maxNearbyStops": 4, - "type": "PELIAS", - } - } - getCurrentPosition={[Function]} - isStatic={true} - layerColorMap={ - Object { - "locality": "orange", - "stations": "navy", - "stops": "purple", - } - } - locationType="to" - nearbyStops={ - Array [ - "1", - "2", - ] - } - onLocationSelected={[Function]} - sessionOptionIcon={ - - } - sessionSearches={ - Array [ - Object { - "lat": 12.34, - "lon": 34.45, - "name": "123 Main St", - }, - ] - } - showUserSettings={true} - stopOptionIcon={ - - } - stopsIndex={ - Object { - "1": Object { - "code": "1", - "dist": 123, - "lat": 12.34, - "lon": 34.56, - "name": "1st & Main", - "routes": Array [ - Object { - "shortName": "1", - }, - ], - }, - "2": Object { - "code": "2", - "dist": 345, - "lat": 23.45, - "lon": 67.89, - "name": "Main & 2nd", - "routes": Array [ - Object { - "shortName": "2", - }, - ], - }, - } - } - userLocationsAndRecentPlaces={ - Array [ - Object { - "icon": "home", - "lat": 45.89, - "lon": 67.12, - "name": "456 Suburb St", - "type": "home", - }, - Object { - "icon": "work", - "lat": 54.32, - "lon": 43.21, - "name": "789 Busy St", - "type": "work", - }, - Object { - "icon": "map-marker", - "lat": 34.22, - "lon": -84.11, - "name": "Coffee Roasters Shop, 55 Coffee Street", - "type": "custom", - }, - Object { - "lat": 12.34, - "lon": 34.45, - "name": "123 Main St", - "type": "recent", - }, - ] - } - /> - -`; - -exports[`Storyshots LocationField/Mobile Context With Custom Icons 2`] = ` -.c3 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c5 { - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - display: inline-block; - height: 0; - overflow: hidden; - width: 0; -} - -.c1 { - border: none; - background: none; -} - -.c16 { - clear: both; -} - -.c2 { - width: 30px; -} - -.c7 { - background-clip: padding-box; - background-color: #fff; - border-radius: 4px; - border: 1px solid rgba(0,0,0,0.15); - box-shadow: 0 6px 12px rgba(0,0,0,0.175); - float: left; - font-size: 14px; - left: 0; - list-style: none; - margin: 2px 0 0; - min-width: 160px; - max-height: 75vh; - padding: 5px 0; - position: absolute; - overflow: scroll; - text-align: left; - top: 100%; - z-index: 1000000; -} - -input[aria-expanded="false"] ~ .c6 { - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - display: inline-block; - height: 0; - overflow: hidden; - width: 0; -} - -.c4 { - border: none; - box-shadow: none; - font-size: 17px; - outline: none; -} - -.c0 { - border-bottom: 1px solid #000; - border-collapse: separate; - display: table; - margin-bottom: 15px; - position: relative; -} - -.c9 { - color: #eee; - background-color: #333; - font-size: 12px; - font-weight: normal; - line-height: 1.42857143; - margin: 0; - padding: 0px 10px; - text-align: center; - white-space: nowrap; -} - -.c10 { - background-color: transparent; - clear: both; - color: #333; - display: block; - font-weight: 400; - line-height: 1.42857143; - padding: 3px 20px; - -webkit-text-decoration: none; - text-decoration: none; - white-space: nowrap; -} - -.c10:hover { - background-color: #f5f5f5; - cursor: pointer; -} - -.c10[aria-hidden="true"]:hover { - background-color: unset; - cursor: default; -} - -.c17 { - display: block; - padding-top: 5px; - padding-bottom: 3px; -} - -.c19 { - margin-left: 30px; - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; -} - -.c18 { - float: left; -} - -.c15 { - background-color: gray; - color: white; - padding: 2px 3px 0px; - margin-right: 5px; -} - -.c8 { - border: none; - box-shadow: none; - display: block; -} - -.c13 { - margin-left: 30px; -} - -.c12 { - font-size: 8px; -} - -.c11 { - float: left; - padding-top: 3px; -} - -.c14 { - font-size: 9px; -} - -
    - - - -
      -

      - otpUi.LocationField.nearby -

      -
    • - - - - 404 ft - - - - - 1st & Main - ( - 1 - ) - - - - 1 - - - -
      -
      • -
    • - - - - 0.2 mi - - - - - Main & 2nd - ( - 2 - ) - - - - 2 - - - -
      -
      • -

      - otpUi.LocationField.recentlySearched -

      -
    • - - - - - - 123 Main St - - - -
      • -

      - otpUi.LocationField.myPlaces -

      -
    • - - - - - - otpUi.LocationField.parenthesisFormat - - -
      • -
    • - - - - - - otpUi.LocationField.parenthesisFormat - - -
      • -
    • - - - - - - Coffee Roasters Shop, 55 Coffee Street - - -
      • -
    • - - - - - - 123 Main St - - -
      • -
    • - - - - - - otpUi.LocationField.useCurrentLocation - - -
      • -
    -
    -`; - -exports[`Storyshots LocationField/Mobile Context With Nearby Stops 1`] = ` - - - -`; - -exports[`Storyshots LocationField/Mobile Context With Nearby Stops 2`] = ` -.c3 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c4 { - color: #f44256; -} - -.c6 { - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - display: inline-block; - height: 0; - overflow: hidden; - width: 0; -} - -.c1 { - border: none; - background: none; -} - -.c17 { - clear: both; -} - -.c2 { - width: 30px; -} - -.c8 { - background-clip: padding-box; - background-color: #fff; - border-radius: 4px; - border: 1px solid rgba(0,0,0,0.15); - box-shadow: 0 6px 12px rgba(0,0,0,0.175); - float: left; - font-size: 14px; - left: 0; - list-style: none; - margin: 2px 0 0; - min-width: 160px; - max-height: 75vh; - padding: 5px 0; - position: absolute; - overflow: scroll; - text-align: left; - top: 100%; - z-index: 1000000; -} - -input[aria-expanded="false"] ~ .c7 { - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - display: inline-block; - height: 0; - overflow: hidden; - width: 0; -} - -.c5 { - border: none; - box-shadow: none; - font-size: 17px; - outline: none; -} - -.c0 { - border-bottom: 1px solid #000; - border-collapse: separate; - display: table; - margin-bottom: 15px; - position: relative; -} - -.c10 { - color: #eee; - background-color: #333; - font-size: 12px; - font-weight: normal; - line-height: 1.42857143; - margin: 0; - padding: 0px 10px; - text-align: center; - white-space: nowrap; -} - -.c11 { - background-color: transparent; - clear: both; - color: #333; - display: block; - font-weight: 400; - line-height: 1.42857143; - padding: 3px 20px; - -webkit-text-decoration: none; - text-decoration: none; - white-space: nowrap; -} - -.c11:hover { - background-color: #f5f5f5; - cursor: pointer; -} - -.c11[aria-hidden="true"]:hover { - background-color: unset; - cursor: default; -} - -.c18 { - display: block; - padding-top: 5px; - padding-bottom: 3px; -} - -.c20 { - margin-left: 30px; - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; -} - -.c19 { - float: left; -} - -.c16 { - background-color: gray; - color: white; - padding: 2px 3px 0px; - margin-right: 5px; -} - -.c9 { - border: none; - box-shadow: none; - display: block; -} - -.c14 { - margin-left: 30px; -} - -.c13 { - font-size: 8px; -} - -.c12 { - float: left; - padding-top: 3px; -} - -.c15 { - font-size: 9px; -} - -
    - - - -
      -

      - otpUi.LocationField.nearby -

      -
    • - - - - 404 ft - - - - - 1st & Main - ( - 1 - ) - - - - 1 - - - -
      -
      • -
    • - - - - 0.2 mi - - - - - Main & 2nd - ( - 2 - ) - - - - 2 - - - -
      -
      • -
    • - - - - - - otpUi.LocationField.useCurrentLocation - - -
      • -
    -
    -`; - -exports[`Storyshots LocationField/Mobile Context With Session Searches 1`] = ` - - - -`; - -exports[`Storyshots LocationField/Mobile Context With Session Searches 2`] = ` -.c3 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c4 { - color: #f44256; -} - -.c6 { - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - display: inline-block; - height: 0; - overflow: hidden; - width: 0; -} - -.c1 { - border: none; - background: none; -} - -.c2 { - width: 30px; -} - -.c8 { - background-clip: padding-box; - background-color: #fff; - border-radius: 4px; - border: 1px solid rgba(0,0,0,0.15); - box-shadow: 0 6px 12px rgba(0,0,0,0.175); - float: left; - font-size: 14px; - left: 0; - list-style: none; - margin: 2px 0 0; - min-width: 160px; - max-height: 75vh; - padding: 5px 0; - position: absolute; - overflow: scroll; - text-align: left; - top: 100%; - z-index: 1000000; -} - -input[aria-expanded="false"] ~ .c7 { - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - display: inline-block; - height: 0; - overflow: hidden; - width: 0; -} - -.c5 { - border: none; - box-shadow: none; - font-size: 17px; - outline: none; -} - -.c0 { - border-bottom: 1px solid #000; - border-collapse: separate; - display: table; - margin-bottom: 15px; - position: relative; -} - -.c10 { - color: #eee; - background-color: #333; - font-size: 12px; - font-weight: normal; - line-height: 1.42857143; - margin: 0; - padding: 0px 10px; - text-align: center; - white-space: nowrap; -} - -.c11 { - background-color: transparent; - clear: both; - color: #333; - display: block; - font-weight: 400; - line-height: 1.42857143; - padding: 3px 20px; - -webkit-text-decoration: none; - text-decoration: none; - white-space: nowrap; -} - -.c11:hover { - background-color: #f5f5f5; - cursor: pointer; -} - -.c11[aria-hidden="true"]:hover { - background-color: unset; - cursor: default; -} - -.c12 { - display: block; - padding-top: 5px; - padding-bottom: 3px; -} - -.c14 { - margin-left: 30px; - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; -} - -.c13 { - float: left; -} - -.c9 { - border: none; - box-shadow: none; - display: block; -} - -
    - - - -
      -

      - otpUi.LocationField.recentlySearched -

      -
    • - - - - - - 123 Main St - - - -
      • -
    • - - - - - - otpUi.LocationField.useCurrentLocation - - -
      • -
    -
    -`; - -exports[`Storyshots LocationField/Mobile Context With User Settings 1`] = ` - - - -`; - -exports[`Storyshots LocationField/Mobile Context With User Settings 2`] = ` -.c3 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c4 { - color: #f44256; -} - -.c6 { - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - display: inline-block; - height: 0; - overflow: hidden; - width: 0; -} - -.c1 { - border: none; - background: none; -} - -.c2 { - width: 30px; -} - -.c8 { - background-clip: padding-box; - background-color: #fff; - border-radius: 4px; - border: 1px solid rgba(0,0,0,0.15); - box-shadow: 0 6px 12px rgba(0,0,0,0.175); - float: left; - font-size: 14px; - left: 0; - list-style: none; - margin: 2px 0 0; - min-width: 160px; - max-height: 75vh; - padding: 5px 0; - position: absolute; - overflow: scroll; - text-align: left; - top: 100%; - z-index: 1000000; -} - -input[aria-expanded="false"] ~ .c7 { - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - display: inline-block; - height: 0; - overflow: hidden; - width: 0; -} - -.c5 { - border: none; - box-shadow: none; - font-size: 17px; - outline: none; -} - -.c0 { - border-bottom: 1px solid #000; - border-collapse: separate; - display: table; - margin-bottom: 15px; - position: relative; -} - -.c10 { - color: #eee; - background-color: #333; - font-size: 12px; - font-weight: normal; - line-height: 1.42857143; - margin: 0; - padding: 0px 10px; - text-align: center; - white-space: nowrap; -} - -.c11 { - background-color: transparent; - clear: both; - color: #333; - display: block; - font-weight: 400; - line-height: 1.42857143; - padding: 3px 20px; - -webkit-text-decoration: none; - text-decoration: none; - white-space: nowrap; -} - -.c11:hover { - background-color: #f5f5f5; - cursor: pointer; -} - -.c11[aria-hidden="true"]:hover { - background-color: unset; - cursor: default; -} - -.c12 { - display: block; - padding-top: 5px; - padding-bottom: 3px; -} - -.c14 { - margin-left: 30px; - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; -} - -.c13 { - float: left; -} - -.c9 { - border: none; - box-shadow: none; - display: block; -} - -
    - - - -
      -

      - otpUi.LocationField.myPlaces -

      -
    • - - - - - - otpUi.LocationField.parenthesisFormat - - -
      • -
    • - - - - - - otpUi.LocationField.parenthesisFormat - - -
      • -
    • - - - - - - Coffee Roasters Shop, 55 Coffee Street - - -
      • -
    • - - - - - - 123 Main St - - -
      • -
    • - - - - - - otpUi.LocationField.useCurrentLocation - - -
      • -
    -
    -`; - -exports[`Storyshots LocationIcon Custom Style For To 1`] = ` - - - -`; - -exports[`Storyshots LocationIcon Custom Style For To 2`] = ` -.c0 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c1 { - color: #f44256; -} - -.c2 { - color: blue; -} - - -`; - -exports[`Storyshots LocationIcon From 1`] = ` - - - -`; - -exports[`Storyshots LocationIcon From 2`] = ` -.c0 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c1 { - color: #333; -} - - -`; - -exports[`Storyshots LocationIcon Generic Place 1`] = ` - - - -`; - -exports[`Storyshots LocationIcon Generic Place 2`] = ` -.c0 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c1 { - color: #333; -} - - -`; - -exports[`Storyshots LocationIcon To 1`] = ` - - - -`; - -exports[`Storyshots LocationIcon To 2`] = ` -.c0 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c1 { - color: #f44256; -} - - -`; - -exports[`Storyshots Map Popup Floating Vehicle Entity 1`] = ` - - - -`; - -exports[`Storyshots Map Popup Floating Vehicle Entity 2`] = ` -.c0 { - font-size: 12px; - line-height: 1.5; - min-width: 250px; -} - -.c2 { - margin-top: 6px; -} - -.c1 { - font-size: 18px; - font-weight: 500; - margin-bottom: 6px; -} - -.c5 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c6 { - color: #333; -} - -.c8 { - color: #f44256; -} - -.c4:first-of-type { - border-left: none; -} - -.c3 > * { - padding-left: 0.4em; - border-left: 1px solid black; -} - -.c7 { - background: none; - border: none; - color: navy; - font-family: inherit; - font-size: inherit; - line-height: inherit; - padding-left: 0.2em; -} - -.c7:hover { - -webkit-text-decoration: underline; - text-decoration: underline; - cursor: pointer; -} - -
    -
    - Free-floating bike: 0541 BIKETOWN -
    -

    - - Plan a trip: - - - - - - - - - - - -

    -
    -`; - -exports[`Storyshots Map Popup Station Entity 1`] = ` - - - -`; - -exports[`Storyshots Map Popup Station Entity 2`] = ` -.c0 { - font-size: 12px; - line-height: 1.5; - min-width: 250px; -} - -.c2 { - margin-top: 6px; -} - -.c1 { - font-size: 18px; - font-weight: 500; - margin-bottom: 6px; -} - -.c5 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c6 { - color: #333; -} - -.c8 { - color: #f44256; -} - -.c4:first-of-type { - border-left: none; -} - -.c3 > * { - padding-left: 0.4em; - border-left: 1px solid black; -} - -.c7 { - background: none; - border: none; - color: navy; - font-family: inherit; - font-size: inherit; - line-height: inherit; - padding-left: 0.2em; -} - -.c7:hover { - -webkit-text-decoration: underline; - text-decoration: underline; - cursor: pointer; -} - -
    -
    - SW Morrison at 18th -
    -

    -

    - Available bikes: 6 -
    -
    - Available docks: 11 -
    -

    -

    - - Plan a trip: - - - - - - - - - - - -

    -
    -`; - -exports[`Storyshots Map Popup Stop Entity 1`] = ` - - - -`; - -exports[`Storyshots Map Popup Stop Entity 2`] = ` -.c0 { - font-size: 12px; - line-height: 1.5; - min-width: 250px; -} - -.c2 { - margin-top: 6px; -} - -.c1 { - font-size: 18px; - font-weight: 500; - margin-bottom: 6px; -} - -.c6 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c7 { - color: #333; -} - -.c9 { - color: #f44256; -} - -.c5:first-of-type { - border-left: none; -} - -.c4 > * { - padding-left: 0.4em; - border-left: 1px solid black; -} - -.c8 { - background: none; - border: none; - color: navy; - font-family: inherit; - font-size: inherit; - line-height: inherit; - padding-left: 0.2em; -} - -.c8:hover { - -webkit-text-decoration: underline; - text-decoration: underline; - cursor: pointer; -} - -.c3 { - background: none; - border-bottom: none; - border-left: 1px solid #000; - border-right: none; - border-top: none; - color: #008; - font-family: inherit; - margin-left: 5px; - padding-top: 0; -} - -
    -
    - W Burnside & SW 2nd -
    -

    - - Stop ID: 9526 - - -

    -

    - - Plan a trip: - - - - - - - - - - - -

    -
    -`; - -exports[`Storyshots Map Popup Stop Entity No Handlers 1`] = ` - - - -`; - -exports[`Storyshots Map Popup Stop Entity No Handlers 2`] = ` -.c0 { - font-size: 12px; - line-height: 1.5; - min-width: 250px; -} - -.c1 { - font-size: 18px; - font-weight: 500; - margin-bottom: 6px; -} - -
    -
    - W Burnside & SW 2nd -
    -
    -`; - -exports[`Storyshots Map Popup Stop Entity With Focus Trap 1`] = ` - - - - - -`; - -exports[`Storyshots Map Popup Stop Entity With Focus Trap 2`] = ` -.c0 { - font-size: 12px; - line-height: 1.5; - min-width: 250px; -} - -.c2 { - margin-top: 6px; -} - -.c1 { - font-size: 18px; - font-weight: 500; - margin-bottom: 6px; -} - -.c6 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c7 { - color: #333; -} - -.c9 { - color: #f44256; -} - -.c5:first-of-type { - border-left: none; -} - -.c4 > * { - padding-left: 0.4em; - border-left: 1px solid black; -} - -.c8 { - background: none; - border: none; - color: navy; - font-family: inherit; - font-size: inherit; - line-height: inherit; - padding-left: 0.2em; -} - -.c8:hover { - -webkit-text-decoration: underline; - text-decoration: underline; - cursor: pointer; -} - -.c3 { - background: none; - border-bottom: none; - border-left: 1px solid #000; - border-right: none; - border-top: none; - color: #008; - font-family: inherit; - margin-left: 5px; - padding-top: 0; -} - - -`; - -exports[`Storyshots ParkAndRideOverlay Default 1`] = ` - - - - - - - -`; - -exports[`Storyshots ParkAndRideOverlay Default 2`] = ` -.c0 { - height: 90vh; -} - -
    -
    -
    -`; - -exports[`Storyshots PrintableItinerary Bike Only Itinerary 1`] = ` - - - -`; - -exports[`Storyshots PrintableItinerary Bike Only Itinerary 2`] = ` -.c7 { - font-weight: inherit; -} - -.c12 { - font-weight: 500; -} - -.c13 { - font-weight: 200; - opacity: 0.8975; - padding-left: 1ch; -} - -.c0 { - margin-bottom: 10px; - border-top: 1px solid grey; - padding-top: 18px; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; -} - -.c1 { - border-top: none; - padding-top: 0; -} - -.c2 { - margin-left: 10px; -} - -.c9 { - font-size: 14px; - margin-top: 3px; -} - -.c8 { - margin-top: 5px; -} - -.c3 { - font-size: 18px; -} - -.c6 { - font-size: 18px; -} - -.c4 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-flex-direction: column; - -ms-flex-direction: column; - flex-direction: column; - height: 100%; - min-width: 70px; -} - -.c10 .c11 { - font-weight: bold; -} - -.c5 { - float: left; - width: 32px; - height: 32px; -} - -
    -
    -
    -
    - - Depart - - from - - 503 SW Alder St, Portland, OR, USA 97204 - -
    -
    -
    -
    -
    -
    - - - - -
    -
    -
    - - Bicycle 0.7 miles to - - 1737 SW Morrison St, Portland, OR, USA 97205 - - -
    -
    - - Head - EAST - on - - SW Alder St - - - 87 feet - - -
    -
    - - RIGHT - on - - SW 5th Ave - - - 257 feet - - -
    -
    - - RIGHT - on - - SW Morrison St - - - 0.6 miles - - -
    -
    -
    -
    -
    -`; - -exports[`Storyshots PrintableItinerary Bike Rental Itinerary 1`] = ` - - - -`; - -exports[`Storyshots PrintableItinerary Bike Rental Itinerary 2`] = ` -.c7 { - font-weight: inherit; -} - -.c12 { - font-weight: 500; -} - -.c13 { - font-weight: 200; - opacity: 0.8975; - padding-left: 1ch; -} - -.c0 { - margin-bottom: 10px; - border-top: 1px solid grey; - padding-top: 18px; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; -} - -.c1 { - border-top: none; - padding-top: 0; -} - -.c2 { - margin-left: 10px; -} - -.c9 { - font-size: 14px; - margin-top: 3px; -} - -.c8 { - margin-top: 5px; -} - -.c3 { - font-size: 18px; -} - -.c6 { - font-size: 18px; -} - -.c4 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-flex-direction: column; - -ms-flex-direction: column; - flex-direction: column; - height: 100%; - min-width: 70px; -} - -.c10 .c11 { - font-weight: bold; -} - -.c5 { - float: left; - width: 32px; - height: 32px; -} - -
    -
    -
    -
    - - Depart - - from - - 2624 SE 30th Ave, Portland, OR, USA 97202 - -
    -
    -
    -
    -
    -
    - - - -
    -
    -
    - - Walk 498 feet to - - SE 30th at Division - - -
    -
    - - Head - WEST - on - - SE Clinton St - - - 79 feet - - -
    -
    - - RIGHT - on - - SE 30th Ave - - - 419 feet - - -
    -
    -
    -
    -
    -
    -
    - - - - - - - - - - -
    -
    -
    - - Bicycle 0.6 miles to - - SE 29th at Hawthorne - - -
    -
    - - CONTINUE - on - - SE 30th Ave - - - 0.3 miles - - -
    -
    - - LEFT - on - - SE Harrison St - - - 361 feet - - -
    -
    - - RIGHT - on - - SE 29th Ave - - - 0.2 miles - - -
    -
    - - LEFT - on - - SE Hawthorne Blvd - - - 50 feet - - -
    -
    -
    -
    -
    -
    -
    - - - -
    -
    -
    - - Walk 0.1 miles to - - 1415 SE 28th Ave, Portland, OR, USA 97214 - - -
    -
    - - CONTINUE - on - - SE Hawthorne Blvd - - - 210 feet - - -
    -
    - - RIGHT - on - - SE 28th Ave - - - 295 feet - - -
    -
    - - LEFT - on - - SE Madison St - - - 114 feet - - -
    -
    -
    -
    -
    -`; - -exports[`Storyshots PrintableItinerary Bike Rental Transit Itinerary 1`] = ` - - - -`; - -exports[`Storyshots PrintableItinerary Bike Rental Transit Itinerary 2`] = ` -.c16 { - font-weight: 200; -} - -.c7 { - font-weight: inherit; -} - -.c12 { - font-weight: 500; -} - -.c13 { - font-weight: 200; - opacity: 0.8975; - padding-left: 1ch; -} - -.c0 { - margin-bottom: 10px; - border-top: 1px solid grey; - padding-top: 18px; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; -} - -.c1 { - border-top: none; - padding-top: 0; -} - -.c2 { - margin-left: 10px; -} - -.c9 { - font-size: 14px; - margin-top: 3px; -} - -.c8 { - margin-top: 5px; -} - -.c3 { - font-size: 18px; -} - -.c6 { - font-size: 18px; -} - -.c4 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-flex-direction: column; - -ms-flex-direction: column; - flex-direction: column; - height: 100%; - min-width: 70px; -} - -.c10 .c11 { - font-weight: bold; -} - -.c14 { - font-weight: bold; -} - -.c14 .c15 { - font-weight: normal; -} - -.c5 { - float: left; - width: 32px; - height: 32px; -} - -
    -
    -
    -
    - - Depart - - from - - 2943 SE Washington St, Portland, OR, USA 97214 - -
    -
    -
    -
    -
    -
    - - - -
    -
    -
    - - Walk 400 feet to - - SE 29th at Stark - - -
    -
    - - Head - NORTH - on - - SE 30th Ave - - - 103 feet - - -
    -
    - - RIGHT - on - - SE Stark St - - - 277 feet - - -
    -
    - - RIGHT - on - - SE 29th Ave - - - 19 feet - - -
    -
    -
    -
    -
    -
    -
    - - - - - - - - - - -
    -
    -
    - - Bicycle 0.8 miles to - - NE Glisan at 24th - - -
    -
    - - CONTINUE - on - - SE 29th Ave - - - 492 feet - - -
    -
    - - LEFT - on - - SE Pine St - - - 358 feet - - -
    -
    - - RIGHT - on - - SE 28th Ave - - - 518 feet - - -
    -
    - - LEFT - on - - SE Ankeny St - - - 0.2 miles - - -
    -
    - - RIGHT - on - - SE 24th Ave - - - 259 feet - - -
    -
    - - CONTINUE - on - - NE 24th Ave - - - 0.2 miles - - -
    -
    - - LEFT - on - - NE Glisan St - - - 57 feet - - -
    -
    -
    -
    -
    -
    -
    - - - -
    -
    -
    - - Walk 497 feet to - - NE Sandy & 24th - - -
    -
    - - HARD_LEFT - on - - NE Glisan St - - - 57 feet - - -
    -
    - - LEFT - on - - NE 24th Ave - - - 382 feet - - -
    -
    - - RIGHT - on - - NE Sandy Blvd - - - 58 feet - - -
    -
    -
    -
    -
    -
    -
    - - - -
    -
    -
    -
    - - 12 - - - - Barbur/Sandy Blvd - - to - - Parkrose TC - -
    -
    -
    - Board at - - NE Sandy & 24th - - (5066) at - - 4:02 PM - -
    -
    - Get off at - - NE Sandy & 57th - - (5104) at - - 4:14 PM - -
    -
    -
    -
    -
    -
    -
    - - - -
    -
    -
    - - Walk 279 feet to - - 0086 BIKETOWN - - -
    -
    - - Head - NORTHEAST - on - - NE Sandy Blvd - - - 75 feet - - -
    -
    - - HARD_LEFT - on - - NE Alameda St - - - 203 feet - - -
    -
    -
    -
    -
    -
    -
    - - - - - - - - - - -
    -
    -
    - - Bicycle 1 mile to - - NE 60th at Cully - - -
    -
    - - HARD_LEFT - on - - NE Alameda St - - - 203 feet - - -
    -
    - - HARD_LEFT - on - - NE 57th Ave - - - 0.6 miles - - -
    -
    - - CONTINUE - on - - NE Cully Blvd - - - 0.3 miles - - -
    -
    - - LEFT - on - - NE 60th Ave - - - 171 feet - - -
    -
    -
    -
    -
    -
    -
    - - - -
    -
    -
    - - Walk 494 feet to - - 5916 NE Going St, Portland, OR, USA 97218 - - -
    -
    - - CONTINUE - on - - NE 60th Ave - - - 270 feet - - -
    -
    - - LEFT - on - - NE Going St - - - 225 feet - - -
    -
    -
    -
    -
    -`; - -exports[`Storyshots PrintableItinerary Bike Transit Bike Itinerary 1`] = ` - - - -`; - -exports[`Storyshots PrintableItinerary Bike Transit Bike Itinerary 2`] = ` -.c16 { - font-weight: 200; -} - -.c7 { - font-weight: inherit; -} - -.c12 { - font-weight: 500; -} - -.c13 { - font-weight: 200; - opacity: 0.8975; - padding-left: 1ch; -} - -.c0 { - margin-bottom: 10px; - border-top: 1px solid grey; - padding-top: 18px; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; -} - -.c1 { - border-top: none; - padding-top: 0; -} - -.c2 { - margin-left: 10px; -} - -.c9 { - font-size: 14px; - margin-top: 3px; -} - -.c8 { - margin-top: 5px; -} - -.c3 { - font-size: 18px; -} - -.c6 { - font-size: 18px; -} - -.c4 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-flex-direction: column; - -ms-flex-direction: column; - flex-direction: column; - height: 100%; - min-width: 70px; -} - -.c10 .c11 { - font-weight: bold; -} - -.c14 { - font-weight: bold; -} - -.c14 .c15 { - font-weight: normal; -} - -.c5 { - float: left; - width: 32px; - height: 32px; -} - -
    -
    -
    -
    - - Depart - - from - - KGW Studio on the Sq, Portland, OR, USA - -
    -
    -
    -
    -
    -
    - - - -
    -
    -
    - - Walk 91 feet to - - corner of path and Pioneer Courthouse Sq (pedestrian street) - - -
    -
    - - Head - SOUTHEAST - on - - Unnamed Path - - - 91 feet - - -
    -
    -
    -
    -
    -
    -
    - - - - -
    -
    -
    - - Bicycle 0.1 miles to - - corner of path and Pioneer Sq N (path) - - -
    -
    - - LEFT - on - - Unnamed Path - - - 20 feet - - -
    -
    - - LEFT - on - - SW 6th Ave - - - 245 feet - - -
    -
    - - LEFT - on - - SW Morrison St - - - 241 feet - - -
    -
    - - LEFT - on - - Unnamed Path - - - 27 feet - - -
    -
    -
    -
    -
    -
    -
    - - - -
    -
    -
    - - Walk 22 feet to - - Pioneer Square North MAX Station - - -
    -
    - - LEFT - on - - Pioneer Sq N (path) - - - 22 feet - - -
    -
    -
    -
    -
    -
    -
    - - - -
    -
    -
    -
    - - MAX Blue Line - - - - MAX Blue Line - - to - - Hillsboro - -
    -
    -
    - Board at - - Pioneer Square North MAX Station - - (8383) at - - 3:46 PM - -
    -
    - Get off at - - Providence Park MAX Station - - (9757) at - - 3:49 PM - -
    -
    -
    -
    -
    -
    -
    - - - -
    -
    -
    - - Walk 19 feet to - - corner of path and Providence Park (path) - - -
    -
    - - Head - WEST - on - - Providence Park (path) - - - 19 feet - - -
    -
    -
    -
    -
    -
    -
    - - - - -
    -
    -
    - - Bicycle 230 feet to - - 1737 SW Morrison St, Portland, OR, USA 97205 - - -
    -
    - - RIGHT - on - - Unnamed Path - - - 104 feet - - -
    -
    - - RIGHT - on - - Unnamed Path - - - 27 feet - - -
    -
    - - RIGHT - on - - SW Morrison St - - - 99 feet - - -
    -
    -
    -
    -
    -`; - -exports[`Storyshots PrintableItinerary Classic Icons And Park And Ride Itinerary 1`] = ` - - - -`; - -exports[`Storyshots PrintableItinerary Classic Icons And Park And Ride Itinerary 2`] = ` -.c16 { - font-weight: 200; -} - -.c7 { - font-weight: inherit; -} - -.c12 { - font-weight: 500; -} - -.c13 { - font-weight: 200; - opacity: 0.8975; - padding-left: 1ch; -} - -.c0 { - margin-bottom: 10px; - border-top: 1px solid grey; - padding-top: 18px; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; -} - -.c1 { - border-top: none; - padding-top: 0; -} - -.c2 { - margin-left: 10px; -} - -.c9 { - font-size: 14px; - margin-top: 3px; -} - -.c8 { - margin-top: 5px; -} - -.c3 { - font-size: 18px; -} - -.c6 { - font-size: 18px; -} - -.c4 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-flex-direction: column; - -ms-flex-direction: column; - flex-direction: column; - height: 100%; - min-width: 70px; -} - -.c10 .c11 { - font-weight: bold; -} - -.c14 { - font-weight: bold; -} - -.c14 .c15 { - font-weight: normal; -} - -.c5 { - float: left; - width: 32px; - height: 32px; -} - -
    -
    -
    -
    - - Depart - - from - - 330 SW Murray Blvd, Washington County, OR, USA 97005 - -
    -
    -
    -
    -
    -
    - - - -
    -
    -
    - - Drive 2.4 miles to - - P+R Sunset TC - - -
    -
    - - Head - SOUTHWEST - on - - parking aisle - - - 158 feet - - -
    -
    - - RIGHT - on - - SW Murray Blvd - - - 0.2 miles - - -
    -
    - - CONTINUE - on - - NW Murray Blvd - - - 150 feet - - -
    -
    - - SLIGHTLY_RIGHT - on - - NW Murray Blvd - - - 0.4 miles - - -
    -
    - - CONTINUE - on - - NW Sunset Hwy - - - 0.6 miles - - -
    -
    - - CONTINUE - on - - NW Sunset Hwy - - - 0.3 miles - - -
    -
    - - LEFT - on - - SW Cedar Hills Blvd - - - 0.2 miles - - -
    -
    - - RIGHT - on - - SW Barnes Rd - - - 0.5 miles - - -
    -
    - - RIGHT - on - - service road - - - 0.2 miles - - -
    -
    - - RIGHT - on - - Sunset TC - - - 76 feet - - -
    -
    -
    -
    -
    -
    -
    - - - - -
    -
    -
    - - Walk 426 feet to - - Sunset TC MAX Station - - -
    -
    - - SLIGHTLY_RIGHT - on - - Unnamed Path - - - 16 feet - - -
    -
    - - LEFT - on - - steps - - - 232 feet - - -
    -
    - - LEFT - on - - Unnamed Path - - - 19 feet - - -
    -
    - - RIGHT - on - - Sunset TC (path) - - - 159 feet - - -
    -
    -
    -
    -
    -
    -
    - - - - - -
    -
    -
    -
    - - MAX Blue Line - - - - MAX Blue Line - - to - - Gresham - -
    -
    -
    - Board at - - Sunset TC MAX Station - - (2600) at - - 4:05 PM - -
    -
    - Get off at - - Oak/ SW 1st Ave MAX Station - - (8337) at - - 4:27 PM - -
    -
    -
    -
    -
    -
    -
    - - - - -
    -
    -
    - - Walk 0.1 miles to - - 205 SW Pine St, Portland, OR, USA 97204 - - -
    -
    - - Head - NORTHEAST - on - - Oak/SW 1st Ave (path) - - - 13 feet - - -
    -
    - - CONTINUE - on - - Unnamed Path - - - 27 feet - - -
    -
    - - LEFT - on - - SW Oak St - - - 37 feet - - -
    -
    - - RIGHT - on - - SW 1st Ave - - - 260 feet - - -
    -
    - - LEFT - on - - SW Pine St - - - 337 feet - - -
    -
    -
    -
    -
    -`; - -exports[`Storyshots PrintableItinerary E Scooter Rental Itinerary 1`] = ` - - - -`; - -exports[`Storyshots PrintableItinerary E Scooter Rental Itinerary 2`] = ` -.c7 { - font-weight: inherit; -} - -.c12 { - font-weight: 500; -} - -.c13 { - font-weight: 200; - opacity: 0.8975; - padding-left: 1ch; -} - -.c0 { - margin-bottom: 10px; - border-top: 1px solid grey; - padding-top: 18px; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; -} - -.c1 { - border-top: none; - padding-top: 0; -} - -.c2 { - margin-left: 10px; -} - -.c9 { - font-size: 14px; - margin-top: 3px; -} - -.c8 { - margin-top: 5px; -} - -.c3 { - font-size: 18px; -} - -.c6 { - font-size: 18px; -} - -.c4 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-flex-direction: column; - -ms-flex-direction: column; - flex-direction: column; - height: 100%; - min-width: 70px; -} - -.c10 .c11 { - font-weight: bold; -} - -.c5 { - float: left; - width: 32px; - height: 32px; -} - -
    -
    -
    -
    - - Depart - - from - - 600 SW 5th Ave, Portland, OR, USA 97204 - -
    -
    -
    -
    -
    -
    - - - -
    -
    -
    - - Walk 206 feet to - - EMAQ - - -
    -
    - - Head - EAST - on - - SW Alder St - - - 118 feet - - -
    -
    - - LEFT - on - - SW 4th Ave - - - 88 feet - - -
    -
    -
    -
    -
    -
    -
    - - - - - - - - - -
    -
    -
    - - Ride 0.3 miles to - - 205 SW Pine St, Portland, OR, USA 97204 - - -
    -
    - - CONTINUE - on - - SW 4th Ave - - - 0.2 miles - - -
    -
    - - RIGHT - on - - SW Pine St - - - 456 feet - - -
    -
    -
    -
    -
    -`; - -exports[`Storyshots PrintableItinerary E Scooter Rental Transit Itinerary 1`] = ` - - - -`; - -exports[`Storyshots PrintableItinerary E Scooter Rental Transit Itinerary 2`] = ` -.c16 { - font-weight: 200; -} - -.c7 { - font-weight: inherit; -} - -.c12 { - font-weight: 500; -} - -.c13 { - font-weight: 200; - opacity: 0.8975; - padding-left: 1ch; -} - -.c0 { - margin-bottom: 10px; - border-top: 1px solid grey; - padding-top: 18px; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; -} - -.c1 { - border-top: none; - padding-top: 0; -} - -.c2 { - margin-left: 10px; -} - -.c9 { - font-size: 14px; - margin-top: 3px; -} - -.c8 { - margin-top: 5px; -} - -.c3 { - font-size: 18px; -} - -.c6 { - font-size: 18px; -} - -.c4 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-flex-direction: column; - -ms-flex-direction: column; - flex-direction: column; - height: 100%; - min-width: 70px; -} - -.c10 .c11 { - font-weight: bold; -} - -.c14 { - font-weight: bold; -} - -.c14 .c15 { - font-weight: normal; -} - -.c5 { - float: left; - width: 32px; - height: 32px; -} - -
    -
    -
    -
    - - Depart - - from - - 2943 SE Washington St, Portland, OR, USA 97214 - -
    -
    -
    -
    -
    -
    - - - -
    -
    -
    - - Walk 0.4 miles to - - Shared E-scooter - - -
    -
    - - Head - SOUTH - on - - SE 30th Ave - - - 0.2 miles - - -
    -
    - - RIGHT - on - - SE Belmont St - - - 330 feet - - -
    -
    - - LEFT - on - - SE 29th Ave - - - 511 feet - - -
    -
    - - RIGHT - on - - SE Taylor St - - - 235 feet - - -
    -
    -
    -
    -
    -
    -
    - - - - - - - - - - -
    -
    -
    - - Ride 1.4 miles to - - NE Broadway - - -
    -
    - - CONTINUE - on - - SE Taylor St - - - 26 feet - - -
    -
    - - RIGHT - on - - SE 28th Ave - - - 0.6 miles - - -
    -
    - - CONTINUE - on - - NE 28th Ave - - - 0.7 miles - - -
    -
    - - SLIGHTLY_RIGHT - on - - NE Halsey St - - - 17 feet - - -
    -
    - - RIGHT - on - - NE Halsey St - - - 59 feet - - -
    -
    - - SLIGHTLY_LEFT - on - - NE 28th Ave - - - 28 feet - - -
    -
    - - SLIGHTLY_LEFT - on - - NE 28th Ave - - - 489 feet - - -
    -
    - - RIGHT - on - - NE Broadway - - - 86 feet - - -
    -
    -
    -
    -
    -
    -
    - - - -
    -
    -
    - - Walk to - - NE Broadway & 28th - - -
    -
    - - RIGHT - on - - street transit link - - -
    -
    -
    -
    -
    -
    -
    - - - -
    -
    -
    -
    - - 70 - - - - 12th/NE 33rd Ave - - to - - NE Sunderland - -
    -
    -
    - Board at - - NE Broadway & 28th - - (638) at - - 4:08 PM - -
    -
    - Get off at - - NE 33rd & Shaver - - (7393) at - - 4:17 PM - -
    -
    -
    -
    -
    -
    -
    - - - -
    -
    -
    - - Walk 0.4 miles to - - Shared E-scooter - - -
    -
    - - Head - NORTH - on - - NE 33rd Ave - - - 33 feet - - -
    -
    - - RIGHT - on - - NE Shaver St - - - 0.3 miles - - -
    -
    - - LEFT - on - - NE 38th Ave - - - 332 feet - - -
    -
    -
    -
    -
    -
    -
    - - - - - - - - - - -
    -
    -
    - - Ride 1 mile to - - 5112 NE 47th Pl, Portland, OR, USA 97218 - - -
    -
    - - CONTINUE - on - - NE 38th Ave - - - 355 feet - - -
    -
    - - RIGHT - on - - NE Skidmore St - - - 0.2 miles - - -
    -
    - - LEFT - on - - NE 42nd Ave - - - 0.4 miles - - -
    -
    - - RIGHT - on - - NE Alberta St - - - 0.3 miles - - -
    -
    - - LEFT - on - - NE 47th Pl - - - 313 feet - - -
    -
    -
    -
    -
    -`; - -exports[`Storyshots PrintableItinerary OTP 2 Scooter Itinerary 1`] = ` - - - -`; - -exports[`Storyshots PrintableItinerary OTP 2 Scooter Itinerary 2`] = ` -.c7 { - font-weight: inherit; -} - -.c12 { - font-weight: 500; -} - -.c13 { - font-weight: 200; - opacity: 0.8975; - padding-left: 1ch; -} - -.c0 { - margin-bottom: 10px; - border-top: 1px solid grey; - padding-top: 18px; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; -} - -.c1 { - border-top: none; - padding-top: 0; -} - -.c2 { - margin-left: 10px; -} - -.c9 { - font-size: 14px; - margin-top: 3px; -} - -.c8 { - margin-top: 5px; -} - -.c3 { - font-size: 18px; -} - -.c6 { - font-size: 18px; -} - -.c4 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-flex-direction: column; - -ms-flex-direction: column; - flex-direction: column; - height: 100%; - min-width: 70px; -} - -.c10 .c11 { - font-weight: bold; -} - -.c5 { - float: left; - width: 32px; - height: 32px; -} - -
    -
    -
    -
    - - Depart - - from - - 300 Courtland St NE, Atlanta, GA 30303-12ND, United States - -
    -
    -
    -
    -
    -
    - - - - -
    -
    -
    - - Walk 0.2 miles to - - Razor Vehicle - - -
    -
    - - Head - SOUTH - on - - Courtland Street Northeast - - - 172 feet - - -
    -
    - - RIGHT - on - - Unnamed Path - - - 0.1 miles - - -
    -
    - - LEFT - on - - Peachtree Center Avenue Northeast - - - 140 feet - - -
    -
    -
    -
    -
    -
    -
    - - - -
    -
    -
    - - Ride 1 mile to - - 126 Mitchell St SW, Atlanta, GA 30303-3524, United States - - -
    -
    - - HARD_RIGHT - on - - Peachtree Center Avenue Northeast - - - 12 feet - - -
    -
    - - LEFT - on - - service road - - - 10 feet - - -
    -
    - - LEFT - on - - Peachtree Center Cycle Track - - - 0.5 miles - - -
    -
    - - RIGHT - on - - Edgewood Avenue Northeast - - - 0.1 miles - - -
    -
    - - LEFT - on - - Pryor Street Southwest - - - 269 feet - - -
    -
    - - CONTINUE - on - - Pryor Street - - - 518 feet - - -
    -
    - - CONTINUE - on - - Pryor Street Southwest - - - 0.2 miles - - -
    -
    - - RIGHT - on - - Unnamed Path - - - 19 feet - - -
    -
    - - RIGHT - on - - sidewalk - - - 22 feet - - -
    -
    -
    -
    -
    -`; - -exports[`Storyshots PrintableItinerary OTP 24 Itinerary 1`] = ` - - - -`; - -exports[`Storyshots PrintableItinerary OTP 24 Itinerary 2`] = ` -.c16 { - font-weight: 200; -} - -.c7 { - font-weight: inherit; -} - -.c12 { - font-weight: 500; -} - -.c13 { - font-weight: 200; - opacity: 0.8975; - padding-left: 1ch; -} - -.c0 { - margin-bottom: 10px; - border-top: 1px solid grey; - padding-top: 18px; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; -} - -.c1 { - border-top: none; - padding-top: 0; -} - -.c2 { - margin-left: 10px; -} - -.c9 { - font-size: 14px; - margin-top: 3px; -} - -.c8 { - margin-top: 5px; -} - -.c3 { - font-size: 18px; -} - -.c6 { - font-size: 18px; -} - -.c4 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-flex-direction: column; - -ms-flex-direction: column; - flex-direction: column; - height: 100%; - min-width: 70px; -} - -.c10 .c11 { - font-weight: bold; -} - -.c14 { - font-weight: bold; -} - -.c14 .c15 { - font-weight: normal; -} - -.c5 { - float: left; - width: 32px; - height: 32px; -} - -
    -
    -
    -
    - - Depart - - from - - 1375 NE Cherry Lane, Hillsboro - -
    -
    -
    -
    -
    -
    - - - -
    -
    -
    - - Walk 0.9 miles to - - Orenco MAX Station - - -
    -
    - - Head - NORTHEAST - on - - parking aisle - - - 212 feet - - -
    -
    - - LEFT - on - - Northeast Cherry Lane - - - 342 feet - - -
    -
    - - LEFT - on - - Northeast Cherry Drive - - - 0.7 miles - - -
    -
    - - LEFT - on - - Northeast Century Boulevard - - - 332 feet - - -
    -
    - - RIGHT - on - - Northeast Century Boulevard (path) - - - 26 feet - - -
    -
    - - CONTINUE - on - - Unnamed Path - - - 204 feet - - -
    -
    - - CONTINUE - on - - Orenco - - - 98 feet - - -
    -
    -
    -
    -
    -
    -
    - - - -
    -
    -
    -
    - - - - MAX Blue Line - - to - - Gresham - -
    -
    -
    - Board at - - Orenco MAX Station - - (9835) at - - 8:15 AM - -
    -
    - Get off at - - Providence Park MAX Station - - (9758) at - - 8:49 AM - -
    -
    -
    -
    -
    -
    -
    - - - -
    -
    -
    - - Walk 0.2 miles to - - W Burnside & SW 18th - - -
    -
    - - Head - EAST - on - - Providence Park - - - 81 feet - - -
    -
    - - LEFT - on - - Unnamed Path - - - 19 feet - - -
    -
    - - RIGHT - on - - Unnamed Path - - - 19 feet - - -
    -
    - - LEFT - on - - Southwest 17th Avenue - - - 0.1 miles - - -
    -
    - - LEFT - on - - West Burnside Street - - - 276 feet - - -
    -
    -
    -
    -
    -
    -
    - - - -
    -
    -
    -
    - - 20 - - - - Burnside/Stark - - to - - Gresham TC - -
    -
    -
    - Board at - - W Burnside & SW 18th - - (9860) at - - 8:57 AM - -
    -
    - Get off at - - E Burnside & SE 94th - - (822) at - - 9:25 AM - -
    -
    -
    -
    -
    -
    -
    - - - -
    -
    -
    - - Walk 0.5 miles to - - 766 NE 94th Avenue, Portland - - -
    -
    - - Head - WEST - on - - East Burnside Street (sidewalk) - - - 79 feet - - -
    -
    - - RIGHT - on - - Southeast 94th Avenue - - - 28 feet - - -
    -
    - - CONTINUE - on - - Northeast 94th Avenue - - - 0.4 miles - - -
    -
    - - RIGHT - on - - Northeast Oregon Street - - - 107 feet - - -
    -
    -
    -
    -
    -`; - -exports[`Storyshots PrintableItinerary Park And Ride Itinerary 1`] = ` - - - -`; - -exports[`Storyshots PrintableItinerary Park And Ride Itinerary 2`] = ` -.c16 { - font-weight: 200; -} - -.c7 { - font-weight: inherit; -} - -.c12 { - font-weight: 500; -} - -.c13 { - font-weight: 200; - opacity: 0.8975; - padding-left: 1ch; -} - -.c0 { - margin-bottom: 10px; - border-top: 1px solid grey; - padding-top: 18px; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; -} - -.c1 { - border-top: none; - padding-top: 0; -} - -.c2 { - margin-left: 10px; -} - -.c9 { - font-size: 14px; - margin-top: 3px; -} - -.c8 { - margin-top: 5px; -} - -.c3 { - font-size: 18px; -} - -.c6 { - font-size: 18px; -} - -.c4 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-flex-direction: column; - -ms-flex-direction: column; - flex-direction: column; - height: 100%; - min-width: 70px; -} - -.c10 .c11 { - font-weight: bold; -} - -.c14 { - font-weight: bold; -} - -.c14 .c15 { - font-weight: normal; -} - -.c5 { - float: left; - width: 32px; - height: 32px; -} - -
    -
    -
    -
    - - Depart - - from - - 330 SW Murray Blvd, Washington County, OR, USA 97005 - -
    -
    -
    -
    -
    -
    - - - - -
    -
    -
    - - Drive 2.4 miles to - - P+R Sunset TC - - -
    -
    - - Head - SOUTHWEST - on - - parking aisle - - - 158 feet - - -
    -
    - - RIGHT - on - - SW Murray Blvd - - - 0.2 miles - - -
    -
    - - CONTINUE - on - - NW Murray Blvd - - - 150 feet - - -
    -
    - - SLIGHTLY_RIGHT - on - - NW Murray Blvd - - - 0.4 miles - - -
    -
    - - CONTINUE - on - - NW Sunset Hwy - - - 0.6 miles - - -
    -
    - - CONTINUE - on - - NW Sunset Hwy - - - 0.3 miles - - -
    -
    - - LEFT - on - - SW Cedar Hills Blvd - - - 0.2 miles - - -
    -
    - - RIGHT - on - - SW Barnes Rd - - - 0.5 miles - - -
    -
    - - RIGHT - on - - service road - - - 0.2 miles - - -
    -
    - - RIGHT - on - - Sunset TC - - - 76 feet - - -
    -
    -
    -
    -
    -
    -
    - - - -
    -
    -
    - - Walk 426 feet to - - Sunset TC MAX Station - - -
    -
    - - SLIGHTLY_RIGHT - on - - Unnamed Path - - - 16 feet - - -
    -
    - - LEFT - on - - steps - - - 232 feet - - -
    -
    - - LEFT - on - - Unnamed Path - - - 19 feet - - -
    -
    - - RIGHT - on - - Sunset TC (path) - - - 159 feet - - -
    -
    -
    -
    -
    -
    -
    - - - -
    -
    -
    -
    - - MAX Blue Line - - - - MAX Blue Line - - to - - Gresham - -
    -
    -
    - Board at - - Sunset TC MAX Station - - (2600) at - - 4:05 PM - -
    -
    - Get off at - - Oak/ SW 1st Ave MAX Station - - (8337) at - - 4:27 PM - -
    -
    -
    -
    -
    -
    -
    - - - -
    -
    -
    - - Walk 0.1 miles to - - 205 SW Pine St, Portland, OR, USA 97204 - - -
    -
    - - Head - NORTHEAST - on - - Oak/SW 1st Ave (path) - - - 13 feet - - -
    -
    - - CONTINUE - on - - Unnamed Path - - - 27 feet - - -
    -
    - - LEFT - on - - SW Oak St - - - 37 feet - - -
    -
    - - RIGHT - on - - SW 1st Ave - - - 260 feet - - -
    -
    - - LEFT - on - - SW Pine St - - - 337 feet - - -
    -
    -
    -
    -
    -`; - -exports[`Storyshots PrintableItinerary Styled Walk Transit Walk Itinerary 1`] = ` - - - -`; - -exports[`Storyshots PrintableItinerary Styled Walk Transit Walk Itinerary 2`] = ` -.c18 { - font-weight: 200; -} - -.c9 { - font-weight: inherit; -} - -.c14 { - font-weight: 500; -} - -.c15 { - font-weight: 200; - opacity: 0.8975; - padding-left: 1ch; -} - -.c1 { - margin-bottom: 10px; - border-top: 1px solid grey; - padding-top: 18px; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; -} - -.c2 { - border-top: none; - padding-top: 0; -} - -.c4 { - margin-left: 10px; -} - -.c11 { - font-size: 14px; - margin-top: 3px; -} - -.c10 { - margin-top: 5px; -} - -.c5 { - font-size: 18px; -} - -.c8 { - font-size: 18px; -} - -.c6 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-flex-direction: column; - -ms-flex-direction: column; - flex-direction: column; - height: 100%; - min-width: 70px; -} - -.c12 .c13 { - font-weight: bold; -} - -.c16 { - font-weight: bold; -} - -.c16 .c17 { - font-weight: normal; -} - -.c7 { - float: left; - width: 32px; - height: 32px; -} - -.c0 .c3 { - background-color: pink; -} - -
    -
    -
    -
    - - Depart - - from - - KGW Studio on the Sq, Portland, OR, USA - -
    -
    -
    -
    -
    -
    - - - -
    -
    -
    - - Walk 269 feet to - - Pioneer Square North MAX Station - - -
    -
    - - Head - NORTHWEST - on - - Unnamed Path - - - 167 feet - - -
    -
    - - LEFT - on - - Pioneer Sq N (path) - - - 101 feet - - -
    -
    -
    -
    -
    -
    -
    - - - -
    -
    -
    -
    - - MAX Blue Line - - - - MAX Blue Line - - to - - Hillsboro - -
    -
    -
    - Board at - - Pioneer Square North MAX Station - - (8383) at - - 3:46 PM - -
    -
    - Get off at - - Providence Park MAX Station - - (9757) at - - 3:49 PM - -
    -
    -
    -
    -
    -
    -
    - - - -
    -
    -
    - - Walk 249 feet to - - 1737 SW Morrison St, Portland, OR, USA 97205 - - -
    -
    - - Head - WEST - on - - Providence Park (path) - - - 19 feet - - -
    -
    - - RIGHT - on - - Unnamed Path - - - 104 feet - - -
    -
    - - RIGHT - on - - Unnamed Path - - - 27 feet - - -
    -
    - - RIGHT - on - - SW Morrison St - - - 99 feet - - -
    -
    -
    -
    -
    -`; - -exports[`Storyshots PrintableItinerary Tnc Transit Itinerary 1`] = ` - - - -`; - -exports[`Storyshots PrintableItinerary Tnc Transit Itinerary 2`] = ` -.c9 { - font-weight: inherit; -} - -.c0 { - margin-bottom: 10px; - border-top: 1px solid grey; - padding-top: 18px; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; -} - -.c1 { - border-top: none; - padding-top: 0; -} - -.c2 { - margin-left: 10px; -} - -.c7 { - font-size: 14px; - margin-top: 3px; -} - -.c6 { - margin-top: 5px; -} - -.c3 { - font-size: 18px; -} - -.c8 { - font-size: 18px; -} - -.c4 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-flex-direction: column; - -ms-flex-direction: column; - flex-direction: column; - height: 100%; - min-width: 70px; -} - -.c10 { - font-weight: bold; -} - -.c5 { - float: left; - width: 32px; - height: 32px; -} - -
    -
    -
    -
    - - Depart - - from - - 128 NW 12th Ave, Portland - -
    -
    -
    -
    -
    -
    - - - - - - -
    -
    -
    -
    - - Take - - to - - West Burnside Street - -
    -
    -
    - Estimated wait time for pickup: - - 4 min - -
    -
    - Estimated travel time: - - 2 min - - (does not account for traffic) -
    -
    -
    -
    -
    -
    -
    - - - -
    -
    -
    - - Walk to - - W Burnside & SW 6th - - -
    -
    -
    -
    -
    -
    - - - -
    -
    -
    -
    - - 20 - - - - Burnside/Stark - -
    -
    -
    - Board at - - W Burnside & SW 6th - - () at - - 11:02 AM - -
    -
    - Get off at - - E Burnside & SE 12th - - () at - - 11:08 AM - -
    -
    -
    -
    -
    -
    -
    - - - -
    -
    -
    - - Walk to - - East Burnside Street - - -
    -
    -
    -
    -
    -
    - - - - - - -
    -
    -
    -
    - - Take - - to - - 407 NE 12th Ave, Portland - -
    -
    -
    - Estimated wait time for pickup: - - 2 min - -
    -
    - Estimated travel time: - - 1 min - - (does not account for traffic) -
    -
    -
    -
    -
    -`; - -exports[`Storyshots PrintableItinerary Walk Interlined Transit Itinerary 1`] = ` - - - -`; - -exports[`Storyshots PrintableItinerary Walk Interlined Transit Itinerary 2`] = ` -.c7 { - font-weight: inherit; -} - -.c12 { - font-weight: 500; -} - -.c13 { - font-weight: 200; - opacity: 0.8975; - padding-left: 1ch; -} - -.c0 { - margin-bottom: 10px; - border-top: 1px solid grey; - padding-top: 18px; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; -} - -.c1 { - border-top: none; - padding-top: 0; -} - -.c2 { - margin-left: 10px; -} - -.c9 { - font-size: 14px; - margin-top: 3px; -} - -.c8 { - margin-top: 5px; -} - -.c3 { - font-size: 18px; -} - -.c6 { - font-size: 18px; -} - -.c4 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-flex-direction: column; - -ms-flex-direction: column; - flex-direction: column; - height: 100%; - min-width: 70px; -} - -.c10 .c11 { - font-weight: bold; -} - -.c14 { - font-weight: bold; -} - -.c5 { - float: left; - width: 32px; - height: 32px; -} - -
    -
    -
    -
    - - Depart - - from - - 47.97767, -122.20034 - -
    -
    -
    -
    -
    -
    - - - -
    -
    -
    - - Walk 0.3 miles to - - Everett Station Bay C1 - - -
    -
    - - Head - SOUTH - on - - service road - - - 0.1 miles - - -
    -
    - - RIGHT - on - - Smith Avenue - - - 129 feet - - -
    -
    - - CONTINUE - on - - Paine Avenue - - - 61 feet - - -
    -
    - - LEFT - on - - 32nd Street - - - 67 feet - - -
    -
    - - RIGHT - on - - 32nd Street - - - 313 feet - - -
    -
    - - LEFT - on - - Unnamed Path - - - 380 feet - - -
    -
    -
    -
    -
    -
    -
    - - - -
    -
    -
    -
    - - 512 - - - - Northgate Station - -
    -
    -
    - Board at - - Everett Station Bay C1 - - (2345) at - - 1:04 PM - -
    -
    - Get off at - - Northgate Station - - (2191) at - - 1:51 PM - -
    -
    -
    -
    -
    -
    -
    - - - -
    -
    -
    - - Walk to - - Northgate Station - Bay 4 - - -
    -
    -
    -
    -
    -
    - - - -
    -
    -
    -
    - - 40 - - - - Downtown Seattle Ballard - -
    -
    -
    - Board at - - Northgate Station - Bay 4 - - (35318) at - - 1:55 PM - -
    -
    - Get off at - - N 105th St & Aurora Ave N - - (40032) at - - 2:06 PM - -
    -
    -
    -
    -
    -
    -
    - - - -
    -
    -
    - - Walk 259 feet to - - Aurora Ave N & N 105th St - - -
    -
    - - Head - EAST - on - - North 105th Street - - - 64 feet - - -
    -
    - - RIGHT - on - - service road - - - 14 feet - - -
    -
    - - LEFT - on - - Unnamed Path - - - 180 feet - - -
    -
    -
    -
    -
    -
    -
    - - - -
    -
    -
    -
    - - E Line - - - - Downtown Seattle - -
    -
    -
    - Board at - - Aurora Ave N & N 105th St - - (7080) at - - 2:07 PM - -
    -
    - Get off at - - 3rd Ave & Cherry St - - (490) at - - 2:39 PM - -
    -
    -
    -
    -
    -
    -
    - - - -
    -
    -
    - - Walk 443 feet to - - 208 James St, Seattle, WA 98104-2212, United States - - -
    -
    - - Head - SOUTHEAST - on - - sidewalk - - - 326 feet - - -
    -
    - - UTURN_RIGHT - on - - sidewalk - - - 117 feet - - -
    -
    -
    -
    -
    -`; - -exports[`Storyshots PrintableItinerary Walk Only Itinerary 1`] = ` - - - -`; - -exports[`Storyshots PrintableItinerary Walk Only Itinerary 2`] = ` -.c7 { - font-weight: inherit; -} - -.c12 { - font-weight: 500; -} - -.c0 { - margin-bottom: 10px; - border-top: 1px solid grey; - padding-top: 18px; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; -} - -.c1 { - border-top: none; - padding-top: 0; -} - -.c2 { - margin-left: 10px; -} - -.c9 { - font-size: 14px; - margin-top: 3px; -} - -.c8 { - margin-top: 5px; -} - -.c3 { - font-size: 18px; -} - -.c6 { - font-size: 18px; -} - -.c4 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-flex-direction: column; - -ms-flex-direction: column; - flex-direction: column; - height: 100%; - min-width: 70px; -} - -.c10 .c11 { - font-weight: bold; -} - -.c5 { - float: left; - width: 32px; - height: 32px; -} - -
    -
    -
    -
    - - Depart - - from - - KGW Studio on the Sq, Portland, OR, USA - -
    -
    -
    -
    -
    -
    - - - -
    -
    -
    - - Walk 166 feet to - - 701 SW 6th Ave, Portland, OR, USA 97204 - - -
    -
    - - Head - NORTHWEST - on - - Unnamed Path - - -
    -
    - - LEFT - on - - Unnamed Path - - -
    -
    -
    -
    -
    -`; - -exports[`Storyshots PrintableItinerary Walk Transit Transfer Itinerary 1`] = ` - - - -`; - -exports[`Storyshots PrintableItinerary Walk Transit Transfer Itinerary 2`] = ` -.c16 { - font-weight: 200; -} - -.c7 { - font-weight: inherit; -} - -.c12 { - font-weight: 500; -} - -.c13 { - font-weight: 200; - opacity: 0.8975; - padding-left: 1ch; -} - -.c0 { - margin-bottom: 10px; - border-top: 1px solid grey; - padding-top: 18px; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; -} - -.c1 { - border-top: none; - padding-top: 0; -} - -.c2 { - margin-left: 10px; -} - -.c9 { - font-size: 14px; - margin-top: 3px; -} - -.c8 { - margin-top: 5px; -} - -.c3 { - font-size: 18px; -} - -.c6 { - font-size: 18px; -} - -.c4 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-flex-direction: column; - -ms-flex-direction: column; - flex-direction: column; - height: 100%; - min-width: 70px; -} - -.c10 .c11 { - font-weight: bold; -} - -.c14 { - font-weight: bold; -} - -.c14 .c15 { - font-weight: normal; -} - -.c5 { - float: left; - width: 32px; - height: 32px; -} - -
    -
    -
    -
    - - Depart - - from - - 3940 SE Brooklyn St, Portland, OR, USA 97202 - -
    -
    -
    -
    -
    -
    - - - -
    -
    -
    - - Walk 238 feet to - - SE Cesar Chavez Blvd & Brooklyn (long address that spans multiple lines) - - -
    -
    - - Head - WEST - on - - SE Brooklyn St - - - 205 feet - - -
    -
    - - RIGHT - on - - SE Cesar E. Chavez Blvd - - - 33 feet - - -
    -
    -
    -
    -
    -
    -
    - - - -
    -
    -
    -
    - - 755X - - - - Cesar Chavez/Lombard (very long route name) - - to - - St. Johns via NAYA - -
    -
    -
    - Board at - - SE Cesar Chavez Blvd & Brooklyn - - (7439) at - - 3:47 PM - -
    -
    - Get off at - - SE Cesar Chavez Blvd & Hawthorne - - (7459) at - - 3:52 PM - -
    -
    -
    -
    -
    -
    -
    - - - -
    -
    -
    - - Walk 440 feet to - - SE Hawthorne & Cesar Chavez Blvd - - -
    -
    - - Head - SOUTH - on - - service road - - - 146 feet - - -
    -
    - - RIGHT - on - - SE Cesar E. Chavez Blvd - - - 198 feet - - -
    -
    - - LEFT - on - - SE Hawthorne Blvd - - - 96 feet - - -
    -
    -
    -
    -
    -
    -
    - - - -
    -
    -
    -
    - - 1 - - - - Hawthorne - - to - - Portland - -
    -
    -
    - Board at - - SE Hawthorne & Cesar Chavez Blvd - - (2626) at - - 4:00 PM - -
    -
    - Get off at - - SE Hawthorne & 27th - - (2613) at - - 4:04 PM - -
    -
    -
    -
    -
    -
    -
    - - - -
    -
    -
    - - Walk 479 feet to - - 1415 SE 28th Ave, Portland, OR, USA 97214 - - -
    -
    - - Head - WEST - on - - SE Hawthorne Blvd - - - 40 feet - - -
    -
    - - RIGHT - on - - SE 27th Ave - - - 294 feet - - -
    -
    - - RIGHT - on - - SE Madison St - - - 146 feet - - -
    -
    -
    -
    -
    -`; - -exports[`Storyshots PrintableItinerary Walk Transit Transfer With A 11 Y Itinerary 1`] = ` - - - -`; - -exports[`Storyshots PrintableItinerary Walk Transit Transfer With A 11 Y Itinerary 2`] = ` -.c8 { - display: inline-block; - vertical-align: middle; - overflow: hidden; -} - -.c7 { - display: inline-block; - grid-row-start: 2; - grid-column-start: 1; - height: 0; - overflow: hidden; - width: 0; -} - -.c20 { - font-weight: 200; -} - -.c11 { - font-weight: inherit; -} - -.c16 { - font-weight: 500; -} - -.c17 { - font-weight: 200; - opacity: 0.8975; - padding-left: 1ch; -} - -.c6 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - border: 1px solid #333; - background-color: transparent; - border-radius: 20px; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-box-pack: justify; - -webkit-justify-content: space-between; - -ms-flex-pack: justify; - justify-content: space-between; - margin-top: 0.25em; - max-width: 75px; - height: 30px; - padding: 0.25em 0.6em 0.25em 0.4em; - word-wrap: anywhere; -} - -.c9 { - -webkit-flex: 1; - -ms-flex: 1; - flex: 1; -} - -.c9 span { - display: block; -} - -.c0 { - margin-bottom: 10px; - border-top: 1px solid grey; - padding-top: 18px; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; -} - -.c1 { - border-top: none; - padding-top: 0; -} - -.c2 { - margin-left: 10px; -} - -.c13 { - font-size: 14px; - margin-top: 3px; -} - -.c12 { - margin-top: 5px; -} - -.c3 { - font-size: 18px; -} - -.c10 { - font-size: 18px; -} - -.c4 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-flex-direction: column; - -ms-flex-direction: column; - flex-direction: column; - height: 100%; - min-width: 70px; -} - -.c14 .c15 { - font-weight: bold; -} - -.c18 { - font-weight: bold; -} - -.c18 .c19 { - font-weight: normal; -} - -.c5 { - float: left; - width: 32px; - height: 32px; -} - -
    -
    -
    -
    - - Depart - - from - - 3940 SE Brooklyn St, Portland, OR, USA 97202 - -
    -
    -
    -
    -
    -
    - - - -
    -
    - - otpUi.ItineraryBody.tripAccessibility.itineraryAccessibilityotpUi.ItineraryBody.tripAccessibility.likelyAccessible - - - - ✅ - -
    -
    -
    - - Walk 238 feet to - - SE Cesar Chavez Blvd & Brooklyn (long address that spans multiple lines) - - -
    -
    - - Head - WEST - on - - SE Brooklyn St - - - 205 feet - - -
    -
    - - RIGHT - on - - SE Cesar E. Chavez Blvd - - - 33 feet - - -
    -
    -
    -
    -
    -
    -
    - - - -
    -
    - - otpUi.ItineraryBody.tripAccessibility.itineraryAccessibilityotpUi.ItineraryBody.tripAccessibility.unclear - - - - ？ - -
    -
    -
    -
    - - 755X - - - - Cesar Chavez/Lombard (very long route name) - - to - - St. Johns via NAYA - -
    -
    -
    - Board at - - SE Cesar Chavez Blvd & Brooklyn - - (7439) at - - 3:47 PM - -
    -
    - Get off at - - SE Cesar Chavez Blvd & Hawthorne - - (7459) at - - 3:52 PM - -
    -
    -
    -
    -
    -
    -
    - - - -
    -
    -
    - - Walk 440 feet to - - SE Hawthorne & Cesar Chavez Blvd - - -
    -
    - - Head - SOUTH - on - - service road - - - 146 feet - - -
    -
    - - RIGHT - on - - SE Cesar E. Chavez Blvd - - - 198 feet - - -
    -
    - - LEFT - on - - SE Hawthorne Blvd - - - 96 feet - - -
    -
    -
    -
    -
    -
    -
    - - - -
    -
    - - otpUi.ItineraryBody.tripAccessibility.itineraryAccessibilityotpUi.ItineraryBody.tripAccessibility.inaccessible - - - - ❌ - -
    -
    -
    -
    - - 1 - - - - Hawthorne - - to - - Portland - -
    -
    -
    - Board at - - SE Hawthorne & Cesar Chavez Blvd - - (2626) at - - 4:00 PM - -
    -
    - Get off at - - SE Hawthorne & 27th - - (2613) at - - 4:04 PM - -
    -
    -
    -
    -
    -
    -
    - - - -
    -
    - - otpUi.ItineraryBody.tripAccessibility.itineraryAccessibilityotpUi.ItineraryBody.tripAccessibility.inaccessible - - - - ❌ - -
    -
    -
    - - Walk 479 feet to - - 1415 SE 28th Ave, Portland, OR, USA 97214 - - -
    -
    - - Head - WEST - on - - SE Hawthorne Blvd - - - 40 feet - - -
    -
    - - RIGHT - on - - SE 27th Ave - - - 294 feet - - -
    -
    - - RIGHT - on - - SE Madison St - - - 146 feet - - -
    -
    -
    -
    -
    -`; - -exports[`Storyshots PrintableItinerary Walk Transit Walk Itinerary 1`] = ` - - - -`; - -exports[`Storyshots PrintableItinerary Walk Transit Walk Itinerary 2`] = ` -.c16 { - font-weight: 200; -} - -.c7 { - font-weight: inherit; -} - -.c12 { - font-weight: 500; -} - -.c13 { - font-weight: 200; - opacity: 0.8975; - padding-left: 1ch; -} - -.c0 { - margin-bottom: 10px; - border-top: 1px solid grey; - padding-top: 18px; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; -} - -.c1 { - border-top: none; - padding-top: 0; -} - -.c2 { - margin-left: 10px; -} - -.c9 { - font-size: 14px; - margin-top: 3px; -} - -.c8 { - margin-top: 5px; -} - -.c3 { - font-size: 18px; -} - -.c6 { - font-size: 18px; -} - -.c4 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-flex-direction: column; - -ms-flex-direction: column; - flex-direction: column; - height: 100%; - min-width: 70px; -} - -.c10 .c11 { - font-weight: bold; -} - -.c14 { - font-weight: bold; -} - -.c14 .c15 { - font-weight: normal; -} - -.c5 { - float: left; - width: 32px; - height: 32px; -} - -
    -
    -
    -
    - - Depart - - from - - KGW Studio on the Sq, Portland, OR, USA - -
    -
    -
    -
    -
    -
    - - - -
    -
    -
    - - Walk 269 feet to - - Pioneer Square North MAX Station - - -
    -
    - - Head - NORTHWEST - on - - Unnamed Path - - - 167 feet - - -
    -
    - - LEFT - on - - Pioneer Sq N (path) - - - 101 feet - - -
    -
    -
    -
    -
    -
    -
    - - - -
    -
    -
    -
    - - MAX Blue Line - - - - MAX Blue Line - - to - - Hillsboro - -
    -
    -
    - Board at - - Pioneer Square North MAX Station - - (8383) at - - 3:46 PM - -
    -
    - Get off at - - Providence Park MAX Station - - (9757) at - - 3:49 PM - -
    -
    -
    -
    -
    -
    -
    - - - -
    -
    -
    - - Walk 249 feet to - - 1737 SW Morrison St, Portland, OR, USA 97205 - - -
    -
    - - Head - WEST - on - - Providence Park (path) - - - 19 feet - - -
    -
    - - RIGHT - on - - Unnamed Path - - - 104 feet - - -
    -
    - - RIGHT - on - - Unnamed Path - - - 27 feet - - -
    -
    - - RIGHT - on - - SW Morrison St - - - 99 feet - - -
    -
    -
    -
    -
    -`; - -exports[`Storyshots RouteViewerOverlay Default 1`] = ` - - - - - - - - - -`; - -exports[`Storyshots RouteViewerOverlay Default 2`] = ` -.c0 { - height: 90vh; -} - -
    -
    -
    -`; - -exports[`Storyshots RouteViewerOverlay Flex Route 1`] = ` - - - - - - - - - - - - - - -`; - -exports[`Storyshots RouteViewerOverlay Flex Route 2`] = ` -.c0 { - height: 90vh; -} - -
    -
    -
    -`; - -exports[`Storyshots RouteViewerOverlay Flex Route 2 1`] = ` - - - - - - - - - - - - - - -`; - -exports[`Storyshots RouteViewerOverlay Flex Route 2 2`] = ` -.c0 { - height: 90vh; -} - -
    -
    -
    -`; - -exports[`Storyshots RouteViewerOverlay Flex Route 3 1`] = ` - - - - - - + +`; + +exports[`Storyshots ItineraryBody/otp-react-redux Park And Ride Itinerary 2`] = ` +.c8 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c11 { + color: #333; +} + +.c65 { + color: #f44256; +} + +.c26 { + background: transparent; + border: 0; + color: inherit; + cursor: pointer; + font-size: inherit; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c41 { + color: #008; + margin-left: 5px; +} + +.c41:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c42 { + padding-left: 0px; +} + +.c42:before { + content: "|"; + color: black; + margin-right: 5px; +} + +.c31::before { + content: ""; + margin: 0 0.125em; +} + +.c60 { + display: block; + font-size: 13px; + list-style: none; + padding: 0; +} + +.c0 { + list-style: none; + padding: 0; +} + +.c21 { + color: #676767; + font-size: 13px; + padding-bottom: 12px; +} + +.c27 { + bottom: 0; + cursor: pointer; + left: 0; + position: absolute; + right: 0; + top: 0; + width: 100%; + z-index: 1; +} + +.c22 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + line-height: 16px; + min-height: 31px; + position: relative; +} + +.c19 { + display: inline-block; + grid-row-start: 2; + grid-column-start: 1; + height: 0; + overflow: hidden; + width: 0; +} + +.c47 { + font-weight: 200; +} + +.c25 { + font-weight: inherit; +} + +.c46 { + font-size: 13px; + font-weight: 500; +} + +.c45 { + font-weight: 800; + margin-right: 6px; +} + +.c43 { + color: #807373; + margin-top: 5px; +} + +.c24 img, +.c24 svg { + margin-right: 6px; + height: 24px; + width: 24px; + vertical-align: bottom; +} + +.c23 { + -webkit-flex-shrink: 0; + -ms-flex-negative: 0; + flex-shrink: 0; +} + +.c5 { + grid-column-start: 2; + grid-row: span 2; + padding-right: 5px; +} + +.c28 { + display: grid; + grid-template-columns: 130px auto; +} + +.c3 { + max-width: 500px; + display: grid; + grid-template-areas: "time line title" "time line instructions"; + grid-template-columns: 65px 30px auto; +} + +.c18 { + grid-column-start: 1; + grid-row: 1 / span 2; + padding-right: 5px; + font-size: 0.9em; +} + +.c20 { + grid-row-start: 2; + grid-column-start: 3; + grid-area: instructions; +} + +.c14 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + font-size: 1.2em; + grid-row-start: 1; + grid-column-start: 3; +} + +.c16 { + font-size: inherit; + font-weight: bold; + height: 1.2em; + margin: 0; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + -webkit-flex: 1 1 auto; + -ms-flex: 1 1 auto; + flex: 1 1 auto; + padding: 3px 0 10px 0; +} + +.c40 { + color: #807373; + font-size: 13px; + font-weight: 300; + padding-top: 1px; + margin-bottom: 10px; + margin-top: -14px; +} + +.c32 { + display: block; + list-style: none; + padding: 0; +} + +.c35 { + margin-left: 24px; + line-height: 1.25em; + padding-top: 1px; +} + +.c35 > span { + margin-right: 1ch; +} + +.c29 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-self: center; + -ms-flex-item-align: center; + align-self: center; + margin-top: 10px; +} + +.c29 a { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c30 { + color: #676767; + font-size: 13px; + font-style: normal; + padding: 0; +} + +.c34 { + fill: #676767; + float: left; + height: 16px; + width: 16px; +} + +.c33 { + font-size: 13px; + margin-top: 8px; + color: #676767; + font-style: normal; +} + +.c36 { + font-weight: 500; +} + +.c37 { + font-weight: 200; + opacity: 0.8975; + padding-left: 1ch; +} + +.c63 { + float: left; + margin-left: -36px; + color: #fff; +} + +.c64 { + color: #676767; + margin-top: 3px; +} + +.c61 { + z-index: 30; + position: relative; +} + +.c51 { + background-color: #eee; + border-radius: 4px; + color: #000; + display: block; + margin-top: 5px; + padding: 8px; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c55 { + -webkit-align-items: baseline; + -webkit-box-align: baseline; + -ms-flex-align: baseline; + align-items: baseline; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + gap: 5px; + margin-top: 0.5em; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c55:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c53 { + font-size: 12px; + margin-left: 30px; + white-space: pre-wrap; +} + +.c54 { + margin-top: 5px; + margin-left: 30px; + font-size: 12px; + font-style: italic; +} + +.c52 { + float: left; + font-size: 18px; +} + +.c50 { + display: block; + margin-top: 3px; + padding: 0; +} + +.c49 { + color: #d14727; + cursor: auto; + display: inline-block; + font-weight: 400; + margin-top: 8px; + padding: 0; +} + +.c56 { + margin-top: 5px; +} + +.c57 { + color: #676767; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; +} + +.c59 { + font-size: 14px; +} + +.c58 { + padding: 0; +} + +.c48 { + margin-top: 5px; +} + +.c48 a { + color: #337ab7; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c48 a:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c48 img { + margin-left: 5px; + vertical-align: middle; +} + +.c1 { + font-size: 16px; +} + +.c1 *:not(.fa) { + box-sizing: border-box; + font-family: Hind,sans-serif; +} + +.c1 .c44 { + background-color: rgb(15,106,172); + border-color: white; + border-image: initial; + border-radius: 12px; + border-style: solid; + border-width: 1px; + box-shadow: rgb(0,0,0) 0px 0px 0.25em; + color: white; + display: inline-block; + font-size: 14px; + font-weight: 500; + height: 24px; + line-height: 1.5; + margin-right: 8px; + min-width: 24px; + padding: 2px 3px; + text-align: center; +} + +.c1 .c4 { + grid-area: line; + display: table-cell; + max-width: 20px; + width: 20px; + padding: 0; + position: relative; +} + +.c1 .c13 { + grid-area: title; + color: #000; + font-size: 18px; + font-weight: 500; + line-height: 20px; +} + +.c1 .c15 { + height: inherit; + white-space: normal; +} + +.c1 .c2 { + width: 100%; +} + +.c1 .c62 { + margin-left: -23px; +} + +.c1 .c17 { + grid-area: time; + color: #676767; + display: table-cell; + font-size: 14px; + padding-right: 4px; + padding-top: 2px; + text-align: right; + vertical-align: top; + width: 60px; +} + +.c7 { + position: absolute; + width: 100%; + top: 3px; + z-index: 20; +} + +.c6 { + background: repeating-linear-gradient( 0deg,grey,grey 8px,white 8px,white 12.5px ); + left: 7.5px; + right: 7.5px; + bottom: -11px; + position: absolute; + top: 11px; + z-index: 10; +} + +.c38 { + background: radial-gradient(ellipse at center,#87cefa 40%,transparent 10%); + background-position: center -5px; + background-repeat: repeat-y; + background-size: 12px 12px; + left: 6px; + right: 6px; + bottom: -11px; + position: absolute; + top: 11px; + z-index: 10; +} + +.c39 { + background-color: gray; + left: 5px; + right: 5px; + background-color: #084C8D; + bottom: -11px; + position: absolute; + top: 11px; + z-index: 10; +} + +.c9 { + left: 0; + line-height: inherit; + position: absolute; + text-align: center; + width: 100%; +} + +.c10 { + top: 3px; +} + +.c12 { + left: 0; + position: absolute; + text-align: center; + width: 100%; +} + +
      +
    1. +
      +
      + + + + +
      +
      + + 330 SW Murray Blvd, Washington County, OR, USA 97005 + +
      +
      + 3:50 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + + + + + + + - + + + Drive 2.4 miles to + + P+R Sunset TC + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + SOUTHWEST + on + + parking aisle + + + 158 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + RIGHT + on + + SW Murray Blvd + + + 0.2 miles + + +
        +
        3. +
      3. +
        + + + +
        +
        + + CONTINUE + on + + NW Murray Blvd + + + 150 feet + + +
        +
        4. +
      4. +
        + + + +
        +
        + + SLIGHTLY_RIGHT + on + + NW Murray Blvd + + + 0.4 miles + + +
        +
        5. +
      5. +
        + + + +
        +
        + + CONTINUE + on + + NW Sunset Hwy + + + 0.6 miles + + +
        +
        6. +
      6. +
        + + + +
        +
        + + CONTINUE + on + + NW Sunset Hwy + + + 0.3 miles + + +
        +
        7. +
      7. +
        + + + +
        +
        + + LEFT + on + + SW Cedar Hills Blvd + + + 0.2 miles + + +
        +
        8. +
      8. +
        + + + +
        +
        + + RIGHT + on + + SW Barnes Rd + + + 0.5 miles + + +
        +
        9. +
      9. +
        + + + +
        +
        + + RIGHT + on + + service road + + + 0.2 miles + + +
        +
        10. +
      10. +
        + + + +
        +
        + + RIGHT + on + + Sunset TC + + + 76 feet + + +
        +
        11. +
      +
      +
      +       +
      +
      +
      2. +
    2. +
      +
      + + + +
      +
      + + P+R Sunset TC + +
      +
      + 4:02 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + + + + + + + + - + + + Walk 426 feet to + + Sunset TC MAX Station + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + SLIGHTLY_RIGHT + on + + Unnamed Path + + + 16 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + LEFT + on + + steps + + + 232 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + LEFT + on + + Unnamed Path + + + 19 feet + + +
        +
        4. +
      4. +
        + + + +
        +
        + + RIGHT + on + + Sunset TC (path) + + + 159 feet + + +
        +
        5. +
      +
      +
      +       +
      +
      +
      3. +
    3. +
      +
      + + + + +
      +
      + + Sunset TC MAX Station + +
      +
      + 4:05 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      + Stop ID 2600 + +
      +
      +
      + + + + - + Ride + + + + + + + + + + + + MAX Blue Line + + + + + MAX Blue Line + + to + + Gresham + + + + + - + Disembark at + Oak/ SW 1st Ave MAX Station + + + + +
      +
      +
      + Service operated by + + TriMet + + +
      +
      + + + 2 alerts +
      +
      +
      + +
      +
      +
      +
      + + +
      +
      +
      +
      +
        +
      1. +
        + • +
        +
        + Washington Park MAX Station +
        +
        2. +
      2. +
        + • +
        +
        + Goose Hollow/SW Jefferson St MAX Station +
        +
        3. +
      3. +
        + • +
        +
        + Kings Hill/SW Salmon St MAX Station +
        +
        4. +
      4. +
        + • +
        +
        + Providence Park MAX Station +
        +
        5. +
      5. +
        + • +
        +
        + Library/SW 9th Ave MAX Station +
        +
        6. +
      6. +
        + • +
        +
        + Pioneer Square South MAX Station +
        +
        7. +
      7. +
        + • +
        +
        + Mall/SW 4th Ave MAX Station +
        +
        8. +
      8. +
        + • +
        +
        + Yamhill District MAX Station +
        +
        9. +
      +
      +
      +
      +
      +
      +
      +
      +
      4. +
    4. +
      +
      + + + + +
      +
      + + Oak/ SW 1st Ave MAX Station + +
      +
      + 4:27 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      + Stop ID 8337 + +
      +
      +
      + + + + + + + + + + + - + + + Walk 0.1 miles to + + 205 SW Pine St, Portland, OR, USA 97204 + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + NORTHEAST + on + + Oak/SW 1st Ave (path) + + + 13 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + CONTINUE + on + + Unnamed Path + + + 27 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + LEFT + on + + SW Oak St + + + 37 feet + + +
        +
        4. +
      4. +
        + + + +
        +
        + + RIGHT + on + + SW 1st Ave + + + 260 feet + + +
        +
        5. +
      5. +
        + + + +
        +
        + + LEFT + on + + SW Pine St + + + 337 feet + + +
        +
        6. +
      +
      +
      +       +
      +
      +
      5. +
    5. +
      + + + + +
      +
      + + 205 SW Pine St, Portland, OR, USA 97204 + +
      +
      + 4:29 PM +
      + + Arrive at + 205 SW Pine St, Portland, OR, USA 97204 + +
      +
      6. +
    +`; + +exports[`Storyshots ItineraryBody/otp-react-redux Three Alerts Always Collapsing 1`] = ` + + + +`; + +exports[`Storyshots ItineraryBody/otp-react-redux Three Alerts Always Collapsing 2`] = ` +.c8 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c11 { + color: #333; +} + +.c64 { + color: #f44256; +} + +.c26 { + background: transparent; + border: 0; + color: inherit; + cursor: pointer; + font-size: inherit; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c40 { + color: #008; + margin-left: 5px; +} + +.c40:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c41 { + padding-left: 0px; +} + +.c41:before { + content: "|"; + color: black; + margin-right: 5px; +} + +.c31::before { + content: ""; + margin: 0 0.125em; +} + +.c59 { + display: block; + font-size: 13px; + list-style: none; + padding: 0; +} + +.c0 { + list-style: none; + padding: 0; +} + +.c21 { + color: #676767; + font-size: 13px; + padding-bottom: 12px; +} + +.c27 { + bottom: 0; + cursor: pointer; + left: 0; + position: absolute; + right: 0; + top: 0; + width: 100%; + z-index: 1; +} + +.c22 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + line-height: 16px; + min-height: 31px; + position: relative; +} + +.c19 { + display: inline-block; + grid-row-start: 2; + grid-column-start: 1; + height: 0; + overflow: hidden; + width: 0; +} + +.c46 { + font-weight: 200; +} + +.c25 { + font-weight: inherit; +} + +.c45 { + font-size: 13px; + font-weight: 500; +} + +.c44 { + font-weight: 800; + margin-right: 6px; +} + +.c42 { + color: #807373; + margin-top: 5px; +} + +.c24 img, +.c24 svg { + margin-right: 6px; + height: 24px; + width: 24px; + vertical-align: bottom; +} + +.c23 { + -webkit-flex-shrink: 0; + -ms-flex-negative: 0; + flex-shrink: 0; +} + +.c5 { + grid-column-start: 2; + grid-row: span 2; + padding-right: 5px; +} + +.c28 { + display: grid; + grid-template-columns: 130px auto; +} + +.c3 { + max-width: 500px; + display: grid; + grid-template-areas: "time line title" "time line instructions"; + grid-template-columns: 65px 30px auto; +} + +.c18 { + grid-column-start: 1; + grid-row: 1 / span 2; + padding-right: 5px; + font-size: 0.9em; +} + +.c20 { + grid-row-start: 2; + grid-column-start: 3; + grid-area: instructions; +} + +.c14 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + font-size: 1.2em; + grid-row-start: 1; + grid-column-start: 3; +} + +.c16 { + font-size: inherit; + font-weight: bold; + height: 1.2em; + margin: 0; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + -webkit-flex: 1 1 auto; + -ms-flex: 1 1 auto; + flex: 1 1 auto; + padding: 3px 0 10px 0; +} + +.c39 { + color: #807373; + font-size: 13px; + font-weight: 300; + padding-top: 1px; + margin-bottom: 10px; + margin-top: -14px; +} + +.c32 { + display: block; + list-style: none; + padding: 0; +} + +.c35 { + margin-left: 24px; + line-height: 1.25em; + padding-top: 1px; +} + +.c35 > span { + margin-right: 1ch; +} + +.c29 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-self: center; + -ms-flex-item-align: center; + align-self: center; + margin-top: 10px; +} + +.c29 a { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c30 { + color: #676767; + font-size: 13px; + font-style: normal; + padding: 0; +} + +.c34 { + fill: #676767; + float: left; + height: 16px; + width: 16px; +} + +.c33 { + font-size: 13px; + margin-top: 8px; + color: #676767; + font-style: normal; +} + +.c36 { + font-weight: 500; +} + +.c37 { + font-weight: 200; + opacity: 0.8975; + padding-left: 1ch; +} + +.c62 { + float: left; + margin-left: -36px; + color: #fff; +} + +.c63 { + color: #676767; + margin-top: 3px; +} + +.c60 { + z-index: 30; + position: relative; +} + +.c50 { + background-color: #eee; + border-radius: 4px; + color: #000; + display: block; + margin-top: 5px; + padding: 8px; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c54 { + -webkit-align-items: baseline; + -webkit-box-align: baseline; + -ms-flex-align: baseline; + align-items: baseline; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + gap: 5px; + margin-top: 0.5em; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c54:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c52 { + font-size: 12px; + margin-left: 30px; + white-space: pre-wrap; +} + +.c53 { + margin-top: 5px; + margin-left: 30px; + font-size: 12px; + font-style: italic; +} + +.c51 { + float: left; + font-size: 18px; +} + +.c49 { + display: block; + margin-top: 3px; + padding: 0; +} + +.c48 { + color: #d14727; + cursor: cursor; + display: inline-block; + font-weight: 400; + margin-top: 8px; + padding: 0; +} + +.c55 { + margin-top: 5px; +} + +.c56 { + color: #676767; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; +} + +.c58 { + font-size: 14px; +} + +.c57 { + padding: 0; +} + +.c47 { + margin-top: 5px; +} + +.c47 a { + color: #337ab7; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c47 a:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c47 img { + margin-left: 5px; + vertical-align: middle; +} + +.c1 { + font-size: 16px; +} + +.c1 *:not(.fa) { + box-sizing: border-box; + font-family: Hind,sans-serif; +} + +.c1 .c43 { + background-color: rgb(15,106,172); + border-color: white; + border-image: initial; + border-radius: 12px; + border-style: solid; + border-width: 1px; + box-shadow: rgb(0,0,0) 0px 0px 0.25em; + color: white; + display: inline-block; + font-size: 14px; + font-weight: 500; + height: 24px; + line-height: 1.5; + margin-right: 8px; + min-width: 24px; + padding: 2px 3px; + text-align: center; +} + +.c1 .c4 { + grid-area: line; + display: table-cell; + max-width: 20px; + width: 20px; + padding: 0; + position: relative; +} + +.c1 .c13 { + grid-area: title; + color: #000; + font-size: 18px; + font-weight: 500; + line-height: 20px; +} + +.c1 .c15 { + height: inherit; + white-space: normal; +} + +.c1 .c2 { + width: 100%; +} + +.c1 .c61 { + margin-left: -23px; +} + +.c1 .c17 { + grid-area: time; + color: #676767; + display: table-cell; + font-size: 14px; + padding-right: 4px; + padding-top: 2px; + text-align: right; + vertical-align: top; + width: 60px; +} + +.c7 { + position: absolute; + width: 100%; + top: 3px; + z-index: 20; +} + +.c6 { + background: radial-gradient(ellipse at center,#87cefa 40%,transparent 10%); + background-position: center -5px; + background-repeat: repeat-y; + background-size: 12px 12px; + left: 6px; + right: 6px; + bottom: -11px; + position: absolute; + top: 11px; + z-index: 10; +} + +.c38 { + background-color: gray; + left: 5px; + right: 5px; + background-color: #084C8D; + bottom: -11px; + position: absolute; + top: 11px; + z-index: 10; +} + +.c9 { + left: 0; + line-height: inherit; + position: absolute; + text-align: center; + width: 100%; +} + +.c10 { + top: 3px; +} + +.c12 { + left: 0; + position: absolute; + text-align: center; + width: 100%; +} + +
      +
    1. +
      +
      + + + + +
      +
      + + KGW Studio on the Sq, Portland, OR, USA + +
      +
      + 3:44 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + + + + + + + + - + + + Walk 269 feet to + + Pioneer Square North MAX Station + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + NORTHWEST + on + + Unnamed Path + + + 167 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + LEFT + on + + Pioneer Sq N (path) + + + 101 feet + + +
        +
        3. +
      +
      +
      +       +
      +
      +
      2. +
    2. +
      +
      + + + + +
      +
      + + Pioneer Square North MAX Station + +
      +
      + 3:46 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      + Stop ID 8383 + +
      +
      +
      + + + + - + Ride + + + + + + + + + + + + MAX Blue Line + + + + + MAX Blue Line + + to + + Hillsboro + + + + + - + Disembark at + Providence Park MAX Station + + + + +
      +
      +
      + Service operated by + + TriMet + + +
      + +
      +
      + +
      +
      +
      +
      + + +
      +
      +
      +
      +
        +
      1. +
        + • +
        +
        + Galleria/SW 10th Ave MAX Station +
        +
        2. +
      +
      +
      +
      + + Typical wait: + 15 min + +
      +
      +
      +
      +
      3. +
    3. +
      +
      + + + + +
      +
      + + Providence Park MAX Station + +
      +
      + 3:49 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      + Stop ID 9757 + +
      +
      +
      + + + + + + + + + + + - + + + Walk 249 feet to + + 1737 SW Morrison St, Portland, OR, USA 97205 + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + WEST + on + + Providence Park (path) + + + 19 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + RIGHT + on + + Unnamed Path + + + 104 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + RIGHT + on + + Unnamed Path + + + 27 feet + + +
        +
        4. +
      4. +
        + + + +
        +
        + + RIGHT + on + + SW Morrison St + + + 99 feet + + +
        +
        5. +
      +
      +
      +       +
      +
      +
      4. +
    4. +
      + + + + +
      +
      + + 1737 SW Morrison St, Portland, OR, USA 97205 + +
      +
      + 3:50 PM +
      + + Arrive at + 1737 SW Morrison St, Portland, OR, USA 97205 + +
      +
      5. +
    +`; + +exports[`Storyshots ItineraryBody/otp-react-redux Three Alerts Not Always Collapsing 1`] = ` + + + +`; + +exports[`Storyshots ItineraryBody/otp-react-redux Three Alerts Not Always Collapsing 2`] = ` +.c8 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c11 { + color: #333; +} + +.c64 { + color: #f44256; +} + +.c26 { + background: transparent; + border: 0; + color: inherit; + cursor: pointer; + font-size: inherit; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c40 { + color: #008; + margin-left: 5px; +} + +.c40:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c41 { + padding-left: 0px; +} + +.c41:before { + content: "|"; + color: black; + margin-right: 5px; +} + +.c31::before { + content: ""; + margin: 0 0.125em; +} + +.c59 { + display: block; + font-size: 13px; + list-style: none; + padding: 0; +} + +.c0 { + list-style: none; + padding: 0; +} + +.c21 { + color: #676767; + font-size: 13px; + padding-bottom: 12px; +} + +.c27 { + bottom: 0; + cursor: pointer; + left: 0; + position: absolute; + right: 0; + top: 0; + width: 100%; + z-index: 1; +} + +.c22 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + line-height: 16px; + min-height: 31px; + position: relative; +} + +.c19 { + display: inline-block; + grid-row-start: 2; + grid-column-start: 1; + height: 0; + overflow: hidden; + width: 0; +} + +.c46 { + font-weight: 200; +} + +.c25 { + font-weight: inherit; +} + +.c45 { + font-size: 13px; + font-weight: 500; +} + +.c44 { + font-weight: 800; + margin-right: 6px; +} + +.c42 { + color: #807373; + margin-top: 5px; +} + +.c24 img, +.c24 svg { + margin-right: 6px; + height: 24px; + width: 24px; + vertical-align: bottom; +} + +.c23 { + -webkit-flex-shrink: 0; + -ms-flex-negative: 0; + flex-shrink: 0; +} + +.c5 { + grid-column-start: 2; + grid-row: span 2; + padding-right: 5px; +} + +.c28 { + display: grid; + grid-template-columns: 130px auto; +} + +.c3 { + max-width: 500px; + display: grid; + grid-template-areas: "time line title" "time line instructions"; + grid-template-columns: 65px 30px auto; +} + +.c18 { + grid-column-start: 1; + grid-row: 1 / span 2; + padding-right: 5px; + font-size: 0.9em; +} + +.c20 { + grid-row-start: 2; + grid-column-start: 3; + grid-area: instructions; +} + +.c14 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + font-size: 1.2em; + grid-row-start: 1; + grid-column-start: 3; +} + +.c16 { + font-size: inherit; + font-weight: bold; + height: 1.2em; + margin: 0; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + -webkit-flex: 1 1 auto; + -ms-flex: 1 1 auto; + flex: 1 1 auto; + padding: 3px 0 10px 0; +} + +.c39 { + color: #807373; + font-size: 13px; + font-weight: 300; + padding-top: 1px; + margin-bottom: 10px; + margin-top: -14px; +} + +.c32 { + display: block; + list-style: none; + padding: 0; +} + +.c35 { + margin-left: 24px; + line-height: 1.25em; + padding-top: 1px; +} + +.c35 > span { + margin-right: 1ch; +} + +.c29 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-self: center; + -ms-flex-item-align: center; + align-self: center; + margin-top: 10px; +} + +.c29 a { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c30 { + color: #676767; + font-size: 13px; + font-style: normal; + padding: 0; +} + +.c34 { + fill: #676767; + float: left; + height: 16px; + width: 16px; +} + +.c33 { + font-size: 13px; + margin-top: 8px; + color: #676767; + font-style: normal; +} + +.c36 { + font-weight: 500; +} + +.c37 { + font-weight: 200; + opacity: 0.8975; + padding-left: 1ch; +} + +.c62 { + float: left; + margin-left: -36px; + color: #fff; +} + +.c63 { + color: #676767; + margin-top: 3px; +} + +.c60 { + z-index: 30; + position: relative; +} + +.c50 { + background-color: #eee; + border-radius: 4px; + color: #000; + display: block; + margin-top: 5px; + padding: 8px; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c54 { + -webkit-align-items: baseline; + -webkit-box-align: baseline; + -ms-flex-align: baseline; + align-items: baseline; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + gap: 5px; + margin-top: 0.5em; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c54:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c52 { + font-size: 12px; + margin-left: 30px; + white-space: pre-wrap; +} + +.c53 { + margin-top: 5px; + margin-left: 30px; + font-size: 12px; + font-style: italic; +} + +.c51 { + float: left; + font-size: 18px; +} + +.c49 { + display: block; + margin-top: 3px; + padding: 0; +} + +.c48 { + color: #d14727; + cursor: cursor; + display: inline-block; + font-weight: 400; + margin-top: 8px; + padding: 0; +} + +.c55 { + margin-top: 5px; +} + +.c56 { + color: #676767; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; +} + +.c58 { + font-size: 14px; +} + +.c57 { + padding: 0; +} + +.c47 { + margin-top: 5px; +} + +.c47 a { + color: #337ab7; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c47 a:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c47 img { + margin-left: 5px; + vertical-align: middle; +} + +.c1 { + font-size: 16px; +} + +.c1 *:not(.fa) { + box-sizing: border-box; + font-family: Hind,sans-serif; +} + +.c1 .c43 { + background-color: rgb(15,106,172); + border-color: white; + border-image: initial; + border-radius: 12px; + border-style: solid; + border-width: 1px; + box-shadow: rgb(0,0,0) 0px 0px 0.25em; + color: white; + display: inline-block; + font-size: 14px; + font-weight: 500; + height: 24px; + line-height: 1.5; + margin-right: 8px; + min-width: 24px; + padding: 2px 3px; + text-align: center; +} + +.c1 .c4 { + grid-area: line; + display: table-cell; + max-width: 20px; + width: 20px; + padding: 0; + position: relative; +} + +.c1 .c13 { + grid-area: title; + color: #000; + font-size: 18px; + font-weight: 500; + line-height: 20px; +} + +.c1 .c15 { + height: inherit; + white-space: normal; +} + +.c1 .c2 { + width: 100%; +} + +.c1 .c61 { + margin-left: -23px; +} + +.c1 .c17 { + grid-area: time; + color: #676767; + display: table-cell; + font-size: 14px; + padding-right: 4px; + padding-top: 2px; + text-align: right; + vertical-align: top; + width: 60px; +} + +.c7 { + position: absolute; + width: 100%; + top: 3px; + z-index: 20; +} + +.c6 { + background: radial-gradient(ellipse at center,#87cefa 40%,transparent 10%); + background-position: center -5px; + background-repeat: repeat-y; + background-size: 12px 12px; + left: 6px; + right: 6px; + bottom: -11px; + position: absolute; + top: 11px; + z-index: 10; +} + +.c38 { + background-color: gray; + left: 5px; + right: 5px; + background-color: #084C8D; + bottom: -11px; + position: absolute; + top: 11px; + z-index: 10; +} + +.c9 { + left: 0; + line-height: inherit; + position: absolute; + text-align: center; + width: 100%; +} + +.c10 { + top: 3px; +} + +.c12 { + left: 0; + position: absolute; + text-align: center; + width: 100%; +} + +
      +
    1. +
      +
      + + + + +
      +
      + + KGW Studio on the Sq, Portland, OR, USA + +
      +
      + 3:44 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + + + + + + + + - + + + Walk 269 feet to + + Pioneer Square North MAX Station + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + NORTHWEST + on + + Unnamed Path + + + 167 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + LEFT + on + + Pioneer Sq N (path) + + + 101 feet + + +
        +
        3. +
      +
      +
      +       +
      +
      +
      2. +
    2. +
      +
      + + + + +
      +
      + + Pioneer Square North MAX Station + +
      +
      + 3:46 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      + Stop ID 8383 + +
      +
      +
      + + + + - + Ride + + + + + + + + + + + + MAX Blue Line + + + + + MAX Blue Line + + to + + Hillsboro + + + + + - + Disembark at + Providence Park MAX Station + + + + +
      +
      +
      + Service operated by + + TriMet + + +
      + +
      +
      + +
      +
      +
      +
      + + +
      +
      +
      +
      +
        +
      1. +
        + • +
        +
        + Galleria/SW 10th Ave MAX Station +
        +
        2. +
      +
      +
      +
      + + Typical wait: + 15 min + +
      +
      +
      +
      +
      3. +
    3. +
      +
      + + + + +
      +
      + + Providence Park MAX Station + +
      +
      + 3:49 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      + Stop ID 9757 + +
      +
      +
      + + + + + + + + + + + - + + + Walk 249 feet to + + 1737 SW Morrison St, Portland, OR, USA 97205 + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + WEST + on + + Providence Park (path) + + + 19 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + RIGHT + on + + Unnamed Path + + + 104 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + RIGHT + on + + Unnamed Path + + + 27 feet + + +
        +
        4. +
      4. +
        + + + +
        +
        + + RIGHT + on + + SW Morrison St + + + 99 feet + + +
        +
        5. +
      +
      +
      +       +
      +
      +
      4. +
    4. +
      + + + + +
      +
      + + 1737 SW Morrison St, Portland, OR, USA 97205 + +
      +
      + 3:50 PM +
      + + Arrive at + 1737 SW Morrison St, Portland, OR, USA 97205 + +
      +
      5. +
    +`; + +exports[`Storyshots ItineraryBody/otp-react-redux Three Alerts Without Collapsing Prop 1`] = ` + + + +`; + +exports[`Storyshots ItineraryBody/otp-react-redux Three Alerts Without Collapsing Prop 2`] = ` +.c8 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c11 { + color: #333; +} + +.c64 { + color: #f44256; +} + +.c26 { + background: transparent; + border: 0; + color: inherit; + cursor: pointer; + font-size: inherit; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c40 { + color: #008; + margin-left: 5px; +} + +.c40:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c41 { + padding-left: 0px; +} + +.c41:before { + content: "|"; + color: black; + margin-right: 5px; +} + +.c31::before { + content: ""; + margin: 0 0.125em; +} + +.c59 { + display: block; + font-size: 13px; + list-style: none; + padding: 0; +} + +.c0 { + list-style: none; + padding: 0; +} + +.c21 { + color: #676767; + font-size: 13px; + padding-bottom: 12px; +} + +.c27 { + bottom: 0; + cursor: pointer; + left: 0; + position: absolute; + right: 0; + top: 0; + width: 100%; + z-index: 1; +} + +.c22 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + line-height: 16px; + min-height: 31px; + position: relative; +} + +.c19 { + display: inline-block; + grid-row-start: 2; + grid-column-start: 1; + height: 0; + overflow: hidden; + width: 0; +} + +.c46 { + font-weight: 200; +} + +.c25 { + font-weight: inherit; +} + +.c45 { + font-size: 13px; + font-weight: 500; +} + +.c44 { + font-weight: 800; + margin-right: 6px; +} + +.c42 { + color: #807373; + margin-top: 5px; +} + +.c24 img, +.c24 svg { + margin-right: 6px; + height: 24px; + width: 24px; + vertical-align: bottom; +} + +.c23 { + -webkit-flex-shrink: 0; + -ms-flex-negative: 0; + flex-shrink: 0; +} + +.c5 { + grid-column-start: 2; + grid-row: span 2; + padding-right: 5px; +} + +.c28 { + display: grid; + grid-template-columns: 130px auto; +} + +.c3 { + max-width: 500px; + display: grid; + grid-template-areas: "time line title" "time line instructions"; + grid-template-columns: 65px 30px auto; +} + +.c18 { + grid-column-start: 1; + grid-row: 1 / span 2; + padding-right: 5px; + font-size: 0.9em; +} + +.c20 { + grid-row-start: 2; + grid-column-start: 3; + grid-area: instructions; +} + +.c14 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + font-size: 1.2em; + grid-row-start: 1; + grid-column-start: 3; +} + +.c16 { + font-size: inherit; + font-weight: bold; + height: 1.2em; + margin: 0; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + -webkit-flex: 1 1 auto; + -ms-flex: 1 1 auto; + flex: 1 1 auto; + padding: 3px 0 10px 0; +} + +.c39 { + color: #807373; + font-size: 13px; + font-weight: 300; + padding-top: 1px; + margin-bottom: 10px; + margin-top: -14px; +} + +.c32 { + display: block; + list-style: none; + padding: 0; +} + +.c35 { + margin-left: 24px; + line-height: 1.25em; + padding-top: 1px; +} + +.c35 > span { + margin-right: 1ch; +} + +.c29 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-self: center; + -ms-flex-item-align: center; + align-self: center; + margin-top: 10px; +} + +.c29 a { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c30 { + color: #676767; + font-size: 13px; + font-style: normal; + padding: 0; +} + +.c34 { + fill: #676767; + float: left; + height: 16px; + width: 16px; +} + +.c33 { + font-size: 13px; + margin-top: 8px; + color: #676767; + font-style: normal; +} + +.c36 { + font-weight: 500; +} + +.c37 { + font-weight: 200; + opacity: 0.8975; + padding-left: 1ch; +} + +.c62 { + float: left; + margin-left: -36px; + color: #fff; +} + +.c63 { + color: #676767; + margin-top: 3px; +} + +.c60 { + z-index: 30; + position: relative; +} + +.c50 { + background-color: #eee; + border-radius: 4px; + color: #000; + display: block; + margin-top: 5px; + padding: 8px; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c54 { + -webkit-align-items: baseline; + -webkit-box-align: baseline; + -ms-flex-align: baseline; + align-items: baseline; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + gap: 5px; + margin-top: 0.5em; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c54:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c52 { + font-size: 12px; + margin-left: 30px; + white-space: pre-wrap; +} + +.c53 { + margin-top: 5px; + margin-left: 30px; + font-size: 12px; + font-style: italic; +} + +.c51 { + float: left; + font-size: 18px; +} + +.c49 { + display: block; + margin-top: 3px; + padding: 0; +} + +.c48 { + color: #d14727; + cursor: cursor; + display: inline-block; + font-weight: 400; + margin-top: 8px; + padding: 0; +} + +.c55 { + margin-top: 5px; +} + +.c56 { + color: #676767; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; +} + +.c58 { + font-size: 14px; +} + +.c57 { + padding: 0; +} + +.c47 { + margin-top: 5px; +} + +.c47 a { + color: #337ab7; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c47 a:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c47 img { + margin-left: 5px; + vertical-align: middle; +} + +.c1 { + font-size: 16px; +} + +.c1 *:not(.fa) { + box-sizing: border-box; + font-family: Hind,sans-serif; +} + +.c1 .c43 { + background-color: rgb(15,106,172); + border-color: white; + border-image: initial; + border-radius: 12px; + border-style: solid; + border-width: 1px; + box-shadow: rgb(0,0,0) 0px 0px 0.25em; + color: white; + display: inline-block; + font-size: 14px; + font-weight: 500; + height: 24px; + line-height: 1.5; + margin-right: 8px; + min-width: 24px; + padding: 2px 3px; + text-align: center; +} + +.c1 .c4 { + grid-area: line; + display: table-cell; + max-width: 20px; + width: 20px; + padding: 0; + position: relative; +} + +.c1 .c13 { + grid-area: title; + color: #000; + font-size: 18px; + font-weight: 500; + line-height: 20px; +} + +.c1 .c15 { + height: inherit; + white-space: normal; +} + +.c1 .c2 { + width: 100%; +} + +.c1 .c61 { + margin-left: -23px; +} + +.c1 .c17 { + grid-area: time; + color: #676767; + display: table-cell; + font-size: 14px; + padding-right: 4px; + padding-top: 2px; + text-align: right; + vertical-align: top; + width: 60px; +} + +.c7 { + position: absolute; + width: 100%; + top: 3px; + z-index: 20; +} + +.c6 { + background: radial-gradient(ellipse at center,#87cefa 40%,transparent 10%); + background-position: center -5px; + background-repeat: repeat-y; + background-size: 12px 12px; + left: 6px; + right: 6px; + bottom: -11px; + position: absolute; + top: 11px; + z-index: 10; +} + +.c38 { + background-color: gray; + left: 5px; + right: 5px; + background-color: #084C8D; + bottom: -11px; + position: absolute; + top: 11px; + z-index: 10; +} + +.c9 { + left: 0; + line-height: inherit; + position: absolute; + text-align: center; + width: 100%; +} + +.c10 { + top: 3px; +} + +.c12 { + left: 0; + position: absolute; + text-align: center; + width: 100%; +} + +
      +
    1. +
      +
      + + + + +
      +
      + + KGW Studio on the Sq, Portland, OR, USA + +
      +
      + 3:44 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + + + + + + + + - + + + Walk 269 feet to + + Pioneer Square North MAX Station + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + NORTHWEST + on + + Unnamed Path + + + 167 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + LEFT + on + + Pioneer Sq N (path) + + + 101 feet + + +
        +
        3. +
      +
      +
      +       +
      +
      +
      2. +
    2. +
      +
      + + + + +
      +
      + + Pioneer Square North MAX Station + +
      +
      + 3:46 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      + Stop ID 8383 + +
      +
      +
      + + + + - + Ride + + + + + + + + + + + + MAX Blue Line + + + + + MAX Blue Line + + to + + Hillsboro + + + + + - + Disembark at + Providence Park MAX Station + + + + +
      +
      +
      + Service operated by + + TriMet + + +
      + +
      +
      + +
      +
      +
      +
      + + +
      +
      +
      +
      +
        +
      1. +
        + • +
        +
        + Galleria/SW 10th Ave MAX Station +
        +
        2. +
      +
      +
      +
      + + Typical wait: + 15 min + +
      +
      +
      +
      +
      3. +
    3. +
      +
      + + + + +
      +
      + + Providence Park MAX Station + +
      +
      + 3:49 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      + Stop ID 9757 + +
      +
      +
      + + + + + + + + + + + - + + + Walk 249 feet to + + 1737 SW Morrison St, Portland, OR, USA 97205 + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + WEST + on + + Providence Park (path) + + + 19 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + RIGHT + on + + Unnamed Path + + + 104 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + RIGHT + on + + Unnamed Path + + + 27 feet + + +
        +
        4. +
      4. +
        + + + +
        +
        + + RIGHT + on + + SW Morrison St + + + 99 feet + + +
        +
        5. +
      +
      +
      +       +
      +
      +
      4. +
    4. +
      + + + + +
      +
      + + 1737 SW Morrison St, Portland, OR, USA 97205 + +
      +
      + 3:50 PM +
      + + Arrive at + 1737 SW Morrison St, Portland, OR, USA 97205 + +
      +
      5. +
    +`; + +exports[`Storyshots ItineraryBody/otp-react-redux Tnc Transit Itinerary 1`] = ` + + + +`; + +exports[`Storyshots ItineraryBody/otp-react-redux Tnc Transit Itinerary 2`] = ` +.c8 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c11 { + color: #333; +} + +.c58 { + color: #f44256; +} + +.c27 { + background: transparent; + border: 0; + color: inherit; + cursor: pointer; + font-size: inherit; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c30 { + background-color: #fff; + background-image: none; + border-radius: 4px; + border: 1px solid #ccc; + color: #333; + cursor: pointer; + display: inline-block; + font-size: 14px; + font-weight: 400; + padding: 4px 6px; + text-align: center; + -webkit-text-decoration: none; + text-decoration: none; + touch-action: manipulation; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + white-space: nowrap; +} + +.c30:hover { + color: #333; + background-color: #e6e6e6; + border-color: #adadad; +} + +.c30:active { + color: #333; + background-color: #e6e6e6; + background-image: none; + border-color: #adadad; + outline: 0; + box-shadow: inset 0 3px 5px rgba(0,0,0,0.125); +} + +.c30:focus { + color: #333; + background-color: #e6e6e6; + border-color: #8c8c8c; +} + +.c30:active:hover { + color: #333; + background-color: #d4d4d4; + border-color: #8c8c8c; +} + +.c37 { + color: #008; + margin-left: 5px; +} + +.c37:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c38 { + padding-left: 0px; +} + +.c38:before { + content: "|"; + color: black; + margin-right: 5px; +} + +.c55 { + bottom: 0; + left: 110px; + position: absolute; + right: 0; + top: 0; +} + +.c56 { + background-color: #fcf9d3; + display: table; + height: 100%; + width: 100%; +} + +.c54 { + border-bottom: 16px solid transparent; + border-right: 16px solid #fcf9d3; + border-top: 16px solid transparent; + height: 0; + left: 94px; + position: absolute; + top: 0; + width: 0; +} + +.c57 { + color: #444; + display: table-cell; + font-style: italic; + line-height: 0.95; + padding: 0px 2px; + vertical-align: middle; +} + +.c29 { + height: 32px; + margin-bottom: 10px; + margin-top: 10px; + position: relative; +} + +.c47::before { + content: ""; + margin: 0 0.125em; +} + +.c49 { + display: block; + font-size: 13px; + list-style: none; + padding: 0; +} + +.c0 { + list-style: none; + padding: 0; +} + +.c22 { + color: #676767; + font-size: 13px; + padding-bottom: 12px; +} + +.c28 { + bottom: 0; + cursor: pointer; + left: 0; + position: absolute; + right: 0; + top: 0; + width: 100%; + z-index: 1; +} + +.c23 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + line-height: 16px; + min-height: 31px; + position: relative; +} + +.c19 { + display: inline-block; + grid-row-start: 2; + grid-column-start: 1; + height: 0; + overflow: hidden; + width: 0; +} + +.c26 { + font-weight: inherit; +} + +.c42 { + font-size: 13px; + font-weight: 500; +} + +.c41 { + font-weight: 800; + margin-right: 6px; +} + +.c39 { + color: #807373; + margin-top: 5px; +} + +.c25 img, +.c25 svg { + margin-right: 6px; + height: 24px; + width: 24px; + vertical-align: bottom; +} + +.c24 { + -webkit-flex-shrink: 0; + -ms-flex-negative: 0; + flex-shrink: 0; +} + +.c5 { + grid-column-start: 2; + grid-row: span 2; + padding-right: 5px; +} + +.c32 { + display: grid; + grid-template-columns: 130px auto; +} + +.c3 { + max-width: 500px; + display: grid; + grid-template-areas: "time line title" "time line instructions"; + grid-template-columns: 65px 30px auto; +} + +.c18 { + grid-column-start: 1; + grid-row: 1 / span 2; + padding-right: 5px; + font-size: 0.9em; +} + +.c20 { + grid-row-start: 2; + grid-column-start: 3; + grid-area: instructions; +} + +.c14 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + font-size: 1.2em; + grid-row-start: 1; + grid-column-start: 3; +} + +.c16 { + font-size: inherit; + font-weight: bold; + height: 1.2em; + margin: 0; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + -webkit-flex: 1 1 auto; + -ms-flex: 1 1 auto; + flex: 1 1 auto; + padding: 3px 0 10px 0; +} + +.c21 { + color: #807373; + font-size: 13px; + font-weight: 300; + padding-top: 1px; + margin-bottom: 10px; + margin-top: -14px; +} + +.c35 { + display: block; + list-style: none; + padding: 0; +} + +.c33 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-self: center; + -ms-flex-item-align: center; + align-self: center; + margin-top: 10px; +} + +.c33 a { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c34 { + color: #676767; + font-size: 13px; + font-style: normal; + padding: 0; +} + +.c52 { + float: left; + margin-left: -36px; + color: #fff; +} + +.c53 { + color: #676767; + margin-top: 3px; +} + +.c50 { + z-index: 30; + position: relative; +} + +.c44 { + margin-top: 5px; +} + +.c45 { + color: #676767; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; +} + +.c48 { + font-size: 14px; +} + +.c46 { + padding: 0; +} + +.c43 { + margin-top: 5px; +} + +.c43 a { + color: #337ab7; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c43 a:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c43 img { + margin-left: 5px; + vertical-align: middle; +} + +.c1 { + font-size: 16px; +} + +.c1 *:not(.fa) { + box-sizing: border-box; + font-family: Hind,sans-serif; +} + +.c1 .c40 { + background-color: rgb(15,106,172); + border-color: white; + border-image: initial; + border-radius: 12px; + border-style: solid; + border-width: 1px; + box-shadow: rgb(0,0,0) 0px 0px 0.25em; + color: white; + display: inline-block; + font-size: 14px; + font-weight: 500; + height: 24px; + line-height: 1.5; + margin-right: 8px; + min-width: 24px; + padding: 2px 3px; + text-align: center; +} + +.c1 .c4 { + grid-area: line; + display: table-cell; + max-width: 20px; + width: 20px; + padding: 0; + position: relative; +} + +.c1 .c13 { + grid-area: title; + color: #000; + font-size: 18px; + font-weight: 500; + line-height: 20px; +} + +.c1 .c15 { + height: inherit; + white-space: normal; +} + +.c1 .c2 { + width: 100%; +} + +.c1 .c51 { + margin-left: -23px; +} + +.c1 .c17 { + grid-area: time; + color: #676767; + display: table-cell; + font-size: 14px; + padding-right: 4px; + padding-top: 2px; + text-align: right; + vertical-align: top; + width: 60px; +} + +.c7 { + position: absolute; + width: 100%; + top: 3px; + z-index: 20; +} + +.c6 { + background: repeating-linear-gradient( 0deg,grey,grey 8px,white 8px,white 12.5px ); + left: 7.5px; + right: 7.5px; + bottom: -11px; + position: absolute; + top: 11px; + z-index: 10; +} + +.c31 { + background: radial-gradient(ellipse at center,#87cefa 40%,transparent 10%); + background-position: center -5px; + background-repeat: repeat-y; + background-size: 12px 12px; + left: 6px; + right: 6px; + bottom: -11px; + position: absolute; + top: 11px; + z-index: 10; +} + +.c36 { + background-color: gray; + left: 5px; + right: 5px; + background-color: #000088; + bottom: -11px; + position: absolute; + top: 11px; + z-index: 10; +} + +.c9 { + left: 0; + line-height: inherit; + position: absolute; + text-align: center; + width: 100%; +} + +.c10 { + top: 3px; +} + +.c12 { + left: 0; + position: absolute; + text-align: center; + width: 100%; +} + +
      +
    1. +
      +
      + + + + +
      +
      + + 128 NW 12th Ave, Portland + +
      +
      + 10:58 AM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + Wait 4 minutes for pickup +
      +
      +
      + + + + + uber + + + + + - + + + Ride 0.4 miles to + + West Burnside Street + + + + +
      + +
      + Estimated travel time: + 2 min + (does not account for traffic) +
      +
      + Estimated cost: + $17.00 + - + $19.00 +
      +
      +
      +
      +
      2. +
    2. +
      +
      + + + +
      +
      + + West Burnside Street + +
      +
      + 11:01 AM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + + + + + + + + - + + + Walk to + + W Burnside & SW 6th + + + + +
      + + + + +
      +
      +
        +
      +
      +       +
      +
      +
      3. +
    3. +
      +
      + + + + +
      +
      + + W Burnside & SW 6th + +
      +
      + 11:02 AM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      + Stop ID 792 + +
      +
      +
      + + + + - + Ride + + + + + + + + + + + + + + + 20 + + + + + Burnside/Stark + + + + + - + Disembark at + E Burnside & SE 12th + + + + +
      +
      +
      + Service operated by + + TriMet + + +
      +
      +
      +
      +
      +
      + + +
      +
      +
      +
      +
        +
      1. +
        + • +
        +
        + W Burnside & SW 2nd +
        +
        2. +
      2. +
        + • +
        +
        + E Burnside & SE 8th +
        +
        3. +
      +
      +
      +
      +
      +
      +
      +
      +
      4. +
    4. +
      +
      + + + + +
      +
      + + E Burnside & SE 12th + +
      +
      + 11:08 AM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      + Stop ID 13327 + +
      +
      +
      + + + + + + + + + + + - + + + Walk to + + East Burnside Street + + + + +
      + + + + +
      +
      +
        +
      +
      +       +
      +
      +
      5. +
    5. +
      +
      + + + +
      +
      + + East Burnside Street + +
      +
      + 11:09 AM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + Wait for pickup +
      +
      +
      + + + + + uber + + + + + - + + + Ride 0.2 miles to + + 407 NE 12th Ave, Portland + + + + +
      +
      + + Book Ride + +
      +
      +
      +
      + Wait until 11:08 AM to book +
      +
      +
      +
      +
      + Estimated travel time: + 1 min + (does not account for traffic) +
      +
      + Estimated cost: + $17.00 + - + $18.00 +
      +
      +
      +
      +
      6. +
    6. +
      + + + + +
      +
      + + 407 NE 12th Ave, Portland + +
      +
      + 11:10 AM +
      + + Arrive at + 407 NE 12th Ave, Portland + +
      +
      7. +
    +`; + +exports[`Storyshots ItineraryBody/otp-react-redux Two Alerts Always Collapsing 1`] = ` + + + +`; + +exports[`Storyshots ItineraryBody/otp-react-redux Two Alerts Always Collapsing 2`] = ` +.c8 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c11 { + color: #333; +} + +.c65 { + color: #f44256; +} + +.c26 { + background: transparent; + border: 0; + color: inherit; + cursor: pointer; + font-size: inherit; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c41 { + color: #008; + margin-left: 5px; +} + +.c41:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c42 { + padding-left: 0px; +} + +.c42:before { + content: "|"; + color: black; + margin-right: 5px; +} + +.c31::before { + content: ""; + margin: 0 0.125em; +} + +.c60 { + display: block; + font-size: 13px; + list-style: none; + padding: 0; +} + +.c0 { + list-style: none; + padding: 0; +} + +.c21 { + color: #676767; + font-size: 13px; + padding-bottom: 12px; +} + +.c27 { + bottom: 0; + cursor: pointer; + left: 0; + position: absolute; + right: 0; + top: 0; + width: 100%; + z-index: 1; +} + +.c22 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + line-height: 16px; + min-height: 31px; + position: relative; +} + +.c19 { + display: inline-block; + grid-row-start: 2; + grid-column-start: 1; + height: 0; + overflow: hidden; + width: 0; +} + +.c47 { + font-weight: 200; +} + +.c25 { + font-weight: inherit; +} + +.c46 { + font-size: 13px; + font-weight: 500; +} + +.c45 { + font-weight: 800; + margin-right: 6px; +} + +.c43 { + color: #807373; + margin-top: 5px; +} + +.c24 img, +.c24 svg { + margin-right: 6px; + height: 24px; + width: 24px; + vertical-align: bottom; +} + +.c23 { + -webkit-flex-shrink: 0; + -ms-flex-negative: 0; + flex-shrink: 0; +} + +.c5 { + grid-column-start: 2; + grid-row: span 2; + padding-right: 5px; +} + +.c28 { + display: grid; + grid-template-columns: 130px auto; +} + +.c3 { + max-width: 500px; + display: grid; + grid-template-areas: "time line title" "time line instructions"; + grid-template-columns: 65px 30px auto; +} + +.c18 { + grid-column-start: 1; + grid-row: 1 / span 2; + padding-right: 5px; + font-size: 0.9em; +} + +.c20 { + grid-row-start: 2; + grid-column-start: 3; + grid-area: instructions; +} + +.c14 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + font-size: 1.2em; + grid-row-start: 1; + grid-column-start: 3; +} + +.c16 { + font-size: inherit; + font-weight: bold; + height: 1.2em; + margin: 0; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + -webkit-flex: 1 1 auto; + -ms-flex: 1 1 auto; + flex: 1 1 auto; + padding: 3px 0 10px 0; +} + +.c40 { + color: #807373; + font-size: 13px; + font-weight: 300; + padding-top: 1px; + margin-bottom: 10px; + margin-top: -14px; +} + +.c32 { + display: block; + list-style: none; + padding: 0; +} + +.c35 { + margin-left: 24px; + line-height: 1.25em; + padding-top: 1px; +} + +.c35 > span { + margin-right: 1ch; +} + +.c29 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-self: center; + -ms-flex-item-align: center; + align-self: center; + margin-top: 10px; +} + +.c29 a { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c30 { + color: #676767; + font-size: 13px; + font-style: normal; + padding: 0; +} + +.c34 { + fill: #676767; + float: left; + height: 16px; + width: 16px; +} + +.c33 { + font-size: 13px; + margin-top: 8px; + color: #676767; + font-style: normal; +} + +.c36 { + font-weight: 500; +} + +.c37 { + font-weight: 200; + opacity: 0.8975; + padding-left: 1ch; +} + +.c63 { + float: left; + margin-left: -36px; + color: #fff; +} + +.c64 { + color: #676767; + margin-top: 3px; +} + +.c61 { + z-index: 30; + position: relative; +} + +.c51 { + background-color: #eee; + border-radius: 4px; + color: #000; + display: block; + margin-top: 5px; + padding: 8px; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c55 { + -webkit-align-items: baseline; + -webkit-box-align: baseline; + -ms-flex-align: baseline; + align-items: baseline; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + gap: 5px; + margin-top: 0.5em; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c55:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c53 { + font-size: 12px; + margin-left: 30px; + white-space: pre-wrap; +} + +.c54 { + margin-top: 5px; + margin-left: 30px; + font-size: 12px; + font-style: italic; +} + +.c52 { + float: left; + font-size: 18px; +} + +.c50 { + display: block; + margin-top: 3px; + padding: 0; +} + +.c49 { + color: #d14727; + cursor: cursor; + display: inline-block; + font-weight: 400; + margin-top: 8px; + padding: 0; +} + +.c56 { + margin-top: 5px; +} + +.c57 { + color: #676767; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; +} + +.c59 { + font-size: 14px; +} + +.c58 { + padding: 0; +} + +.c48 { + margin-top: 5px; +} + +.c48 a { + color: #337ab7; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c48 a:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c48 img { + margin-left: 5px; + vertical-align: middle; +} + +.c1 { + font-size: 16px; +} + +.c1 *:not(.fa) { + box-sizing: border-box; + font-family: Hind,sans-serif; +} + +.c1 .c44 { + background-color: rgb(15,106,172); + border-color: white; + border-image: initial; + border-radius: 12px; + border-style: solid; + border-width: 1px; + box-shadow: rgb(0,0,0) 0px 0px 0.25em; + color: white; + display: inline-block; + font-size: 14px; + font-weight: 500; + height: 24px; + line-height: 1.5; + margin-right: 8px; + min-width: 24px; + padding: 2px 3px; + text-align: center; +} + +.c1 .c4 { + grid-area: line; + display: table-cell; + max-width: 20px; + width: 20px; + padding: 0; + position: relative; +} + +.c1 .c13 { + grid-area: title; + color: #000; + font-size: 18px; + font-weight: 500; + line-height: 20px; +} + +.c1 .c15 { + height: inherit; + white-space: normal; +} + +.c1 .c2 { + width: 100%; +} + +.c1 .c62 { + margin-left: -23px; +} + +.c1 .c17 { + grid-area: time; + color: #676767; + display: table-cell; + font-size: 14px; + padding-right: 4px; + padding-top: 2px; + text-align: right; + vertical-align: top; + width: 60px; +} + +.c7 { + position: absolute; + width: 100%; + top: 3px; + z-index: 20; +} + +.c6 { + background: repeating-linear-gradient( 0deg,grey,grey 8px,white 8px,white 12.5px ); + left: 7.5px; + right: 7.5px; + bottom: -11px; + position: absolute; + top: 11px; + z-index: 10; +} + +.c38 { + background: radial-gradient(ellipse at center,#87cefa 40%,transparent 10%); + background-position: center -5px; + background-repeat: repeat-y; + background-size: 12px 12px; + left: 6px; + right: 6px; + bottom: -11px; + position: absolute; + top: 11px; + z-index: 10; +} + +.c39 { + background-color: gray; + left: 5px; + right: 5px; + background-color: #084C8D; + bottom: -11px; + position: absolute; + top: 11px; + z-index: 10; +} + +.c9 { + left: 0; + line-height: inherit; + position: absolute; + text-align: center; + width: 100%; +} + +.c10 { + top: 3px; +} + +.c12 { + left: 0; + position: absolute; + text-align: center; + width: 100%; +} + +
      +
    1. +
      +
      + + + + +
      +
      + + 330 SW Murray Blvd, Washington County, OR, USA 97005 + +
      +
      + 3:50 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + + + + + + + - + + + Drive 2.4 miles to + + P+R Sunset TC + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + SOUTHWEST + on + + parking aisle + + + 158 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + RIGHT + on + + SW Murray Blvd + + + 0.2 miles + + +
        +
        3. +
      3. +
        + + + +
        +
        + + CONTINUE + on + + NW Murray Blvd + + + 150 feet + + +
        +
        4. +
      4. +
        + + + +
        +
        + + SLIGHTLY_RIGHT + on + + NW Murray Blvd + + + 0.4 miles + + +
        +
        5. +
      5. +
        + + + +
        +
        + + CONTINUE + on + + NW Sunset Hwy + + + 0.6 miles + + +
        +
        6. +
      6. +
        + + + +
        +
        + + CONTINUE + on + + NW Sunset Hwy + + + 0.3 miles + + +
        +
        7. +
      7. +
        + + + +
        +
        + + LEFT + on + + SW Cedar Hills Blvd + + + 0.2 miles + + +
        +
        8. +
      8. +
        + + + +
        +
        + + RIGHT + on + + SW Barnes Rd + + + 0.5 miles + + +
        +
        9. +
      9. +
        + + + +
        +
        + + RIGHT + on + + service road + + + 0.2 miles + + +
        +
        10. +
      10. +
        + + + +
        +
        + + RIGHT + on + + Sunset TC + + + 76 feet + + +
        +
        11. +
      +
      +
      +       +
      +
      +
      2. +
    2. +
      +
      + + + +
      +
      + + P+R Sunset TC + +
      +
      + 4:02 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + + + + + + + + - + + + Walk 426 feet to + + Sunset TC MAX Station + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + SLIGHTLY_RIGHT + on + + Unnamed Path + + + 16 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + LEFT + on + + steps + + + 232 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + LEFT + on + + Unnamed Path + + + 19 feet + + +
        +
        4. +
      4. +
        + + + +
        +
        + + RIGHT + on + + Sunset TC (path) + + + 159 feet + + +
        +
        5. +
      +
      +
      +       +
      +
      +
      3. +
    3. +
      +
      + + + + +
      +
      + + Sunset TC MAX Station + +
      +
      + 4:05 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      + Stop ID 2600 + +
      +
      +
      + + + + - + Ride + + + + + + + + + + + + MAX Blue Line + + + + + MAX Blue Line + + to + + Gresham + + + + + - + Disembark at + Oak/ SW 1st Ave MAX Station + + + + +
      +
      +
      + Service operated by + + TriMet + + +
      + +
      +
      + +
      +
      +
      +
      + + +
      +
      +
      +
      +
        +
      1. +
        + • +
        +
        + Washington Park MAX Station +
        +
        2. +
      2. +
        + • +
        +
        + Goose Hollow/SW Jefferson St MAX Station +
        +
        3. +
      3. +
        + • +
        +
        + Kings Hill/SW Salmon St MAX Station +
        +
        4. +
      4. +
        + • +
        +
        + Providence Park MAX Station +
        +
        5. +
      5. +
        + • +
        +
        + Library/SW 9th Ave MAX Station +
        +
        6. +
      6. +
        + • +
        +
        + Pioneer Square South MAX Station +
        +
        7. +
      7. +
        + • +
        +
        + Mall/SW 4th Ave MAX Station +
        +
        8. +
      8. +
        + • +
        +
        + Yamhill District MAX Station +
        +
        9. +
      +
      +
      +
      +
      +
      +
      +
      +
      4. +
    4. +
      +
      + + + + +
      +
      + + Oak/ SW 1st Ave MAX Station + +
      +
      + 4:27 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      + Stop ID 8337 + +
      +
      +
      + + + + + + + + + + + - + + + Walk 0.1 miles to + + 205 SW Pine St, Portland, OR, USA 97204 + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + NORTHEAST + on + + Oak/SW 1st Ave (path) + + + 13 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + CONTINUE + on + + Unnamed Path + + + 27 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + LEFT + on + + SW Oak St + + + 37 feet + + +
        +
        4. +
      4. +
        + + + +
        +
        + + RIGHT + on + + SW 1st Ave + + + 260 feet + + +
        +
        5. +
      5. +
        + + + +
        +
        + + LEFT + on + + SW Pine St + + + 337 feet + + +
        +
        6. +
      +
      +
      +       +
      +
      +
      5. +
    5. +
      + + + + +
      +
      + + 205 SW Pine St, Portland, OR, USA 97204 + +
      +
      + 4:29 PM +
      + + Arrive at + 205 SW Pine St, Portland, OR, USA 97204 + +
      +
      6. +
    +`; + +exports[`Storyshots ItineraryBody/otp-react-redux Two Alerts Not Always Collapsing 1`] = ` + + + +`; + +exports[`Storyshots ItineraryBody/otp-react-redux Two Alerts Not Always Collapsing 2`] = ` +.c8 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c11 { + color: #333; +} + +.c65 { + color: #f44256; +} + +.c26 { + background: transparent; + border: 0; + color: inherit; + cursor: pointer; + font-size: inherit; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c41 { + color: #008; + margin-left: 5px; +} + +.c41:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c42 { + padding-left: 0px; +} + +.c42:before { + content: "|"; + color: black; + margin-right: 5px; +} + +.c31::before { + content: ""; + margin: 0 0.125em; +} + +.c60 { + display: block; + font-size: 13px; + list-style: none; + padding: 0; +} + +.c0 { + list-style: none; + padding: 0; +} + +.c21 { + color: #676767; + font-size: 13px; + padding-bottom: 12px; +} + +.c27 { + bottom: 0; + cursor: pointer; + left: 0; + position: absolute; + right: 0; + top: 0; + width: 100%; + z-index: 1; +} + +.c22 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + line-height: 16px; + min-height: 31px; + position: relative; +} + +.c19 { + display: inline-block; + grid-row-start: 2; + grid-column-start: 1; + height: 0; + overflow: hidden; + width: 0; +} + +.c47 { + font-weight: 200; +} + +.c25 { + font-weight: inherit; +} + +.c46 { + font-size: 13px; + font-weight: 500; +} + +.c45 { + font-weight: 800; + margin-right: 6px; +} + +.c43 { + color: #807373; + margin-top: 5px; +} + +.c24 img, +.c24 svg { + margin-right: 6px; + height: 24px; + width: 24px; + vertical-align: bottom; +} + +.c23 { + -webkit-flex-shrink: 0; + -ms-flex-negative: 0; + flex-shrink: 0; +} + +.c5 { + grid-column-start: 2; + grid-row: span 2; + padding-right: 5px; +} + +.c28 { + display: grid; + grid-template-columns: 130px auto; +} + +.c3 { + max-width: 500px; + display: grid; + grid-template-areas: "time line title" "time line instructions"; + grid-template-columns: 65px 30px auto; +} + +.c18 { + grid-column-start: 1; + grid-row: 1 / span 2; + padding-right: 5px; + font-size: 0.9em; +} + +.c20 { + grid-row-start: 2; + grid-column-start: 3; + grid-area: instructions; +} + +.c14 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + font-size: 1.2em; + grid-row-start: 1; + grid-column-start: 3; +} + +.c16 { + font-size: inherit; + font-weight: bold; + height: 1.2em; + margin: 0; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + -webkit-flex: 1 1 auto; + -ms-flex: 1 1 auto; + flex: 1 1 auto; + padding: 3px 0 10px 0; +} + +.c40 { + color: #807373; + font-size: 13px; + font-weight: 300; + padding-top: 1px; + margin-bottom: 10px; + margin-top: -14px; +} + +.c32 { + display: block; + list-style: none; + padding: 0; +} + +.c35 { + margin-left: 24px; + line-height: 1.25em; + padding-top: 1px; +} + +.c35 > span { + margin-right: 1ch; +} + +.c29 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-self: center; + -ms-flex-item-align: center; + align-self: center; + margin-top: 10px; +} + +.c29 a { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c30 { + color: #676767; + font-size: 13px; + font-style: normal; + padding: 0; +} + +.c34 { + fill: #676767; + float: left; + height: 16px; + width: 16px; +} + +.c33 { + font-size: 13px; + margin-top: 8px; + color: #676767; + font-style: normal; +} + +.c36 { + font-weight: 500; +} + +.c37 { + font-weight: 200; + opacity: 0.8975; + padding-left: 1ch; +} + +.c63 { + float: left; + margin-left: -36px; + color: #fff; +} + +.c64 { + color: #676767; + margin-top: 3px; +} + +.c61 { + z-index: 30; + position: relative; +} + +.c51 { + background-color: #eee; + border-radius: 4px; + color: #000; + display: block; + margin-top: 5px; + padding: 8px; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c55 { + -webkit-align-items: baseline; + -webkit-box-align: baseline; + -ms-flex-align: baseline; + align-items: baseline; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + gap: 5px; + margin-top: 0.5em; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c55:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c53 { + font-size: 12px; + margin-left: 30px; + white-space: pre-wrap; +} + +.c54 { + margin-top: 5px; + margin-left: 30px; + font-size: 12px; + font-style: italic; +} + +.c52 { + float: left; + font-size: 18px; +} + +.c50 { + display: block; + margin-top: 3px; + padding: 0; +} + +.c49 { + color: #d14727; + cursor: auto; + display: inline-block; + font-weight: 400; + margin-top: 8px; + padding: 0; +} + +.c56 { + margin-top: 5px; +} + +.c57 { + color: #676767; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; +} + +.c59 { + font-size: 14px; +} + +.c58 { + padding: 0; +} + +.c48 { + margin-top: 5px; +} + +.c48 a { + color: #337ab7; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c48 a:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c48 img { + margin-left: 5px; + vertical-align: middle; +} + +.c1 { + font-size: 16px; +} + +.c1 *:not(.fa) { + box-sizing: border-box; + font-family: Hind,sans-serif; +} + +.c1 .c44 { + background-color: rgb(15,106,172); + border-color: white; + border-image: initial; + border-radius: 12px; + border-style: solid; + border-width: 1px; + box-shadow: rgb(0,0,0) 0px 0px 0.25em; + color: white; + display: inline-block; + font-size: 14px; + font-weight: 500; + height: 24px; + line-height: 1.5; + margin-right: 8px; + min-width: 24px; + padding: 2px 3px; + text-align: center; +} + +.c1 .c4 { + grid-area: line; + display: table-cell; + max-width: 20px; + width: 20px; + padding: 0; + position: relative; +} + +.c1 .c13 { + grid-area: title; + color: #000; + font-size: 18px; + font-weight: 500; + line-height: 20px; +} + +.c1 .c15 { + height: inherit; + white-space: normal; +} + +.c1 .c2 { + width: 100%; +} + +.c1 .c62 { + margin-left: -23px; +} + +.c1 .c17 { + grid-area: time; + color: #676767; + display: table-cell; + font-size: 14px; + padding-right: 4px; + padding-top: 2px; + text-align: right; + vertical-align: top; + width: 60px; +} + +.c7 { + position: absolute; + width: 100%; + top: 3px; + z-index: 20; +} + +.c6 { + background: repeating-linear-gradient( 0deg,grey,grey 8px,white 8px,white 12.5px ); + left: 7.5px; + right: 7.5px; + bottom: -11px; + position: absolute; + top: 11px; + z-index: 10; +} + +.c38 { + background: radial-gradient(ellipse at center,#87cefa 40%,transparent 10%); + background-position: center -5px; + background-repeat: repeat-y; + background-size: 12px 12px; + left: 6px; + right: 6px; + bottom: -11px; + position: absolute; + top: 11px; + z-index: 10; +} + +.c39 { + background-color: gray; + left: 5px; + right: 5px; + background-color: #084C8D; + bottom: -11px; + position: absolute; + top: 11px; + z-index: 10; +} + +.c9 { + left: 0; + line-height: inherit; + position: absolute; + text-align: center; + width: 100%; +} + +.c10 { + top: 3px; +} + +.c12 { + left: 0; + position: absolute; + text-align: center; + width: 100%; +} + +
      +
    1. +
      +
      + + + + +
      +
      + + 330 SW Murray Blvd, Washington County, OR, USA 97005 + +
      +
      + 3:50 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + + + + + + + - + + + Drive 2.4 miles to + + P+R Sunset TC + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + SOUTHWEST + on + + parking aisle + + + 158 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + RIGHT + on + + SW Murray Blvd + + + 0.2 miles + + +
        +
        3. +
      3. +
        + + + +
        +
        + + CONTINUE + on + + NW Murray Blvd + + + 150 feet + + +
        +
        4. +
      4. +
        + + + +
        +
        + + SLIGHTLY_RIGHT + on + + NW Murray Blvd + + + 0.4 miles + + +
        +
        5. +
      5. +
        + + + +
        +
        + + CONTINUE + on + + NW Sunset Hwy + + + 0.6 miles + + +
        +
        6. +
      6. +
        + + + +
        +
        + + CONTINUE + on + + NW Sunset Hwy + + + 0.3 miles + + +
        +
        7. +
      7. +
        + + + +
        +
        + + LEFT + on + + SW Cedar Hills Blvd + + + 0.2 miles + + +
        +
        8. +
      8. +
        + + + +
        +
        + + RIGHT + on + + SW Barnes Rd + + + 0.5 miles + + +
        +
        9. +
      9. +
        + + + +
        +
        + + RIGHT + on + + service road + + + 0.2 miles + + +
        +
        10. +
      10. +
        + + + +
        +
        + + RIGHT + on + + Sunset TC + + + 76 feet + + +
        +
        11. +
      +
      +
      +       +
      +
      +
      2. +
    2. +
      +
      + + + +
      +
      + + P+R Sunset TC + +
      +
      + 4:02 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + + + + + + + + - + + + Walk 426 feet to + + Sunset TC MAX Station + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + SLIGHTLY_RIGHT + on + + Unnamed Path + + + 16 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + LEFT + on + + steps + + + 232 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + LEFT + on + + Unnamed Path + + + 19 feet + + +
        +
        4. +
      4. +
        + + + +
        +
        + + RIGHT + on + + Sunset TC (path) + + + 159 feet + + +
        +
        5. +
      +
      +
      +       +
      +
      +
      3. +
    3. +
      +
      + + + + +
      +
      + + Sunset TC MAX Station + +
      +
      + 4:05 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      + Stop ID 2600 + +
      +
      +
      + + + + - + Ride + + + + + + + + + + + + MAX Blue Line + + + + + MAX Blue Line + + to + + Gresham + + + + + - + Disembark at + Oak/ SW 1st Ave MAX Station + + + + +
      +
      +
      + Service operated by + + TriMet + + +
      +
      + + + 2 alerts +
      +
      +
      + +
      +
      +
      +
      + + +
      +
      +
      +
      +
        +
      1. +
        + • +
        +
        + Washington Park MAX Station +
        +
        2. +
      2. +
        + • +
        +
        + Goose Hollow/SW Jefferson St MAX Station +
        +
        3. +
      3. +
        + • +
        +
        + Kings Hill/SW Salmon St MAX Station +
        +
        4. +
      4. +
        + • +
        +
        + Providence Park MAX Station +
        +
        5. +
      5. +
        + • +
        +
        + Library/SW 9th Ave MAX Station +
        +
        6. +
      6. +
        + • +
        +
        + Pioneer Square South MAX Station +
        +
        7. +
      7. +
        + • +
        +
        + Mall/SW 4th Ave MAX Station +
        +
        8. +
      8. +
        + • +
        +
        + Yamhill District MAX Station +
        +
        9. +
      +
      +
      +
      +
      +
      +
      +
      +
      4. +
    4. +
      +
      + + + + +
      +
      + + Oak/ SW 1st Ave MAX Station + +
      +
      + 4:27 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      + Stop ID 8337 + +
      +
      +
      + + + + + + + + + + + - + + + Walk 0.1 miles to + + 205 SW Pine St, Portland, OR, USA 97204 + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + NORTHEAST + on + + Oak/SW 1st Ave (path) + + + 13 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + CONTINUE + on + + Unnamed Path + + + 27 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + LEFT + on + + SW Oak St + + + 37 feet + + +
        +
        4. +
      4. +
        + + + +
        +
        + + RIGHT + on + + SW 1st Ave + + + 260 feet + + +
        +
        5. +
      5. +
        + + + +
        +
        + + LEFT + on + + SW Pine St + + + 337 feet + + +
        +
        6. +
      +
      +
      +       +
      +
      +
      5. +
    5. +
      + + + + +
      +
      + + 205 SW Pine St, Portland, OR, USA 97204 + +
      +
      + 4:29 PM +
      + + Arrive at + 205 SW Pine St, Portland, OR, USA 97204 + +
      +
      6. +
    +`; + +exports[`Storyshots ItineraryBody/otp-react-redux Two Alerts Without Collapsing Prop 1`] = ` + + + +`; + +exports[`Storyshots ItineraryBody/otp-react-redux Two Alerts Without Collapsing Prop 2`] = ` +.c8 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c11 { + color: #333; +} + +.c65 { + color: #f44256; +} + +.c26 { + background: transparent; + border: 0; + color: inherit; + cursor: pointer; + font-size: inherit; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c41 { + color: #008; + margin-left: 5px; +} + +.c41:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c42 { + padding-left: 0px; +} + +.c42:before { + content: "|"; + color: black; + margin-right: 5px; +} + +.c31::before { + content: ""; + margin: 0 0.125em; +} + +.c60 { + display: block; + font-size: 13px; + list-style: none; + padding: 0; +} + +.c0 { + list-style: none; + padding: 0; +} + +.c21 { + color: #676767; + font-size: 13px; + padding-bottom: 12px; +} + +.c27 { + bottom: 0; + cursor: pointer; + left: 0; + position: absolute; + right: 0; + top: 0; + width: 100%; + z-index: 1; +} + +.c22 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + line-height: 16px; + min-height: 31px; + position: relative; +} + +.c19 { + display: inline-block; + grid-row-start: 2; + grid-column-start: 1; + height: 0; + overflow: hidden; + width: 0; +} + +.c47 { + font-weight: 200; +} + +.c25 { + font-weight: inherit; +} + +.c46 { + font-size: 13px; + font-weight: 500; +} + +.c45 { + font-weight: 800; + margin-right: 6px; +} + +.c43 { + color: #807373; + margin-top: 5px; +} + +.c24 img, +.c24 svg { + margin-right: 6px; + height: 24px; + width: 24px; + vertical-align: bottom; +} + +.c23 { + -webkit-flex-shrink: 0; + -ms-flex-negative: 0; + flex-shrink: 0; +} + +.c5 { + grid-column-start: 2; + grid-row: span 2; + padding-right: 5px; +} + +.c28 { + display: grid; + grid-template-columns: 130px auto; +} + +.c3 { + max-width: 500px; + display: grid; + grid-template-areas: "time line title" "time line instructions"; + grid-template-columns: 65px 30px auto; +} + +.c18 { + grid-column-start: 1; + grid-row: 1 / span 2; + padding-right: 5px; + font-size: 0.9em; +} + +.c20 { + grid-row-start: 2; + grid-column-start: 3; + grid-area: instructions; +} + +.c14 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + font-size: 1.2em; + grid-row-start: 1; + grid-column-start: 3; +} + +.c16 { + font-size: inherit; + font-weight: bold; + height: 1.2em; + margin: 0; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + -webkit-flex: 1 1 auto; + -ms-flex: 1 1 auto; + flex: 1 1 auto; + padding: 3px 0 10px 0; +} + +.c40 { + color: #807373; + font-size: 13px; + font-weight: 300; + padding-top: 1px; + margin-bottom: 10px; + margin-top: -14px; +} + +.c32 { + display: block; + list-style: none; + padding: 0; +} + +.c35 { + margin-left: 24px; + line-height: 1.25em; + padding-top: 1px; +} + +.c35 > span { + margin-right: 1ch; +} + +.c29 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-self: center; + -ms-flex-item-align: center; + align-self: center; + margin-top: 10px; +} + +.c29 a { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c30 { + color: #676767; + font-size: 13px; + font-style: normal; + padding: 0; +} + +.c34 { + fill: #676767; + float: left; + height: 16px; + width: 16px; +} + +.c33 { + font-size: 13px; + margin-top: 8px; + color: #676767; + font-style: normal; +} + +.c36 { + font-weight: 500; +} + +.c37 { + font-weight: 200; + opacity: 0.8975; + padding-left: 1ch; +} + +.c63 { + float: left; + margin-left: -36px; + color: #fff; +} + +.c64 { + color: #676767; + margin-top: 3px; +} + +.c61 { + z-index: 30; + position: relative; +} + +.c51 { + background-color: #eee; + border-radius: 4px; + color: #000; + display: block; + margin-top: 5px; + padding: 8px; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c55 { + -webkit-align-items: baseline; + -webkit-box-align: baseline; + -ms-flex-align: baseline; + align-items: baseline; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + gap: 5px; + margin-top: 0.5em; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c55:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c53 { + font-size: 12px; + margin-left: 30px; + white-space: pre-wrap; +} + +.c54 { + margin-top: 5px; + margin-left: 30px; + font-size: 12px; + font-style: italic; +} + +.c52 { + float: left; + font-size: 18px; +} + +.c50 { + display: block; + margin-top: 3px; + padding: 0; +} + +.c49 { + color: #d14727; + cursor: auto; + display: inline-block; + font-weight: 400; + margin-top: 8px; + padding: 0; +} + +.c56 { + margin-top: 5px; +} + +.c57 { + color: #676767; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; +} + +.c59 { + font-size: 14px; +} + +.c58 { + padding: 0; +} + +.c48 { + margin-top: 5px; +} + +.c48 a { + color: #337ab7; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c48 a:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c48 img { + margin-left: 5px; + vertical-align: middle; +} + +.c1 { + font-size: 16px; +} + +.c1 *:not(.fa) { + box-sizing: border-box; + font-family: Hind,sans-serif; +} + +.c1 .c44 { + background-color: rgb(15,106,172); + border-color: white; + border-image: initial; + border-radius: 12px; + border-style: solid; + border-width: 1px; + box-shadow: rgb(0,0,0) 0px 0px 0.25em; + color: white; + display: inline-block; + font-size: 14px; + font-weight: 500; + height: 24px; + line-height: 1.5; + margin-right: 8px; + min-width: 24px; + padding: 2px 3px; + text-align: center; +} + +.c1 .c4 { + grid-area: line; + display: table-cell; + max-width: 20px; + width: 20px; + padding: 0; + position: relative; +} + +.c1 .c13 { + grid-area: title; + color: #000; + font-size: 18px; + font-weight: 500; + line-height: 20px; +} + +.c1 .c15 { + height: inherit; + white-space: normal; +} + +.c1 .c2 { + width: 100%; +} + +.c1 .c62 { + margin-left: -23px; +} + +.c1 .c17 { + grid-area: time; + color: #676767; + display: table-cell; + font-size: 14px; + padding-right: 4px; + padding-top: 2px; + text-align: right; + vertical-align: top; + width: 60px; +} + +.c7 { + position: absolute; + width: 100%; + top: 3px; + z-index: 20; +} + +.c6 { + background: repeating-linear-gradient( 0deg,grey,grey 8px,white 8px,white 12.5px ); + left: 7.5px; + right: 7.5px; + bottom: -11px; + position: absolute; + top: 11px; + z-index: 10; +} + +.c38 { + background: radial-gradient(ellipse at center,#87cefa 40%,transparent 10%); + background-position: center -5px; + background-repeat: repeat-y; + background-size: 12px 12px; + left: 6px; + right: 6px; + bottom: -11px; + position: absolute; + top: 11px; + z-index: 10; +} + +.c39 { + background-color: gray; + left: 5px; + right: 5px; + background-color: #084C8D; + bottom: -11px; + position: absolute; + top: 11px; + z-index: 10; +} + +.c9 { + left: 0; + line-height: inherit; + position: absolute; + text-align: center; + width: 100%; +} + +.c10 { + top: 3px; +} + +.c12 { + left: 0; + position: absolute; + text-align: center; + width: 100%; +} + +
      +
    1. +
      +
      + + + + +
      +
      + + 330 SW Murray Blvd, Washington County, OR, USA 97005 + +
      +
      + 3:50 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + + + + + + + - + + + Drive 2.4 miles to + + P+R Sunset TC + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + SOUTHWEST + on + + parking aisle + + + 158 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + RIGHT + on + + SW Murray Blvd + + + 0.2 miles + + +
        +
        3. +
      3. +
        + + + +
        +
        + + CONTINUE + on + + NW Murray Blvd + + + 150 feet + + +
        +
        4. +
      4. +
        + + + +
        +
        + + SLIGHTLY_RIGHT + on + + NW Murray Blvd + + + 0.4 miles + + +
        +
        5. +
      5. +
        + + + +
        +
        + + CONTINUE + on + + NW Sunset Hwy + + + 0.6 miles + + +
        +
        6. +
      6. +
        + + + +
        +
        + + CONTINUE + on + + NW Sunset Hwy + + + 0.3 miles + + +
        +
        7. +
      7. +
        + + + +
        +
        + + LEFT + on + + SW Cedar Hills Blvd + + + 0.2 miles + + +
        +
        8. +
      8. +
        + + + +
        +
        + + RIGHT + on + + SW Barnes Rd + + + 0.5 miles + + +
        +
        9. +
      9. +
        + + + +
        +
        + + RIGHT + on + + service road + + + 0.2 miles + + +
        +
        10. +
      10. +
        + + + +
        +
        + + RIGHT + on + + Sunset TC + + + 76 feet + + +
        +
        11. +
      +
      +
      +       +
      +
      +
      2. +
    2. +
      +
      + + + +
      +
      + + P+R Sunset TC + +
      +
      + 4:02 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + + + + + + + + - + + + Walk 426 feet to + + Sunset TC MAX Station + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + SLIGHTLY_RIGHT + on + + Unnamed Path + + + 16 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + LEFT + on + + steps + + + 232 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + LEFT + on + + Unnamed Path + + + 19 feet + + +
        +
        4. +
      4. +
        + + + +
        +
        + + RIGHT + on + + Sunset TC (path) + + + 159 feet + + +
        +
        5. +
      +
      +
      +       +
      +
      +
      3. +
    3. +
      +
      + + + + +
      +
      + + Sunset TC MAX Station + +
      +
      + 4:05 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      + Stop ID 2600 + +
      +
      +
      + + + + - + Ride + + + + + + + + + + + + MAX Blue Line + + + + + MAX Blue Line + + to + + Gresham + + + + + - + Disembark at + Oak/ SW 1st Ave MAX Station + + + + +
      +
      +
      + Service operated by + + TriMet + + +
      +
      + + + 2 alerts +
      +
      +
      + +
      +
      +
      +
      + + +
      +
      +
      +
      +
        +
      1. +
        + • +
        +
        + Washington Park MAX Station +
        +
        2. +
      2. +
        + • +
        +
        + Goose Hollow/SW Jefferson St MAX Station +
        +
        3. +
      3. +
        + • +
        +
        + Kings Hill/SW Salmon St MAX Station +
        +
        4. +
      4. +
        + • +
        +
        + Providence Park MAX Station +
        +
        5. +
      5. +
        + • +
        +
        + Library/SW 9th Ave MAX Station +
        +
        6. +
      6. +
        + • +
        +
        + Pioneer Square South MAX Station +
        +
        7. +
      7. +
        + • +
        +
        + Mall/SW 4th Ave MAX Station +
        +
        8. +
      8. +
        + • +
        +
        + Yamhill District MAX Station +
        +
        9. +
      +
      +
      +
      +
      +
      +
      +
      +
      4. +
    4. +
      +
      + + + + +
      +
      + + Oak/ SW 1st Ave MAX Station + +
      +
      + 4:27 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      + Stop ID 8337 + +
      +
      +
      + + + + + + + + + + + - + + + Walk 0.1 miles to + + 205 SW Pine St, Portland, OR, USA 97204 + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + NORTHEAST + on + + Oak/SW 1st Ave (path) + + + 13 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + CONTINUE + on + + Unnamed Path + + + 27 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + LEFT + on + + SW Oak St + + + 37 feet + + +
        +
        4. +
      4. +
        + + + +
        +
        + + RIGHT + on + + SW 1st Ave + + + 260 feet + + +
        +
        5. +
      5. +
        + + + +
        +
        + + LEFT + on + + SW Pine St + + + 337 feet + + +
        +
        6. +
      +
      +
      +       +
      +
      +
      5. +
    5. +
      + + + + +
      +
      + + 205 SW Pine St, Portland, OR, USA 97204 + +
      +
      + 4:29 PM +
      + + Arrive at + 205 SW Pine St, Portland, OR, USA 97204 + +
      +
      6. +
    +`; + +exports[`Storyshots ItineraryBody/otp-react-redux Walk Interlined Transit Itinerary 1`] = ` + + + +`; + +exports[`Storyshots ItineraryBody/otp-react-redux Walk Interlined Transit Itinerary 2`] = ` +.c8 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c11 { + color: #333; +} + +.c57 { + color: #f44256; +} + +.c26 { + background: transparent; + border: 0; + color: inherit; + cursor: pointer; + font-size: inherit; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c40 { + color: #008; + margin-left: 5px; +} + +.c40:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c41 { + padding-left: 0px; +} + +.c41:before { + content: "|"; + color: black; + margin-right: 5px; +} + +.c31::before { + content: ""; + margin: 0 0.125em; +} + +.c51 { + display: block; + font-size: 13px; + list-style: none; + padding: 0; +} + +.c0 { + list-style: none; + padding: 0; +} + +.c21 { + color: #676767; + font-size: 13px; + padding-bottom: 12px; +} + +.c27 { + bottom: 0; + cursor: pointer; + left: 0; + position: absolute; + right: 0; + top: 0; + width: 100%; + z-index: 1; +} + +.c22 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + line-height: 16px; + min-height: 31px; + position: relative; +} + +.c19 { + display: inline-block; + grid-row-start: 2; + grid-column-start: 1; + height: 0; + overflow: hidden; + width: 0; +} + +.c25 { + font-weight: inherit; +} + +.c45 { + font-size: 13px; + font-weight: 500; +} + +.c44 { + font-weight: 800; + margin-right: 6px; +} + +.c42 { + color: #807373; + margin-top: 5px; +} + +.c24 img, +.c24 svg { + margin-right: 6px; + height: 24px; + width: 24px; + vertical-align: bottom; +} + +.c23 { + -webkit-flex-shrink: 0; + -ms-flex-negative: 0; + flex-shrink: 0; +} + +.c5 { + grid-column-start: 2; + grid-row: span 2; + padding-right: 5px; +} + +.c28 { + display: grid; + grid-template-columns: 130px auto; +} + +.c3 { + max-width: 500px; + display: grid; + grid-template-areas: "time line title" "time line instructions"; + grid-template-columns: 65px 30px auto; +} + +.c18 { + grid-column-start: 1; + grid-row: 1 / span 2; + padding-right: 5px; + font-size: 0.9em; +} + +.c20 { + grid-row-start: 2; + grid-column-start: 3; + grid-area: instructions; +} + +.c14 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + font-size: 1.2em; + grid-row-start: 1; + grid-column-start: 3; +} + +.c16 { + font-size: inherit; + font-weight: bold; + height: 1.2em; + margin: 0; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + -webkit-flex: 1 1 auto; + -ms-flex: 1 1 auto; + flex: 1 1 auto; + padding: 3px 0 10px 0; +} + +.c39 { + color: #807373; + font-size: 13px; + font-weight: 300; + padding-top: 1px; + margin-bottom: 10px; + margin-top: -14px; +} + +.c32 { + display: block; + list-style: none; + padding: 0; +} + +.c35 { + margin-left: 24px; + line-height: 1.25em; + padding-top: 1px; +} + +.c35 > span { + margin-right: 1ch; +} + +.c29 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-self: center; + -ms-flex-item-align: center; + align-self: center; + margin-top: 10px; +} + +.c29 a { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c30 { + color: #676767; + font-size: 13px; + font-style: normal; + padding: 0; +} + +.c34 { + fill: #676767; + float: left; + height: 16px; + width: 16px; +} + +.c33 { + font-size: 13px; + margin-top: 8px; + color: #676767; + font-style: normal; +} + +.c36 { + font-weight: 500; +} + +.c37 { + font-weight: 200; + opacity: 0.8975; + padding-left: 1ch; +} + +.c54 { + float: left; + margin-left: -36px; + color: #fff; +} + +.c55 { + color: #676767; + margin-top: 3px; +} + +.c52 { + z-index: 30; + position: relative; +} + +.c47 { + margin-top: 5px; +} + +.c48 { + color: #676767; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; +} + +.c50 { + font-size: 14px; +} + +.c49 { + padding: 0; +} + +.c46 { + margin-top: 5px; +} + +.c46 a { + color: #337ab7; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c46 a:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c46 img { + margin-left: 5px; + vertical-align: middle; +} + +.c1 { + font-size: 16px; +} + +.c1 *:not(.fa) { + box-sizing: border-box; + font-family: Hind,sans-serif; +} + +.c1 .c43 { + background-color: rgb(15,106,172); + border-color: white; + border-image: initial; + border-radius: 12px; + border-style: solid; + border-width: 1px; + box-shadow: rgb(0,0,0) 0px 0px 0.25em; + color: white; + display: inline-block; + font-size: 14px; + font-weight: 500; + height: 24px; + line-height: 1.5; + margin-right: 8px; + min-width: 24px; + padding: 2px 3px; + text-align: center; +} + +.c1 .c4 { + grid-area: line; + display: table-cell; + max-width: 20px; + width: 20px; + padding: 0; + position: relative; +} + +.c1 .c13 { + grid-area: title; + color: #000; + font-size: 18px; + font-weight: 500; + line-height: 20px; +} + +.c1 .c15 { + height: inherit; + white-space: normal; +} + +.c1 .c2 { + width: 100%; +} + +.c1 .c53 { + margin-left: -23px; +} + +.c1 .c17 { + grid-area: time; + color: #676767; + display: table-cell; + font-size: 14px; + padding-right: 4px; + padding-top: 2px; + text-align: right; + vertical-align: top; + width: 60px; +} + +.c7 { + position: absolute; + width: 100%; + top: 3px; + z-index: 20; +} + +.c6 { + background: radial-gradient(ellipse at center,#87cefa 40%,transparent 10%); + background-position: center -5px; + background-repeat: repeat-y; + background-size: 12px 12px; + left: 6px; + right: 6px; + bottom: -11px; + position: absolute; + top: 11px; + z-index: 10; +} + +.c38 { + background-color: gray; + left: 5px; + right: 5px; + background-color: #0070c0; + bottom: -11px; + position: absolute; + top: 11px; + z-index: 10; +} + +.c56 { + background-color: gray; + left: 5px; + right: 5px; + background-color: #000088; + bottom: -11px; + position: absolute; + top: 11px; + z-index: 10; +} + +.c9 { + left: 0; + line-height: inherit; + position: absolute; + text-align: center; + width: 100%; +} + +.c10 { + top: 3px; +} + +.c12 { + left: 0; + position: absolute; + text-align: center; + width: 100%; +} + +
      +
    1. +
      +
      + + + + +
      +
      + + 47.97767, -122.20034 + +
      +
      + 12:57 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + + + + + + + + - + + + Walk 0.3 miles to + + Everett Station Bay C1 + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + SOUTH + on + + service road + + + 0.1 miles + + +
        +
        2. +
      2. +
        + + + +
        +
        + + RIGHT + on + + Smith Avenue + + + 129 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + CONTINUE + on + + Paine Avenue + + + 61 feet + + +
        +
        4. +
      4. +
        + + + +
        +
        + + LEFT + on + + 32nd Street + + + 67 feet + + +
        +
        5. +
      5. +
        + + + +
        +
        + + RIGHT + on + + 32nd Street + + + 313 feet + + +
        +
        6. +
      6. +
        + + + +
        +
        + + LEFT + on + + Unnamed Path + + + 380 feet + + +
        +
        7. +
      +
      +
      +       +
      +
      +
      2. +
    2. +
      +
      + + + + +
      +
      + + Everett Station Bay C1 + +
      +
      + 1:04 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      + Stop ID 2345 + +
      +
      +
      + + + + - + Ride + + + + + + + + + + + + + + + 512 + + + + + Northgate Station + + + + + - + Disembark at + Northgate Station + + + + +
      +
      +
      + Service operated by + + Community Transit + +
      +
      +
      +
      +
      +
      + + +
      +
      +
      +
      +
        +
      1. +
        + • +
        +
        + Broadway & 34th St +
        +
        2. +
      2. +
        + • +
        +
        + South Everett Fwy Station Bay 3 +
        +
        3. +
      3. +
        + • +
        +
        + Ash Way Park & Ride Bay 1 +
        +
        4. +
      4. +
        + • +
        +
        + Lynnwood Transit Center Bay D3 +
        +
        5. +
      5. +
        + • +
        +
        + Mountlake Terrace Fwy Station Bay 6 +
        +
        6. +
      +
      +
      +
      +
      +
      +
      +
      +
      3. +
    3. +
      +
      + + + + +
      +
      + + Northgate Station + +
      +
      + 1:51 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      + Stop ID 2191 + +
      +
      +
      + + + + + + + + + + + - + + + Walk to + + Northgate Station - Bay 4 + + + + +
      + + + + +
      +
      +
        +
      +
      +       +
      +
      +
      4. +
    4. +
      +
      + + + + +
      +
      + + Northgate Station - Bay 4 + +
      +
      + 1:55 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      + Stop ID 35318 + +
      +
      +
      + + + + - + Ride + + + + + + + + + + + + + + + 40 + + + + + Downtown Seattle Ballard + + + + + - + Disembark at + N 105th St & Aurora Ave N + + + + +
      +
      +
      + Service operated by + + Metro Transit + +
      +
      +
      +
      +
      +
      + + +
      +
      +
      +
      +
        +
      1. +
        + • +
        +
        + 1st Ave NE & NE 95th St +
        +
        2. +
      2. +
        + • +
        +
        + N 92nd St & Corliss Ave N +
        +
        3. +
      3. +
        + • +
        +
        + College Way N & N 97th St +
        +
        4. +
      4. +
        + • +
        +
        + College Way N & N 103rd St +
        +
        5. +
      5. +
        + • +
        +
        + Meridian Ave N & N 105th St +
        +
        6. +
      6. +
        + • +
        +
        + N Northgate Way & Meridian Ave N +
        +
        7. +
      7. +
        + • +
        +
        + N Northgate Way & Stone Ave N +
        +
        8. +
      +
      +
      +
      +
      +
      +
      +
      +
      5. +
    5. +
      +
      + + + + +
      +
      + + N 105th St & Aurora Ave N + +
      +
      + 2:06 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      + Stop ID 40032 + +
      +
      +
      + + + + + + + + + + + - + + + Walk 259 feet to + + Aurora Ave N & N 105th St + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + EAST + on + + North 105th Street + + + 64 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + RIGHT + on + + service road + + + 14 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + LEFT + on + + Unnamed Path + + + 180 feet + + +
        +
        4. +
      +
      +
      +       +
      +
      +
      6. +
    6. +
      +
      + + + + +
      +
      + + Aurora Ave N & N 105th St + +
      +
      + 2:07 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      + Stop ID 7080 + +
      +
      +
      + + + + - + Ride + + + + + + + + + + + + + + + E Line + + + + + Downtown Seattle + + + + + - + Disembark at + 3rd Ave & Cherry St + + + + +
      +
      +
      + Service operated by + + Metro Transit + +
      +
      +
      +
      +
      +
      + + +
      +
      +
      +
      +
        +
      1. +
        + • +
        +
        + Aurora Ave N & N 100th St +
        +
        2. +
      2. +
        + • +
        +
        + Aurora Ave N & N 95th St +
        +
        3. +
      3. +
        + • +
        +
        + Aurora Ave N & N 90th St +
        +
        4. +
      4. +
        + • +
        +
        + Aurora Ave N & N 85th St +
        +
        5. +
      5. +
        + • +
        +
        + Aurora Ave N & N 80th St +
        +
        6. +
      6. +
        + • +
        +
        + Aurora Ave N & N 76th St +
        +
        7. +
      7. +
        + • +
        +
        + Aurora Ave N & N 65th St +
        +
        8. +
      8. +
        + • +
        +
        + Aurora Ave N & N 46th St +
        +
        9. +
      9. +
        + • +
        +
        + Aurora Ave N & Lynn St +
        +
        10. +
      10. +
        + • +
        +
        + Aurora Ave N & Galer St +
        +
        11. +
      11. +
        + • +
        +
        + 7th Ave N & Thomas St +
        +
        12. +
      12. +
        + • +
        +
        + Wall St & 5th Ave +
        +
        13. +
      13. +
        + • +
        +
        + 3rd Ave & Bell St +
        +
        14. +
      14. +
        + • +
        +
        + 3rd Ave & Virginia St +
        +
        15. +
      15. +
        + • +
        +
        + 3rd Ave & Pike St +
        +
        16. +
      16. +
        + • +
        +
        + 3rd Ave & Seneca St +
        +
        17. +
      +
      +
      +
      +
      +
      +
      +
      +
      7. +
    7. +
      +
      + + + + +
      +
      + + 3rd Ave & Cherry St + +
      +
      + 2:39 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      + Stop ID 490 + +
      +
      +
      + + + + + + + + + + + - + + + Walk 443 feet to + + 208 James St, Seattle, WA 98104-2212, United States + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + SOUTHEAST + on + + sidewalk + + + 326 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + UTURN_RIGHT + on + + sidewalk + + + 117 feet + + +
        +
        3. +
      +
      +
      +       +
      +
      +
      8. +
    8. +
      + + + + +
      +
      + + 208 James St, Seattle, WA 98104-2212, United States + +
      +
      + 2:41 PM +
      + + Arrive at + 208 James St, Seattle, WA 98104-2212, United States + +
      +
      9. +
    +`; + +exports[`Storyshots ItineraryBody/otp-react-redux Walk Only Itinerary 1`] = ` + + + +`; + +exports[`Storyshots ItineraryBody/otp-react-redux Walk Only Itinerary 2`] = ` +.c8 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c11 { + color: #333; +} + +.c37 { + color: #f44256; +} + +.c26 { + background: transparent; + border: 0; + color: inherit; + cursor: pointer; + font-size: inherit; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c31::before { + content: ""; + margin: 0 0.125em; +} + +.c0 { + list-style: none; + padding: 0; +} + +.c21 { + color: #676767; + font-size: 13px; + padding-bottom: 12px; +} + +.c27 { + bottom: 0; + cursor: pointer; + left: 0; + position: absolute; + right: 0; + top: 0; + width: 100%; + z-index: 1; +} + +.c22 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + line-height: 16px; + min-height: 31px; + position: relative; +} + +.c19 { + display: inline-block; + grid-row-start: 2; + grid-column-start: 1; + height: 0; + overflow: hidden; + width: 0; +} + +.c25 { + font-weight: inherit; +} + +.c24 img, +.c24 svg { + margin-right: 6px; + height: 24px; + width: 24px; + vertical-align: bottom; +} + +.c23 { + -webkit-flex-shrink: 0; + -ms-flex-negative: 0; + flex-shrink: 0; +} + +.c5 { + grid-column-start: 2; + grid-row: span 2; + padding-right: 5px; +} + +.c28 { + display: grid; + grid-template-columns: 130px auto; +} + +.c3 { + max-width: 500px; + display: grid; + grid-template-areas: "time line title" "time line instructions"; + grid-template-columns: 65px 30px auto; +} + +.c18 { + grid-column-start: 1; + grid-row: 1 / span 2; + padding-right: 5px; + font-size: 0.9em; +} + +.c20 { + grid-row-start: 2; + grid-column-start: 3; + grid-area: instructions; +} + +.c14 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + font-size: 1.2em; + grid-row-start: 1; + grid-column-start: 3; +} + +.c16 { + font-size: inherit; + font-weight: bold; + height: 1.2em; + margin: 0; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + -webkit-flex: 1 1 auto; + -ms-flex: 1 1 auto; + flex: 1 1 auto; + padding: 3px 0 10px 0; +} + +.c32 { + display: block; + list-style: none; + padding: 0; +} + +.c35 { + margin-left: 24px; + line-height: 1.25em; + padding-top: 1px; +} + +.c35 > span { + margin-right: 1ch; +} + +.c29 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-self: center; + -ms-flex-item-align: center; + align-self: center; + margin-top: 10px; +} + +.c29 a { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c30 { + color: #676767; + font-size: 13px; + font-style: normal; + padding: 0; +} + +.c34 { + fill: #676767; + float: left; + height: 16px; + width: 16px; +} + +.c33 { + font-size: 13px; + margin-top: 8px; + color: #676767; + font-style: normal; +} + +.c36 { + font-weight: 500; +} + +.c1 { + font-size: 16px; +} + +.c1 *:not(.fa) { + box-sizing: border-box; + font-family: Hind,sans-serif; +} + +.c1 .c4 { + grid-area: line; + display: table-cell; + max-width: 20px; + width: 20px; + padding: 0; + position: relative; +} + +.c1 .c13 { + grid-area: title; + color: #000; + font-size: 18px; + font-weight: 500; + line-height: 20px; +} + +.c1 .c15 { + height: inherit; + white-space: normal; +} + +.c1 .c2 { + width: 100%; +} + +.c1 .c17 { + grid-area: time; + color: #676767; + display: table-cell; + font-size: 14px; + padding-right: 4px; + padding-top: 2px; + text-align: right; + vertical-align: top; + width: 60px; +} + +.c7 { + position: absolute; + width: 100%; + top: 3px; + z-index: 20; +} + +.c6 { + background: radial-gradient(ellipse at center,#87cefa 40%,transparent 10%); + background-position: center -5px; + background-repeat: repeat-y; + background-size: 12px 12px; + left: 6px; + right: 6px; + bottom: -11px; + position: absolute; + top: 11px; + z-index: 10; +} + +.c9 { + left: 0; + line-height: inherit; + position: absolute; + text-align: center; + width: 100%; +} + +.c10 { + top: 3px; +} + +.c12 { + left: 0; + position: absolute; + text-align: center; + width: 100%; +} + +
      +
    1. +
      +
      + + + + +
      +
      + + KGW Studio on the Sq, Portland, OR, USA + +
      +
      + 11:29 AM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + + + + + + + + - + + + Walk 166 feet to + + 701 SW 6th Ave, Portland, OR, USA 97204 + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + NORTHWEST + on + + Unnamed Path + + +
        +
        2. +
      2. +
        + + + +
        +
        + + LEFT + on + + Unnamed Path + + +
        +
        3. +
      +
      +
      +       +
      +
      +
      2. +
    2. +
      + + + + +
      +
      + + 701 SW 6th Ave, Portland, OR, USA 97204 + +
      +
      + 11:30 AM +
      + + Arrive at + 701 SW 6th Ave, Portland, OR, USA 97204 + +
      +
      3. +
    +`; + +exports[`Storyshots ItineraryBody/otp-react-redux Walk Transit Transfer Itinerary 1`] = ` + + + +`; + +exports[`Storyshots ItineraryBody/otp-react-redux Walk Transit Transfer Itinerary 2`] = ` +.c8 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c11 { + color: #333; +} + +.c57 { + color: #f44256; +} + +.c26 { + background: transparent; + border: 0; + color: inherit; + cursor: pointer; + font-size: inherit; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c40 { + color: #008; + margin-left: 5px; +} + +.c40:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c41 { + padding-left: 0px; +} + +.c41:before { + content: "|"; + color: black; + margin-right: 5px; +} + +.c31::before { + content: ""; + margin: 0 0.125em; +} + +.c52 { + display: block; + font-size: 13px; + list-style: none; + padding: 0; +} + +.c0 { + list-style: none; + padding: 0; +} + +.c21 { + color: #676767; + font-size: 13px; + padding-bottom: 12px; +} + +.c27 { + bottom: 0; + cursor: pointer; + left: 0; + position: absolute; + right: 0; + top: 0; + width: 100%; + z-index: 1; +} + +.c22 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + line-height: 16px; + min-height: 31px; + position: relative; +} + +.c19 { + display: inline-block; + grid-row-start: 2; + grid-column-start: 1; + height: 0; + overflow: hidden; + width: 0; +} + +.c46 { + font-weight: 200; +} + +.c25 { + font-weight: inherit; +} + +.c45 { + font-size: 13px; + font-weight: 500; +} + +.c44 { + font-weight: 800; + margin-right: 6px; +} + +.c42 { + color: #807373; + margin-top: 5px; +} + +.c24 img, +.c24 svg { + margin-right: 6px; + height: 24px; + width: 24px; + vertical-align: bottom; +} + +.c23 { + -webkit-flex-shrink: 0; + -ms-flex-negative: 0; + flex-shrink: 0; +} + +.c5 { + grid-column-start: 2; + grid-row: span 2; + padding-right: 5px; +} + +.c28 { + display: grid; + grid-template-columns: 130px auto; +} + +.c3 { + max-width: 500px; + display: grid; + grid-template-areas: "time line title" "time line instructions"; + grid-template-columns: 65px 30px auto; +} + +.c18 { + grid-column-start: 1; + grid-row: 1 / span 2; + padding-right: 5px; + font-size: 0.9em; +} + +.c20 { + grid-row-start: 2; + grid-column-start: 3; + grid-area: instructions; +} + +.c14 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + font-size: 1.2em; + grid-row-start: 1; + grid-column-start: 3; +} + +.c16 { + font-size: inherit; + font-weight: bold; + height: 1.2em; + margin: 0; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + -webkit-flex: 1 1 auto; + -ms-flex: 1 1 auto; + flex: 1 1 auto; + padding: 3px 0 10px 0; +} + +.c39 { + color: #807373; + font-size: 13px; + font-weight: 300; + padding-top: 1px; + margin-bottom: 10px; + margin-top: -14px; +} + +.c32 { + display: block; + list-style: none; + padding: 0; +} + +.c35 { + margin-left: 24px; + line-height: 1.25em; + padding-top: 1px; +} + +.c35 > span { + margin-right: 1ch; +} + +.c29 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-self: center; + -ms-flex-item-align: center; + align-self: center; + margin-top: 10px; +} + +.c29 a { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c30 { + color: #676767; + font-size: 13px; + font-style: normal; + padding: 0; +} + +.c34 { + fill: #676767; + float: left; + height: 16px; + width: 16px; +} + +.c33 { + font-size: 13px; + margin-top: 8px; + color: #676767; + font-style: normal; +} + +.c36 { + font-weight: 500; +} + +.c37 { + font-weight: 200; + opacity: 0.8975; + padding-left: 1ch; +} + +.c55 { + float: left; + margin-left: -36px; + color: #fff; +} + +.c56 { + color: #676767; + margin-top: 3px; +} + +.c53 { + z-index: 30; + position: relative; +} + +.c48 { + margin-top: 5px; +} + +.c49 { + color: #676767; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; +} + +.c51 { + font-size: 14px; +} + +.c50 { + padding: 0; +} + +.c47 { + margin-top: 5px; +} + +.c47 a { + color: #337ab7; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c47 a:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c47 img { + margin-left: 5px; + vertical-align: middle; +} + +.c1 { + font-size: 16px; +} + +.c1 *:not(.fa) { + box-sizing: border-box; + font-family: Hind,sans-serif; +} + +.c1 .c43 { + background-color: rgb(15,106,172); + border-color: white; + border-image: initial; + border-radius: 12px; + border-style: solid; + border-width: 1px; + box-shadow: rgb(0,0,0) 0px 0px 0.25em; + color: white; + display: inline-block; + font-size: 14px; + font-weight: 500; + height: 24px; + line-height: 1.5; + margin-right: 8px; + min-width: 24px; + padding: 2px 3px; + text-align: center; +} + +.c1 .c4 { + grid-area: line; + display: table-cell; + max-width: 20px; + width: 20px; + padding: 0; + position: relative; +} + +.c1 .c13 { + grid-area: title; + color: #000; + font-size: 18px; + font-weight: 500; + line-height: 20px; +} + +.c1 .c15 { + height: inherit; + white-space: normal; +} + +.c1 .c2 { + width: 100%; +} + +.c1 .c54 { + margin-left: -23px; +} + +.c1 .c17 { + grid-area: time; + color: #676767; + display: table-cell; + font-size: 14px; + padding-right: 4px; + padding-top: 2px; + text-align: right; + vertical-align: top; + width: 60px; +} + +.c7 { + position: absolute; + width: 100%; + top: 3px; + z-index: 20; +} + +.c6 { + background: radial-gradient(ellipse at center,#87cefa 40%,transparent 10%); + background-position: center -5px; + background-repeat: repeat-y; + background-size: 12px 12px; + left: 6px; + right: 6px; + bottom: -11px; + position: absolute; + top: 11px; + z-index: 10; +} + +.c38 { + background-color: gray; + left: 5px; + right: 5px; + background-color: #000088; + bottom: -11px; + position: absolute; + top: 11px; + z-index: 10; +} + +.c9 { + left: 0; + line-height: inherit; + position: absolute; + text-align: center; + width: 100%; +} + +.c10 { + top: 3px; +} + +.c12 { + left: 0; + position: absolute; + text-align: center; + width: 100%; +} + +
      +
    1. +
      +
      + + + + +
      +
      + + 3940 SE Brooklyn St, Portland, OR, USA 97202 + +
      +
      + 3:46 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + + + + + + + + - + + + Walk 238 feet to + + SE Cesar Chavez Blvd & Brooklyn (long address that spans multiple lines) + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + WEST + on + + SE Brooklyn St + + + 205 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + RIGHT + on + + SE Cesar E. Chavez Blvd + + + 33 feet + + +
        +
        3. +
      +
      +
      +       +
      +
      +
      2. +
    2. +
      +
      + + + + +
      +
      + + SE Cesar Chavez Blvd & Brooklyn + +
      +
      + 3:47 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      + Stop ID 7439 + +
      +
      +
      + + + + - + Ride + + + + + + + + + + + + + + + 755X + + + + + Cesar Chavez/Lombard (very long route name) + + to + + St. Johns via NAYA + + + + + - + Disembark at + SE Cesar Chavez Blvd & Hawthorne + + + + +
      +
      +
      + Service operated by + + TriMet + + +
      +
      +
      +
      +
      +
      + + +
      +
      +
      +
      +
        +
      1. +
        + • +
        +
        + SE Cesar Chavez Blvd & Clinton +
        +
        2. +
      2. +
        + • +
        +
        + SE Cesar Chavez Blvd & Division +
        +
        3. +
      3. +
        + • +
        +
        + SE Cesar Chavez Blvd & Lincoln +
        +
        4. +
      4. +
        + • +
        +
        + SE Cesar Chavez Blvd & Stephens +
        +
        5. +
      +
      +
      +
      +
      +
      +
      +
      +
      3. +
    3. +
      +
      + + + + +
      +
      + + SE Cesar Chavez Blvd & Hawthorne + +
      +
      + 3:52 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      + Stop ID 7459 + +
      +
      +
      + + + + + + + + + + + - + + + Walk 440 feet to + + SE Hawthorne & Cesar Chavez Blvd + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + SOUTH + on + + service road + + + 146 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + RIGHT + on + + SE Cesar E. Chavez Blvd + + + 198 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + LEFT + on + + SE Hawthorne Blvd + + + 96 feet + + +
        +
        4. +
      +
      +
      +       +
      +
      +
      4. +
    4. +
      +
      + + + + +
      +
      + + SE Hawthorne & Cesar Chavez Blvd + +
      +
      + 4:00 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      + Stop ID 2626 + +
      +
      +
      + + + + - + Ride + + + + + + + + + + + + + + + 1 + + + + + Hawthorne + + to + + Portland + + + + + - + Disembark at + SE Hawthorne & 27th + + + + +
      +
      +
      + Service operated by + + TriMet + + +
      +
      +
      +
      +
      +
      + + +
      +
      +
      +
      +
        +
      1. +
        + • +
        +
        + SE Hawthorne & 37th +
        +
        2. +
      2. +
        + • +
        +
        + SE Hawthorne & 34th +
        +
        3. +
      3. +
        + • +
        +
        + SE Hawthorne & 32nd +
        +
        4. +
      4. +
        + • +
        +
        + SE Hawthorne & 30th +
        +
        5. +
      +
      +
      +
      +
      +
      +
      +
      +
      5. +
    5. +
      +
      + + + + +
      +
      + + SE Hawthorne & 27th + +
      +
      + 4:04 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      + Stop ID 2613 + +
      +
      +
      + + + + + + + + + + + - + + + Walk 479 feet to + + 1415 SE 28th Ave, Portland, OR, USA 97214 + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + WEST + on + + SE Hawthorne Blvd + + + 40 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + RIGHT + on + + SE 27th Ave + + + 294 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + RIGHT + on + + SE Madison St + + + 146 feet + + +
        +
        4. +
      +
      +
      +       +
      +
      +
      6. +
    6. +
      + + + + +
      +
      + + 1415 SE 28th Ave, Portland, OR, USA 97214 + +
      +
      + 4:06 PM +
      + + Arrive at + 1415 SE 28th Ave, Portland, OR, USA 97214 + +
      +
      7. +
    +`; + +exports[`Storyshots ItineraryBody/otp-react-redux Walk Transit Transfer With A 11 Y Itinerary 1`] = ` + + + +`; + +exports[`Storyshots ItineraryBody/otp-react-redux Walk Transit Transfer With A 11 Y Itinerary 2`] = ` +.c8 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c11 { + color: #333; +} + +.c61 { + color: #f44256; +} + +.c28 { + background: transparent; + border: 0; + color: inherit; + cursor: pointer; + font-size: inherit; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c43 { + color: #008; + margin-left: 5px; +} + +.c43:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c44 { + padding-left: 0px; +} + +.c44:before { + content: "|"; + color: black; + margin-right: 5px; +} + +.c33::before { + content: ""; + margin: 0 0.125em; +} + +.c55 { + display: block; + font-size: 13px; + list-style: none; + padding: 0; +} + +.c0 { + list-style: none; + padding: 0; +} + +.c23 { + color: #676767; + font-size: 13px; + padding-bottom: 12px; +} + +.c29 { + bottom: 0; + cursor: pointer; + left: 0; + position: absolute; + right: 0; + top: 0; + width: 100%; + z-index: 1; +} + +.c24 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + line-height: 16px; + min-height: 31px; + position: relative; +} + +.c20 { + display: inline-block; + grid-row-start: 2; + grid-column-start: 1; + height: 0; + overflow: hidden; + width: 0; +} + +.c49 { + font-weight: 200; +} + +.c27 { + font-weight: inherit; +} + +.c48 { + font-size: 13px; + font-weight: 500; +} + +.c47 { + font-weight: 800; + margin-right: 6px; +} + +.c45 { + color: #807373; + margin-top: 5px; +} + +.c26 img, +.c26 svg { + margin-right: 6px; + height: 24px; + width: 24px; + vertical-align: bottom; +} + +.c25 { + -webkit-flex-shrink: 0; + -ms-flex-negative: 0; + flex-shrink: 0; +} + +.c5 { + grid-column-start: 2; + grid-row: span 2; + padding-right: 5px; +} + +.c30 { + display: grid; + grid-template-columns: 130px auto; +} + +.c3 { + max-width: 500px; + display: grid; + grid-template-areas: "time line title" "time line instructions"; + grid-template-columns: 65px 30px auto; +} + +.c18 { + grid-column-start: 1; + grid-row: 1 / span 2; + padding-right: 5px; + font-size: 0.9em; +} + +.c22 { + grid-row-start: 2; + grid-column-start: 3; + grid-area: instructions; +} + +.c14 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + font-size: 1.2em; + grid-row-start: 1; + grid-column-start: 3; +} + +.c16 { + font-size: inherit; + font-weight: bold; + height: 1.2em; + margin: 0; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + -webkit-flex: 1 1 auto; + -ms-flex: 1 1 auto; + flex: 1 1 auto; + padding: 3px 0 10px 0; +} + +.c42 { + color: #807373; + font-size: 13px; + font-weight: 300; + padding-top: 1px; + margin-bottom: 10px; + margin-top: -14px; +} + +.c34 { + display: block; + list-style: none; + padding: 0; +} + +.c37 { + margin-left: 24px; + line-height: 1.25em; + padding-top: 1px; +} + +.c37 > span { + margin-right: 1ch; +} + +.c31 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-self: center; + -ms-flex-item-align: center; + align-self: center; + margin-top: 10px; +} + +.c31 a { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c32 { + color: #676767; + font-size: 13px; + font-style: normal; + padding: 0; +} + +.c36 { + fill: #676767; + float: left; + height: 16px; + width: 16px; +} + +.c35 { + font-size: 13px; + margin-top: 8px; + color: #676767; + font-style: normal; +} + +.c38 { + font-weight: 500; +} + +.c39 { + font-weight: 200; + opacity: 0.8975; + padding-left: 1ch; +} + +.c58 { + float: left; + margin-left: -36px; + color: #fff; +} + +.c59 { + color: #676767; + margin-top: 3px; +} + +.c56 { + z-index: 30; + position: relative; +} + +.c51 { + margin-top: 5px; +} + +.c52 { + color: #676767; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; +} + +.c54 { + font-size: 14px; +} + +.c53 { + padding: 0; +} + +.c50 { + margin-top: 5px; +} + +.c50 a { + color: #337ab7; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c50 a:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c50 img { + margin-left: 5px; + vertical-align: middle; +} + +.c19 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + border: none; + background-color: #bfffb5; + border-radius: 20px; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-box-pack: justify; + -webkit-justify-content: space-between; + -ms-flex-pack: justify; + justify-content: space-between; + margin-top: 0.25em; + max-width: 75px; + height: 30px; + padding: 0.25em 0.6em 0.25em 0.4em; + word-wrap: anywhere; +} + +.c41 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + border: none; + background-color: #dbe9ff; + border-radius: 20px; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-box-pack: justify; + -webkit-justify-content: space-between; + -ms-flex-pack: justify; + justify-content: space-between; + margin-top: 0.25em; + max-width: 75px; + height: 30px; + padding: 0.25em 0.6em 0.25em 0.4em; + word-wrap: anywhere; +} + +.c60 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + border: none; + background-color: #ffe4e5; + border-radius: 20px; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-box-pack: justify; + -webkit-justify-content: space-between; + -ms-flex-pack: justify; + justify-content: space-between; + margin-top: 0.25em; + max-width: 75px; + height: 30px; + padding: 0.25em 0.6em 0.25em 0.4em; + word-wrap: anywhere; +} + +.c21 { + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; +} + +.c21 span { + display: block; +} + +.c1 { + font-size: 16px; +} + +.c1 *:not(.fa) { + box-sizing: border-box; + font-family: Hind,sans-serif; +} + +.c1 .c46 { + background-color: rgb(15,106,172); + border-color: white; + border-image: initial; + border-radius: 12px; + border-style: solid; + border-width: 1px; + box-shadow: rgb(0,0,0) 0px 0px 0.25em; + color: white; + display: inline-block; + font-size: 14px; + font-weight: 500; + height: 24px; + line-height: 1.5; + margin-right: 8px; + min-width: 24px; + padding: 2px 3px; + text-align: center; +} + +.c1 .c4 { + grid-area: line; + display: table-cell; + max-width: 20px; + width: 20px; + padding: 0; + position: relative; +} + +.c1 .c13 { + grid-area: title; + color: #000; + font-size: 18px; + font-weight: 500; + line-height: 20px; +} + +.c1 .c15 { + height: inherit; + white-space: normal; +} + +.c1 .c2 { + width: 100%; +} + +.c1 .c57 { + margin-left: -23px; +} + +.c1 .c17 { + grid-area: time; + color: #676767; + display: table-cell; + font-size: 14px; + padding-right: 4px; + padding-top: 2px; + text-align: right; + vertical-align: top; + width: 60px; +} + +.c7 { + position: absolute; + width: 100%; + top: 3px; + z-index: 20; +} + +.c6 { + background: radial-gradient(ellipse at center,#87cefa 40%,transparent 10%); + background-position: center -5px; + background-repeat: repeat-y; + background-size: 12px 12px; + left: 6px; + right: 6px; + bottom: -11px; + position: absolute; + top: 11px; + z-index: 10; +} + +.c40 { + background-color: gray; + left: 5px; + right: 5px; + background-color: #000088; + bottom: -11px; + position: absolute; + top: 11px; + z-index: 10; +} + +.c9 { + left: 0; + line-height: inherit; + position: absolute; + text-align: center; + width: 100%; +} + +.c10 { + top: 3px; +} + +.c12 { + left: 0; + position: absolute; + text-align: center; + width: 100%; +} + +
      +
    1. +
      +
      + + + + +
      +
      + + 3940 SE Brooklyn St, Portland, OR, USA 97202 + +
      +
      + 3:46 PM +
      + + otpUi.ItineraryBody.tripAccessibility.legAccessibilityotpUi.ItineraryBody.tripAccessibility.likelyAccessible + + + + ✅ + +
      +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + + + + + + + + - + + + Walk 238 feet to + + SE Cesar Chavez Blvd & Brooklyn (long address that spans multiple lines) + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + WEST + on + + SE Brooklyn St + + + 205 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + RIGHT + on + + SE Cesar E. Chavez Blvd + + + 33 feet + + +
        +
        3. +
      +
      +
      +       +
      +
      +
      2. +
    2. +
      +
      + + + + +
      +
      + + SE Cesar Chavez Blvd & Brooklyn + +
      +
      + 3:47 PM +
      + + otpUi.ItineraryBody.tripAccessibility.legAccessibilityotpUi.ItineraryBody.tripAccessibility.unclear + + + + ？ + +
      +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      + Stop ID 7439 + +
      +
      +
      + + + + - + Ride + + + + + + + + + + + + + + + 755X + + + + + Cesar Chavez/Lombard (very long route name) + + to + + St. Johns via NAYA + + + + + - + Disembark at + SE Cesar Chavez Blvd & Hawthorne + + + + +
      +
      +
      + Service operated by + + TriMet + + +
      +
      +
      +
      +
      +
      + + +
      +
      +
      +
      +
        +
      1. +
        + • +
        +
        + SE Cesar Chavez Blvd & Clinton +
        +
        2. +
      2. +
        + • +
        +
        + SE Cesar Chavez Blvd & Division +
        +
        3. +
      3. +
        + • +
        +
        + SE Cesar Chavez Blvd & Lincoln +
        +
        4. +
      4. +
        + • +
        +
        + SE Cesar Chavez Blvd & Stephens +
        +
        5. +
      +
      +
      +
      +
      +
      +
      +
      +
      3. +
    3. +
      +
      + + + + +
      +
      + + SE Cesar Chavez Blvd & Hawthorne + +
      +
      + 3:52 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      + Stop ID 7459 + +
      +
      +
      + + + + + + + + + + + - + + + Walk 440 feet to + + SE Hawthorne & Cesar Chavez Blvd + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + SOUTH + on + + service road + + + 146 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + RIGHT + on + + SE Cesar E. Chavez Blvd + + + 198 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + LEFT + on + + SE Hawthorne Blvd + + + 96 feet + + +
        +
        4. +
      +
      +
      +       +
      +
      +
      4. +
    4. +
      +
      + + + + +
      +
      + + SE Hawthorne & Cesar Chavez Blvd + +
      +
      + 4:00 PM +
      + + otpUi.ItineraryBody.tripAccessibility.legAccessibilityotpUi.ItineraryBody.tripAccessibility.inaccessible + + + + ❌ + +
      +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      + Stop ID 2626 + +
      +
      +
      + + + + - + Ride + + + + + + + + + + + + + + + 1 + + + + + Hawthorne + + to + + Portland + + + + + - + Disembark at + SE Hawthorne & 27th + + + + +
      +
      +
      + Service operated by + + TriMet + + +
      +
      +
      +
      +
      +
      + + +
      +
      +
      +
      +
        +
      1. +
        + • +
        +
        + SE Hawthorne & 37th +
        +
        2. +
      2. +
        + • +
        +
        + SE Hawthorne & 34th +
        +
        3. +
      3. +
        + • +
        +
        + SE Hawthorne & 32nd +
        +
        4. +
      4. +
        + • +
        +
        + SE Hawthorne & 30th +
        +
        5. +
      +
      +
      +
      +
      +
      +
      +
      +
      5. +
    5. +
      +
      + + + + +
      +
      + + SE Hawthorne & 27th + +
      +
      + 4:04 PM +
      + + otpUi.ItineraryBody.tripAccessibility.legAccessibilityotpUi.ItineraryBody.tripAccessibility.inaccessible + + + + ❌ + +
      +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      + Stop ID 2613 + +
      +
      +
      + + + + + + + + + + + - + + + Walk 479 feet to + + 1415 SE 28th Ave, Portland, OR, USA 97214 + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + WEST + on + + SE Hawthorne Blvd + + + 40 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + RIGHT + on + + SE 27th Ave + + + 294 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + RIGHT + on + + SE Madison St + + + 146 feet + + +
        +
        4. +
      +
      +
      +       +
      +
      +
      6. +
    6. +
      + + + + +
      +
      + + 1415 SE 28th Ave, Portland, OR, USA 97214 + +
      +
      + 4:06 PM +
      + + Arrive at + 1415 SE 28th Ave, Portland, OR, USA 97214 + +
      +
      7. +
    +`; + +exports[`Storyshots ItineraryBody/otp-react-redux Walk Transit Walk Itinerary 1`] = ` + + + +`; + +exports[`Storyshots ItineraryBody/otp-react-redux Walk Transit Walk Itinerary 2`] = ` +.c8 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c11 { + color: #333; +} + +.c64 { + color: #f44256; +} + +.c26 { + background: transparent; + border: 0; + color: inherit; + cursor: pointer; + font-size: inherit; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c40 { + color: #008; + margin-left: 5px; +} + +.c40:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c41 { + padding-left: 0px; +} + +.c41:before { + content: "|"; + color: black; + margin-right: 5px; +} + +.c31::before { + content: ""; + margin: 0 0.125em; +} + +.c59 { + display: block; + font-size: 13px; + list-style: none; + padding: 0; +} + +.c0 { + list-style: none; + padding: 0; +} + +.c21 { + color: #676767; + font-size: 13px; + padding-bottom: 12px; +} + +.c27 { + bottom: 0; + cursor: pointer; + left: 0; + position: absolute; + right: 0; + top: 0; + width: 100%; + z-index: 1; +} + +.c22 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + line-height: 16px; + min-height: 31px; + position: relative; +} + +.c19 { + display: inline-block; + grid-row-start: 2; + grid-column-start: 1; + height: 0; + overflow: hidden; + width: 0; +} + +.c46 { + font-weight: 200; +} + +.c25 { + font-weight: inherit; +} + +.c45 { + font-size: 13px; + font-weight: 500; +} + +.c44 { + font-weight: 800; + margin-right: 6px; +} + +.c42 { + color: #807373; + margin-top: 5px; +} + +.c24 img, +.c24 svg { + margin-right: 6px; + height: 24px; + width: 24px; + vertical-align: bottom; +} + +.c23 { + -webkit-flex-shrink: 0; + -ms-flex-negative: 0; + flex-shrink: 0; +} + +.c5 { + grid-column-start: 2; + grid-row: span 2; + padding-right: 5px; +} + +.c28 { + display: grid; + grid-template-columns: 130px auto; +} + +.c3 { + max-width: 500px; + display: grid; + grid-template-areas: "time line title" "time line instructions"; + grid-template-columns: 65px 30px auto; +} + +.c18 { + grid-column-start: 1; + grid-row: 1 / span 2; + padding-right: 5px; + font-size: 0.9em; +} + +.c20 { + grid-row-start: 2; + grid-column-start: 3; + grid-area: instructions; +} + +.c14 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + font-size: 1.2em; + grid-row-start: 1; + grid-column-start: 3; +} + +.c16 { + font-size: inherit; + font-weight: bold; + height: 1.2em; + margin: 0; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + -webkit-flex: 1 1 auto; + -ms-flex: 1 1 auto; + flex: 1 1 auto; + padding: 3px 0 10px 0; +} + +.c39 { + color: #807373; + font-size: 13px; + font-weight: 300; + padding-top: 1px; + margin-bottom: 10px; + margin-top: -14px; +} + +.c32 { + display: block; + list-style: none; + padding: 0; +} + +.c35 { + margin-left: 24px; + line-height: 1.25em; + padding-top: 1px; +} + +.c35 > span { + margin-right: 1ch; +} + +.c29 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-self: center; + -ms-flex-item-align: center; + align-self: center; + margin-top: 10px; +} + +.c29 a { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c30 { + color: #676767; + font-size: 13px; + font-style: normal; + padding: 0; +} + +.c34 { + fill: #676767; + float: left; + height: 16px; + width: 16px; +} + +.c33 { + font-size: 13px; + margin-top: 8px; + color: #676767; + font-style: normal; +} + +.c36 { + font-weight: 500; +} + +.c37 { + font-weight: 200; + opacity: 0.8975; + padding-left: 1ch; +} + +.c62 { + float: left; + margin-left: -36px; + color: #fff; +} + +.c63 { + color: #676767; + margin-top: 3px; +} + +.c60 { + z-index: 30; + position: relative; +} + +.c50 { + background-color: #eee; + border-radius: 4px; + color: #000; + display: block; + margin-top: 5px; + padding: 8px; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c54 { + -webkit-align-items: baseline; + -webkit-box-align: baseline; + -ms-flex-align: baseline; + align-items: baseline; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + gap: 5px; + margin-top: 0.5em; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c54:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c52 { + font-size: 12px; + margin-left: 30px; + white-space: pre-wrap; +} + +.c53 { + margin-top: 5px; + margin-left: 30px; + font-size: 12px; + font-style: italic; +} + +.c51 { + float: left; + font-size: 18px; +} + +.c49 { + display: block; + margin-top: 3px; + padding: 0; +} + +.c48 { + color: #d14727; + cursor: cursor; + display: inline-block; + font-weight: 400; + margin-top: 8px; + padding: 0; +} + +.c55 { + margin-top: 5px; +} + +.c56 { + color: #676767; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; +} + +.c58 { + font-size: 14px; +} + +.c57 { + padding: 0; +} + +.c47 { + margin-top: 5px; +} + +.c47 a { + color: #337ab7; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c47 a:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c47 img { + margin-left: 5px; + vertical-align: middle; +} + +.c1 { + font-size: 16px; +} + +.c1 *:not(.fa) { + box-sizing: border-box; + font-family: Hind,sans-serif; +} + +.c1 .c43 { + background-color: rgb(15,106,172); + border-color: white; + border-image: initial; + border-radius: 12px; + border-style: solid; + border-width: 1px; + box-shadow: rgb(0,0,0) 0px 0px 0.25em; + color: white; + display: inline-block; + font-size: 14px; + font-weight: 500; + height: 24px; + line-height: 1.5; + margin-right: 8px; + min-width: 24px; + padding: 2px 3px; + text-align: center; +} + +.c1 .c4 { + grid-area: line; + display: table-cell; + max-width: 20px; + width: 20px; + padding: 0; + position: relative; +} + +.c1 .c13 { + grid-area: title; + color: #000; + font-size: 18px; + font-weight: 500; + line-height: 20px; +} + +.c1 .c15 { + height: inherit; + white-space: normal; +} + +.c1 .c2 { + width: 100%; +} + +.c1 .c61 { + margin-left: -23px; +} + +.c1 .c17 { + grid-area: time; + color: #676767; + display: table-cell; + font-size: 14px; + padding-right: 4px; + padding-top: 2px; + text-align: right; + vertical-align: top; + width: 60px; +} + +.c7 { + position: absolute; + width: 100%; + top: 3px; + z-index: 20; +} + +.c6 { + background: radial-gradient(ellipse at center,#87cefa 40%,transparent 10%); + background-position: center -5px; + background-repeat: repeat-y; + background-size: 12px 12px; + left: 6px; + right: 6px; + bottom: -11px; + position: absolute; + top: 11px; + z-index: 10; +} + +.c38 { + background-color: gray; + left: 5px; + right: 5px; + background-color: #084C8D; + bottom: -11px; + position: absolute; + top: 11px; + z-index: 10; +} + +.c9 { + left: 0; + line-height: inherit; + position: absolute; + text-align: center; + width: 100%; +} + +.c10 { + top: 3px; +} + +.c12 { + left: 0; + position: absolute; + text-align: center; + width: 100%; +} + +
      +
    1. +
      +
      + + + + +
      +
      + + KGW Studio on the Sq, Portland, OR, USA + +
      +
      + 3:44 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + + + + + + + + - + + + Walk 269 feet to + + Pioneer Square North MAX Station + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + NORTHWEST + on + + Unnamed Path + + + 167 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + LEFT + on + + Pioneer Sq N (path) + + + 101 feet + + +
        +
        3. +
      +
      +
      +       +
      +
      +
      2. +
    2. +
      +
      + + + + +
      +
      + + Pioneer Square North MAX Station + +
      +
      + 3:46 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      + Stop ID 8383 + +
      +
      +
      + + + + - + Ride + + + + + + + + + + + + MAX Blue Line + + + + + MAX Blue Line + + to + + Hillsboro + + + + + - + Disembark at + Providence Park MAX Station + + + + +
      +
      +
      + Service operated by + + TriMet + + +
      + +
      +
      + +
      +
      +
      +
      + + +
      +
      +
      +
      +
        +
      1. +
        + • +
        +
        + Galleria/SW 10th Ave MAX Station +
        +
        2. +
      +
      +
      +
      + + Typical wait: + 15 min + +
      +
      +
      +
      +
      3. +
    3. +
      +
      + + + + +
      +
      + + Providence Park MAX Station + +
      +
      + 3:49 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      + Stop ID 9757 + +
      +
      +
      + + + + + + + + + + + - + + + Walk 249 feet to + + 1737 SW Morrison St, Portland, OR, USA 97205 + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + WEST + on + + Providence Park (path) + + + 19 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + RIGHT + on + + Unnamed Path + + + 104 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + RIGHT + on + + Unnamed Path + + + 27 feet + + +
        +
        4. +
      4. +
        + + + +
        +
        + + RIGHT + on + + SW Morrison St + + + 99 feet + + +
        +
        5. +
      +
      +
      +       +
      +
      +
      4. +
    4. +
      + + + + +
      +
      + + 1737 SW Morrison St, Portland, OR, USA 97205 + +
      +
      + 3:50 PM +
      + + Arrive at + 1737 SW Morrison St, Portland, OR, USA 97205 + +
      +
      5. +
    +`; + +exports[`Storyshots ItineraryBody/otp-react-redux Zero Alerts Always Collapsing 1`] = ` + + + +`; + +exports[`Storyshots ItineraryBody/otp-react-redux Zero Alerts Always Collapsing 2`] = ` +.c8 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c11 { + color: #333; +} + +.c57 { + color: #f44256; +} + +.c26 { + background: transparent; + border: 0; + color: inherit; + cursor: pointer; + font-size: inherit; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c40 { + color: #008; + margin-left: 5px; +} + +.c40:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c41 { + padding-left: 0px; +} + +.c41:before { + content: "|"; + color: black; + margin-right: 5px; +} + +.c31::before { + content: ""; + margin: 0 0.125em; +} + +.c51 { + display: block; + font-size: 13px; + list-style: none; + padding: 0; +} + +.c0 { + list-style: none; + padding: 0; +} + +.c21 { + color: #676767; + font-size: 13px; + padding-bottom: 12px; +} + +.c27 { + bottom: 0; + cursor: pointer; + left: 0; + position: absolute; + right: 0; + top: 0; + width: 100%; + z-index: 1; +} + +.c22 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + line-height: 16px; + min-height: 31px; + position: relative; +} + +.c19 { + display: inline-block; + grid-row-start: 2; + grid-column-start: 1; + height: 0; + overflow: hidden; + width: 0; +} + +.c25 { + font-weight: inherit; +} + +.c45 { + font-size: 13px; + font-weight: 500; +} + +.c44 { + font-weight: 800; + margin-right: 6px; +} + +.c42 { + color: #807373; + margin-top: 5px; +} + +.c24 img, +.c24 svg { + margin-right: 6px; + height: 24px; + width: 24px; + vertical-align: bottom; +} + +.c23 { + -webkit-flex-shrink: 0; + -ms-flex-negative: 0; + flex-shrink: 0; +} + +.c5 { + grid-column-start: 2; + grid-row: span 2; + padding-right: 5px; +} + +.c28 { + display: grid; + grid-template-columns: 130px auto; +} + +.c3 { + max-width: 500px; + display: grid; + grid-template-areas: "time line title" "time line instructions"; + grid-template-columns: 65px 30px auto; +} + +.c18 { + grid-column-start: 1; + grid-row: 1 / span 2; + padding-right: 5px; + font-size: 0.9em; +} + +.c20 { + grid-row-start: 2; + grid-column-start: 3; + grid-area: instructions; +} + +.c14 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + font-size: 1.2em; + grid-row-start: 1; + grid-column-start: 3; +} + +.c16 { + font-size: inherit; + font-weight: bold; + height: 1.2em; + margin: 0; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + -webkit-flex: 1 1 auto; + -ms-flex: 1 1 auto; + flex: 1 1 auto; + padding: 3px 0 10px 0; +} + +.c39 { + color: #807373; + font-size: 13px; + font-weight: 300; + padding-top: 1px; + margin-bottom: 10px; + margin-top: -14px; +} + +.c32 { + display: block; + list-style: none; + padding: 0; +} + +.c35 { + margin-left: 24px; + line-height: 1.25em; + padding-top: 1px; +} + +.c35 > span { + margin-right: 1ch; +} + +.c29 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-self: center; + -ms-flex-item-align: center; + align-self: center; + margin-top: 10px; +} + +.c29 a { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c30 { + color: #676767; + font-size: 13px; + font-style: normal; + padding: 0; +} + +.c34 { + fill: #676767; + float: left; + height: 16px; + width: 16px; +} + +.c33 { + font-size: 13px; + margin-top: 8px; + color: #676767; + font-style: normal; +} + +.c36 { + font-weight: 500; +} + +.c37 { + font-weight: 200; + opacity: 0.8975; + padding-left: 1ch; +} + +.c54 { + float: left; + margin-left: -36px; + color: #fff; +} + +.c55 { + color: #676767; + margin-top: 3px; +} + +.c52 { + z-index: 30; + position: relative; +} + +.c47 { + margin-top: 5px; +} + +.c48 { + color: #676767; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; +} + +.c50 { + font-size: 14px; +} + +.c49 { + padding: 0; +} + +.c46 { + margin-top: 5px; +} + +.c46 a { + color: #337ab7; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c46 a:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c46 img { + margin-left: 5px; + vertical-align: middle; +} + +.c1 { + font-size: 16px; +} + +.c1 *:not(.fa) { + box-sizing: border-box; + font-family: Hind,sans-serif; +} + +.c1 .c43 { + background-color: rgb(15,106,172); + border-color: white; + border-image: initial; + border-radius: 12px; + border-style: solid; + border-width: 1px; + box-shadow: rgb(0,0,0) 0px 0px 0.25em; + color: white; + display: inline-block; + font-size: 14px; + font-weight: 500; + height: 24px; + line-height: 1.5; + margin-right: 8px; + min-width: 24px; + padding: 2px 3px; + text-align: center; +} + +.c1 .c4 { + grid-area: line; + display: table-cell; + max-width: 20px; + width: 20px; + padding: 0; + position: relative; +} + +.c1 .c13 { + grid-area: title; + color: #000; + font-size: 18px; + font-weight: 500; + line-height: 20px; +} + +.c1 .c15 { + height: inherit; + white-space: normal; +} + +.c1 .c2 { + width: 100%; +} + +.c1 .c53 { + margin-left: -23px; +} + +.c1 .c17 { + grid-area: time; + color: #676767; + display: table-cell; + font-size: 14px; + padding-right: 4px; + padding-top: 2px; + text-align: right; + vertical-align: top; + width: 60px; +} + +.c7 { + position: absolute; + width: 100%; + top: 3px; + z-index: 20; +} + +.c6 { + background: radial-gradient(ellipse at center,#87cefa 40%,transparent 10%); + background-position: center -5px; + background-repeat: repeat-y; + background-size: 12px 12px; + left: 6px; + right: 6px; + bottom: -11px; + position: absolute; + top: 11px; + z-index: 10; +} + +.c38 { + background-color: gray; + left: 5px; + right: 5px; + background-color: #0070c0; + bottom: -11px; + position: absolute; + top: 11px; + z-index: 10; +} + +.c56 { + background-color: gray; + left: 5px; + right: 5px; + background-color: #000088; + bottom: -11px; + position: absolute; + top: 11px; + z-index: 10; +} + +.c9 { + left: 0; + line-height: inherit; + position: absolute; + text-align: center; + width: 100%; +} + +.c10 { + top: 3px; +} + +.c12 { + left: 0; + position: absolute; + text-align: center; + width: 100%; +} + +
      +
    1. +
      +
      + + + + +
      +
      + + 47.97767, -122.20034 + +
      +
      + 12:57 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + + + + + + + + - + + + Walk 0.3 miles to + + Everett Station Bay C1 + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + SOUTH + on + + service road + + + 0.1 miles + + +
        +
        2. +
      2. +
        + + + +
        +
        + + RIGHT + on + + Smith Avenue + + + 129 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + CONTINUE + on + + Paine Avenue + + + 61 feet + + +
        +
        4. +
      4. +
        + + + +
        +
        + + LEFT + on + + 32nd Street + + + 67 feet + + +
        +
        5. +
      5. +
        + + + +
        +
        + + RIGHT + on + + 32nd Street + + + 313 feet + + +
        +
        6. +
      6. +
        + + + +
        +
        + + LEFT + on + + Unnamed Path + + + 380 feet + + +
        +
        7. +
      +
      +
      +       +
      +
      +
      2. +
    2. +
      +
      + + + + +
      +
      + + Everett Station Bay C1 + +
      +
      + 1:04 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      + Stop ID 2345 + +
      +
      +
      + + + + - + Ride + + + + + + + + + + + + + + + 512 + + + + + Northgate Station + + + + + - + Disembark at + Northgate Station + + + + +
      +
      +
      + Service operated by + + Community Transit + +
      +
      +
      +
      +
      +
      + + +
      +
      +
      +
      +
        +
      1. +
        + • +
        +
        + Broadway & 34th St +
        +
        2. +
      2. +
        + • +
        +
        + South Everett Fwy Station Bay 3 +
        +
        3. +
      3. +
        + • +
        +
        + Ash Way Park & Ride Bay 1 +
        +
        4. +
      4. +
        + • +
        +
        + Lynnwood Transit Center Bay D3 +
        +
        5. +
      5. +
        + • +
        +
        + Mountlake Terrace Fwy Station Bay 6 +
        +
        6. +
      +
      +
      +
      +
      +
      +
      +
      +
      3. +
    3. +
      +
      + + + + +
      +
      + + Northgate Station + +
      +
      + 1:51 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      + Stop ID 2191 + +
      +
      +
      + + + + + + + + + + + - + + + Walk to + + Northgate Station - Bay 4 + + + + +
      + + + + +
      +
      +
        +
      +
      +       +
      +
      +
      4. +
    4. +
      +
      + + + + +
      +
      + + Northgate Station - Bay 4 + +
      +
      + 1:55 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      + Stop ID 35318 + +
      +
      +
      + + + + - + Ride + + + + + + + + + + + + + + + 40 + + + + + Downtown Seattle Ballard + + + + + - + Disembark at + N 105th St & Aurora Ave N + + + + +
      +
      +
      + Service operated by + + Metro Transit + +
      +
      +
      +
      +
      +
      + + +
      +
      +
      +
      +
        +
      1. +
        + • +
        +
        + 1st Ave NE & NE 95th St +
        +
        2. +
      2. +
        + • +
        +
        + N 92nd St & Corliss Ave N +
        +
        3. +
      3. +
        + • +
        +
        + College Way N & N 97th St +
        +
        4. +
      4. +
        + • +
        +
        + College Way N & N 103rd St +
        +
        5. +
      5. +
        + • +
        +
        + Meridian Ave N & N 105th St +
        +
        6. +
      6. +
        + • +
        +
        + N Northgate Way & Meridian Ave N +
        +
        7. +
      7. +
        + • +
        +
        + N Northgate Way & Stone Ave N +
        +
        8. +
      +
      +
      +
      +
      +
      +
      +
      +
      5. +
    5. +
      +
      + + + + +
      +
      + + N 105th St & Aurora Ave N + +
      +
      + 2:06 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      + Stop ID 40032 + +
      +
      +
      + + + + + + + + + + + - + + + Walk 259 feet to + + Aurora Ave N & N 105th St + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + EAST + on + + North 105th Street + + + 64 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + RIGHT + on + + service road + + + 14 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + LEFT + on + + Unnamed Path + + + 180 feet + + +
        +
        4. +
      +
      +
      +       +
      +
      +
      6. +
    6. +
      +
      + + + + +
      +
      + + Aurora Ave N & N 105th St + +
      +
      + 2:07 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      + Stop ID 7080 + +
      +
      +
      + + + + - + Ride + + + + + + + + + + + + + + + E Line + + + + + Downtown Seattle + + + + + - + Disembark at + 3rd Ave & Cherry St + + + + +
      +
      +
      + Service operated by + + Metro Transit + +
      +
      +
      +
      +
      +
      + + +
      +
      +
      +
      +
        +
      1. +
        + • +
        +
        + Aurora Ave N & N 100th St +
        +
        2. +
      2. +
        + • +
        +
        + Aurora Ave N & N 95th St +
        +
        3. +
      3. +
        + • +
        +
        + Aurora Ave N & N 90th St +
        +
        4. +
      4. +
        + • +
        +
        + Aurora Ave N & N 85th St +
        +
        5. +
      5. +
        + • +
        +
        + Aurora Ave N & N 80th St +
        +
        6. +
      6. +
        + • +
        +
        + Aurora Ave N & N 76th St +
        +
        7. +
      7. +
        + • +
        +
        + Aurora Ave N & N 65th St +
        +
        8. +
      8. +
        + • +
        +
        + Aurora Ave N & N 46th St +
        +
        9. +
      9. +
        + • +
        +
        + Aurora Ave N & Lynn St +
        +
        10. +
      10. +
        + • +
        +
        + Aurora Ave N & Galer St +
        +
        11. +
      11. +
        + • +
        +
        + 7th Ave N & Thomas St +
        +
        12. +
      12. +
        + • +
        +
        + Wall St & 5th Ave +
        +
        13. +
      13. +
        + • +
        +
        + 3rd Ave & Bell St +
        +
        14. +
      14. +
        + • +
        +
        + 3rd Ave & Virginia St +
        +
        15. +
      15. +
        + • +
        +
        + 3rd Ave & Pike St +
        +
        16. +
      16. +
        + • +
        +
        + 3rd Ave & Seneca St +
        +
        17. +
      +
      +
      +
      +
      +
      +
      +
      +
      7. +
    7. +
      +
      + + + + +
      +
      + + 3rd Ave & Cherry St + +
      +
      + 2:39 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      + Stop ID 490 + +
      +
      +
      + + + + + + + + + + + - + + + Walk 443 feet to + + 208 James St, Seattle, WA 98104-2212, United States + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + SOUTHEAST + on + + sidewalk + + + 326 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + UTURN_RIGHT + on + + sidewalk + + + 117 feet + + +
        +
        3. +
      +
      +
      +       +
      +
      +
      8. +
    8. +
      + + + + +
      +
      + + 208 James St, Seattle, WA 98104-2212, United States + +
      +
      + 2:41 PM +
      + + Arrive at + 208 James St, Seattle, WA 98104-2212, United States + +
      +
      9. +
    +`; + +exports[`Storyshots ItineraryBody/otp-react-redux Zero Alerts Not Always Collapsing 1`] = ` + + + +`; + +exports[`Storyshots ItineraryBody/otp-react-redux Zero Alerts Not Always Collapsing 2`] = ` +.c8 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c11 { + color: #333; +} + +.c57 { + color: #f44256; +} + +.c26 { + background: transparent; + border: 0; + color: inherit; + cursor: pointer; + font-size: inherit; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c40 { + color: #008; + margin-left: 5px; +} + +.c40:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c41 { + padding-left: 0px; +} + +.c41:before { + content: "|"; + color: black; + margin-right: 5px; +} + +.c31::before { + content: ""; + margin: 0 0.125em; +} + +.c51 { + display: block; + font-size: 13px; + list-style: none; + padding: 0; +} + +.c0 { + list-style: none; + padding: 0; +} + +.c21 { + color: #676767; + font-size: 13px; + padding-bottom: 12px; +} + +.c27 { + bottom: 0; + cursor: pointer; + left: 0; + position: absolute; + right: 0; + top: 0; + width: 100%; + z-index: 1; +} + +.c22 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + line-height: 16px; + min-height: 31px; + position: relative; +} + +.c19 { + display: inline-block; + grid-row-start: 2; + grid-column-start: 1; + height: 0; + overflow: hidden; + width: 0; +} + +.c25 { + font-weight: inherit; +} + +.c45 { + font-size: 13px; + font-weight: 500; +} + +.c44 { + font-weight: 800; + margin-right: 6px; +} + +.c42 { + color: #807373; + margin-top: 5px; +} + +.c24 img, +.c24 svg { + margin-right: 6px; + height: 24px; + width: 24px; + vertical-align: bottom; +} + +.c23 { + -webkit-flex-shrink: 0; + -ms-flex-negative: 0; + flex-shrink: 0; +} + +.c5 { + grid-column-start: 2; + grid-row: span 2; + padding-right: 5px; +} + +.c28 { + display: grid; + grid-template-columns: 130px auto; +} + +.c3 { + max-width: 500px; + display: grid; + grid-template-areas: "time line title" "time line instructions"; + grid-template-columns: 65px 30px auto; +} + +.c18 { + grid-column-start: 1; + grid-row: 1 / span 2; + padding-right: 5px; + font-size: 0.9em; +} + +.c20 { + grid-row-start: 2; + grid-column-start: 3; + grid-area: instructions; +} + +.c14 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + font-size: 1.2em; + grid-row-start: 1; + grid-column-start: 3; +} + +.c16 { + font-size: inherit; + font-weight: bold; + height: 1.2em; + margin: 0; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + -webkit-flex: 1 1 auto; + -ms-flex: 1 1 auto; + flex: 1 1 auto; + padding: 3px 0 10px 0; +} + +.c39 { + color: #807373; + font-size: 13px; + font-weight: 300; + padding-top: 1px; + margin-bottom: 10px; + margin-top: -14px; +} + +.c32 { + display: block; + list-style: none; + padding: 0; +} + +.c35 { + margin-left: 24px; + line-height: 1.25em; + padding-top: 1px; +} + +.c35 > span { + margin-right: 1ch; +} + +.c29 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-self: center; + -ms-flex-item-align: center; + align-self: center; + margin-top: 10px; +} + +.c29 a { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c30 { + color: #676767; + font-size: 13px; + font-style: normal; + padding: 0; +} + +.c34 { + fill: #676767; + float: left; + height: 16px; + width: 16px; +} + +.c33 { + font-size: 13px; + margin-top: 8px; + color: #676767; + font-style: normal; +} + +.c36 { + font-weight: 500; +} + +.c37 { + font-weight: 200; + opacity: 0.8975; + padding-left: 1ch; +} + +.c54 { + float: left; + margin-left: -36px; + color: #fff; +} + +.c55 { + color: #676767; + margin-top: 3px; +} + +.c52 { + z-index: 30; + position: relative; +} + +.c47 { + margin-top: 5px; +} + +.c48 { + color: #676767; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; +} + +.c50 { + font-size: 14px; +} + +.c49 { + padding: 0; +} + +.c46 { + margin-top: 5px; +} + +.c46 a { + color: #337ab7; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c46 a:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c46 img { + margin-left: 5px; + vertical-align: middle; +} + +.c1 { + font-size: 16px; +} + +.c1 *:not(.fa) { + box-sizing: border-box; + font-family: Hind,sans-serif; +} + +.c1 .c43 { + background-color: rgb(15,106,172); + border-color: white; + border-image: initial; + border-radius: 12px; + border-style: solid; + border-width: 1px; + box-shadow: rgb(0,0,0) 0px 0px 0.25em; + color: white; + display: inline-block; + font-size: 14px; + font-weight: 500; + height: 24px; + line-height: 1.5; + margin-right: 8px; + min-width: 24px; + padding: 2px 3px; + text-align: center; +} + +.c1 .c4 { + grid-area: line; + display: table-cell; + max-width: 20px; + width: 20px; + padding: 0; + position: relative; +} + +.c1 .c13 { + grid-area: title; + color: #000; + font-size: 18px; + font-weight: 500; + line-height: 20px; +} + +.c1 .c15 { + height: inherit; + white-space: normal; +} + +.c1 .c2 { + width: 100%; +} + +.c1 .c53 { + margin-left: -23px; +} + +.c1 .c17 { + grid-area: time; + color: #676767; + display: table-cell; + font-size: 14px; + padding-right: 4px; + padding-top: 2px; + text-align: right; + vertical-align: top; + width: 60px; +} + +.c7 { + position: absolute; + width: 100%; + top: 3px; + z-index: 20; +} + +.c6 { + background: radial-gradient(ellipse at center,#87cefa 40%,transparent 10%); + background-position: center -5px; + background-repeat: repeat-y; + background-size: 12px 12px; + left: 6px; + right: 6px; + bottom: -11px; + position: absolute; + top: 11px; + z-index: 10; +} + +.c38 { + background-color: gray; + left: 5px; + right: 5px; + background-color: #0070c0; + bottom: -11px; + position: absolute; + top: 11px; + z-index: 10; +} + +.c56 { + background-color: gray; + left: 5px; + right: 5px; + background-color: #000088; + bottom: -11px; + position: absolute; + top: 11px; + z-index: 10; +} + +.c9 { + left: 0; + line-height: inherit; + position: absolute; + text-align: center; + width: 100%; +} + +.c10 { + top: 3px; +} + +.c12 { + left: 0; + position: absolute; + text-align: center; + width: 100%; +} + +
      +
    1. +
      +
      + + + + +
      +
      + + 47.97767, -122.20034 + +
      +
      + 12:57 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + + + + + + + + - + + + Walk 0.3 miles to + + Everett Station Bay C1 + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + SOUTH + on + + service road + + + 0.1 miles + + +
        +
        2. +
      2. +
        + + + +
        +
        + + RIGHT + on + + Smith Avenue + + + 129 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + CONTINUE + on + + Paine Avenue + + + 61 feet + + +
        +
        4. +
      4. +
        + + + +
        +
        + + LEFT + on + + 32nd Street + + + 67 feet + + +
        +
        5. +
      5. +
        + + + +
        +
        + + RIGHT + on + + 32nd Street + + + 313 feet + + +
        +
        6. +
      6. +
        + + + +
        +
        + + LEFT + on + + Unnamed Path + + + 380 feet + + +
        +
        7. +
      +
      +
      +       +
      +
      +
      2. +
    2. +
      +
      + + + + +
      +
      + + Everett Station Bay C1 + +
      +
      + 1:04 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      + Stop ID 2345 + +
      +
      +
      + + + + - + Ride + + + + + + + + + + + + + + + 512 + + + + + Northgate Station + + + + + - + Disembark at + Northgate Station + + + + +
      +
      +
      + Service operated by + + Community Transit + +
      +
      +
      +
      +
      +
      + + +
      +
      +
      +
      +
        +
      1. +
        + • +
        +
        + Broadway & 34th St +
        +
        2. +
      2. +
        + • +
        +
        + South Everett Fwy Station Bay 3 +
        +
        3. +
      3. +
        + • +
        +
        + Ash Way Park & Ride Bay 1 +
        +
        4. +
      4. +
        + • +
        +
        + Lynnwood Transit Center Bay D3 +
        +
        5. +
      5. +
        + • +
        +
        + Mountlake Terrace Fwy Station Bay 6 +
        +
        6. +
      +
      +
      +
      +
      +
      +
      +
      +
      3. +
    3. +
      +
      + + + + +
      +
      + + Northgate Station + +
      +
      + 1:51 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      + Stop ID 2191 + +
      +
      +
      + + + + + + + + + + + - + + + Walk to + + Northgate Station - Bay 4 + + + + +
      + + + + +
      +
      +
        +
      +
      +       +
      +
      +
      4. +
    4. +
      +
      + + + + +
      +
      + + Northgate Station - Bay 4 + +
      +
      + 1:55 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      + Stop ID 35318 + +
      +
      +
      + + + + - + Ride + + + + + + + + + + + + + + + 40 + + + + + Downtown Seattle Ballard + + + + + - + Disembark at + N 105th St & Aurora Ave N + + + + +
      +
      +
      + Service operated by + + Metro Transit + +
      +
      +
      +
      +
      +
      + + +
      +
      +
      +
      +
        +
      1. +
        + • +
        +
        + 1st Ave NE & NE 95th St +
        +
        2. +
      2. +
        + • +
        +
        + N 92nd St & Corliss Ave N +
        +
        3. +
      3. +
        + • +
        +
        + College Way N & N 97th St +
        +
        4. +
      4. +
        + • +
        +
        + College Way N & N 103rd St +
        +
        5. +
      5. +
        + • +
        +
        + Meridian Ave N & N 105th St +
        +
        6. +
      6. +
        + • +
        +
        + N Northgate Way & Meridian Ave N +
        +
        7. +
      7. +
        + • +
        +
        + N Northgate Way & Stone Ave N +
        +
        8. +
      +
      +
      +
      +
      +
      +
      +
      +
      5. +
    5. +
      +
      + + + + +
      +
      + + N 105th St & Aurora Ave N + +
      +
      + 2:06 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      + Stop ID 40032 + +
      +
      +
      + + + + + + + + + + + - + + + Walk 259 feet to + + Aurora Ave N & N 105th St + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + EAST + on + + North 105th Street + + + 64 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + RIGHT + on + + service road + + + 14 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + LEFT + on + + Unnamed Path + + + 180 feet + + +
        +
        4. +
      +
      +
      +       +
      +
      +
      6. +
    6. +
      +
      + + + + +
      +
      + + Aurora Ave N & N 105th St + +
      +
      + 2:07 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      + Stop ID 7080 + +
      +
      +
      + + + + - + Ride + + + + + + + + + + + + + + + E Line + + + + + Downtown Seattle + + + + + - + Disembark at + 3rd Ave & Cherry St + + + + +
      +
      +
      + Service operated by + + Metro Transit + +
      +
      +
      +
      +
      +
      + + +
      +
      +
      +
      +
        +
      1. +
        + • +
        +
        + Aurora Ave N & N 100th St +
        +
        2. +
      2. +
        + • +
        +
        + Aurora Ave N & N 95th St +
        +
        3. +
      3. +
        + • +
        +
        + Aurora Ave N & N 90th St +
        +
        4. +
      4. +
        + • +
        +
        + Aurora Ave N & N 85th St +
        +
        5. +
      5. +
        + • +
        +
        + Aurora Ave N & N 80th St +
        +
        6. +
      6. +
        + • +
        +
        + Aurora Ave N & N 76th St +
        +
        7. +
      7. +
        + • +
        +
        + Aurora Ave N & N 65th St +
        +
        8. +
      8. +
        + • +
        +
        + Aurora Ave N & N 46th St +
        +
        9. +
      9. +
        + • +
        +
        + Aurora Ave N & Lynn St +
        +
        10. +
      10. +
        + • +
        +
        + Aurora Ave N & Galer St +
        +
        11. +
      11. +
        + • +
        +
        + 7th Ave N & Thomas St +
        +
        12. +
      12. +
        + • +
        +
        + Wall St & 5th Ave +
        +
        13. +
      13. +
        + • +
        +
        + 3rd Ave & Bell St +
        +
        14. +
      14. +
        + • +
        +
        + 3rd Ave & Virginia St +
        +
        15. +
      15. +
        + • +
        +
        + 3rd Ave & Pike St +
        +
        16. +
      16. +
        + • +
        +
        + 3rd Ave & Seneca St +
        +
        17. +
      +
      +
      +
      +
      +
      +
      +
      +
      7. +
    7. +
      +
      + + + + +
      +
      + + 3rd Ave & Cherry St + +
      +
      + 2:39 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      + Stop ID 490 + +
      +
      +
      + + + + + + + + + + + - + + + Walk 443 feet to + + 208 James St, Seattle, WA 98104-2212, United States + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + SOUTHEAST + on + + sidewalk + + + 326 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + UTURN_RIGHT + on + + sidewalk + + + 117 feet + + +
        +
        3. +
      +
      +
      +       +
      +
      +
      8. +
    8. +
      + + + + +
      +
      + + 208 James St, Seattle, WA 98104-2212, United States + +
      +
      + 2:41 PM +
      + + Arrive at + 208 James St, Seattle, WA 98104-2212, United States + +
      +
      9. +
    +`; + +exports[`Storyshots ItineraryBody/otp-react-redux Zero Alerts Without Collapsing Prop 1`] = ` + + + +`; + +exports[`Storyshots ItineraryBody/otp-react-redux Zero Alerts Without Collapsing Prop 2`] = ` +.c8 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c11 { + color: #333; +} + +.c57 { + color: #f44256; +} + +.c26 { + background: transparent; + border: 0; + color: inherit; + cursor: pointer; + font-size: inherit; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c40 { + color: #008; + margin-left: 5px; +} + +.c40:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c41 { + padding-left: 0px; +} + +.c41:before { + content: "|"; + color: black; + margin-right: 5px; +} + +.c31::before { + content: ""; + margin: 0 0.125em; +} + +.c51 { + display: block; + font-size: 13px; + list-style: none; + padding: 0; +} + +.c0 { + list-style: none; + padding: 0; +} + +.c21 { + color: #676767; + font-size: 13px; + padding-bottom: 12px; +} + +.c27 { + bottom: 0; + cursor: pointer; + left: 0; + position: absolute; + right: 0; + top: 0; + width: 100%; + z-index: 1; +} + +.c22 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + line-height: 16px; + min-height: 31px; + position: relative; +} + +.c19 { + display: inline-block; + grid-row-start: 2; + grid-column-start: 1; + height: 0; + overflow: hidden; + width: 0; +} + +.c25 { + font-weight: inherit; +} + +.c45 { + font-size: 13px; + font-weight: 500; +} + +.c44 { + font-weight: 800; + margin-right: 6px; +} + +.c42 { + color: #807373; + margin-top: 5px; +} + +.c24 img, +.c24 svg { + margin-right: 6px; + height: 24px; + width: 24px; + vertical-align: bottom; +} + +.c23 { + -webkit-flex-shrink: 0; + -ms-flex-negative: 0; + flex-shrink: 0; +} + +.c5 { + grid-column-start: 2; + grid-row: span 2; + padding-right: 5px; +} + +.c28 { + display: grid; + grid-template-columns: 130px auto; +} + +.c3 { + max-width: 500px; + display: grid; + grid-template-areas: "time line title" "time line instructions"; + grid-template-columns: 65px 30px auto; +} + +.c18 { + grid-column-start: 1; + grid-row: 1 / span 2; + padding-right: 5px; + font-size: 0.9em; +} + +.c20 { + grid-row-start: 2; + grid-column-start: 3; + grid-area: instructions; +} + +.c14 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + font-size: 1.2em; + grid-row-start: 1; + grid-column-start: 3; +} + +.c16 { + font-size: inherit; + font-weight: bold; + height: 1.2em; + margin: 0; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + -webkit-flex: 1 1 auto; + -ms-flex: 1 1 auto; + flex: 1 1 auto; + padding: 3px 0 10px 0; +} + +.c39 { + color: #807373; + font-size: 13px; + font-weight: 300; + padding-top: 1px; + margin-bottom: 10px; + margin-top: -14px; +} + +.c32 { + display: block; + list-style: none; + padding: 0; +} + +.c35 { + margin-left: 24px; + line-height: 1.25em; + padding-top: 1px; +} + +.c35 > span { + margin-right: 1ch; +} + +.c29 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-self: center; + -ms-flex-item-align: center; + align-self: center; + margin-top: 10px; +} + +.c29 a { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c30 { + color: #676767; + font-size: 13px; + font-style: normal; + padding: 0; +} + +.c34 { + fill: #676767; + float: left; + height: 16px; + width: 16px; +} + +.c33 { + font-size: 13px; + margin-top: 8px; + color: #676767; + font-style: normal; +} + +.c36 { + font-weight: 500; +} + +.c37 { + font-weight: 200; + opacity: 0.8975; + padding-left: 1ch; +} + +.c54 { + float: left; + margin-left: -36px; + color: #fff; +} + +.c55 { + color: #676767; + margin-top: 3px; +} + +.c52 { + z-index: 30; + position: relative; +} + +.c47 { + margin-top: 5px; +} + +.c48 { + color: #676767; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; +} + +.c50 { + font-size: 14px; +} + +.c49 { + padding: 0; +} + +.c46 { + margin-top: 5px; +} + +.c46 a { + color: #337ab7; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c46 a:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c46 img { + margin-left: 5px; + vertical-align: middle; +} + +.c1 { + font-size: 16px; +} + +.c1 *:not(.fa) { + box-sizing: border-box; + font-family: Hind,sans-serif; +} + +.c1 .c43 { + background-color: rgb(15,106,172); + border-color: white; + border-image: initial; + border-radius: 12px; + border-style: solid; + border-width: 1px; + box-shadow: rgb(0,0,0) 0px 0px 0.25em; + color: white; + display: inline-block; + font-size: 14px; + font-weight: 500; + height: 24px; + line-height: 1.5; + margin-right: 8px; + min-width: 24px; + padding: 2px 3px; + text-align: center; +} + +.c1 .c4 { + grid-area: line; + display: table-cell; + max-width: 20px; + width: 20px; + padding: 0; + position: relative; +} + +.c1 .c13 { + grid-area: title; + color: #000; + font-size: 18px; + font-weight: 500; + line-height: 20px; +} + +.c1 .c15 { + height: inherit; + white-space: normal; +} + +.c1 .c2 { + width: 100%; +} + +.c1 .c53 { + margin-left: -23px; +} + +.c1 .c17 { + grid-area: time; + color: #676767; + display: table-cell; + font-size: 14px; + padding-right: 4px; + padding-top: 2px; + text-align: right; + vertical-align: top; + width: 60px; +} + +.c7 { + position: absolute; + width: 100%; + top: 3px; + z-index: 20; +} + +.c6 { + background: radial-gradient(ellipse at center,#87cefa 40%,transparent 10%); + background-position: center -5px; + background-repeat: repeat-y; + background-size: 12px 12px; + left: 6px; + right: 6px; + bottom: -11px; + position: absolute; + top: 11px; + z-index: 10; +} + +.c38 { + background-color: gray; + left: 5px; + right: 5px; + background-color: #0070c0; + bottom: -11px; + position: absolute; + top: 11px; + z-index: 10; +} + +.c56 { + background-color: gray; + left: 5px; + right: 5px; + background-color: #000088; + bottom: -11px; + position: absolute; + top: 11px; + z-index: 10; +} + +.c9 { + left: 0; + line-height: inherit; + position: absolute; + text-align: center; + width: 100%; +} + +.c10 { + top: 3px; +} + +.c12 { + left: 0; + position: absolute; + text-align: center; + width: 100%; +} + +
      +
    1. +
      +
      + + + + +
      +
      + + 47.97767, -122.20034 + +
      +
      + 12:57 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + + + + + + + + - + + + Walk 0.3 miles to + + Everett Station Bay C1 + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + SOUTH + on + + service road + + + 0.1 miles + + +
        +
        2. +
      2. +
        + + + +
        +
        + + RIGHT + on + + Smith Avenue + + + 129 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + CONTINUE + on + + Paine Avenue + + + 61 feet + + +
        +
        4. +
      4. +
        + + + +
        +
        + + LEFT + on + + 32nd Street + + + 67 feet + + +
        +
        5. +
      5. +
        + + + +
        +
        + + RIGHT + on + + 32nd Street + + + 313 feet + + +
        +
        6. +
      6. +
        + + + +
        +
        + + LEFT + on + + Unnamed Path + + + 380 feet + + +
        +
        7. +
      +
      +
      +       +
      +
      +
      2. +
    2. +
      +
      + + + + +
      +
      + + Everett Station Bay C1 + +
      +
      + 1:04 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      + Stop ID 2345 + +
      +
      +
      + + + + - + Ride + + + + + + + + + + + + + + + 512 + + + + + Northgate Station + + + + + - + Disembark at + Northgate Station + + + + +
      +
      +
      + Service operated by + + Community Transit + +
      +
      +
      +
      +
      +
      + + +
      +
      +
      +
      +
        +
      1. +
        + • +
        +
        + Broadway & 34th St +
        +
        2. +
      2. +
        + • +
        +
        + South Everett Fwy Station Bay 3 +
        +
        3. +
      3. +
        + • +
        +
        + Ash Way Park & Ride Bay 1 +
        +
        4. +
      4. +
        + • +
        +
        + Lynnwood Transit Center Bay D3 +
        +
        5. +
      5. +
        + • +
        +
        + Mountlake Terrace Fwy Station Bay 6 +
        +
        6. +
      +
      +
      +
      +
      +
      +
      +
      +
      3. +
    3. +
      +
      + + + + +
      +
      + + Northgate Station + +
      +
      + 1:51 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      + Stop ID 2191 + +
      +
      +
      + + + + + + + + + + + - + + + Walk to + + Northgate Station - Bay 4 + + + + +
      + + + + +
      +
      +
        +
      +
      +       +
      +
      +
      4. +
    4. +
      +
      + + + + +
      +
      + + Northgate Station - Bay 4 + +
      +
      + 1:55 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      + Stop ID 35318 + +
      +
      +
      + + + + - + Ride + + + + + + + + + + + + + + + 40 + + + + + Downtown Seattle Ballard + + + + + - + Disembark at + N 105th St & Aurora Ave N + + + + +
      +
      +
      + Service operated by + + Metro Transit + +
      +
      +
      +
      +
      +
      + + +
      +
      +
      +
      +
        +
      1. +
        + • +
        +
        + 1st Ave NE & NE 95th St +
        +
        2. +
      2. +
        + • +
        +
        + N 92nd St & Corliss Ave N +
        +
        3. +
      3. +
        + • +
        +
        + College Way N & N 97th St +
        +
        4. +
      4. +
        + • +
        +
        + College Way N & N 103rd St +
        +
        5. +
      5. +
        + • +
        +
        + Meridian Ave N & N 105th St +
        +
        6. +
      6. +
        + • +
        +
        + N Northgate Way & Meridian Ave N +
        +
        7. +
      7. +
        + • +
        +
        + N Northgate Way & Stone Ave N +
        +
        8. +
      +
      +
      +
      +
      +
      +
      +
      +
      5. +
    5. +
      +
      + + + + +
      +
      + + N 105th St & Aurora Ave N + +
      +
      + 2:06 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      + Stop ID 40032 + +
      +
      +
      + + + + + + + + + + + - + + + Walk 259 feet to + + Aurora Ave N & N 105th St + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + EAST + on + + North 105th Street + + + 64 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + RIGHT + on + + service road + + + 14 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + LEFT + on + + Unnamed Path + + + 180 feet + + +
        +
        4. +
      +
      +
      +       +
      +
      +
      6. +
    6. +
      +
      + + + + +
      +
      + + Aurora Ave N & N 105th St + +
      +
      + 2:07 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      + Stop ID 7080 + +
      +
      +
      + + + + - + Ride + + + + + + + + + + + + + + + E Line + + + + + Downtown Seattle + + + + + - + Disembark at + 3rd Ave & Cherry St + + + + +
      +
      +
      + Service operated by + + Metro Transit + +
      +
      +
      +
      +
      +
      + + +
      +
      +
      +
      +
        +
      1. +
        + • +
        +
        + Aurora Ave N & N 100th St +
        +
        2. +
      2. +
        + • +
        +
        + Aurora Ave N & N 95th St +
        +
        3. +
      3. +
        + • +
        +
        + Aurora Ave N & N 90th St +
        +
        4. +
      4. +
        + • +
        +
        + Aurora Ave N & N 85th St +
        +
        5. +
      5. +
        + • +
        +
        + Aurora Ave N & N 80th St +
        +
        6. +
      6. +
        + • +
        +
        + Aurora Ave N & N 76th St +
        +
        7. +
      7. +
        + • +
        +
        + Aurora Ave N & N 65th St +
        +
        8. +
      8. +
        + • +
        +
        + Aurora Ave N & N 46th St +
        +
        9. +
      9. +
        + • +
        +
        + Aurora Ave N & Lynn St +
        +
        10. +
      10. +
        + • +
        +
        + Aurora Ave N & Galer St +
        +
        11. +
      11. +
        + • +
        +
        + 7th Ave N & Thomas St +
        +
        12. +
      12. +
        + • +
        +
        + Wall St & 5th Ave +
        +
        13. +
      13. +
        + • +
        +
        + 3rd Ave & Bell St +
        +
        14. +
      14. +
        + • +
        +
        + 3rd Ave & Virginia St +
        +
        15. +
      15. +
        + • +
        +
        + 3rd Ave & Pike St +
        +
        16. +
      16. +
        + • +
        +
        + 3rd Ave & Seneca St +
        +
        17. +
      +
      +
      +
      +
      +
      +
      +
      +
      7. +
    7. +
      +
      + + + + +
      +
      + + 3rd Ave & Cherry St + +
      +
      + 2:39 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      + Stop ID 490 + +
      +
      +
      + + + + + + + + + + + - + + + Walk 443 feet to + + 208 James St, Seattle, WA 98104-2212, United States + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + SOUTHEAST + on + + sidewalk + + + 326 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + UTURN_RIGHT + on + + sidewalk + + + 117 feet + + +
        +
        3. +
      +
      +
      +       +
      +
      +
      8. +
    8. +
      + + + + +
      +
      + + 208 James St, Seattle, WA 98104-2212, United States + +
      +
      + 2:41 PM +
      + + Arrive at + 208 James St, Seattle, WA 98104-2212, United States + +
      +
      9. +
    +`; + +exports[`Storyshots ItineraryBody/otp-ui Approximate Prefix Itinerary 1`] = ` + + + +`; + +exports[`Storyshots ItineraryBody/otp-ui Approximate Prefix Itinerary 2`] = ` +.c22 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c59 { + color: #f44256; +} + +.c29 { + border-top-style: solid; + border-top-width: 0; + padding-top: 0; + padding-bottom: 10px; +} + +.c16 { + background: transparent; + border: 0; + color: inherit; + cursor: pointer; + font-size: inherit; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c31 { + color: #008; + margin-left: 5px; +} + +.c31:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c6 { + color: black; + background-color: grey; + border: 2px solid #bbb; + text-align: center; + width: 25px; + height: 25px; + font-size: 1.2em; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; +} + +.c34 { + color: black; + background-color: #e9e9e9; + border: 2px solid #bbb; + text-align: center; + width: 25px; + height: 25px; + font-size: 1.2em; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; +} + +.c21::before { + content: ""; + margin: 0 0.125em; +} + +.c58 { + text-align: center; +} + +.c4 { + border-left: dotted 4px grey; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c33 { + border-left: dotted 4px #484848; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c35 { + border-left: solid 8px #084C8D; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c54 { + display: block; + font-size: 13px; + list-style: none; + padding: 0; +} + +.c0 { + list-style: none; + padding: 0; +} + +.c12 { + color: #676767; + font-size: 13px; + padding-bottom: 12px; +} + +.c17 { + bottom: 0; + cursor: pointer; + left: 0; + position: absolute; + right: 0; + top: 0; + width: 100%; + z-index: 1; +} + +.c13 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + line-height: 16px; + min-height: 31px; + position: relative; +} + +.c10 { + display: inline-block; + grid-row-start: 2; + grid-column-start: 1; + height: 0; + overflow: hidden; + width: 0; +} + +.c42 { + font-weight: 200; +} + +.c15 { + font-weight: inherit; +} + +.c41 { + font-size: 13px; + font-weight: 500; +} + +.c40 { + font-weight: 800; + margin-right: 6px; +} + +.c39 { + color: #807373; + margin-top: 5px; +} + +.c14 { + -webkit-flex-shrink: 0; + -ms-flex-negative: 0; + flex-shrink: 0; +} + +.c3 { + position: relative; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); + height: 100%; +} + +.c5 { + width: 30px; + height: 30px; + border-radius: 50%; + position: absolute; + left: 50%; + top: 0; + -webkit-transform: translate(-51%,-10%); + -ms-transform: translate(-51%,-10%); + transform: translate(-51%,-10%); +} + +.c2 { + grid-column-start: 2; + grid-row: span 2; + padding-right: 5px; +} + +.c18 { + display: grid; + grid-template-columns: 130px auto; +} + +.c1 { + max-width: 500px; + display: grid; + grid-template-areas: "time line title" "time line instructions"; + grid-template-columns: 65px 30px auto; +} + +.c9 { + grid-column-start: 1; + grid-row: 1 / span 2; + padding-right: 5px; + font-size: 0.9em; +} + +.c32 { + padding: 3px 10px 3px 10px; + border: 0; + margin-top: -15px; + width: 35px; + height: 35px; +} + +.c32:hover { + cursor: pointer; +} + +.c30 { + -webkit-flex: 0 0 25px; + -ms-flex: 0 0 25px; + flex: 0 0 25px; + grid-column: -1; +} + +.c11 { + grid-row-start: 2; + grid-column-start: 3; + grid-area: instructions; +} + +.c7 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + font-size: 1.2em; + grid-row-start: 1; + grid-column-start: 3; +} + +.c8 { + font-size: inherit; + font-weight: bold; + height: 1.2em; + margin: 0; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + -webkit-flex: 1 1 auto; + -ms-flex: 1 1 auto; + flex: 1 1 auto; + padding: 3px 0 10px 0; +} + +.c36 { + text-align: center; + min-width: 30px; + min-height: 30px; + font-size: 1.2em; + background-color: #084C8D; + color: white; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; + border: 1px solid; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + cursor: default; +} + +.c37 { + position: absolute; + width: 1px; + height: 1px; + padding: 0; + margin: -1px; + overflow: hidden; + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + border: 0; +} + +.c23 { + display: block; + list-style: none; + padding: 0; +} + +.c26 { + margin-left: 24px; + line-height: 1.25em; + padding-top: 1px; +} + +.c26 > span { + margin-right: 1ch; +} + +.c19 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-self: center; + -ms-flex-item-align: center; + align-self: center; + margin-top: 10px; +} + +.c19 a { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c20 { + color: #676767; + font-size: 13px; + font-style: normal; + padding: 0; +} + +.c25 { + fill: #676767; + float: left; + height: 16px; + width: 16px; +} + +.c24 { + font-size: 13px; + margin-top: 8px; + color: #676767; + font-style: normal; +} + +.c27 { + font-weight: 500; +} + +.c28 { + font-weight: 200; + opacity: 0.8975; + padding-left: 1ch; +} + +.c38 { + font-weight: 200; + font-size: 0.9em; + margin-left: 10px; +} + +.c56 { + float: left; + margin-left: -36px; + color: #fff; +} + +.c57 { + color: #676767; + margin-top: 3px; +} + +.c55 { + z-index: 30; + position: relative; +} + +.c45 { + background-color: #eee; + border-radius: 4px; + color: #000; + display: block; + margin-top: 5px; + padding: 8px; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c49 { + -webkit-align-items: baseline; + -webkit-box-align: baseline; + -ms-flex-align: baseline; + align-items: baseline; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + gap: 5px; + margin-top: 0.5em; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c49:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c47 { + font-size: 12px; + margin-left: 30px; + white-space: pre-wrap; +} + +.c48 { + margin-top: 5px; + margin-left: 30px; + font-size: 12px; + font-style: italic; +} + +.c46 { + float: left; + font-size: 18px; +} + +.c44 { + display: block; + margin-top: 3px; + padding: 0; +} + +.c43 { + color: #d14727; + cursor: auto; + display: inline-block; + font-weight: 400; + margin-top: 8px; + padding: 0; +} + +.c50 { + margin-top: 5px; +} + +.c51 { + color: #676767; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; +} + +.c53 { + font-size: 14px; +} + +.c52 { + padding: 0; +} + +
      +
    1. +
      +
      +
      +
      +
      + + + Travel by car + + + + +
      +
      +
      +
      +
      + + 330 SW Murray Blvd, Washington County, OR, USA 97005 + +
      +
      + 3:50 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Drive 2.4 miles to + + P+R Sunset TC + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + SOUTHWEST + on + + parking aisle + + + 158 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + RIGHT + on + + SW Murray Blvd + + + 0.2 miles + + +
        +
        3. +
      3. +
        + + + +
        +
        + + CONTINUE + on + + NW Murray Blvd + + + 150 feet + + +
        +
        4. +
      4. +
        + + + +
        +
        + + SLIGHTLY_RIGHT + on + + NW Murray Blvd + + + 0.4 miles + + +
        +
        5. +
      5. +
        + + + +
        +
        + + CONTINUE + on + + NW Sunset Hwy + + + 0.6 miles + + +
        +
        6. +
      6. +
        + + + +
        +
        + + CONTINUE + on + + NW Sunset Hwy + + + 0.3 miles + + +
        +
        7. +
      7. +
        + + + +
        +
        + + LEFT + on + + SW Cedar Hills Blvd + + + 0.2 miles + + +
        +
        8. +
      8. +
        + + + +
        +
        + + RIGHT + on + + SW Barnes Rd + + + 0.5 miles + + +
        +
        9. +
      9. +
        + + + +
        +
        + + RIGHT + on + + service road + + + 0.2 miles + + +
        +
        10. +
      10. +
        + + + +
        +
        + + RIGHT + on + + Sunset TC + + + 76 feet + + +
        +
        11. +
      +
      +
      +       +
      +
      +
      + +
      +
      2. +
    2. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + P+R Sunset TC + +
      +
      + 4:02 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 426 feet to + + Sunset TC MAX Station + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + SLIGHTLY_RIGHT + on + + Unnamed Path + + + 16 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + LEFT + on + + steps + + + 232 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + LEFT + on + + Unnamed Path + + + 19 feet + + +
        +
        4. +
      4. +
        + + + +
        +
        + + RIGHT + on + + Sunset TC (path) + + + 159 feet + + +
        +
        5. +
      +
      +
      +       +
      +
      +
      + +
      +
      3. +
    3. +
      +
      +
      +
      +
      + + MA + + + MAX Blue Line + +
      +
      +
      +
      +
      + + Sunset TC MAX Station + + ID 9969 + + +
      +
      + 4:05 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + Ride + + +
      + + MAX Blue Line + +
      + + + MAX Blue Line + + to + + Gresham + + +       + + - + Disembark at + Oak/ SW 1st Ave MAX Station + + ID 8337 + + +       + +       +
      +
      +
      + + + 2 alerts +
      +
      +
      + +
      +
      +
      +
      + +
      +
      +
      +
      +
        +
      1. +
        + • +
        +
        + Washington Park MAX Station +
        +
        2. +
      2. +
        + • +
        +
        + Goose Hollow/SW Jefferson St MAX Station +
        +
        3. +
      3. +
        + • +
        +
        + Kings Hill/SW Salmon St MAX Station +
        +
        4. +
      4. +
        + • +
        +
        + Providence Park MAX Station +
        +
        5. +
      5. +
        + • +
        +
        + Library/SW 9th Ave MAX Station +
        +
        6. +
      6. +
        + • +
        +
        + Pioneer Square South MAX Station +
        +
        7. +
      7. +
        + • +
        +
        + Mall/SW 4th Ave MAX Station +
        +
        8. +
      8. +
        + • +
        +
        + Yamhill District MAX Station +
        +
        9. +
      +
      +
      +
      +
      +
      +
      +
      +
      + +
      +
      4. +
    4. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + Oak/ SW 1st Ave MAX Station + + ID 8337 + + +
      +
      + 4:27 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 0.1 miles to + + 205 SW Pine St, Portland, OR, USA 97204 + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + NORTHEAST + on + + Oak/SW 1st Ave (path) + + + 13 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + CONTINUE + on + + Unnamed Path + + + 27 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + LEFT + on + + SW Oak St + + + 37 feet + + +
        +
        4. +
      4. +
        + + + +
        +
        + + RIGHT + on + + SW 1st Ave + + + 260 feet + + +
        +
        5. +
      5. +
        + + + +
        +
        + + LEFT + on + + SW Pine St + + + 337 feet + + +
        +
        6. +
      +
      +
      +       +
      +
      +
      + +
      +
      5. +
    5. +
      +
      +
      +
      + +
      +
      +
      +
      +
      + + 205 SW Pine St, Portland, OR, USA 97204 + +
      +
      + 4:29 PM +
      + + Arrive at + 205 SW Pine St, Portland, OR, USA 97204 + +
      +
      + +
      +
      6. +
    +`; + +exports[`Storyshots ItineraryBody/otp-ui Bike Only Itinerary 1`] = ` + + + +`; + +exports[`Storyshots ItineraryBody/otp-ui Bike Only Itinerary 2`] = ` +.c22 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c40 { + color: #f44256; +} + +.c35 { + border-top-style: solid; + border-top-width: 0; + padding-top: 0; + padding-bottom: 10px; +} + +.c16 { + background: transparent; + border: 0; + color: inherit; + cursor: pointer; + font-size: inherit; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c37 { + color: #008; + margin-left: 5px; +} + +.c37:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c6 { + color: black; + background-color: red; + border: 2px solid #bbb; + text-align: center; + width: 25px; + height: 25px; + font-size: 1.2em; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; +} + +.c21::before { + content: ""; + margin: 0 0.125em; +} + +.c39 { + text-align: center; +} + +.c4 { + border-left: dotted 4px red; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c0 { + list-style: none; + padding: 0; +} + +.c12 { + color: #676767; + font-size: 13px; + padding-bottom: 12px; +} + +.c17 { + bottom: 0; + cursor: pointer; + left: 0; + position: absolute; + right: 0; + top: 0; + width: 100%; + z-index: 1; +} + +.c13 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + line-height: 16px; + min-height: 31px; + position: relative; +} + +.c10 { + display: inline-block; + grid-row-start: 2; + grid-column-start: 1; + height: 0; + overflow: hidden; + width: 0; +} + +.c15 { + font-weight: inherit; +} + +.c14 { + -webkit-flex-shrink: 0; + -ms-flex-negative: 0; + flex-shrink: 0; +} + +.c3 { + position: relative; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); + height: 100%; +} + +.c5 { + width: 30px; + height: 30px; + border-radius: 50%; + position: absolute; + left: 50%; + top: 0; + -webkit-transform: translate(-51%,-10%); + -ms-transform: translate(-51%,-10%); + transform: translate(-51%,-10%); +} + +.c2 { + grid-column-start: 2; + grid-row: span 2; + padding-right: 5px; +} + +.c18 { + display: grid; + grid-template-columns: 130px auto; +} + +.c1 { + max-width: 500px; + display: grid; + grid-template-areas: "time line title" "time line instructions"; + grid-template-columns: 65px 30px auto; +} + +.c29 { + border-color: #fff; + border-radius: 5px; + border-style: solid; + border-width: 1px; + display: inline-block; + font-style: normal; + grid-column: 2; + grid-row: 1; + margin: 0 4px; + position: relative; + text-align: center; + -webkit-text-decoration: none; + text-decoration: none; + vertical-align: middle; + width: 75%; +} + +.c29:hover { + border-color: #d1d5da; + background-color: #f6f8fa; +} + +.c9 { + grid-column-start: 1; + grid-row: 1 / span 2; + padding-right: 5px; + font-size: 0.9em; +} + +.c38 { + padding: 3px 10px 3px 10px; + border: 0; + margin-top: -15px; + width: 35px; + height: 35px; +} + +.c38:hover { + cursor: pointer; +} + +.c36 { + -webkit-flex: 0 0 25px; + -ms-flex: 0 0 25px; + flex: 0 0 25px; + grid-column: -1; +} + +.c11 { + grid-row-start: 2; + grid-column-start: 3; + grid-area: instructions; +} + +.c7 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + font-size: 1.2em; + grid-row-start: 1; + grid-column-start: 3; +} + +.c8 { + font-size: inherit; + font-weight: bold; + height: 1.2em; + margin: 0; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + -webkit-flex: 1 1 auto; + -ms-flex: 1 1 auto; + flex: 1 1 auto; + padding: 3px 0 10px 0; +} + +.c30 { + padding: 2px; + width: 100%; +} + +.c32 { + font-size: xx-small; +} + +.c32::before { + content: ""; + margin: 0 0.125em; +} + +.c33 { + color: #e60000; +} + +.c34 { + color: green; +} + +.c31 { + font-size: small; +} + +.c23 { + display: block; + list-style: none; + padding: 0; +} + +.c26 { + margin-left: 24px; + line-height: 1.25em; + padding-top: 1px; +} + +.c26 > span { + margin-right: 1ch; +} + +.c19 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-self: center; + -ms-flex-item-align: center; + align-self: center; + margin-top: 10px; +} + +.c19 a { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c20 { + color: #676767; + font-size: 13px; + font-style: normal; + padding: 0; +} + +.c25 { + fill: #676767; + float: left; + height: 16px; + width: 16px; +} + +.c24 { + font-size: 13px; + margin-top: 8px; + color: #676767; + font-style: normal; +} + +.c27 { + font-weight: 500; +} + +.c28 { + font-weight: 200; + opacity: 0.8975; + padding-left: 1ch; +} + +
      +
    1. +
      +
      +
      +
      +
      + + + Travel by bicycle + + + + +
      +
      +
      +
      +
      + + 503 SW Alder St, Portland, OR, USA 97204 + +
      +
      + 3:42 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Bicycle 0.7 miles to + + 1737 SW Morrison St, Portland, OR, USA 97205 + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + EAST + on + + SW Alder St + + + 87 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + RIGHT + on + + SW 5th Ave + + + 257 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + RIGHT + on + + SW Morrison St + + + 0.6 miles + + +
        +
        4. +
      +
      +
      +
      + +
      +       +
      +
      +
      + +
      +
      2. +
    2. +
      +
      +
      +
      + +
      +
      +
      +
      +
      + + 1737 SW Morrison St, Portland, OR, USA 97205 + +
      +
      + 3:49 PM +
      + + Arrive at + 1737 SW Morrison St, Portland, OR, USA 97205 + +
      +
      + +
      +
      3. +
    +`; + +exports[`Storyshots ItineraryBody/otp-ui Bike Rental Itinerary 1`] = ` + + + +`; + +exports[`Storyshots ItineraryBody/otp-ui Bike Rental Itinerary 2`] = ` +.c22 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c43 { + color: #f44256; +} + +.c29 { + border-top-style: solid; + border-top-width: 0; + padding-top: 0; + padding-bottom: 10px; +} + +.c16 { + background: transparent; + border: 0; + color: inherit; + cursor: pointer; + font-size: inherit; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c31 { + color: #008; + margin-left: 5px; +} + +.c31:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c6 { + color: black; + background-color: #e9e9e9; + border: 2px solid #bbb; + text-align: center; + width: 25px; + height: 25px; + font-size: 1.2em; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; +} + +.c34 { + color: black; + background-color: red; + border: 2px solid #bbb; + text-align: center; + width: 25px; + height: 25px; + font-size: 1.2em; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; +} + +.c21::before { + content: ""; + margin: 0 0.125em; +} + +.c42 { + text-align: center; +} + +.c4 { + border-left: dotted 4px #484848; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c33 { + border-left: dotted 4px red; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c0 { + list-style: none; + padding: 0; +} + +.c12 { + color: #676767; + font-size: 13px; + padding-bottom: 12px; +} + +.c17 { + bottom: 0; + cursor: pointer; + left: 0; + position: absolute; + right: 0; + top: 0; + width: 100%; + z-index: 1; +} + +.c13 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + line-height: 16px; + min-height: 31px; + position: relative; +} + +.c10 { + display: inline-block; + grid-row-start: 2; + grid-column-start: 1; + height: 0; + overflow: hidden; + width: 0; +} + +.c15 { + font-weight: inherit; +} + +.c14 { + -webkit-flex-shrink: 0; + -ms-flex-negative: 0; + flex-shrink: 0; +} + +.c3 { + position: relative; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); + height: 100%; +} + +.c5 { + width: 30px; + height: 30px; + border-radius: 50%; + position: absolute; + left: 50%; + top: 0; + -webkit-transform: translate(-51%,-10%); + -ms-transform: translate(-51%,-10%); + transform: translate(-51%,-10%); +} + +.c2 { + grid-column-start: 2; + grid-row: span 2; + padding-right: 5px; +} + +.c18 { + display: grid; + grid-template-columns: 130px auto; +} + +.c1 { + max-width: 500px; + display: grid; + grid-template-areas: "time line title" "time line instructions"; + grid-template-columns: 65px 30px auto; +} + +.c36 { + border-color: #fff; + border-radius: 5px; + border-style: solid; + border-width: 1px; + display: inline-block; + font-style: normal; + grid-column: 2; + grid-row: 1; + margin: 0 4px; + position: relative; + text-align: center; + -webkit-text-decoration: none; + text-decoration: none; + vertical-align: middle; + width: 75%; +} + +.c36:hover { + border-color: #d1d5da; + background-color: #f6f8fa; +} + +.c9 { + grid-column-start: 1; + grid-row: 1 / span 2; + padding-right: 5px; + font-size: 0.9em; +} + +.c32 { + padding: 3px 10px 3px 10px; + border: 0; + margin-top: -15px; + width: 35px; + height: 35px; +} + +.c32:hover { + cursor: pointer; +} + +.c30 { + -webkit-flex: 0 0 25px; + -ms-flex: 0 0 25px; + flex: 0 0 25px; + grid-column: -1; +} + +.c11 { + grid-row-start: 2; + grid-column-start: 3; + grid-area: instructions; +} + +.c7 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + font-size: 1.2em; + grid-row-start: 1; + grid-column-start: 3; +} + +.c8 { + font-size: inherit; + font-weight: bold; + height: 1.2em; + margin: 0; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + -webkit-flex: 1 1 auto; + -ms-flex: 1 1 auto; + flex: 1 1 auto; + padding: 3px 0 10px 0; +} + +.c35 { + color: #807373; + font-size: 13px; + font-weight: 300; + padding-top: 1px; + margin-bottom: 10px; + margin-top: -14px; +} + +.c37 { + padding: 2px; + width: 100%; +} + +.c39 { + font-size: xx-small; +} + +.c39::before { + content: ""; + margin: 0 0.125em; +} + +.c40 { + color: #e60000; +} + +.c41 { + color: green; +} + +.c38 { + font-size: small; +} + +.c23 { + display: block; + list-style: none; + padding: 0; +} + +.c26 { + margin-left: 24px; + line-height: 1.25em; + padding-top: 1px; +} + +.c26 > span { + margin-right: 1ch; +} + +.c19 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-self: center; + -ms-flex-item-align: center; + align-self: center; + margin-top: 10px; +} + +.c19 a { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c20 { + color: #676767; + font-size: 13px; + font-style: normal; + padding: 0; +} + +.c25 { + fill: #676767; + float: left; + height: 16px; + width: 16px; +} + +.c24 { + font-size: 13px; + margin-top: 8px; + color: #676767; + font-style: normal; +} + +.c27 { + font-weight: 500; +} + +.c28 { + font-weight: 200; + opacity: 0.8975; + padding-left: 1ch; +} + +
      +
    1. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + 2624 SE 30th Ave, Portland, OR, USA 97202 + +
      +
      + 3:45 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 498 feet to + + SE 30th at Division + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + WEST + on + + SE Clinton St + + + 79 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + RIGHT + on + + SE 30th Ave + + + 419 feet + + +
        +
        3. +
      +
      +
      +       +
      +
      +
      + +
      +
      2. +
    2. +
      +
      +
      +
      +
      + + + Travel by bicycle + + + + + + + + + + +
      +
      +
      +
      +
      + + SE 30th at Division + +
      +
      + 3:48 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      + Pick up + shared bike + +
      +
      +
      + + + + - + + + Bicycle 0.6 miles to + + SE 29th at Hawthorne + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + CONTINUE + on + + SE 30th Ave + + + 0.3 miles + + +
        +
        2. +
      2. +
        + + + +
        +
        + + LEFT + on + + SE Harrison St + + + 361 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + RIGHT + on + + SE 29th Ave + + + 0.2 miles + + +
        +
        4. +
      4. +
        + + + +
        +
        + + LEFT + on + + SE Hawthorne Blvd + + + 50 feet + + +
        +
        5. +
      +
      +
      +
      + +
      +       +
      +
      +
      + +
      +
      3. +
    3. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + SE 29th at Hawthorne + +
      +
      + 3:55 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 0.1 miles to + + 1415 SE 28th Ave, Portland, OR, USA 97214 + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + CONTINUE + on + + SE Hawthorne Blvd + + + 210 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + RIGHT + on + + SE 28th Ave + + + 295 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + LEFT + on + + SE Madison St + + + 114 feet + + +
        +
        4. +
      +
      +
      +       +
      +
      +
      + +
      +
      4. +
    4. +
      +
      +
      +
      + +
      +
      +
      +
      +
      + + 1415 SE 28th Ave, Portland, OR, USA 97214 + +
      +
      + 3:58 PM +
      + + Arrive at + 1415 SE 28th Ave, Portland, OR, USA 97214 + +
      +
      + +
      +
      5. +
    +`; + +exports[`Storyshots ItineraryBody/otp-ui Bike Rental Transit Itinerary 1`] = ` + + + +`; + +exports[`Storyshots ItineraryBody/otp-ui Bike Rental Transit Itinerary 2`] = ` +.c22 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c66 { + color: #f44256; +} + +.c29 { + border-top-style: solid; + border-top-width: 0; + padding-top: 0; + padding-bottom: 10px; +} + +.c16 { + background: transparent; + border: 0; + color: inherit; + cursor: pointer; + font-size: inherit; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c31 { + color: #008; + margin-left: 5px; +} + +.c31:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c6 { + color: black; + background-color: #e9e9e9; + border: 2px solid #bbb; + text-align: center; + width: 25px; + height: 25px; + font-size: 1.2em; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; +} + +.c34 { + color: black; + background-color: red; + border: 2px solid #bbb; + text-align: center; + width: 25px; + height: 25px; + font-size: 1.2em; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; +} + +.c21::before { + content: ""; + margin: 0 0.125em; +} + +.c65 { + text-align: center; +} + +.c4 { + border-left: dotted 4px #484848; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c33 { + border-left: dotted 4px red; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c42 { + border-left: solid 8px #008ab0; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c61 { + display: block; + font-size: 13px; + list-style: none; + padding: 0; +} + +.c0 { + list-style: none; + padding: 0; +} + +.c12 { + color: #676767; + font-size: 13px; + padding-bottom: 12px; +} + +.c17 { + bottom: 0; + cursor: pointer; + left: 0; + position: absolute; + right: 0; + top: 0; + width: 100%; + z-index: 1; +} + +.c13 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + line-height: 16px; + min-height: 31px; + position: relative; +} + +.c10 { + display: inline-block; + grid-row-start: 2; + grid-column-start: 1; + height: 0; + overflow: hidden; + width: 0; +} + +.c49 { + font-weight: 200; +} + +.c15 { + font-weight: inherit; +} + +.c48 { + font-size: 13px; + font-weight: 500; +} + +.c47 { + font-weight: 800; + margin-right: 6px; +} + +.c46 { + color: #807373; + margin-top: 5px; +} + +.c14 { + -webkit-flex-shrink: 0; + -ms-flex-negative: 0; + flex-shrink: 0; +} + +.c3 { + position: relative; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); + height: 100%; +} + +.c5 { + width: 30px; + height: 30px; + border-radius: 50%; + position: absolute; + left: 50%; + top: 0; + -webkit-transform: translate(-51%,-10%); + -ms-transform: translate(-51%,-10%); + transform: translate(-51%,-10%); +} + +.c2 { + grid-column-start: 2; + grid-row: span 2; + padding-right: 5px; +} + +.c18 { + display: grid; + grid-template-columns: 130px auto; +} + +.c1 { + max-width: 500px; + display: grid; + grid-template-areas: "time line title" "time line instructions"; + grid-template-columns: 65px 30px auto; +} + +.c36 { + border-color: #fff; + border-radius: 5px; + border-style: solid; + border-width: 1px; + display: inline-block; + font-style: normal; + grid-column: 2; + grid-row: 1; + margin: 0 4px; + position: relative; + text-align: center; + -webkit-text-decoration: none; + text-decoration: none; + vertical-align: middle; + width: 75%; +} + +.c36:hover { + border-color: #d1d5da; + background-color: #f6f8fa; +} + +.c9 { + grid-column-start: 1; + grid-row: 1 / span 2; + padding-right: 5px; + font-size: 0.9em; +} + +.c32 { + padding: 3px 10px 3px 10px; + border: 0; + margin-top: -15px; + width: 35px; + height: 35px; +} + +.c32:hover { + cursor: pointer; +} + +.c30 { + -webkit-flex: 0 0 25px; + -ms-flex: 0 0 25px; + flex: 0 0 25px; + grid-column: -1; +} + +.c11 { + grid-row-start: 2; + grid-column-start: 3; + grid-area: instructions; +} + +.c7 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + font-size: 1.2em; + grid-row-start: 1; + grid-column-start: 3; +} + +.c8 { + font-size: inherit; + font-weight: bold; + height: 1.2em; + margin: 0; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + -webkit-flex: 1 1 auto; + -ms-flex: 1 1 auto; + flex: 1 1 auto; + padding: 3px 0 10px 0; +} + +.c35 { + color: #807373; + font-size: 13px; + font-weight: 300; + padding-top: 1px; + margin-bottom: 10px; + margin-top: -14px; +} + +.c37 { + padding: 2px; + width: 100%; +} + +.c39 { + font-size: xx-small; +} + +.c39::before { + content: ""; + margin: 0 0.125em; +} + +.c40 { + color: #e60000; +} + +.c41 { + color: green; +} + +.c38 { + font-size: small; +} + +.c43 { + text-align: center; + min-width: 30px; + min-height: 30px; + font-size: 1.2em; + background-color: #084c8d; + color: white; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; + border: 1px solid; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + cursor: default; +} + +.c44 { + position: absolute; + width: 1px; + height: 1px; + padding: 0; + margin: -1px; + overflow: hidden; + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + border: 0; +} + +.c23 { + display: block; + list-style: none; + padding: 0; +} + +.c26 { + margin-left: 24px; + line-height: 1.25em; + padding-top: 1px; +} + +.c26 > span { + margin-right: 1ch; +} + +.c19 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-self: center; + -ms-flex-item-align: center; + align-self: center; + margin-top: 10px; +} + +.c19 a { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c20 { + color: #676767; + font-size: 13px; + font-style: normal; + padding: 0; +} + +.c25 { + fill: #676767; + float: left; + height: 16px; + width: 16px; +} + +.c24 { + font-size: 13px; + margin-top: 8px; + color: #676767; + font-style: normal; +} + +.c27 { + font-weight: 500; +} + +.c28 { + font-weight: 200; + opacity: 0.8975; + padding-left: 1ch; +} + +.c45 { + font-weight: 200; + font-size: 0.9em; + margin-left: 10px; +} + +.c63 { + float: left; + margin-left: -36px; + color: #fff; +} + +.c64 { + color: #676767; + margin-top: 3px; +} + +.c62 { + z-index: 30; + position: relative; +} + +.c52 { + background-color: #eee; + border-radius: 4px; + color: #000; + display: block; + margin-top: 5px; + padding: 8px; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c56 { + -webkit-align-items: baseline; + -webkit-box-align: baseline; + -ms-flex-align: baseline; + align-items: baseline; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + gap: 5px; + margin-top: 0.5em; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c56:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c54 { + font-size: 12px; + margin-left: 30px; + white-space: pre-wrap; +} + +.c55 { + margin-top: 5px; + margin-left: 30px; + font-size: 12px; + font-style: italic; +} + +.c53 { + float: left; + font-size: 18px; +} + +.c51 { + display: block; + margin-top: 3px; + padding: 0; +} + +.c50 { + color: #d14727; + cursor: auto; + display: inline-block; + font-weight: 400; + margin-top: 8px; + padding: 0; +} + +.c57 { + margin-top: 5px; +} + +.c58 { + color: #676767; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; +} + +.c60 { + font-size: 14px; +} + +.c59 { + padding: 0; +} + +
      +
    1. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + 2943 SE Washington St, Portland, OR, USA 97214 + +
      +
      + 3:50 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 400 feet to + + SE 29th at Stark + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + NORTH + on + + SE 30th Ave + + + 103 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + RIGHT + on + + SE Stark St + + + 277 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + RIGHT + on + + SE 29th Ave + + + 19 feet + + +
        +
        4. +
      +
      +
      +       +
      +
      +
      + +
      +
      2. +
    2. +
      +
      +
      +
      +
      + + + Travel by bicycle + + + + + + + + + + +
      +
      +
      +
      +
      + + SE 29th at Stark + +
      +
      + 3:53 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      + Pick up + shared bike + +
      +
      +
      + + + + - + + + Bicycle 0.8 miles to + + NE Glisan at 24th + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + CONTINUE + on + + SE 29th Ave + + + 492 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + LEFT + on + + SE Pine St + + + 358 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + RIGHT + on + + SE 28th Ave + + + 518 feet + + +
        +
        4. +
      4. +
        + + + +
        +
        + + LEFT + on + + SE Ankeny St + + + 0.2 miles + + +
        +
        5. +
      5. +
        + + + +
        +
        + + RIGHT + on + + SE 24th Ave + + + 259 feet + + +
        +
        6. +
      6. +
        + + + +
        +
        + + CONTINUE + on + + NE 24th Ave + + + 0.2 miles + + +
        +
        7. +
      7. +
        + + + +
        +
        + + LEFT + on + + NE Glisan St + + + 57 feet + + +
        +
        8. +
      +
      +
      +
      + +
      +       +
      +
      +
      + +
      +
      3. +
    3. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + NE Glisan at 24th + +
      +
      + 3:59 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 497 feet to + + NE Sandy & 24th + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + HARD_LEFT + on + + NE Glisan St + + + 57 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + LEFT + on + + NE 24th Ave + + + 382 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + RIGHT + on + + NE Sandy Blvd + + + 58 feet + + +
        +
        4. +
      +
      +
      +       +
      +
      +
      + +
      +
      4. +
    4. +
      +
      +
      +
      +
      + + 12 + + + Barbur/Sandy Blvd + +
      +
      +
      +
      +
      + + NE Sandy & 24th + + ID 5066 + + +
      +
      + 4:02 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + Ride + + +
      + + 12 + +
      + + + Barbur/Sandy Blvd + + to + + Parkrose TC + + +       + + - + Disembark at + NE Sandy & 57th + + ID 5104 + + +       + +       +
      +
      +
      + + + 2 alerts +
      +
      +
      + +
      +
      +
      +
      + +
      +
      +
      +
      +
        +
      1. +
        + • +
        +
        + NE Sandy & Lawrence +
        +
        2. +
      2. +
        + • +
        +
        + NE Sandy & 28th +
        +
        3. +
      3. +
        + • +
        +
        + NE Sandy & 31st +
        +
        4. +
      4. +
        + • +
        +
        + NE Sandy & 33rd +
        +
        5. +
      5. +
        + • +
        +
        + NE Sandy & Imperial +
        +
        6. +
      6. +
        + • +
        +
        + NE Sandy & 38th +
        +
        7. +
      7. +
        + • +
        +
        + NE Sandy & 42nd +
        +
        8. +
      8. +
        + • +
        +
        + NE Sandy & 44th +
        +
        9. +
      9. +
        + • +
        +
        + NE Sandy & 48th +
        +
        10. +
      10. +
        + • +
        +
        + NE Sandy & 50th +
        +
        11. +
      11. +
        + • +
        +
        + NE Sandy & Sacramento +
        +
        12. +
      12. +
        + • +
        +
        + NE Sandy & 54th +
        +
        13. +
      +
      +
      +
      +
      +
      +
      +
      +
      + +
      +
      5. +
    5. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + NE Sandy & 57th + + ID 5104 + + +
      +
      + 4:14 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 279 feet to + + 0086 BIKETOWN + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + NORTHEAST + on + + NE Sandy Blvd + + + 75 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + HARD_LEFT + on + + NE Alameda St + + + 203 feet + + +
        +
        3. +
      +
      +
      +       +
      +
      +
      + +
      +
      6. +
    6. +
      +
      +
      +
      +
      + + + Travel by bicycle + + + + + + + + + + +
      +
      +
      +
      +
      + + 0086 BIKETOWN + +
      +
      + 4:16 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      + Pick up + shared bike + +
      +
      +
      + + + + - + + + Bicycle 1 mile to + + NE 60th at Cully + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + HARD_LEFT + on + + NE Alameda St + + + 203 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + HARD_LEFT + on + + NE 57th Ave + + + 0.6 miles + + +
        +
        3. +
      3. +
        + + + +
        +
        + + CONTINUE + on + + NE Cully Blvd + + + 0.3 miles + + +
        +
        4. +
      4. +
        + + + +
        +
        + + LEFT + on + + NE 60th Ave + + + 171 feet + + +
        +
        5. +
      +
      +
      +
      + +
      +       +
      +
      +
      + +
      +
      7. +
    7. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + NE 60th at Cully + +
      +
      + 4:24 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 494 feet to + + 5916 NE Going St, Portland, OR, USA 97218 + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + CONTINUE + on + + NE 60th Ave + + + 270 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + LEFT + on + + NE Going St + + + 225 feet + + +
        +
        3. +
      +
      +
      +       +
      +
      +
      + +
      +
      8. +
    8. +
      +
      +
      +
      + +
      +
      +
      +
      +
      + + 5916 NE Going St, Portland, OR, USA 97218 + +
      +
      + 4:26 PM +
      + + Arrive at + 5916 NE Going St, Portland, OR, USA 97218 + +
      +
      + +
      +
      9. +
    +`; + +exports[`Storyshots ItineraryBody/otp-ui Bike Transit Bike Itinerary 1`] = ` + + + +`; + +exports[`Storyshots ItineraryBody/otp-ui Bike Transit Bike Itinerary 2`] = ` +.c22 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c59 { + color: #f44256; +} + +.c29 { + border-top-style: solid; + border-top-width: 0; + padding-top: 0; + padding-bottom: 10px; +} + +.c16 { + background: transparent; + border: 0; + color: inherit; + cursor: pointer; + font-size: inherit; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c31 { + color: #008; + margin-left: 5px; +} + +.c31:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c6 { + color: black; + background-color: #e9e9e9; + border: 2px solid #bbb; + text-align: center; + width: 25px; + height: 25px; + font-size: 1.2em; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; +} + +.c34 { + color: black; + background-color: red; + border: 2px solid #bbb; + text-align: center; + width: 25px; + height: 25px; + font-size: 1.2em; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; +} + +.c21::before { + content: ""; + margin: 0 0.125em; +} + +.c58 { + text-align: center; +} + +.c4 { + border-left: dotted 4px #484848; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c33 { + border-left: dotted 4px red; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c35 { + border-left: solid 8px #084C8D; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c54 { + display: block; + font-size: 13px; + list-style: none; + padding: 0; +} + +.c0 { + list-style: none; + padding: 0; +} + +.c12 { + color: #676767; + font-size: 13px; + padding-bottom: 12px; +} + +.c17 { + bottom: 0; + cursor: pointer; + left: 0; + position: absolute; + right: 0; + top: 0; + width: 100%; + z-index: 1; +} + +.c13 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + line-height: 16px; + min-height: 31px; + position: relative; +} + +.c10 { + display: inline-block; + grid-row-start: 2; + grid-column-start: 1; + height: 0; + overflow: hidden; + width: 0; +} + +.c42 { + font-weight: 200; +} + +.c15 { + font-weight: inherit; +} + +.c41 { + font-size: 13px; + font-weight: 500; +} + +.c40 { + font-weight: 800; + margin-right: 6px; +} + +.c39 { + color: #807373; + margin-top: 5px; +} + +.c14 { + -webkit-flex-shrink: 0; + -ms-flex-negative: 0; + flex-shrink: 0; +} + +.c3 { + position: relative; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); + height: 100%; +} + +.c5 { + width: 30px; + height: 30px; + border-radius: 50%; + position: absolute; + left: 50%; + top: 0; + -webkit-transform: translate(-51%,-10%); + -ms-transform: translate(-51%,-10%); + transform: translate(-51%,-10%); +} + +.c2 { + grid-column-start: 2; + grid-row: span 2; + padding-right: 5px; +} + +.c18 { + display: grid; + grid-template-columns: 130px auto; +} + +.c1 { + max-width: 500px; + display: grid; + grid-template-areas: "time line title" "time line instructions"; + grid-template-columns: 65px 30px auto; +} + +.c9 { + grid-column-start: 1; + grid-row: 1 / span 2; + padding-right: 5px; + font-size: 0.9em; +} + +.c32 { + padding: 3px 10px 3px 10px; + border: 0; + margin-top: -15px; + width: 35px; + height: 35px; +} + +.c32:hover { + cursor: pointer; +} + +.c30 { + -webkit-flex: 0 0 25px; + -ms-flex: 0 0 25px; + flex: 0 0 25px; + grid-column: -1; +} + +.c11 { + grid-row-start: 2; + grid-column-start: 3; + grid-area: instructions; +} + +.c7 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + font-size: 1.2em; + grid-row-start: 1; + grid-column-start: 3; +} + +.c8 { + font-size: inherit; + font-weight: bold; + height: 1.2em; + margin: 0; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + -webkit-flex: 1 1 auto; + -ms-flex: 1 1 auto; + flex: 1 1 auto; + padding: 3px 0 10px 0; +} + +.c36 { + text-align: center; + min-width: 30px; + min-height: 30px; + font-size: 1.2em; + background-color: #084C8D; + color: white; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; + border: 1px solid; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + cursor: default; +} + +.c37 { + position: absolute; + width: 1px; + height: 1px; + padding: 0; + margin: -1px; + overflow: hidden; + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + border: 0; +} + +.c23 { + display: block; + list-style: none; + padding: 0; +} + +.c26 { + margin-left: 24px; + line-height: 1.25em; + padding-top: 1px; +} + +.c26 > span { + margin-right: 1ch; +} + +.c19 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-self: center; + -ms-flex-item-align: center; + align-self: center; + margin-top: 10px; +} + +.c19 a { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c20 { + color: #676767; + font-size: 13px; + font-style: normal; + padding: 0; +} + +.c25 { + fill: #676767; + float: left; + height: 16px; + width: 16px; +} + +.c24 { + font-size: 13px; + margin-top: 8px; + color: #676767; + font-style: normal; +} + +.c27 { + font-weight: 500; +} + +.c28 { + font-weight: 200; + opacity: 0.8975; + padding-left: 1ch; +} + +.c38 { + font-weight: 200; + font-size: 0.9em; + margin-left: 10px; +} + +.c56 { + float: left; + margin-left: -36px; + color: #fff; +} + +.c57 { + color: #676767; + margin-top: 3px; +} + +.c55 { + z-index: 30; + position: relative; +} + +.c45 { + background-color: #eee; + border-radius: 4px; + color: #000; + display: block; + margin-top: 5px; + padding: 8px; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c49 { + -webkit-align-items: baseline; + -webkit-box-align: baseline; + -ms-flex-align: baseline; + align-items: baseline; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + gap: 5px; + margin-top: 0.5em; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c49:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c47 { + font-size: 12px; + margin-left: 30px; + white-space: pre-wrap; +} + +.c48 { + margin-top: 5px; + margin-left: 30px; + font-size: 12px; + font-style: italic; +} + +.c46 { + float: left; + font-size: 18px; +} + +.c44 { + display: block; + margin-top: 3px; + padding: 0; +} + +.c43 { + color: #d14727; + cursor: auto; + display: inline-block; + font-weight: 400; + margin-top: 8px; + padding: 0; +} + +.c50 { + margin-top: 5px; +} + +.c51 { + color: #676767; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; +} + +.c53 { + font-size: 14px; +} + +.c52 { + padding: 0; +} + +
      +
    1. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + KGW Studio on the Sq, Portland, OR, USA + +
      +
      + 3:44 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 91 feet to + + corner of path and Pioneer Courthouse Sq (pedestrian street) + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + SOUTHEAST + on + + Unnamed Path + + + 91 feet + + +
        +
        2. +
      +
      +
      +       +
      +
      +
      + +
      +
      2. +
    2. +
      +
      +
      +
      +
      + + + Travel by bicycle + + + + +
      +
      +
      +
      +
      + + corner of path and Pioneer Courthouse Sq (pedestrian street) + +
      +
      + 3:44 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Bicycle 0.1 miles to + + corner of path and Pioneer Sq N (path) + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + LEFT + on + + Unnamed Path + + + 20 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + LEFT + on + + SW 6th Ave + + + 245 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + LEFT + on + + SW Morrison St + + + 241 feet + + +
        +
        4. +
      4. +
        + + + +
        +
        + + LEFT + on + + Unnamed Path + + + 27 feet + + +
        +
        5. +
      +
      +
      +       +
      +
      +
      + +
      +
      3. +
    3. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + corner of path and Pioneer Sq N (path) + +
      +
      + 3:45 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 22 feet to + + Pioneer Square North MAX Station + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + LEFT + on + + Pioneer Sq N (path) + + + 22 feet + + +
        +
        2. +
      +
      +
      +       +
      +
      +
      + +
      +
      4. +
    4. +
      +
      +
      +
      +
      + + MA + + + MAX Blue Line + +
      +
      +
      +
      +
      + + Pioneer Square North MAX Station + + ID 8383 + + +
      +
      + 3:46 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + Ride + + +
      + + MAX Blue Line + +
      + + + MAX Blue Line + + to + + Hillsboro + + +       + + - + Disembark at + Providence Park MAX Station + + ID 9757 + + +       + +       +
      +
      +
      + + + 2 alerts +
      +
      +
      + +
      +
      +
      +
      + +
      +
      +
      +
      +
        +
      1. +
        + • +
        +
        + Galleria/SW 10th Ave MAX Station +
        +
        2. +
      +
      +
      +
      +
      +
      +
      +
      +
      + +
      +
      5. +
    5. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + Providence Park MAX Station + + ID 9757 + + +
      +
      + 3:49 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 19 feet to + + corner of path and Providence Park (path) + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + WEST + on + + Providence Park (path) + + + 19 feet + + +
        +
        2. +
      +
      +
      +       +
      +
      +
      + +
      +
      6. +
    6. +
      +
      +
      +
      +
      + + + Travel by bicycle + + + + +
      +
      +
      +
      +
      + + corner of path and Providence Park (path) + +
      +
      + 3:49 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Bicycle 230 feet to + + 1737 SW Morrison St, Portland, OR, USA 97205 + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + RIGHT + on + + Unnamed Path + + + 104 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + RIGHT + on + + Unnamed Path + + + 27 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + RIGHT + on + + SW Morrison St + + + 99 feet + + +
        +
        4. +
      +
      +
      +       +
      +
      +
      + +
      +
      7. +
    7. +
      +
      +
      +
      + +
      +
      +
      +
      +
      + + 1737 SW Morrison St, Portland, OR, USA 97205 + +
      +
      + 3:50 PM +
      + + Arrive at + 1737 SW Morrison St, Portland, OR, USA 97205 + +
      +
      + +
      +
      8. +
    +`; + +exports[`Storyshots ItineraryBody/otp-ui Custom Alert Icons Itinerary 1`] = ` + + + +`; + +exports[`Storyshots ItineraryBody/otp-ui Custom Alert Icons Itinerary 2`] = ` +.c22 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c57 { + color: #f44256; +} + +.c29 { + border-top-style: solid; + border-top-width: 0; + padding-top: 0; + padding-bottom: 10px; +} + +.c16 { + background: transparent; + border: 0; + color: inherit; + cursor: pointer; + font-size: inherit; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c31 { + color: #008; + margin-left: 5px; +} + +.c31:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c6 { + color: black; + background-color: #e9e9e9; + border: 2px solid #bbb; + text-align: center; + width: 25px; + height: 25px; + font-size: 1.2em; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; +} + +.c21::before { + content: ""; + margin: 0 0.125em; +} + +.c56 { + text-align: center; +} + +.c4 { + border-left: dotted 4px #484848; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c33 { + border-left: solid 8px #084C8D; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c52 { + display: block; + font-size: 13px; + list-style: none; + padding: 0; +} + +.c0 { + list-style: none; + padding: 0; +} + +.c12 { + color: #676767; + font-size: 13px; + padding-bottom: 12px; +} + +.c17 { + bottom: 0; + cursor: pointer; + left: 0; + position: absolute; + right: 0; + top: 0; + width: 100%; + z-index: 1; +} + +.c13 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + line-height: 16px; + min-height: 31px; + position: relative; +} + +.c10 { + display: inline-block; + grid-row-start: 2; + grid-column-start: 1; + height: 0; + overflow: hidden; + width: 0; +} + +.c40 { + font-weight: 200; +} + +.c15 { + font-weight: inherit; +} + +.c39 { + font-size: 13px; + font-weight: 500; +} + +.c38 { + font-weight: 800; + margin-right: 6px; +} + +.c37 { + color: #807373; + margin-top: 5px; +} + +.c14 { + -webkit-flex-shrink: 0; + -ms-flex-negative: 0; + flex-shrink: 0; +} + +.c3 { + position: relative; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); + height: 100%; +} + +.c5 { + width: 30px; + height: 30px; + border-radius: 50%; + position: absolute; + left: 50%; + top: 0; + -webkit-transform: translate(-51%,-10%); + -ms-transform: translate(-51%,-10%); + transform: translate(-51%,-10%); +} + +.c2 { + grid-column-start: 2; + grid-row: span 2; + padding-right: 5px; +} + +.c18 { + display: grid; + grid-template-columns: 130px auto; +} + +.c1 { + max-width: 500px; + display: grid; + grid-template-areas: "time line title" "time line instructions"; + grid-template-columns: 65px 30px auto; +} + +.c9 { + grid-column-start: 1; + grid-row: 1 / span 2; + padding-right: 5px; + font-size: 0.9em; +} + +.c32 { + padding: 3px 10px 3px 10px; + border: 0; + margin-top: -15px; + width: 35px; + height: 35px; +} + +.c32:hover { + cursor: pointer; +} + +.c30 { + -webkit-flex: 0 0 25px; + -ms-flex: 0 0 25px; + flex: 0 0 25px; + grid-column: -1; +} + +.c11 { + grid-row-start: 2; + grid-column-start: 3; + grid-area: instructions; +} + +.c7 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + font-size: 1.2em; + grid-row-start: 1; + grid-column-start: 3; +} + +.c8 { + font-size: inherit; + font-weight: bold; + height: 1.2em; + margin: 0; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + -webkit-flex: 1 1 auto; + -ms-flex: 1 1 auto; + flex: 1 1 auto; + padding: 3px 0 10px 0; +} + +.c34 { + text-align: center; + min-width: 30px; + min-height: 30px; + font-size: 1.2em; + background-color: #084C8D; + color: white; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; + border: 1px solid; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + cursor: default; +} + +.c35 { + position: absolute; + width: 1px; + height: 1px; + padding: 0; + margin: -1px; + overflow: hidden; + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + border: 0; +} + +.c23 { + display: block; + list-style: none; + padding: 0; +} + +.c26 { + margin-left: 24px; + line-height: 1.25em; + padding-top: 1px; +} + +.c26 > span { + margin-right: 1ch; +} + +.c19 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-self: center; + -ms-flex-item-align: center; + align-self: center; + margin-top: 10px; +} + +.c19 a { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c20 { + color: #676767; + font-size: 13px; + font-style: normal; + padding: 0; +} + +.c25 { + fill: #676767; + float: left; + height: 16px; + width: 16px; +} + +.c24 { + font-size: 13px; + margin-top: 8px; + color: #676767; + font-style: normal; +} + +.c27 { + font-weight: 500; +} + +.c28 { + font-weight: 200; + opacity: 0.8975; + padding-left: 1ch; +} + +.c36 { + font-weight: 200; + font-size: 0.9em; + margin-left: 10px; +} + +.c54 { + float: left; + margin-left: -36px; + color: #fff; +} + +.c55 { + color: #676767; + margin-top: 3px; +} + +.c53 { + z-index: 30; + position: relative; +} + +.c43 { + background-color: #eee; + border-radius: 4px; + color: #000; + display: block; + margin-top: 5px; + padding: 8px; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c47 { + -webkit-align-items: baseline; + -webkit-box-align: baseline; + -ms-flex-align: baseline; + align-items: baseline; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + gap: 5px; + margin-top: 0.5em; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c47:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c45 { + font-size: 12px; + margin-left: 30px; + white-space: pre-wrap; +} + +.c46 { + margin-top: 5px; + margin-left: 30px; + font-size: 12px; + font-style: italic; +} + +.c44 { + float: left; + font-size: 18px; +} + +.c42 { + display: block; + margin-top: 3px; + padding: 0; +} + +.c41 { + color: #d14727; + cursor: cursor; + display: inline-block; + font-weight: 400; + margin-top: 8px; + padding: 0; +} + +.c48 { + margin-top: 5px; +} + +.c49 { + color: #676767; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; +} + +.c51 { + font-size: 14px; +} + +.c50 { + padding: 0; +} + +
      +
    1. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + KGW Studio on the Sq, Portland, OR, USA + +
      +
      + 3:44 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 269 feet to + + Pioneer Square North MAX Station + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + NORTHWEST + on + + Unnamed Path + + + 167 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + LEFT + on + + Pioneer Sq N (path) + + + 101 feet + + +
        +
        3. +
      +
      +
      +       +
      +
      +
      + +
      +
      2. +
    2. +
      +
      +
      +
      +
      + + MA + + + MAX Blue Line + +
      +
      +
      +
      +
      + + Pioneer Square North MAX Station + + ID 8383 + + +
      +
      + 3:46 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + Ride + + +
      + + MAX Blue Line + +
      + + + MAX Blue Line + + to + + Hillsboro + + +       + + - + Disembark at + Providence Park MAX Station + + ID 9757 + + +       + +       +
      +
      + +
      +
      + +
      +
      +
      +
      + +
      +
      +
      +
      +
        +
      1. +
        + • +
        +
        + Galleria/SW 10th Ave MAX Station +
        +
        2. +
      +
      +
      +
      + + Typical wait: + 15 min + +
      +
      +
      +
      +
      + +
      +
      3. +
    3. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + Providence Park MAX Station + + ID 9757 + + +
      +
      + 3:49 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 249 feet to + + 1737 SW Morrison St, Portland, OR, USA 97205 + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + WEST + on + + Providence Park (path) + + + 19 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + RIGHT + on + + Unnamed Path + + + 104 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + RIGHT + on + + Unnamed Path + + + 27 feet + + +
        +
        4. +
      4. +
        + + + +
        +
        + + RIGHT + on + + SW Morrison St + + + 99 feet + + +
        +
        5. +
      +
      +
      +       +
      +
      +
      + +
      +
      4. +
    4. +
      +
      +
      +
      + +
      +
      +
      +
      +
      + + 1737 SW Morrison St, Portland, OR, USA 97205 + +
      +
      + 3:50 PM +
      + + Arrive at + 1737 SW Morrison St, Portland, OR, USA 97205 + +
      +
      + +
      +
      5. +
    +`; + +exports[`Storyshots ItineraryBody/otp-ui E Scooter Rental Itinerary 1`] = ` + + + +`; + +exports[`Storyshots ItineraryBody/otp-ui E Scooter Rental Itinerary 2`] = ` +.c22 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c37 { + color: #f44256; +} + +.c29 { + border-top-style: solid; + border-top-width: 0; + padding-top: 0; + padding-bottom: 10px; +} + +.c16 { + background: transparent; + border: 0; + color: inherit; + cursor: pointer; + font-size: inherit; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c31 { + color: #008; + margin-left: 5px; +} + +.c31:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c6 { + color: black; + background-color: #e9e9e9; + border: 2px solid #bbb; + text-align: center; + width: 25px; + height: 25px; + font-size: 1.2em; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; +} + +.c34 { + color: black; + background-color: #f5a729; + border: 2px solid #bbb; + text-align: center; + width: 25px; + height: 25px; + font-size: 1.2em; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; +} + +.c21::before { + content: ""; + margin: 0 0.125em; +} + +.c36 { + text-align: center; +} + +.c4 { + border-left: dotted 4px #484848; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c33 { + border-left: dotted 4px #f5a729; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c0 { + list-style: none; + padding: 0; +} + +.c12 { + color: #676767; + font-size: 13px; + padding-bottom: 12px; +} + +.c17 { + bottom: 0; + cursor: pointer; + left: 0; + position: absolute; + right: 0; + top: 0; + width: 100%; + z-index: 1; +} + +.c13 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + line-height: 16px; + min-height: 31px; + position: relative; +} + +.c10 { + display: inline-block; + grid-row-start: 2; + grid-column-start: 1; + height: 0; + overflow: hidden; + width: 0; +} + +.c15 { + font-weight: inherit; +} + +.c14 { + -webkit-flex-shrink: 0; + -ms-flex-negative: 0; + flex-shrink: 0; +} + +.c3 { + position: relative; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); + height: 100%; +} + +.c5 { + width: 30px; + height: 30px; + border-radius: 50%; + position: absolute; + left: 50%; + top: 0; + -webkit-transform: translate(-51%,-10%); + -ms-transform: translate(-51%,-10%); + transform: translate(-51%,-10%); +} + +.c2 { + grid-column-start: 2; + grid-row: span 2; + padding-right: 5px; +} + +.c18 { + display: grid; + grid-template-columns: 130px auto; +} + +.c1 { + max-width: 500px; + display: grid; + grid-template-areas: "time line title" "time line instructions"; + grid-template-columns: 65px 30px auto; +} + +.c9 { + grid-column-start: 1; + grid-row: 1 / span 2; + padding-right: 5px; + font-size: 0.9em; +} + +.c32 { + padding: 3px 10px 3px 10px; + border: 0; + margin-top: -15px; + width: 35px; + height: 35px; +} + +.c32:hover { + cursor: pointer; +} + +.c30 { + -webkit-flex: 0 0 25px; + -ms-flex: 0 0 25px; + flex: 0 0 25px; + grid-column: -1; +} + +.c11 { + grid-row-start: 2; + grid-column-start: 3; + grid-area: instructions; +} + +.c7 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + font-size: 1.2em; + grid-row-start: 1; + grid-column-start: 3; +} + +.c8 { + font-size: inherit; + font-weight: bold; + height: 1.2em; + margin: 0; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + -webkit-flex: 1 1 auto; + -ms-flex: 1 1 auto; + flex: 1 1 auto; + padding: 3px 0 10px 0; +} + +.c35 { + color: #807373; + font-size: 13px; + font-weight: 300; + padding-top: 1px; + margin-bottom: 10px; + margin-top: -14px; +} + +.c23 { + display: block; + list-style: none; + padding: 0; +} + +.c26 { + margin-left: 24px; + line-height: 1.25em; + padding-top: 1px; +} + +.c26 > span { + margin-right: 1ch; +} + +.c19 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-self: center; + -ms-flex-item-align: center; + align-self: center; + margin-top: 10px; +} + +.c19 a { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c20 { + color: #676767; + font-size: 13px; + font-style: normal; + padding: 0; +} + +.c25 { + fill: #676767; + float: left; + height: 16px; + width: 16px; +} + +.c24 { + font-size: 13px; + margin-top: 8px; + color: #676767; + font-style: normal; +} + +.c27 { + font-weight: 500; +} + +.c28 { + font-weight: 200; + opacity: 0.8975; + padding-left: 1ch; +} + +
      +
    1. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + 600 SW 5th Ave, Portland, OR, USA 97204 + +
      +
      + 3:45 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 206 feet to + + EMAQ + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + EAST + on + + SW Alder St + + + 118 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + LEFT + on + + SW 4th Ave + + + 88 feet + + +
        +
        3. +
      +
      +
      +       +
      +
      +
      + +
      +
      2. +
    2. +
      +
      +
      +
      +
      + + + Travel by e-scooter + + + + + + + + + +
      +
      +
      +
      +
      + + EMAQ + +
      +
      + 3:46 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      + Pick up Razor + E-scooter + +
      +
      +
      + + + + - + + + Ride 0.3 miles to + + 205 SW Pine St, Portland, OR, USA 97204 + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + CONTINUE + on + + SW 4th Ave + + + 0.2 miles + + +
        +
        2. +
      2. +
        + + + +
        +
        + + RIGHT + on + + SW Pine St + + + 456 feet + + +
        +
        3. +
      +
      +
      +       +
      +
      +
      + +
      +
      3. +
    3. +
      +
      +
      +
      + +
      +
      +
      +
      +
      + + 205 SW Pine St, Portland, OR, USA 97204 + +
      +
      + 3:48 PM +
      + + Arrive at + 205 SW Pine St, Portland, OR, USA 97204 + +
      +
      + +
      +
      4. +
    +`; + +exports[`Storyshots ItineraryBody/otp-ui E Scooter Rental Transit Itinerary 1`] = ` + + + +`; + +exports[`Storyshots ItineraryBody/otp-ui E Scooter Rental Transit Itinerary 2`] = ` +.c22 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c59 { + color: #f44256; +} + +.c35 { + border-top-style: solid; + border-top-width: 0; + padding-top: 0; + padding-bottom: 10px; +} + +.c16 { + background: transparent; + border: 0; + color: inherit; + cursor: pointer; + font-size: inherit; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c37 { + color: #008; + margin-left: 5px; +} + +.c37:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c6 { + color: black; + background-color: #e9e9e9; + border: 2px solid #bbb; + text-align: center; + width: 25px; + height: 25px; + font-size: 1.2em; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; +} + +.c40 { + color: black; + background-color: #f5a729; + border: 2px solid #bbb; + text-align: center; + width: 25px; + height: 25px; + font-size: 1.2em; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; +} + +.c21::before { + content: ""; + margin: 0 0.125em; +} + +.c58 { + text-align: center; +} + +.c4 { + border-left: dotted 4px #484848; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c39 { + border-left: dotted 4px #f5a729; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c42 { + border-left: solid 8px #008ab0; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c54 { + display: block; + font-size: 13px; + list-style: none; + padding: 0; +} + +.c0 { + list-style: none; + padding: 0; +} + +.c12 { + color: #676767; + font-size: 13px; + padding-bottom: 12px; +} + +.c17 { + bottom: 0; + cursor: pointer; + left: 0; + position: absolute; + right: 0; + top: 0; + width: 100%; + z-index: 1; +} + +.c13 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + line-height: 16px; + min-height: 31px; + position: relative; +} + +.c10 { + display: inline-block; + grid-row-start: 2; + grid-column-start: 1; + height: 0; + overflow: hidden; + width: 0; +} + +.c49 { + font-weight: 200; +} + +.c15 { + font-weight: inherit; +} + +.c48 { + font-size: 13px; + font-weight: 500; +} + +.c47 { + font-weight: 800; + margin-right: 6px; +} + +.c46 { + color: #807373; + margin-top: 5px; +} + +.c14 { + -webkit-flex-shrink: 0; + -ms-flex-negative: 0; + flex-shrink: 0; +} + +.c3 { + position: relative; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); + height: 100%; +} + +.c5 { + width: 30px; + height: 30px; + border-radius: 50%; + position: absolute; + left: 50%; + top: 0; + -webkit-transform: translate(-51%,-10%); + -ms-transform: translate(-51%,-10%); + transform: translate(-51%,-10%); +} + +.c2 { + grid-column-start: 2; + grid-row: span 2; + padding-right: 5px; +} + +.c18 { + display: grid; + grid-template-columns: 130px auto; +} + +.c1 { + max-width: 500px; + display: grid; + grid-template-areas: "time line title" "time line instructions"; + grid-template-columns: 65px 30px auto; +} + +.c29 { + border-color: #fff; + border-radius: 5px; + border-style: solid; + border-width: 1px; + display: inline-block; + font-style: normal; + grid-column: 2; + grid-row: 1; + margin: 0 4px; + position: relative; + text-align: center; + -webkit-text-decoration: none; + text-decoration: none; + vertical-align: middle; + width: 75%; +} + +.c29:hover { + border-color: #d1d5da; + background-color: #f6f8fa; +} + +.c9 { + grid-column-start: 1; + grid-row: 1 / span 2; + padding-right: 5px; + font-size: 0.9em; +} + +.c38 { + padding: 3px 10px 3px 10px; + border: 0; + margin-top: -15px; + width: 35px; + height: 35px; +} + +.c38:hover { + cursor: pointer; +} + +.c36 { + -webkit-flex: 0 0 25px; + -ms-flex: 0 0 25px; + flex: 0 0 25px; + grid-column: -1; +} + +.c11 { + grid-row-start: 2; + grid-column-start: 3; + grid-area: instructions; +} + +.c7 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + font-size: 1.2em; + grid-row-start: 1; + grid-column-start: 3; +} + +.c8 { + font-size: inherit; + font-weight: bold; + height: 1.2em; + margin: 0; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + -webkit-flex: 1 1 auto; + -ms-flex: 1 1 auto; + flex: 1 1 auto; + padding: 3px 0 10px 0; +} + +.c41 { + color: #807373; + font-size: 13px; + font-weight: 300; + padding-top: 1px; + margin-bottom: 10px; + margin-top: -14px; +} + +.c30 { + padding: 2px; + width: 100%; +} + +.c32 { + font-size: xx-small; +} + +.c32::before { + content: ""; + margin: 0 0.125em; +} + +.c33 { + color: #e60000; +} + +.c34 { + color: green; +} + +.c31 { + font-size: small; +} + +.c43 { + text-align: center; + min-width: 30px; + min-height: 30px; + font-size: 1.2em; + background-color: #084c8d; + color: white; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; + border: 1px solid; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + cursor: default; +} + +.c44 { + position: absolute; + width: 1px; + height: 1px; + padding: 0; + margin: -1px; + overflow: hidden; + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + border: 0; +} + +.c23 { + display: block; + list-style: none; + padding: 0; +} + +.c26 { + margin-left: 24px; + line-height: 1.25em; + padding-top: 1px; +} + +.c26 > span { + margin-right: 1ch; +} + +.c19 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-self: center; + -ms-flex-item-align: center; + align-self: center; + margin-top: 10px; +} + +.c19 a { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c20 { + color: #676767; + font-size: 13px; + font-style: normal; + padding: 0; +} + +.c25 { + fill: #676767; + float: left; + height: 16px; + width: 16px; +} + +.c24 { + font-size: 13px; + margin-top: 8px; + color: #676767; + font-style: normal; +} + +.c27 { + font-weight: 500; +} + +.c28 { + font-weight: 200; + opacity: 0.8975; + padding-left: 1ch; +} + +.c45 { + font-weight: 200; + font-size: 0.9em; + margin-left: 10px; +} + +.c56 { + float: left; + margin-left: -36px; + color: #fff; +} + +.c57 { + color: #676767; + margin-top: 3px; +} + +.c55 { + z-index: 30; + position: relative; +} + +.c50 { + margin-top: 5px; +} + +.c51 { + color: #676767; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; +} + +.c53 { + font-size: 14px; +} + +.c52 { + padding: 0; +} + +
      +
    1. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + 2943 SE Washington St, Portland, OR, USA 97214 + +
      +
      + 3:45 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 0.4 miles to + + Shared E-scooter + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + SOUTH + on + + SE 30th Ave + + + 0.2 miles + + +
        +
        2. +
      2. +
        + + + +
        +
        + + RIGHT + on + + SE Belmont St + + + 330 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + LEFT + on + + SE 29th Ave + + + 511 feet + + +
        +
        4. +
      4. +
        + + + +
        +
        + + RIGHT + on + + SE Taylor St + + + 235 feet + + +
        +
        5. +
      +
      +
      +
      + +
      +       +
      +
      +
      + +
      +
      2. +
    2. +
      +
      +
      +
      +
      + + + Travel by e-scooter + + + + + + + + + + +
      +
      +
      +
      +
      + + Shared E-scooter + +
      +
      + 3:54 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      + Pick up Shared + E-scooter + +
      +
      +
      + + + + - + + + Ride 1.4 miles to + + NE Broadway + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + CONTINUE + on + + SE Taylor St + + + 26 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + RIGHT + on + + SE 28th Ave + + + 0.6 miles + + +
        +
        3. +
      3. +
        + + + +
        +
        + + CONTINUE + on + + NE 28th Ave + + + 0.7 miles + + +
        +
        4. +
      4. +
        + + + +
        +
        + + SLIGHTLY_RIGHT + on + + NE Halsey St + + + 17 feet + + +
        +
        5. +
      5. +
        + + + +
        +
        + + RIGHT + on + + NE Halsey St + + + 59 feet + + +
        +
        6. +
      6. +
        + + + +
        +
        + + SLIGHTLY_LEFT + on + + NE 28th Ave + + + 28 feet + + +
        +
        7. +
      7. +
        + + + +
        +
        + + SLIGHTLY_LEFT + on + + NE 28th Ave + + + 489 feet + + +
        +
        8. +
      8. +
        + + + +
        +
        + + RIGHT + on + + NE Broadway + + + 86 feet + + +
        +
        9. +
      +
      +
      +
      + +
      +       +
      +
      +
      + +
      +
      3. +
    3. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + NE Broadway + +
      +
      + 4:03 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk to + + NE Broadway & 28th + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + RIGHT + on + + street transit link + + +
        +
        2. +
      +
      +
      +       +
      +
      +
      + +
      +
      4. +
    4. +
      +
      +
      +
      +
      + + 70 + + + 12th/NE 33rd Ave + +
      +
      +
      +
      +
      + + NE Broadway & 28th + + ID 638 + + +
      +
      + 4:08 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + Ride + + +
      + + 70 + +
      + + + 12th/NE 33rd Ave + + to + + NE Sunderland + + +       + + - + Disembark at + NE 33rd & Shaver + + ID 7393 + + +       + +       +
      +
      +
      +
      +
      +
      +
      + +
      +
      +
      +
      +
        +
      1. +
        + • +
        +
        + NE Broadway & 32nd +
        +
        2. +
      2. +
        + • +
        +
        + NE 33rd & Schuyler +
        +
        3. +
      3. +
        + • +
        +
        + NE 33rd & US Grant Pl +
        +
        4. +
      4. +
        + • +
        +
        + NE 33rd & Brazee +
        +
        5. +
      5. +
        + • +
        +
        + NE 33rd & Knott +
        +
        6. +
      6. +
        + • +
        +
        + NE 33rd & Stanton +
        +
        7. +
      7. +
        + • +
        +
        + NE 33rd & Siskiyou +
        +
        8. +
      8. +
        + • +
        +
        + NE 33rd & Alameda +
        +
        9. +
      +
      +
      +
      +
      +
      +
      +
      +
      + +
      +
      5. +
    5. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + NE 33rd & Shaver + + ID 7393 + + +
      +
      + 4:17 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 0.4 miles to + + Shared E-scooter + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + NORTH + on + + NE 33rd Ave + + + 33 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + RIGHT + on + + NE Shaver St + + + 0.3 miles + + +
        +
        3. +
      3. +
        + + + +
        +
        + + LEFT + on + + NE 38th Ave + + + 332 feet + + +
        +
        4. +
      +
      +
      +
      + +
      +       +
      +
      +
      + +
      +
      6. +
    6. +
      +
      +
      +
      +
      + + + Travel by e-scooter + + + + + + + + + + +
      +
      +
      +
      +
      + + Shared E-scooter + +
      +
      + 4:25 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      + Pick up Shared + E-scooter + +
      +
      +
      + + + + - + + + Ride 1 mile to + + 5112 NE 47th Pl, Portland, OR, USA 97218 + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + CONTINUE + on + + NE 38th Ave + + + 355 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + RIGHT + on + + NE Skidmore St + + + 0.2 miles + + +
        +
        3. +
      3. +
        + + + +
        +
        + + LEFT + on + + NE 42nd Ave + + + 0.4 miles + + +
        +
        4. +
      4. +
        + + + +
        +
        + + RIGHT + on + + NE Alberta St + + + 0.3 miles + + +
        +
        5. +
      5. +
        + + + +
        +
        + + LEFT + on + + NE 47th Pl + + + 313 feet + + +
        +
        6. +
      +
      +
      +
      + +
      +       +
      +
      +
      + +
      +
      7. +
    7. +
      +
      +
      +
      + +
      +
      +
      +
      +
      + + 5112 NE 47th Pl, Portland, OR, USA 97218 + +
      +
      + 4:31 PM +
      + + Arrive at + 5112 NE 47th Pl, Portland, OR, USA 97218 + +
      +
      + +
      +
      8. +
    +`; + +exports[`Storyshots ItineraryBody/otp-ui Hide Driving Directions 1`] = ` + + + +`; + +exports[`Storyshots ItineraryBody/otp-ui Hide Driving Directions 2`] = ` +.c29 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c60 { + color: #f44256; +} + +.c21 { + border-top-style: solid; + border-top-width: 0; + padding-top: 0; + padding-bottom: 10px; +} + +.c16 { + background: transparent; + border: 0; + color: inherit; + cursor: pointer; + font-size: inherit; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c23 { + color: #008; + margin-left: 5px; +} + +.c23:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c6 { + color: black; + background-color: grey; + border: 2px solid #bbb; + text-align: center; + width: 25px; + height: 25px; + font-size: 1.2em; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; +} + +.c26 { + color: black; + background-color: #e9e9e9; + border: 2px solid #bbb; + text-align: center; + width: 25px; + height: 25px; + font-size: 1.2em; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; +} + +.c28::before { + content: ""; + margin: 0 0.125em; +} + +.c59 { + text-align: center; +} + +.c4 { + border-left: dotted 4px grey; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c25 { + border-left: dotted 4px #484848; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c36 { + border-left: solid 8px #084C8D; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c55 { + display: block; + font-size: 13px; + list-style: none; + padding: 0; +} + +.c0 { + list-style: none; + padding: 0; +} + +.c12 { + color: #676767; + font-size: 13px; + padding-bottom: 12px; +} + +.c17 { + bottom: 0; + cursor: pointer; + left: 0; + position: absolute; + right: 0; + top: 0; + width: 100%; + z-index: 1; +} + +.c13 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + line-height: 16px; + min-height: 31px; + position: relative; +} + +.c10 { + display: inline-block; + grid-row-start: 2; + grid-column-start: 1; + height: 0; + overflow: hidden; + width: 0; +} + +.c43 { + font-weight: 200; +} + +.c15 { + font-weight: inherit; +} + +.c42 { + font-size: 13px; + font-weight: 500; +} + +.c41 { + font-weight: 800; + margin-right: 6px; +} + +.c40 { + color: #807373; + margin-top: 5px; +} + +.c14 { + -webkit-flex-shrink: 0; + -ms-flex-negative: 0; + flex-shrink: 0; +} + +.c3 { + position: relative; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); + height: 100%; +} + +.c5 { + width: 30px; + height: 30px; + border-radius: 50%; + position: absolute; + left: 50%; + top: 0; + -webkit-transform: translate(-51%,-10%); + -ms-transform: translate(-51%,-10%); + transform: translate(-51%,-10%); +} + +.c2 { + grid-column-start: 2; + grid-row: span 2; + padding-right: 5px; +} + +.c18 { + display: grid; + grid-template-columns: 130px auto; +} + +.c1 { + max-width: 500px; + display: grid; + grid-template-areas: "time line title" "time line instructions"; + grid-template-columns: 65px 30px auto; +} + +.c9 { + grid-column-start: 1; + grid-row: 1 / span 2; + padding-right: 5px; + font-size: 0.9em; +} + +.c24 { + padding: 3px 10px 3px 10px; + border: 0; + margin-top: -15px; + width: 35px; + height: 35px; +} + +.c24:hover { + cursor: pointer; +} + +.c22 { + -webkit-flex: 0 0 25px; + -ms-flex: 0 0 25px; + flex: 0 0 25px; + grid-column: -1; +} + +.c11 { + grid-row-start: 2; + grid-column-start: 3; + grid-area: instructions; +} + +.c7 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + font-size: 1.2em; + grid-row-start: 1; + grid-column-start: 3; +} + +.c8 { + font-size: inherit; + font-weight: bold; + height: 1.2em; + margin: 0; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + -webkit-flex: 1 1 auto; + -ms-flex: 1 1 auto; + flex: 1 1 auto; + padding: 3px 0 10px 0; +} + +.c37 { + text-align: center; + min-width: 30px; + min-height: 30px; + font-size: 1.2em; + background-color: #084C8D; + color: white; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; + border: 1px solid; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + cursor: default; +} + +.c38 { + position: absolute; + width: 1px; + height: 1px; + padding: 0; + margin: -1px; + overflow: hidden; + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + border: 0; +} + +.c30 { + display: block; + list-style: none; + padding: 0; +} + +.c33 { + margin-left: 24px; + line-height: 1.25em; + padding-top: 1px; +} + +.c33 > span { + margin-right: 1ch; +} + +.c19 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-self: center; + -ms-flex-item-align: center; + align-self: center; + margin-top: 10px; +} + +.c19 a { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c27 { + color: #676767; + font-size: 13px; + font-style: normal; + padding: 0; +} + +.c20 { + color: #676767; + font-size: 13px; + font-style: normal; + padding: 0; + margin-right: 0.4em; +} + +.c32 { + fill: #676767; + float: left; + height: 16px; + width: 16px; +} + +.c31 { + font-size: 13px; + margin-top: 8px; + color: #676767; + font-style: normal; +} + +.c34 { + font-weight: 500; +} + +.c35 { + font-weight: 200; + opacity: 0.8975; + padding-left: 1ch; +} + +.c39 { + font-weight: 200; + font-size: 0.9em; + margin-left: 10px; +} + +.c57 { + float: left; + margin-left: -36px; + color: #fff; +} + +.c58 { + color: #676767; + margin-top: 3px; +} + +.c56 { + z-index: 30; + position: relative; +} + +.c46 { + background-color: #eee; + border-radius: 4px; + color: #000; + display: block; + margin-top: 5px; + padding: 8px; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c50 { + -webkit-align-items: baseline; + -webkit-box-align: baseline; + -ms-flex-align: baseline; + align-items: baseline; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + gap: 5px; + margin-top: 0.5em; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c50:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c48 { + font-size: 12px; + margin-left: 30px; + white-space: pre-wrap; +} + +.c49 { + margin-top: 5px; + margin-left: 30px; + font-size: 12px; + font-style: italic; +} + +.c47 { + float: left; + font-size: 18px; +} + +.c45 { + display: block; + margin-top: 3px; + padding: 0; +} + +.c44 { + color: #d14727; + cursor: auto; + display: inline-block; + font-weight: 400; + margin-top: 8px; + padding: 0; +} + +.c51 { + margin-top: 5px; +} + +.c52 { + color: #676767; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; +} + +.c54 { + font-size: 14px; +} + +.c53 { + padding: 0; +} + +
      +
    1. +
      +
      +
      +
      +
      + + + Travel by car + + + + +
      +
      +
      +
      +
      + + 330 SW Murray Blvd, Washington County, OR, USA 97005 + +
      +
      + 3:50 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Drive 2.4 miles to + + P+R Sunset TC + + + + +
      + + + + 10 min + + + +
      +
      +
      + +
      +
      2. +
    2. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + P+R Sunset TC + +
      +
      + 4:02 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 426 feet to + + Sunset TC MAX Station + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + SLIGHTLY_RIGHT + on + + Unnamed Path + + + 16 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + LEFT + on + + steps + + + 232 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + LEFT + on + + Unnamed Path + + + 19 feet + + +
        +
        4. +
      4. +
        + + + +
        +
        + + RIGHT + on + + Sunset TC (path) + + + 159 feet + + +
        +
        5. +
      +
      +
      +       +
      +
      +
      + +
      +
      3. +
    3. +
      +
      +
      +
      +
      + + MA + + + MAX Blue Line + +
      +
      +
      +
      +
      + + Sunset TC MAX Station + + ID 9969 + + +
      +
      + 4:05 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + Ride + + +
      + + MAX Blue Line + +
      + + + MAX Blue Line + + to + + Gresham + + +       + + - + Disembark at + Oak/ SW 1st Ave MAX Station + + ID 8337 + + +       + +       +
      +
      +
      + + + 2 alerts +
      +
      +
      + +
      +
      +
      +
      + +
      +
      +
      +
      +
        +
      1. +
        + • +
        +
        + Washington Park MAX Station +
        +
        2. +
      2. +
        + • +
        +
        + Goose Hollow/SW Jefferson St MAX Station +
        +
        3. +
      3. +
        + • +
        +
        + Kings Hill/SW Salmon St MAX Station +
        +
        4. +
      4. +
        + • +
        +
        + Providence Park MAX Station +
        +
        5. +
      5. +
        + • +
        +
        + Library/SW 9th Ave MAX Station +
        +
        6. +
      6. +
        + • +
        +
        + Pioneer Square South MAX Station +
        +
        7. +
      7. +
        + • +
        +
        + Mall/SW 4th Ave MAX Station +
        +
        8. +
      8. +
        + • +
        +
        + Yamhill District MAX Station +
        +
        9. +
      +
      +
      +
      +
      +
      +
      +
      +
      + +
      +
      4. +
    4. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + Oak/ SW 1st Ave MAX Station + + ID 8337 + + +
      +
      + 4:27 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 0.1 miles to + + 205 SW Pine St, Portland, OR, USA 97204 + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + NORTHEAST + on + + Oak/SW 1st Ave (path) + + + 13 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + CONTINUE + on + + Unnamed Path + + + 27 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + LEFT + on + + SW Oak St + + + 37 feet + + +
        +
        4. +
      4. +
        + + + +
        +
        + + RIGHT + on + + SW 1st Ave + + + 260 feet + + +
        +
        5. +
      5. +
        + + + +
        +
        + + LEFT + on + + SW Pine St + + + 337 feet + + +
        +
        6. +
      +
      +
      +       +
      +
      +
      + +
      +
      5. +
    5. +
      +
      +
      +
      + +
      +
      +
      +
      +
      + + 205 SW Pine St, Portland, OR, USA 97204 + +
      +
      + 4:29 PM +
      + + Arrive at + 205 SW Pine St, Portland, OR, USA 97204 + +
      +
      + +
      +
      6. +
    +`; + +exports[`Storyshots ItineraryBody/otp-ui Individual Leg Fare Components 1`] = ` + + + +`; + +exports[`Storyshots ItineraryBody/otp-ui Individual Leg Fare Components 2`] = ` +.c22 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c56 { + color: #f44256; +} + +.c35 { + border-top-style: solid; + border-top-width: 0; + padding-top: 0; + padding-bottom: 10px; +} + +.c16 { + background: transparent; + border: 0; + color: inherit; + cursor: pointer; + font-size: inherit; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c37 { + color: #008; + margin-left: 5px; +} + +.c37:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c6 { + color: black; + background-color: #e9e9e9; + border: 2px solid #bbb; + text-align: center; + width: 25px; + height: 25px; + font-size: 1.2em; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; +} + +.c21::before { + content: ""; + margin: 0 0.125em; +} + +.c55 { + text-align: center; +} + +.c4 { + border-left: dotted 4px #484848; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c39 { + border-left: solid 8px #008ab0; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c51 { + display: block; + font-size: 13px; + list-style: none; + padding: 0; +} + +.c0 { + list-style: none; + padding: 0; +} + +.c12 { + color: #676767; + font-size: 13px; + padding-bottom: 12px; +} + +.c17 { + bottom: 0; + cursor: pointer; + left: 0; + position: absolute; + right: 0; + top: 0; + width: 100%; + z-index: 1; +} + +.c13 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + line-height: 16px; + min-height: 31px; + position: relative; +} + +.c10 { + display: inline-block; + grid-row-start: 2; + grid-column-start: 1; + height: 0; + overflow: hidden; + width: 0; +} + +.c45 { + font-weight: 200; +} + +.c15 { + font-weight: inherit; +} + +.c44 { + font-size: 13px; + font-weight: 500; +} + +.c43 { + font-weight: 800; + margin-right: 6px; +} + +.c42 { + color: #807373; + margin-top: 5px; +} + +.c14 { + -webkit-flex-shrink: 0; + -ms-flex-negative: 0; + flex-shrink: 0; +} + +.c3 { + position: relative; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); + height: 100%; +} + +.c5 { + width: 30px; + height: 30px; + border-radius: 50%; + position: absolute; + left: 50%; + top: 0; + -webkit-transform: translate(-51%,-10%); + -ms-transform: translate(-51%,-10%); + transform: translate(-51%,-10%); +} + +.c2 { + grid-column-start: 2; + grid-row: span 2; + padding-right: 5px; +} + +.c18 { + display: grid; + grid-template-columns: 130px auto; +} + +.c1 { + max-width: 500px; + display: grid; + grid-template-areas: "time line title" "time line instructions"; + grid-template-columns: 65px 30px auto; +} + +.c29 { + border-color: #fff; + border-radius: 5px; + border-style: solid; + border-width: 1px; + display: inline-block; + font-style: normal; + grid-column: 2; + grid-row: 1; + margin: 0 4px; + position: relative; + text-align: center; + -webkit-text-decoration: none; + text-decoration: none; + vertical-align: middle; + width: 75%; +} + +.c29:hover { + border-color: #d1d5da; + background-color: #f6f8fa; +} + +.c9 { + grid-column-start: 1; + grid-row: 1 / span 2; + padding-right: 5px; + font-size: 0.9em; +} + +.c38 { + padding: 3px 10px 3px 10px; + border: 0; + margin-top: -15px; + width: 35px; + height: 35px; +} + +.c38:hover { + cursor: pointer; +} + +.c36 { + -webkit-flex: 0 0 25px; + -ms-flex: 0 0 25px; + flex: 0 0 25px; + grid-column: -1; +} + +.c11 { + grid-row-start: 2; + grid-column-start: 3; + grid-area: instructions; +} + +.c7 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + font-size: 1.2em; + grid-row-start: 1; + grid-column-start: 3; +} + +.c8 { + font-size: inherit; + font-weight: bold; + height: 1.2em; + margin: 0; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + -webkit-flex: 1 1 auto; + -ms-flex: 1 1 auto; + flex: 1 1 auto; + padding: 3px 0 10px 0; +} + +.c30 { + padding: 2px; + width: 100%; +} + +.c32 { + font-size: xx-small; +} + +.c32::before { + content: ""; + margin: 0 0.125em; +} + +.c33 { + color: #e60000; +} + +.c34 { + color: green; +} + +.c31 { + font-size: small; +} + +.c40 { + text-align: center; + min-width: 30px; + min-height: 30px; + font-size: 1.2em; + background-color: #084c8d; + color: white; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; + border: 1px solid; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + cursor: default; +} + +.c41 { + position: absolute; + width: 1px; + height: 1px; + padding: 0; + margin: -1px; + overflow: hidden; + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + border: 0; +} + +.c23 { + display: block; + list-style: none; + padding: 0; +} + +.c26 { + margin-left: 24px; + line-height: 1.25em; + padding-top: 1px; +} + +.c26 > span { + margin-right: 1ch; +} + +.c19 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-self: center; + -ms-flex-item-align: center; + align-self: center; + margin-top: 10px; +} + +.c19 a { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c20 { + color: #676767; + font-size: 13px; + font-style: normal; + padding: 0; +} + +.c25 { + fill: #676767; + float: left; + height: 16px; + width: 16px; +} + +.c24 { + font-size: 13px; + margin-top: 8px; + color: #676767; + font-style: normal; +} + +.c27 { + font-weight: 500; +} + +.c28 { + font-weight: 200; + opacity: 0.8975; + padding-left: 1ch; +} + +.c53 { + float: left; + margin-left: -36px; + color: #fff; +} + +.c54 { + color: #676767; + margin-top: 3px; +} + +.c52 { + z-index: 30; + position: relative; +} + +.c46 { + display: block; + margin-top: 3px; + padding: 0; +} + +.c47 { + margin-top: 5px; +} + +.c48 { + color: #676767; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; +} + +.c50 { + font-size: 14px; +} + +.c49 { + padding: 0; +} + +
      +
    1. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + 100 South 11th Street, Mount Vernon, WA, USA + +
      +
      + 1:42 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 0.8 miles to + + Skagit Station Gate 3 + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + WEST + on + + East Division Street + + + 72 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + LEFT + on + + South 11th Street + + + 48 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + RIGHT + on + + service road + + + 27 feet + + +
        +
        4. +
      4. +
        + + + +
        +
        + + LEFT + on + + sidewalk + + + 0.2 miles + + +
        +
        5. +
      5. +
        + + + +
        +
        + + LEFT + on + + South 10th Street + + + 282 feet + + +
        +
        6. +
      6. +
        + + + +
        +
        + + RIGHT + on + + Unnamed Path + + + 136 feet + + +
        +
        7. +
      7. +
        + + + +
        +
        + + LEFT + on + + alley + + + 17 feet + + +
        +
        8. +
      8. +
        + + + +
        +
        + + RIGHT + on + + East Montgomery Street + + + 109 feet + + +
        +
        9. +
      9. +
        + + + +
        +
        + + LEFT + on + + Unnamed Path + + + 0.2 miles + + +
        +
        10. +
      10. +
        + + + +
        +
        + + RIGHT + on + + sidewalk + + + 0.2 miles + + +
        +
        11. +
      11. +
        + + + +
        +
        + + RIGHT + on + + sidewalk + + + 56 feet + + +
        +
        12. +
      12. +
        + + + +
        +
        + + LEFT + on + + service road + + + 175 feet + + +
        +
        13. +
      +
      +
      +
      + +
      +       +
      +
      +
      + +
      +
      2. +
    2. +
      +
      +
      +
      +
      + + 90 + + + County Connector Snohomish/Skagit + +
      +
      +
      +
      +
      + + Skagit Station Gate 3 + +
      +
      + 2:00 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + Ride + + +
      + + 90X + +
      + + + County Connector Snohomish/Skagit + + to + + Everett + + +       + + - + Disembark at + Everett Station + +       + +       +
      +
      +
      +
      +
        +
      +
      +
      +
      + +
      +
      +
      +
      +
        +
      1. +
        + • +
        +
        + South Mount Vernon Park & Ride +
        +
        2. +
      2. +
        + • +
        +
        + Broadway - Everett Community College +
        +
        3. +
      3. +
        + • +
        +
        + Broadway & 14th (near hospital) +
        +
        4. +
      4. +
        + • +
        +
        + Broadway just South of the Event Center +
        +
        5. +
      +
      +
      +
      +
      +
      +
      +
      +
      + +
      +
      3. +
    3. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + Everett Station + +
      +
      + 3:00 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 318 feet to + + Everett Station Bay C1 + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + NORTH + on + + Unnamed Path + + + 318 feet + + +
        +
        2. +
      +
      +
      +       +
      +
      +
      + +
      +
      4. +
    4. +
      +
      +
      +
      +
      + + 51 + + + Everett - Northgate Station + +
      +
      +
      +
      +
      + + Everett Station Bay C1 + +
      +
      + 3:03 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + Ride + + +
      + + 512 + +
      + + + Northgate Station + + +       + + - + Disembark at + Lynnwood Transit Center Bay D3 + +       + +       +
      +
      +
      +
      +
        +
      +
      +
      +
      + +
      +
      +
      +
      +
        +
      1. +
        + • +
        +
        + Broadway & 34th St +
        +
        2. +
      2. +
        + • +
        +
        + South Everett Fwy Station Bay 3 +
        +
        3. +
      3. +
        + • +
        +
        + Ash Way Park & Ride Bay 1 +
        +
        4. +
      +
      +
      +
      +
      +
      +
      +
      +
      + +
      +
      5. +
    5. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + Lynnwood Transit Center Bay D3 + +
      +
      + 3:29 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 176 feet to + + Lynnwood Transit Center Bay D1 + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + WEST + on + + platform + + + 176 feet + + +
        +
        2. +
      +
      +
      +       +
      +
      +
      + +
      +
      6. +
    6. +
      +
      +
      +
      +
      + + 53 + + + Lynnwood - Bellevue + +
      +
      +
      +
      +
      + + Lynnwood Transit Center Bay D1 + +
      +
      + 3:40 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + Ride + + +
      + + 535 + +
      + + + Bellevue + + +       + + - + Disembark at + Bothell Park & Ride Bay 2 + +       + +       +
      +
      +
      +
      +
        +
      +
      +
      +
      + +
      +
      +
      +
      +
        +
      1. +
        + • +
        +
        + Alderwood Mall Pkwy & Beech Rd +
        +
        2. +
      2. +
        + • +
        +
        + Alderwood Mall Pkwy & 184th St SW +
        +
        3. +
      3. +
        + • +
        +
        + Canyon Park Fwy Station Bay 4 +
        +
        4. +
      4. +
        + • +
        +
        + Beardslee Blvd & Ross Rd +
        +
        5. +
      5. +
        + • +
        +
        + UW Bothell & Cascadia College +
        +
        6. +
      +
      +
      +
      +
      +
      +
      +
      +
      + +
      +
      7. +
    7. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + Bothell Park & Ride Bay 2 + +
      +
      + 4:05 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 1 foot to + + Kaysner Way & Woodinville Dr + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + NORTHWEST + on + + sidewalk + + + 1 foot + + +
        +
        2. +
      +
      +
      +       +
      +
      +
      + +
      +
      8. +
    8. +
      +
      +
      +
      +
      + + 37 + + + + +
      +
      +
      +
      +
      + + Kaysner Way & Woodinville Dr + +
      +
      + 4:18 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + Ride + + +
      + + 372 + +
      + + + U-District Station Lake City + + +       + + - + Disembark at + NE Bothell Way & 61st Ave NE + +       + +       +
      +
      +
      +
      +
        +
      +
      +
      +
      + +
      +
      +
      +
      +
        +
      1. +
        + • +
        +
        + Woodinville Dr & Kaysner Way +
        +
        2. +
      2. +
        + • +
        +
        + Bothell Way NE & NE 180th St +
        +
        3. +
      3. +
        + • +
        +
        + NE Bothell Way & 96th Ave NE +
        +
        4. +
      4. +
        + • +
        +
        + NE Bothell Way & 91st Ave NE +
        +
        5. +
      5. +
        + • +
        +
        + NE Bothell Way & 83rd Pl NE +
        +
        6. +
      6. +
        + • +
        +
        + NE Bothell Way & 80th Ave NE +
        +
        7. +
      7. +
        + • +
        +
        + NE Bothell Way & 77th Ct NE +
        +
        8. +
      8. +
        + • +
        +
        + NE Bothell Way & Kenmore Park & Ride +
        +
        9. +
      9. +
        + • +
        +
        + NE Bothell Way & 68th Ave NE +
        +
        10. +
      +
      +
      +
      +
      +
      +
      +
      +
      + +
      +
      9. +
    9. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + NE Bothell Way & 61st Ave NE + +
      +
      + 4:29 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 0.4 miles to + + 18311 57th Avenue NE, Kenmore, WA, USA + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + WEST + on + + Bothell Way Northeast + + + 74 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + RIGHT + on + + 60th Avenue Northeast + + + 190 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + LEFT + on + + Northeast 180th Street + + + 0.2 miles + + +
        +
        4. +
      4. +
        + + + +
        +
        + + RIGHT + on + + 57th Avenue Northeast + + + 0.2 miles + + +
        +
        5. +
      +
      +
      +
      + +
      +       +
      +
      +
      + +
      +
      10. +
    10. +
      +
      +
      +
      + +
      +
      +
      +
      +
      + + 18311 57th Avenue NE, Kenmore, WA, USA + +
      +
      + 4:38 PM +
      + + Arrive at + 18311 57th Avenue NE, Kenmore, WA, USA + +
      +
      + +
      +
      11. +
    +`; + +exports[`Storyshots ItineraryBody/otp-ui OTP 2 Flex Itinerary 1`] = ` + + + +`; + +exports[`Storyshots ItineraryBody/otp-ui OTP 2 Flex Itinerary 2`] = ` +.c22 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c61 { + color: #f44256; +} + +.c35 { + border-top-style: solid; + border-top-width: 0; + padding-top: 0; + padding-bottom: 10px; +} + +.c16 { + background: transparent; + border: 0; + color: inherit; + cursor: pointer; + font-size: inherit; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c37 { + color: #008; + margin-left: 5px; +} + +.c37:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c6 { + color: black; + background-color: #e9e9e9; + border: 2px solid #bbb; + text-align: center; + width: 25px; + height: 25px; + font-size: 1.2em; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; +} + +.c59 { + color: #b22727; + margin-top: 5px; +} + +.c21::before { + content: ""; + margin: 0 0.125em; +} + +.c60 { + text-align: center; +} + +.c4 { + border-left: dotted 4px #484848; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c39 { + border-left: solid 8px #111; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c55 { + border-left: solid 8px #0076CE; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c57 { + border-left: solid 8px #008ab0; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c51 { + display: block; + font-size: 13px; + list-style: none; + padding: 0; +} + +.c0 { + list-style: none; + padding: 0; +} + +.c12 { + color: #676767; + font-size: 13px; + padding-bottom: 12px; +} + +.c17 { + bottom: 0; + cursor: pointer; + left: 0; + position: absolute; + right: 0; + top: 0; + width: 100%; + z-index: 1; +} + +.c13 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + line-height: 16px; + min-height: 31px; + position: relative; +} + +.c10 { + display: inline-block; + grid-row-start: 2; + grid-column-start: 1; + height: 0; + overflow: hidden; + width: 0; +} + +.c46 { + font-weight: 200; +} + +.c15 { + font-weight: inherit; +} + +.c45 { + font-size: 13px; + font-weight: 500; +} + +.c44 { + font-weight: 800; + margin-right: 6px; +} + +.c43 { + color: #807373; + margin-top: 5px; +} + +.c14 { + -webkit-flex-shrink: 0; + -ms-flex-negative: 0; + flex-shrink: 0; +} + +.c3 { + position: relative; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); + height: 100%; +} + +.c5 { + width: 30px; + height: 30px; + border-radius: 50%; + position: absolute; + left: 50%; + top: 0; + -webkit-transform: translate(-51%,-10%); + -ms-transform: translate(-51%,-10%); + transform: translate(-51%,-10%); +} + +.c2 { + grid-column-start: 2; + grid-row: span 2; + padding-right: 5px; +} + +.c18 { + display: grid; + grid-template-columns: 130px auto; +} + +.c1 { + max-width: 500px; + display: grid; + grid-template-areas: "time line title" "time line instructions"; + grid-template-columns: 65px 30px auto; +} + +.c29 { + border-color: #fff; + border-radius: 5px; + border-style: solid; + border-width: 1px; + display: inline-block; + font-style: normal; + grid-column: 2; + grid-row: 1; + margin: 0 4px; + position: relative; + text-align: center; + -webkit-text-decoration: none; + text-decoration: none; + vertical-align: middle; + width: 75%; +} + +.c29:hover { + border-color: #d1d5da; + background-color: #f6f8fa; +} + +.c9 { + grid-column-start: 1; + grid-row: 1 / span 2; + padding-right: 5px; + font-size: 0.9em; +} + +.c38 { + padding: 3px 10px 3px 10px; + border: 0; + margin-top: -15px; + width: 35px; + height: 35px; +} + +.c38:hover { + cursor: pointer; +} + +.c36 { + -webkit-flex: 0 0 25px; + -ms-flex: 0 0 25px; + flex: 0 0 25px; + grid-column: -1; +} + +.c11 { + grid-row-start: 2; + grid-column-start: 3; + grid-area: instructions; +} + +.c7 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + font-size: 1.2em; + grid-row-start: 1; + grid-column-start: 3; +} + +.c8 { + font-size: inherit; + font-weight: bold; + height: 1.2em; + margin: 0; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + -webkit-flex: 1 1 auto; + -ms-flex: 1 1 auto; + flex: 1 1 auto; + padding: 3px 0 10px 0; +} + +.c30 { + padding: 2px; + width: 100%; +} + +.c32 { + font-size: xx-small; +} + +.c32::before { + content: ""; + margin: 0 0.125em; +} + +.c33 { + color: #e60000; +} + +.c34 { + color: green; +} + +.c31 { + font-size: small; +} + +.c40 { + text-align: center; + min-width: 30px; + min-height: 30px; + font-size: 1.2em; + background-color: #111; + color: white; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; + border: 1px solid; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + cursor: default; +} + +.c56 { + text-align: center; + min-width: 30px; + min-height: 30px; + font-size: 1.2em; + background-color: #0076CE; + color: white; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; + border: 1px solid; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + cursor: default; +} + +.c58 { + text-align: center; + min-width: 30px; + min-height: 30px; + font-size: 1.2em; + background-color: #084c8d; + color: white; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; + border: 1px solid; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + cursor: default; +} + +.c41 { + position: absolute; + width: 1px; + height: 1px; + padding: 0; + margin: -1px; + overflow: hidden; + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + border: 0; +} + +.c23 { + display: block; + list-style: none; + padding: 0; +} + +.c26 { + margin-left: 24px; + line-height: 1.25em; + padding-top: 1px; +} + +.c26 > span { + margin-right: 1ch; +} + +.c19 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-self: center; + -ms-flex-item-align: center; + align-self: center; + margin-top: 10px; +} + +.c19 a { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c20 { + color: #676767; + font-size: 13px; + font-style: normal; + padding: 0; +} + +.c25 { + fill: #676767; + float: left; + height: 16px; + width: 16px; +} + +.c24 { + font-size: 13px; + margin-top: 8px; + color: #676767; + font-style: normal; +} + +.c27 { + font-weight: 500; +} + +.c28 { + font-weight: 200; + opacity: 0.8975; + padding-left: 1ch; +} + +.c42 { + font-weight: 200; + font-size: 0.9em; + margin-left: 10px; +} + +.c53 { + float: left; + margin-left: -36px; + color: #fff; +} + +.c54 { + color: #676767; + margin-top: 3px; +} + +.c52 { + z-index: 30; + position: relative; +} + +.c47 { + margin-top: 5px; +} + +.c48 { + color: #676767; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; +} + +.c50 { + font-size: 14px; +} + +.c49 { + padding: 0; +} + +
      +
    1. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + 2nd Avenue, Longmont, CO, USA + +
      +
      + 4:59 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 0.3 miles to + + S Main St & 1st Ave + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + WEST + on + + parking aisle + + + 148 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + LEFT + on + + Emery Street + + + 0.1 miles + + +
        +
        3. +
      3. +
        + + + +
        +
        + + RIGHT + on + + 1st Avenue + + + 0.1 miles + + +
        +
        4. +
      4. +
        + + + +
        +
        + + LEFT + on + + parking aisle + + + 280 feet + + +
        +
        5. +
      +
      +
      +
      + +
      +       +
      +
      +
      + +
      +
      2. +
    2. +
      +
      +
      +
      +
      + + LD + + + Longmont / Denver + +
      +
      +
      +
      +
      + + S Main St & 1st Ave + + ID 25633 + + +
      +
      + 5:06 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + Ride + + +
      + + LD3 + +
      + + + Longmont / Denver + + to + + US36/Broomfield Stn + + +       + + - + Disembark at + US 287 & Arapahoe Rd + + ID 33109 + + +       + +       +
      +
      +
      +
      +
      +
      +
      + +
      +
      +
      +
      +
        +
      1. +
        + • +
        +
        + S Main St & Ken Pratt Blvd +
        +
        2. +
      2. +
        + • +
        +
        + S Main St & Jersey Ave +
        +
        3. +
      3. +
        + • +
        +
        + S Main St & Missouri Ave +
        +
        4. +
      4. +
        + • +
        +
        + S Main St & Quebec Ave +
        +
        5. +
      5. +
        + • +
        +
        + US 287 & Pike Rd +
        +
        6. +
      6. +
        + • +
        +
        + US 287 & Niwot Rd +
        +
        7. +
      7. +
        + • +
        +
        + US 287 & Hwy 52 +
        +
        8. +
      8. +
        + • +
        +
        + US 287 & Lookout Rd +
        +
        9. +
      9. +
        + • +
        +
        + US 287 & Dawson Dr +
        +
        10. +
      10. +
        + • +
        +
        + US 287 & Goose Haven Dr +
        +
        11. +
      11. +
        + • +
        +
        + US 287 & Isabelle Rd +
        +
        12. +
      +
      +
      +
      +
      +
      +
      +
      +
      + +
      +
      3. +
    3. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + US 287 & Arapahoe Rd + + ID 33109 + + +
      +
      + 5:25 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 0.2 miles to + + Arapahoe Rd & Stonehenge Dr + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + SOUTH + on + + US Highway 287 + + + 0.1 miles + + +
        +
        2. +
      2. +
        + + + +
        +
        + + RIGHT + on + + Arapahoe Road + + + 485 feet + + +
        +
        3. +
      +
      +
      +       +
      +
      +
      + +
      +
      4. +
    4. +
      +
      +
      +
      +
      + + JU + + + Boulder / Lafayette via Arapahoe + +
      +
      +
      +
      +
      + + Arapahoe Rd & Stonehenge Dr + + ID 33465 + + +
      +
      + 6:00 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + Ride + + +
      + + JUMP + +
      + + + Boulder / Lafayette via Arapahoe + + to + + Erie Community Center + + +       + + - + Disembark at + Erie Community Center + + ID 33200 + + +       + +       +
      +
      +
      +
      +
      +
      +
      + +
      +
      +
      +
      +
        +
      1. +
        + • +
        +
        + Arapahoe Rd & US 287 +
        +
        2. +
      2. +
        + • +
        +
        + Arapahoe Rd & 111th St +
        +
        3. +
      3. +
        + • +
        +
        + Arapahoe Rd & Hawkridge Rd +
        +
        4. +
      4. +
        + • +
        +
        + 2800 Block 119th St +
        +
        5. +
      5. +
        + • +
        +
        + 119th St & Austin Ave +
        +
        6. +
      6. +
        + • +
        +
        + Erie Pkwy & Brennan St +
        +
        7. +
      7. +
        + • +
        +
        + Erie Pkwy & Meller St +
        +
        8. +
      +
      +
      +
      +
      +
      +
      +
      +
      + +
      +
      5. +
    5. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + Erie Community Center + + ID 33200 + + +
      +
      + 6:12 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 124 feet to + + corner of path and Powers Street + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + WEST + on + + sidewalk + + + 86 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + LEFT + on + + Unnamed Path + + + 38 feet + + +
        +
        3. +
      +
      +
      +       +
      +
      +
      + +
      +
      6. +
    6. +
      +
      +
      +
      +
      + + 60 + + + 60+ Ride + +
      +
      +
      +
      +
      + + 60plusride-co-us:area_626 + + ID area_626 + + +
      +
      + 6:12 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + Ride + + +
      + + 60+ Ride + +
      + + + 60+ Ride + + +       + + - + Disembark at + 60plusride-co-us:area_626 + + ID area_626 + + +       + +       +
      +
      +
      + To take this route, you must + call 555-352-9348 + at least 7 days in advance + . +
      +
      +
      +
      +
      +
      +
      +
      + +
      +
      7. +
    7. +
      +
      +
      +
      + +
      +
      +
      +
      +
      + + 60plusride-co-us:area_626 + + ID area_626 + + +
      +
      + 6:37 PM +
      + + Arrive at + 60plusride-co-us:area_626 + + ID area_626 + + +
      +
      + +
      +
      8. +
    +`; + +exports[`Storyshots ItineraryBody/otp-ui OTP 2 Scooter Itinerary 1`] = ` + + + +`; + +exports[`Storyshots ItineraryBody/otp-ui OTP 2 Scooter Itinerary 2`] = ` +.c22 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c43 { + color: #f44256; +} + +.c29 { + border-top-style: solid; + border-top-width: 0; + padding-top: 0; + padding-bottom: 10px; +} + +.c16 { + background: transparent; + border: 0; + color: inherit; + cursor: pointer; + font-size: inherit; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c31 { + color: #008; + margin-left: 5px; +} + +.c31:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c6 { + color: black; + background-color: #e9e9e9; + border: 2px solid #bbb; + text-align: center; + width: 25px; + height: 25px; + font-size: 1.2em; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; +} + +.c34 { + color: black; + background-color: #f5a729; + border: 2px solid #bbb; + text-align: center; + width: 25px; + height: 25px; + font-size: 1.2em; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; +} + +.c21::before { + content: ""; + margin: 0 0.125em; +} + +.c42 { + text-align: center; +} + +.c4 { + border-left: dotted 4px #484848; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c33 { + border-left: dotted 4px #f5a729; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c0 { + list-style: none; + padding: 0; +} + +.c12 { + color: #676767; + font-size: 13px; + padding-bottom: 12px; +} + +.c17 { + bottom: 0; + cursor: pointer; + left: 0; + position: absolute; + right: 0; + top: 0; + width: 100%; + z-index: 1; +} + +.c13 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + line-height: 16px; + min-height: 31px; + position: relative; +} + +.c10 { + display: inline-block; + grid-row-start: 2; + grid-column-start: 1; + height: 0; + overflow: hidden; + width: 0; +} + +.c15 { + font-weight: inherit; +} + +.c14 { + -webkit-flex-shrink: 0; + -ms-flex-negative: 0; + flex-shrink: 0; +} + +.c3 { + position: relative; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); + height: 100%; +} + +.c5 { + width: 30px; + height: 30px; + border-radius: 50%; + position: absolute; + left: 50%; + top: 0; + -webkit-transform: translate(-51%,-10%); + -ms-transform: translate(-51%,-10%); + transform: translate(-51%,-10%); +} + +.c2 { + grid-column-start: 2; + grid-row: span 2; + padding-right: 5px; +} + +.c18 { + display: grid; + grid-template-columns: 130px auto; +} + +.c1 { + max-width: 500px; + display: grid; + grid-template-areas: "time line title" "time line instructions"; + grid-template-columns: 65px 30px auto; +} + +.c36 { + border-color: #fff; + border-radius: 5px; + border-style: solid; + border-width: 1px; + display: inline-block; + font-style: normal; + grid-column: 2; + grid-row: 1; + margin: 0 4px; + position: relative; + text-align: center; + -webkit-text-decoration: none; + text-decoration: none; + vertical-align: middle; + width: 75%; +} + +.c36:hover { + border-color: #d1d5da; + background-color: #f6f8fa; +} + +.c9 { + grid-column-start: 1; + grid-row: 1 / span 2; + padding-right: 5px; + font-size: 0.9em; +} + +.c32 { + padding: 3px 10px 3px 10px; + border: 0; + margin-top: -15px; + width: 35px; + height: 35px; +} + +.c32:hover { + cursor: pointer; +} + +.c30 { + -webkit-flex: 0 0 25px; + -ms-flex: 0 0 25px; + flex: 0 0 25px; + grid-column: -1; +} + +.c11 { + grid-row-start: 2; + grid-column-start: 3; + grid-area: instructions; +} + +.c7 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + font-size: 1.2em; + grid-row-start: 1; + grid-column-start: 3; +} + +.c8 { + font-size: inherit; + font-weight: bold; + height: 1.2em; + margin: 0; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + -webkit-flex: 1 1 auto; + -ms-flex: 1 1 auto; + flex: 1 1 auto; + padding: 3px 0 10px 0; +} + +.c35 { + color: #807373; + font-size: 13px; + font-weight: 300; + padding-top: 1px; + margin-bottom: 10px; + margin-top: -14px; +} + +.c37 { + padding: 2px; + width: 100%; +} + +.c39 { + font-size: xx-small; +} + +.c39::before { + content: ""; + margin: 0 0.125em; +} + +.c40 { + color: #e60000; +} + +.c41 { + color: green; +} + +.c38 { + font-size: small; +} + +.c23 { + display: block; + list-style: none; + padding: 0; +} + +.c26 { + margin-left: 24px; + line-height: 1.25em; + padding-top: 1px; +} + +.c26 > span { + margin-right: 1ch; +} + +.c19 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-self: center; + -ms-flex-item-align: center; + align-self: center; + margin-top: 10px; +} + +.c19 a { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c20 { + color: #676767; + font-size: 13px; + font-style: normal; + padding: 0; +} + +.c25 { + fill: #676767; + float: left; + height: 16px; + width: 16px; +} + +.c24 { + font-size: 13px; + margin-top: 8px; + color: #676767; + font-style: normal; +} + +.c27 { + font-weight: 500; +} + +.c28 { + font-weight: 200; + opacity: 0.8975; + padding-left: 1ch; +} + +
      +
    1. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + 300 Courtland St NE, Atlanta, GA 30303-12ND, United States + +
      +
      + 9:15 AM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 0.2 miles to + + Razor Vehicle + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + SOUTH + on + + Courtland Street Northeast + + + 172 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + RIGHT + on + + Unnamed Path + + + 0.1 miles + + +
        +
        3. +
      3. +
        + + + +
        +
        + + LEFT + on + + Peachtree Center Avenue Northeast + + + 140 feet + + +
        +
        4. +
      +
      +
      +       +
      +
      +
      + +
      +
      2. +
    2. +
      +
      +
      +
      +
      + + + Travel by e-scooter + + + + +
      +
      +
      +
      +
      + + Razor E-scooter + +
      +
      + 9:19 AM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      + Pick up Razor + E-scooter + +
      +
      +
      + + + + - + + + Ride 1 mile to + + 126 Mitchell St SW, Atlanta, GA 30303-3524, United States + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + HARD_RIGHT + on + + Peachtree Center Avenue Northeast + + + 12 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + LEFT + on + + service road + + + 10 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + LEFT + on + + Peachtree Center Cycle Track + + + 0.5 miles + + +
        +
        4. +
      4. +
        + + + +
        +
        + + RIGHT + on + + Edgewood Avenue Northeast + + + 0.1 miles + + +
        +
        5. +
      5. +
        + + + +
        +
        + + LEFT + on + + Pryor Street Southwest + + + 269 feet + + +
        +
        6. +
      6. +
        + + + +
        +
        + + CONTINUE + on + + Pryor Street + + + 518 feet + + +
        +
        7. +
      7. +
        + + + +
        +
        + + CONTINUE + on + + Pryor Street Southwest + + + 0.2 miles + + +
        +
        8. +
      8. +
        + + + +
        +
        + + RIGHT + on + + Unnamed Path + + + 19 feet + + +
        +
        9. +
      9. +
        + + + +
        +
        + + RIGHT + on + + sidewalk + + + 22 feet + + +
        +
        10. +
      +
      +
      +
      + +
      +       +
      +
      +
      + +
      +
      3. +
    3. +
      +
      +
      +
      + +
      +
      +
      +
      +
      + + 126 Mitchell St SW, Atlanta, GA 30303-3524, United States + +
      +
      + 9:26 AM +
      + + Arrive at + 126 Mitchell St SW, Atlanta, GA 30303-3524, United States + +
      +
      + +
      +
      4. +
    +`; + +exports[`Storyshots ItineraryBody/otp-ui Park And Ride Itinerary 1`] = ` + + + +`; + +exports[`Storyshots ItineraryBody/otp-ui Park And Ride Itinerary 2`] = ` +.c22 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c59 { + color: #f44256; +} + +.c29 { + border-top-style: solid; + border-top-width: 0; + padding-top: 0; + padding-bottom: 10px; +} + +.c16 { + background: transparent; + border: 0; + color: inherit; + cursor: pointer; + font-size: inherit; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c31 { + color: #008; + margin-left: 5px; +} + +.c31:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c6 { + color: black; + background-color: grey; + border: 2px solid #bbb; + text-align: center; + width: 25px; + height: 25px; + font-size: 1.2em; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; +} + +.c34 { + color: black; + background-color: #e9e9e9; + border: 2px solid #bbb; + text-align: center; + width: 25px; + height: 25px; + font-size: 1.2em; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; +} + +.c21::before { + content: ""; + margin: 0 0.125em; +} + +.c58 { + text-align: center; +} + +.c4 { + border-left: dotted 4px grey; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c33 { + border-left: dotted 4px #484848; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c35 { + border-left: solid 8px #084C8D; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c54 { + display: block; + font-size: 13px; + list-style: none; + padding: 0; +} + +.c0 { + list-style: none; + padding: 0; +} + +.c12 { + color: #676767; + font-size: 13px; + padding-bottom: 12px; +} + +.c17 { + bottom: 0; + cursor: pointer; + left: 0; + position: absolute; + right: 0; + top: 0; + width: 100%; + z-index: 1; +} + +.c13 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + line-height: 16px; + min-height: 31px; + position: relative; +} + +.c10 { + display: inline-block; + grid-row-start: 2; + grid-column-start: 1; + height: 0; + overflow: hidden; + width: 0; +} + +.c42 { + font-weight: 200; +} + +.c15 { + font-weight: inherit; +} + +.c41 { + font-size: 13px; + font-weight: 500; +} + +.c40 { + font-weight: 800; + margin-right: 6px; +} + +.c39 { + color: #807373; + margin-top: 5px; +} + +.c14 { + -webkit-flex-shrink: 0; + -ms-flex-negative: 0; + flex-shrink: 0; +} + +.c3 { + position: relative; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); + height: 100%; +} + +.c5 { + width: 30px; + height: 30px; + border-radius: 50%; + position: absolute; + left: 50%; + top: 0; + -webkit-transform: translate(-51%,-10%); + -ms-transform: translate(-51%,-10%); + transform: translate(-51%,-10%); +} + +.c2 { + grid-column-start: 2; + grid-row: span 2; + padding-right: 5px; +} + +.c18 { + display: grid; + grid-template-columns: 130px auto; +} + +.c1 { + max-width: 500px; + display: grid; + grid-template-areas: "time line title" "time line instructions"; + grid-template-columns: 65px 30px auto; +} + +.c9 { + grid-column-start: 1; + grid-row: 1 / span 2; + padding-right: 5px; + font-size: 0.9em; +} + +.c32 { + padding: 3px 10px 3px 10px; + border: 0; + margin-top: -15px; + width: 35px; + height: 35px; +} + +.c32:hover { + cursor: pointer; +} + +.c30 { + -webkit-flex: 0 0 25px; + -ms-flex: 0 0 25px; + flex: 0 0 25px; + grid-column: -1; +} + +.c11 { + grid-row-start: 2; + grid-column-start: 3; + grid-area: instructions; +} + +.c7 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + font-size: 1.2em; + grid-row-start: 1; + grid-column-start: 3; +} + +.c8 { + font-size: inherit; + font-weight: bold; + height: 1.2em; + margin: 0; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + -webkit-flex: 1 1 auto; + -ms-flex: 1 1 auto; + flex: 1 1 auto; + padding: 3px 0 10px 0; +} + +.c36 { + text-align: center; + min-width: 30px; + min-height: 30px; + font-size: 1.2em; + background-color: #084C8D; + color: white; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; + border: 1px solid; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + cursor: default; +} + +.c37 { + position: absolute; + width: 1px; + height: 1px; + padding: 0; + margin: -1px; + overflow: hidden; + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + border: 0; +} + +.c23 { + display: block; + list-style: none; + padding: 0; +} + +.c26 { + margin-left: 24px; + line-height: 1.25em; + padding-top: 1px; +} + +.c26 > span { + margin-right: 1ch; +} + +.c19 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-self: center; + -ms-flex-item-align: center; + align-self: center; + margin-top: 10px; +} + +.c19 a { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c20 { + color: #676767; + font-size: 13px; + font-style: normal; + padding: 0; +} + +.c25 { + fill: #676767; + float: left; + height: 16px; + width: 16px; +} + +.c24 { + font-size: 13px; + margin-top: 8px; + color: #676767; + font-style: normal; +} + +.c27 { + font-weight: 500; +} + +.c28 { + font-weight: 200; + opacity: 0.8975; + padding-left: 1ch; +} + +.c38 { + font-weight: 200; + font-size: 0.9em; + margin-left: 10px; +} + +.c56 { + float: left; + margin-left: -36px; + color: #fff; +} + +.c57 { + color: #676767; + margin-top: 3px; +} + +.c55 { + z-index: 30; + position: relative; +} + +.c45 { + background-color: #eee; + border-radius: 4px; + color: #000; + display: block; + margin-top: 5px; + padding: 8px; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c49 { + -webkit-align-items: baseline; + -webkit-box-align: baseline; + -ms-flex-align: baseline; + align-items: baseline; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + gap: 5px; + margin-top: 0.5em; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c49:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c47 { + font-size: 12px; + margin-left: 30px; + white-space: pre-wrap; +} + +.c48 { + margin-top: 5px; + margin-left: 30px; + font-size: 12px; + font-style: italic; +} + +.c46 { + float: left; + font-size: 18px; +} + +.c44 { + display: block; + margin-top: 3px; + padding: 0; +} + +.c43 { + color: #d14727; + cursor: auto; + display: inline-block; + font-weight: 400; + margin-top: 8px; + padding: 0; +} + +.c50 { + margin-top: 5px; +} + +.c51 { + color: #676767; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; +} + +.c53 { + font-size: 14px; +} + +.c52 { + padding: 0; +} + +
      +
    1. +
      +
      +
      +
      +
      + + + Travel by car + + + + +
      +
      +
      +
      +
      + + 330 SW Murray Blvd, Washington County, OR, USA 97005 + +
      +
      + 3:50 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Drive 2.4 miles to + + P+R Sunset TC + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + SOUTHWEST + on + + parking aisle + + + 158 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + RIGHT + on + + SW Murray Blvd + + + 0.2 miles + + +
        +
        3. +
      3. +
        + + + +
        +
        + + CONTINUE + on + + NW Murray Blvd + + + 150 feet + + +
        +
        4. +
      4. +
        + + + +
        +
        + + SLIGHTLY_RIGHT + on + + NW Murray Blvd + + + 0.4 miles + + +
        +
        5. +
      5. +
        + + + +
        +
        + + CONTINUE + on + + NW Sunset Hwy + + + 0.6 miles + + +
        +
        6. +
      6. +
        + + + +
        +
        + + CONTINUE + on + + NW Sunset Hwy + + + 0.3 miles + + +
        +
        7. +
      7. +
        + + + +
        +
        + + LEFT + on + + SW Cedar Hills Blvd + + + 0.2 miles + + +
        +
        8. +
      8. +
        + + + +
        +
        + + RIGHT + on + + SW Barnes Rd + + + 0.5 miles + + +
        +
        9. +
      9. +
        + + + +
        +
        + + RIGHT + on + + service road + + + 0.2 miles + + +
        +
        10. +
      10. +
        + + + +
        +
        + + RIGHT + on + + Sunset TC + + + 76 feet + + +
        +
        11. +
      +
      +
      +       +
      +
      +
      + +
      +
      2. +
    2. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + P+R Sunset TC + +
      +
      + 4:02 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 426 feet to + + Sunset TC MAX Station + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + SLIGHTLY_RIGHT + on + + Unnamed Path + + + 16 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + LEFT + on + + steps + + + 232 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + LEFT + on + + Unnamed Path + + + 19 feet + + +
        +
        4. +
      4. +
        + + + +
        +
        + + RIGHT + on + + Sunset TC (path) + + + 159 feet + + +
        +
        5. +
      +
      +
      +       +
      +
      +
      + +
      +
      3. +
    3. +
      +
      +
      +
      +
      + + MA + + + MAX Blue Line + +
      +
      +
      +
      +
      + + Sunset TC MAX Station + + ID 9969 + + +
      +
      + 4:05 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + Ride + + +
      + + MAX Blue Line + +
      + + + MAX Blue Line + + to + + Gresham + + +       + + - + Disembark at + Oak/ SW 1st Ave MAX Station + + ID 8337 + + +       + +       +
      +
      +
      + + + 2 alerts +
      +
      +
      + +
      +
      +
      +
      + +
      +
      +
      +
      +
        +
      1. +
        + • +
        +
        + Washington Park MAX Station +
        +
        2. +
      2. +
        + • +
        +
        + Goose Hollow/SW Jefferson St MAX Station +
        +
        3. +
      3. +
        + • +
        +
        + Kings Hill/SW Salmon St MAX Station +
        +
        4. +
      4. +
        + • +
        +
        + Providence Park MAX Station +
        +
        5. +
      5. +
        + • +
        +
        + Library/SW 9th Ave MAX Station +
        +
        6. +
      6. +
        + • +
        +
        + Pioneer Square South MAX Station +
        +
        7. +
      7. +
        + • +
        +
        + Mall/SW 4th Ave MAX Station +
        +
        8. +
      8. +
        + • +
        +
        + Yamhill District MAX Station +
        +
        9. +
      +
      +
      +
      +
      +
      +
      +
      +
      + +
      +
      4. +
    4. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + Oak/ SW 1st Ave MAX Station + + ID 8337 + + +
      +
      + 4:27 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 0.1 miles to + + 205 SW Pine St, Portland, OR, USA 97204 + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + NORTHEAST + on + + Oak/SW 1st Ave (path) + + + 13 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + CONTINUE + on + + Unnamed Path + + + 27 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + LEFT + on + + SW Oak St + + + 37 feet + + +
        +
        4. +
      4. +
        + + + +
        +
        + + RIGHT + on + + SW 1st Ave + + + 260 feet + + +
        +
        5. +
      5. +
        + + + +
        +
        + + LEFT + on + + SW Pine St + + + 337 feet + + +
        +
        6. +
      +
      +
      +       +
      +
      +
      + +
      +
      5. +
    5. +
      +
      +
      +
      + +
      +
      +
      +
      +
      + + 205 SW Pine St, Portland, OR, USA 97204 + +
      +
      + 4:29 PM +
      + + Arrive at + 205 SW Pine St, Portland, OR, USA 97204 + +
      +
      + +
      +
      6. +
    +`; + +exports[`Storyshots ItineraryBody/otp-ui Styled Walk Transit Walk Itinerary 1`] = ` + + + +`; + +exports[`Storyshots ItineraryBody/otp-ui Styled Walk Transit Walk Itinerary 2`] = ` +.c25 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c60 { + color: #f44256; +} + +.c32 { + border-top-style: solid; + border-top-width: 0; + padding-top: 0; + padding-bottom: 10px; +} + +.c19 { + background: transparent; + border: 0; + color: inherit; + cursor: pointer; + font-size: inherit; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c34 { + color: #008; + margin-left: 5px; +} + +.c34:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c7 { + color: black; + background-color: #e9e9e9; + border: 2px solid #bbb; + text-align: center; + width: 25px; + height: 25px; + font-size: 1.2em; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; +} + +.c24::before { + content: ""; + margin: 0 0.125em; +} + +.c59 { + text-align: center; +} + +.c5 { + border-left: dotted 4px #484848; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c36 { + border-left: solid 8px #084C8D; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c55 { + display: block; + font-size: 13px; + list-style: none; + padding: 0; +} + +.c0 { + list-style: none; + padding: 0; +} + +.c15 { + color: #676767; + font-size: 13px; + padding-bottom: 12px; +} + +.c20 { + bottom: 0; + cursor: pointer; + left: 0; + position: absolute; + right: 0; + top: 0; + width: 100%; + z-index: 1; +} + +.c16 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + line-height: 16px; + min-height: 31px; + position: relative; +} + +.c12 { + display: inline-block; + grid-row-start: 2; + grid-column-start: 1; + height: 0; + overflow: hidden; + width: 0; +} + +.c43 { + font-weight: 200; +} + +.c18 { + font-weight: inherit; +} + +.c42 { + font-size: 13px; + font-weight: 500; +} + +.c41 { + font-weight: 800; + margin-right: 6px; +} + +.c40 { + color: #807373; + margin-top: 5px; +} + +.c17 { + -webkit-flex-shrink: 0; + -ms-flex-negative: 0; + flex-shrink: 0; +} + +.c4 { + position: relative; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); + height: 100%; +} + +.c6 { + width: 30px; + height: 30px; + border-radius: 50%; + position: absolute; + left: 50%; + top: 0; + -webkit-transform: translate(-51%,-10%); + -ms-transform: translate(-51%,-10%); + transform: translate(-51%,-10%); +} + +.c3 { + grid-column-start: 2; + grid-row: span 2; + padding-right: 5px; +} + +.c21 { + display: grid; + grid-template-columns: 130px auto; +} + +.c2 { + max-width: 500px; + display: grid; + grid-template-areas: "time line title" "time line instructions"; + grid-template-columns: 65px 30px auto; +} + +.c11 { + grid-column-start: 1; + grid-row: 1 / span 2; + padding-right: 5px; + font-size: 0.9em; +} + +.c35 { + padding: 3px 10px 3px 10px; + border: 0; + margin-top: -15px; + width: 35px; + height: 35px; +} + +.c35:hover { + cursor: pointer; +} + +.c33 { + -webkit-flex: 0 0 25px; + -ms-flex: 0 0 25px; + flex: 0 0 25px; + grid-column: -1; +} + +.c13 { + grid-row-start: 2; + grid-column-start: 3; + grid-area: instructions; +} + +.c8 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + font-size: 1.2em; + grid-row-start: 1; + grid-column-start: 3; +} + +.c9 { + font-size: inherit; + font-weight: bold; + height: 1.2em; + margin: 0; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + -webkit-flex: 1 1 auto; + -ms-flex: 1 1 auto; + flex: 1 1 auto; + padding: 3px 0 10px 0; +} + +.c37 { + text-align: center; + min-width: 30px; + min-height: 30px; + font-size: 1.2em; + background-color: #084C8D; + color: white; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; + border: 1px solid; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + cursor: default; +} + +.c38 { + position: absolute; + width: 1px; + height: 1px; + padding: 0; + margin: -1px; + overflow: hidden; + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + border: 0; +} + +.c26 { + display: block; + list-style: none; + padding: 0; +} + +.c29 { + margin-left: 24px; + line-height: 1.25em; + padding-top: 1px; +} + +.c29 > span { + margin-right: 1ch; +} + +.c22 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-self: center; + -ms-flex-item-align: center; + align-self: center; + margin-top: 10px; +} + +.c22 a { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c23 { + color: #676767; + font-size: 13px; + font-style: normal; + padding: 0; +} + +.c28 { + fill: #676767; + float: left; + height: 16px; + width: 16px; +} + +.c27 { + font-size: 13px; + margin-top: 8px; + color: #676767; + font-style: normal; +} + +.c30 { + font-weight: 500; +} + +.c31 { + font-weight: 200; + opacity: 0.8975; + padding-left: 1ch; +} + +.c39 { + font-weight: 200; + font-size: 0.9em; + margin-left: 10px; +} + +.c57 { + float: left; + margin-left: -36px; + color: #fff; +} + +.c58 { + color: #676767; + margin-top: 3px; +} + +.c56 { + z-index: 30; + position: relative; +} + +.c46 { + background-color: #eee; + border-radius: 4px; + color: #000; + display: block; + margin-top: 5px; + padding: 8px; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c50 { + -webkit-align-items: baseline; + -webkit-box-align: baseline; + -ms-flex-align: baseline; + align-items: baseline; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + gap: 5px; + margin-top: 0.5em; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c50:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c48 { + font-size: 12px; + margin-left: 30px; + white-space: pre-wrap; +} + +.c49 { + margin-top: 5px; + margin-left: 30px; + font-size: 12px; + font-style: italic; +} + +.c47 { + float: left; + font-size: 18px; +} + +.c45 { + display: block; + margin-top: 3px; + padding: 0; +} + +.c44 { + color: #d14727; + cursor: cursor; + display: inline-block; + font-weight: 400; + margin-top: 8px; + padding: 0; +} + +.c51 { + margin-top: 5px; +} + +.c52 { + color: #676767; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; +} + +.c54 { + font-size: 14px; +} + +.c53 { + padding: 0; +} + +.c1 .c14 { + background-color: pink; +} + +.c1 .c10 { + color: #676767; + font-size: 14px; + padding-right: 4px; + padding-top: 1px; + text-align: right; + vertical-align: top; + width: 60px; +} + +
      +
    1. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + KGW Studio on the Sq, Portland, OR, USA + +
      +
      + 3:44 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 269 feet to + + Pioneer Square North MAX Station + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + NORTHWEST + on + + Unnamed Path + + + 167 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + LEFT + on + + Pioneer Sq N (path) + + + 101 feet + + +
        +
        3. +
      +
      +
      +       +
      +
      +
      + +
      +
      2. +
    2. +
      +
      +
      +
      +
      + + MA + + + MAX Blue Line + +
      +
      +
      +
      +
      + + Pioneer Square North MAX Station + + ID 8383 + + +
      +
      + 3:46 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + Ride + + +
      + + MAX Blue Line + +
      + + + MAX Blue Line + + to + + Hillsboro + + +       + + - + Disembark at + Providence Park MAX Station + + ID 9757 + + +       + +       +
      +
      + +
      +
      + +
      +
      +
      +
      + +
      +
      +
      +
      +
        +
      1. +
        + • +
        +
        + Galleria/SW 10th Ave MAX Station +
        +
        2. +
      +
      +
      +
      + + Typical wait: + 15 min + +
      +
      +
      +
      +
      + +
      +
      3. +
    3. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + Providence Park MAX Station + + ID 9757 + + +
      +
      + 3:49 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 249 feet to + + 1737 SW Morrison St, Portland, OR, USA 97205 + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + WEST + on + + Providence Park (path) + + + 19 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + RIGHT + on + + Unnamed Path + + + 104 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + RIGHT + on + + Unnamed Path + + + 27 feet + + +
        +
        4. +
      4. +
        + + + +
        +
        + + RIGHT + on + + SW Morrison St + + + 99 feet + + +
        +
        5. +
      +
      +
      +       +
      +
      +
      + +
      +
      4. +
    4. +
      +
      +
      +
      + +
      +
      +
      +
      +
      + + 1737 SW Morrison St, Portland, OR, USA 97205 + +
      +
      + 3:50 PM +
      + + Arrive at + 1737 SW Morrison St, Portland, OR, USA 97205 + +
      +
      + +
      +
      5. +
    +`; + +exports[`Storyshots ItineraryBody/otp-ui Three Alerts Always Collapsing 1`] = ` + + + +`; + +exports[`Storyshots ItineraryBody/otp-ui Three Alerts Always Collapsing 2`] = ` +.c22 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c57 { + color: #f44256; +} + +.c29 { + border-top-style: solid; + border-top-width: 0; + padding-top: 0; + padding-bottom: 10px; +} + +.c16 { + background: transparent; + border: 0; + color: inherit; + cursor: pointer; + font-size: inherit; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c31 { + color: #008; + margin-left: 5px; +} + +.c31:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c6 { + color: black; + background-color: #e9e9e9; + border: 2px solid #bbb; + text-align: center; + width: 25px; + height: 25px; + font-size: 1.2em; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; +} + +.c21::before { + content: ""; + margin: 0 0.125em; +} + +.c56 { + text-align: center; +} + +.c4 { + border-left: dotted 4px #484848; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c33 { + border-left: solid 8px #084C8D; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c52 { + display: block; + font-size: 13px; + list-style: none; + padding: 0; +} + +.c0 { + list-style: none; + padding: 0; +} + +.c12 { + color: #676767; + font-size: 13px; + padding-bottom: 12px; +} + +.c17 { + bottom: 0; + cursor: pointer; + left: 0; + position: absolute; + right: 0; + top: 0; + width: 100%; + z-index: 1; +} + +.c13 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + line-height: 16px; + min-height: 31px; + position: relative; +} + +.c10 { + display: inline-block; + grid-row-start: 2; + grid-column-start: 1; + height: 0; + overflow: hidden; + width: 0; +} + +.c40 { + font-weight: 200; +} + +.c15 { + font-weight: inherit; +} + +.c39 { + font-size: 13px; + font-weight: 500; +} + +.c38 { + font-weight: 800; + margin-right: 6px; +} + +.c37 { + color: #807373; + margin-top: 5px; +} + +.c14 { + -webkit-flex-shrink: 0; + -ms-flex-negative: 0; + flex-shrink: 0; +} + +.c3 { + position: relative; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); + height: 100%; +} + +.c5 { + width: 30px; + height: 30px; + border-radius: 50%; + position: absolute; + left: 50%; + top: 0; + -webkit-transform: translate(-51%,-10%); + -ms-transform: translate(-51%,-10%); + transform: translate(-51%,-10%); +} + +.c2 { + grid-column-start: 2; + grid-row: span 2; + padding-right: 5px; +} + +.c18 { + display: grid; + grid-template-columns: 130px auto; +} + +.c1 { + max-width: 500px; + display: grid; + grid-template-areas: "time line title" "time line instructions"; + grid-template-columns: 65px 30px auto; +} + +.c9 { + grid-column-start: 1; + grid-row: 1 / span 2; + padding-right: 5px; + font-size: 0.9em; +} + +.c32 { + padding: 3px 10px 3px 10px; + border: 0; + margin-top: -15px; + width: 35px; + height: 35px; +} + +.c32:hover { + cursor: pointer; +} + +.c30 { + -webkit-flex: 0 0 25px; + -ms-flex: 0 0 25px; + flex: 0 0 25px; + grid-column: -1; +} + +.c11 { + grid-row-start: 2; + grid-column-start: 3; + grid-area: instructions; +} + +.c7 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + font-size: 1.2em; + grid-row-start: 1; + grid-column-start: 3; +} + +.c8 { + font-size: inherit; + font-weight: bold; + height: 1.2em; + margin: 0; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + -webkit-flex: 1 1 auto; + -ms-flex: 1 1 auto; + flex: 1 1 auto; + padding: 3px 0 10px 0; +} + +.c34 { + text-align: center; + min-width: 30px; + min-height: 30px; + font-size: 1.2em; + background-color: #084C8D; + color: white; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; + border: 1px solid; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + cursor: default; +} + +.c35 { + position: absolute; + width: 1px; + height: 1px; + padding: 0; + margin: -1px; + overflow: hidden; + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + border: 0; +} + +.c23 { + display: block; + list-style: none; + padding: 0; +} + +.c26 { + margin-left: 24px; + line-height: 1.25em; + padding-top: 1px; +} + +.c26 > span { + margin-right: 1ch; +} + +.c19 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-self: center; + -ms-flex-item-align: center; + align-self: center; + margin-top: 10px; +} + +.c19 a { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c20 { + color: #676767; + font-size: 13px; + font-style: normal; + padding: 0; +} + +.c25 { + fill: #676767; + float: left; + height: 16px; + width: 16px; +} + +.c24 { + font-size: 13px; + margin-top: 8px; + color: #676767; + font-style: normal; +} + +.c27 { + font-weight: 500; +} + +.c28 { + font-weight: 200; + opacity: 0.8975; + padding-left: 1ch; +} + +.c36 { + font-weight: 200; + font-size: 0.9em; + margin-left: 10px; +} + +.c54 { + float: left; + margin-left: -36px; + color: #fff; +} + +.c55 { + color: #676767; + margin-top: 3px; +} + +.c53 { + z-index: 30; + position: relative; +} + +.c43 { + background-color: #eee; + border-radius: 4px; + color: #000; + display: block; + margin-top: 5px; + padding: 8px; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c47 { + -webkit-align-items: baseline; + -webkit-box-align: baseline; + -ms-flex-align: baseline; + align-items: baseline; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + gap: 5px; + margin-top: 0.5em; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c47:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c45 { + font-size: 12px; + margin-left: 30px; + white-space: pre-wrap; +} + +.c46 { + margin-top: 5px; + margin-left: 30px; + font-size: 12px; + font-style: italic; +} + +.c44 { + float: left; + font-size: 18px; +} + +.c42 { + display: block; + margin-top: 3px; + padding: 0; +} + +.c41 { + color: #d14727; + cursor: cursor; + display: inline-block; + font-weight: 400; + margin-top: 8px; + padding: 0; +} + +.c48 { + margin-top: 5px; +} + +.c49 { + color: #676767; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; +} + +.c51 { + font-size: 14px; +} + +.c50 { + padding: 0; +} + +
      +
    1. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + KGW Studio on the Sq, Portland, OR, USA + +
      +
      + 3:44 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 269 feet to + + Pioneer Square North MAX Station + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + NORTHWEST + on + + Unnamed Path + + + 167 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + LEFT + on + + Pioneer Sq N (path) + + + 101 feet + + +
        +
        3. +
      +
      +
      +       +
      +
      +
      + +
      +
      2. +
    2. +
      +
      +
      +
      +
      + + MA + + + MAX Blue Line + +
      +
      +
      +
      +
      + + Pioneer Square North MAX Station + + ID 8383 + + +
      +
      + 3:46 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + Ride + + +
      + + MAX Blue Line + +
      + + + MAX Blue Line + + to + + Hillsboro + + +       + + - + Disembark at + Providence Park MAX Station + + ID 9757 + + +       + +       +
      +
      + +
      +
      + +
      +
      +
      +
      + +
      +
      +
      +
      +
        +
      1. +
        + • +
        +
        + Galleria/SW 10th Ave MAX Station +
        +
        2. +
      +
      +
      +
      + + Typical wait: + 15 min + +
      +
      +
      +
      +
      + +
      +
      3. +
    3. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + Providence Park MAX Station + + ID 9757 + + +
      +
      + 3:49 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 249 feet to + + 1737 SW Morrison St, Portland, OR, USA 97205 + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + WEST + on + + Providence Park (path) + + + 19 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + RIGHT + on + + Unnamed Path + + + 104 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + RIGHT + on + + Unnamed Path + + + 27 feet + + +
        +
        4. +
      4. +
        + + + +
        +
        + + RIGHT + on + + SW Morrison St + + + 99 feet + + +
        +
        5. +
      +
      +
      +       +
      +
      +
      + +
      +
      4. +
    4. +
      +
      +
      +
      + +
      +
      +
      +
      +
      + + 1737 SW Morrison St, Portland, OR, USA 97205 + +
      +
      + 3:50 PM +
      + + Arrive at + 1737 SW Morrison St, Portland, OR, USA 97205 + +
      +
      + +
      +
      5. +
    +`; + +exports[`Storyshots ItineraryBody/otp-ui Three Alerts Not Always Collapsing 1`] = ` + + + +`; + +exports[`Storyshots ItineraryBody/otp-ui Three Alerts Not Always Collapsing 2`] = ` +.c22 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c57 { + color: #f44256; +} + +.c29 { + border-top-style: solid; + border-top-width: 0; + padding-top: 0; + padding-bottom: 10px; +} + +.c16 { + background: transparent; + border: 0; + color: inherit; + cursor: pointer; + font-size: inherit; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c31 { + color: #008; + margin-left: 5px; +} + +.c31:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c6 { + color: black; + background-color: #e9e9e9; + border: 2px solid #bbb; + text-align: center; + width: 25px; + height: 25px; + font-size: 1.2em; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; +} + +.c21::before { + content: ""; + margin: 0 0.125em; +} + +.c56 { + text-align: center; +} + +.c4 { + border-left: dotted 4px #484848; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c33 { + border-left: solid 8px #084C8D; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c52 { + display: block; + font-size: 13px; + list-style: none; + padding: 0; +} + +.c0 { + list-style: none; + padding: 0; +} + +.c12 { + color: #676767; + font-size: 13px; + padding-bottom: 12px; +} + +.c17 { + bottom: 0; + cursor: pointer; + left: 0; + position: absolute; + right: 0; + top: 0; + width: 100%; + z-index: 1; +} + +.c13 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + line-height: 16px; + min-height: 31px; + position: relative; +} + +.c10 { + display: inline-block; + grid-row-start: 2; + grid-column-start: 1; + height: 0; + overflow: hidden; + width: 0; +} + +.c40 { + font-weight: 200; +} + +.c15 { + font-weight: inherit; +} + +.c39 { + font-size: 13px; + font-weight: 500; +} + +.c38 { + font-weight: 800; + margin-right: 6px; +} + +.c37 { + color: #807373; + margin-top: 5px; +} + +.c14 { + -webkit-flex-shrink: 0; + -ms-flex-negative: 0; + flex-shrink: 0; +} + +.c3 { + position: relative; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); + height: 100%; +} + +.c5 { + width: 30px; + height: 30px; + border-radius: 50%; + position: absolute; + left: 50%; + top: 0; + -webkit-transform: translate(-51%,-10%); + -ms-transform: translate(-51%,-10%); + transform: translate(-51%,-10%); +} + +.c2 { + grid-column-start: 2; + grid-row: span 2; + padding-right: 5px; +} + +.c18 { + display: grid; + grid-template-columns: 130px auto; +} + +.c1 { + max-width: 500px; + display: grid; + grid-template-areas: "time line title" "time line instructions"; + grid-template-columns: 65px 30px auto; +} + +.c9 { + grid-column-start: 1; + grid-row: 1 / span 2; + padding-right: 5px; + font-size: 0.9em; +} + +.c32 { + padding: 3px 10px 3px 10px; + border: 0; + margin-top: -15px; + width: 35px; + height: 35px; +} + +.c32:hover { + cursor: pointer; +} + +.c30 { + -webkit-flex: 0 0 25px; + -ms-flex: 0 0 25px; + flex: 0 0 25px; + grid-column: -1; +} + +.c11 { + grid-row-start: 2; + grid-column-start: 3; + grid-area: instructions; +} + +.c7 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + font-size: 1.2em; + grid-row-start: 1; + grid-column-start: 3; +} + +.c8 { + font-size: inherit; + font-weight: bold; + height: 1.2em; + margin: 0; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + -webkit-flex: 1 1 auto; + -ms-flex: 1 1 auto; + flex: 1 1 auto; + padding: 3px 0 10px 0; +} + +.c34 { + text-align: center; + min-width: 30px; + min-height: 30px; + font-size: 1.2em; + background-color: #084C8D; + color: white; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; + border: 1px solid; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + cursor: default; +} + +.c35 { + position: absolute; + width: 1px; + height: 1px; + padding: 0; + margin: -1px; + overflow: hidden; + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + border: 0; +} + +.c23 { + display: block; + list-style: none; + padding: 0; +} + +.c26 { + margin-left: 24px; + line-height: 1.25em; + padding-top: 1px; +} + +.c26 > span { + margin-right: 1ch; +} + +.c19 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-self: center; + -ms-flex-item-align: center; + align-self: center; + margin-top: 10px; +} + +.c19 a { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c20 { + color: #676767; + font-size: 13px; + font-style: normal; + padding: 0; +} + +.c25 { + fill: #676767; + float: left; + height: 16px; + width: 16px; +} + +.c24 { + font-size: 13px; + margin-top: 8px; + color: #676767; + font-style: normal; +} + +.c27 { + font-weight: 500; +} + +.c28 { + font-weight: 200; + opacity: 0.8975; + padding-left: 1ch; +} + +.c36 { + font-weight: 200; + font-size: 0.9em; + margin-left: 10px; +} + +.c54 { + float: left; + margin-left: -36px; + color: #fff; +} + +.c55 { + color: #676767; + margin-top: 3px; +} + +.c53 { + z-index: 30; + position: relative; +} + +.c43 { + background-color: #eee; + border-radius: 4px; + color: #000; + display: block; + margin-top: 5px; + padding: 8px; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c47 { + -webkit-align-items: baseline; + -webkit-box-align: baseline; + -ms-flex-align: baseline; + align-items: baseline; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + gap: 5px; + margin-top: 0.5em; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c47:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c45 { + font-size: 12px; + margin-left: 30px; + white-space: pre-wrap; +} + +.c46 { + margin-top: 5px; + margin-left: 30px; + font-size: 12px; + font-style: italic; +} + +.c44 { + float: left; + font-size: 18px; +} + +.c42 { + display: block; + margin-top: 3px; + padding: 0; +} + +.c41 { + color: #d14727; + cursor: cursor; + display: inline-block; + font-weight: 400; + margin-top: 8px; + padding: 0; +} + +.c48 { + margin-top: 5px; +} + +.c49 { + color: #676767; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; +} + +.c51 { + font-size: 14px; +} + +.c50 { + padding: 0; +} + +
      +
    1. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + KGW Studio on the Sq, Portland, OR, USA + +
      +
      + 3:44 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 269 feet to + + Pioneer Square North MAX Station + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + NORTHWEST + on + + Unnamed Path + + + 167 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + LEFT + on + + Pioneer Sq N (path) + + + 101 feet + + +
        +
        3. +
      +
      +
      +       +
      +
      +
      + +
      +
      2. +
    2. +
      +
      +
      +
      +
      + + MA + + + MAX Blue Line + +
      +
      +
      +
      +
      + + Pioneer Square North MAX Station + + ID 8383 + + +
      +
      + 3:46 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + Ride + + +
      + + MAX Blue Line + +
      + + + MAX Blue Line + + to + + Hillsboro + + +       + + - + Disembark at + Providence Park MAX Station + + ID 9757 + + +       + +       +
      +
      + +
      +
      + +
      +
      +
      +
      + +
      +
      +
      +
      +
        +
      1. +
        + • +
        +
        + Galleria/SW 10th Ave MAX Station +
        +
        2. +
      +
      +
      +
      + + Typical wait: + 15 min + +
      +
      +
      +
      +
      + +
      +
      3. +
    3. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + Providence Park MAX Station + + ID 9757 + + +
      +
      + 3:49 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 249 feet to + + 1737 SW Morrison St, Portland, OR, USA 97205 + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + WEST + on + + Providence Park (path) + + + 19 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + RIGHT + on + + Unnamed Path + + + 104 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + RIGHT + on + + Unnamed Path + + + 27 feet + + +
        +
        4. +
      4. +
        + + + +
        +
        + + RIGHT + on + + SW Morrison St + + + 99 feet + + +
        +
        5. +
      +
      +
      +       +
      +
      +
      + +
      +
      4. +
    4. +
      +
      +
      +
      + +
      +
      +
      +
      +
      + + 1737 SW Morrison St, Portland, OR, USA 97205 + +
      +
      + 3:50 PM +
      + + Arrive at + 1737 SW Morrison St, Portland, OR, USA 97205 + +
      +
      + +
      +
      5. +
    +`; + +exports[`Storyshots ItineraryBody/otp-ui Three Alerts Without Collapsing Prop 1`] = ` + + + +`; + +exports[`Storyshots ItineraryBody/otp-ui Three Alerts Without Collapsing Prop 2`] = ` +.c22 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c57 { + color: #f44256; +} + +.c29 { + border-top-style: solid; + border-top-width: 0; + padding-top: 0; + padding-bottom: 10px; +} + +.c16 { + background: transparent; + border: 0; + color: inherit; + cursor: pointer; + font-size: inherit; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c31 { + color: #008; + margin-left: 5px; +} + +.c31:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c6 { + color: black; + background-color: #e9e9e9; + border: 2px solid #bbb; + text-align: center; + width: 25px; + height: 25px; + font-size: 1.2em; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; +} + +.c21::before { + content: ""; + margin: 0 0.125em; +} + +.c56 { + text-align: center; +} + +.c4 { + border-left: dotted 4px #484848; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c33 { + border-left: solid 8px #084C8D; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c52 { + display: block; + font-size: 13px; + list-style: none; + padding: 0; +} + +.c0 { + list-style: none; + padding: 0; +} + +.c12 { + color: #676767; + font-size: 13px; + padding-bottom: 12px; +} + +.c17 { + bottom: 0; + cursor: pointer; + left: 0; + position: absolute; + right: 0; + top: 0; + width: 100%; + z-index: 1; +} + +.c13 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + line-height: 16px; + min-height: 31px; + position: relative; +} + +.c10 { + display: inline-block; + grid-row-start: 2; + grid-column-start: 1; + height: 0; + overflow: hidden; + width: 0; +} + +.c40 { + font-weight: 200; +} + +.c15 { + font-weight: inherit; +} + +.c39 { + font-size: 13px; + font-weight: 500; +} + +.c38 { + font-weight: 800; + margin-right: 6px; +} + +.c37 { + color: #807373; + margin-top: 5px; +} + +.c14 { + -webkit-flex-shrink: 0; + -ms-flex-negative: 0; + flex-shrink: 0; +} + +.c3 { + position: relative; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); + height: 100%; +} + +.c5 { + width: 30px; + height: 30px; + border-radius: 50%; + position: absolute; + left: 50%; + top: 0; + -webkit-transform: translate(-51%,-10%); + -ms-transform: translate(-51%,-10%); + transform: translate(-51%,-10%); +} + +.c2 { + grid-column-start: 2; + grid-row: span 2; + padding-right: 5px; +} + +.c18 { + display: grid; + grid-template-columns: 130px auto; +} + +.c1 { + max-width: 500px; + display: grid; + grid-template-areas: "time line title" "time line instructions"; + grid-template-columns: 65px 30px auto; +} + +.c9 { + grid-column-start: 1; + grid-row: 1 / span 2; + padding-right: 5px; + font-size: 0.9em; +} + +.c32 { + padding: 3px 10px 3px 10px; + border: 0; + margin-top: -15px; + width: 35px; + height: 35px; +} + +.c32:hover { + cursor: pointer; +} + +.c30 { + -webkit-flex: 0 0 25px; + -ms-flex: 0 0 25px; + flex: 0 0 25px; + grid-column: -1; +} + +.c11 { + grid-row-start: 2; + grid-column-start: 3; + grid-area: instructions; +} + +.c7 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + font-size: 1.2em; + grid-row-start: 1; + grid-column-start: 3; +} + +.c8 { + font-size: inherit; + font-weight: bold; + height: 1.2em; + margin: 0; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + -webkit-flex: 1 1 auto; + -ms-flex: 1 1 auto; + flex: 1 1 auto; + padding: 3px 0 10px 0; +} + +.c34 { + text-align: center; + min-width: 30px; + min-height: 30px; + font-size: 1.2em; + background-color: #084C8D; + color: white; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; + border: 1px solid; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + cursor: default; +} + +.c35 { + position: absolute; + width: 1px; + height: 1px; + padding: 0; + margin: -1px; + overflow: hidden; + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + border: 0; +} + +.c23 { + display: block; + list-style: none; + padding: 0; +} + +.c26 { + margin-left: 24px; + line-height: 1.25em; + padding-top: 1px; +} + +.c26 > span { + margin-right: 1ch; +} + +.c19 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-self: center; + -ms-flex-item-align: center; + align-self: center; + margin-top: 10px; +} + +.c19 a { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c20 { + color: #676767; + font-size: 13px; + font-style: normal; + padding: 0; +} + +.c25 { + fill: #676767; + float: left; + height: 16px; + width: 16px; +} + +.c24 { + font-size: 13px; + margin-top: 8px; + color: #676767; + font-style: normal; +} + +.c27 { + font-weight: 500; +} + +.c28 { + font-weight: 200; + opacity: 0.8975; + padding-left: 1ch; +} + +.c36 { + font-weight: 200; + font-size: 0.9em; + margin-left: 10px; +} + +.c54 { + float: left; + margin-left: -36px; + color: #fff; +} + +.c55 { + color: #676767; + margin-top: 3px; +} + +.c53 { + z-index: 30; + position: relative; +} + +.c43 { + background-color: #eee; + border-radius: 4px; + color: #000; + display: block; + margin-top: 5px; + padding: 8px; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c47 { + -webkit-align-items: baseline; + -webkit-box-align: baseline; + -ms-flex-align: baseline; + align-items: baseline; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + gap: 5px; + margin-top: 0.5em; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c47:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c45 { + font-size: 12px; + margin-left: 30px; + white-space: pre-wrap; +} + +.c46 { + margin-top: 5px; + margin-left: 30px; + font-size: 12px; + font-style: italic; +} + +.c44 { + float: left; + font-size: 18px; +} + +.c42 { + display: block; + margin-top: 3px; + padding: 0; +} + +.c41 { + color: #d14727; + cursor: cursor; + display: inline-block; + font-weight: 400; + margin-top: 8px; + padding: 0; +} + +.c48 { + margin-top: 5px; +} + +.c49 { + color: #676767; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; +} + +.c51 { + font-size: 14px; +} + +.c50 { + padding: 0; +} + +
      +
    1. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + KGW Studio on the Sq, Portland, OR, USA + +
      +
      + 3:44 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 269 feet to + + Pioneer Square North MAX Station + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + NORTHWEST + on + + Unnamed Path + + + 167 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + LEFT + on + + Pioneer Sq N (path) + + + 101 feet + + +
        +
        3. +
      +
      +
      +       +
      +
      +
      + +
      +
      2. +
    2. +
      +
      +
      +
      +
      + + MA + + + MAX Blue Line + +
      +
      +
      +
      +
      + + Pioneer Square North MAX Station + + ID 8383 + + +
      +
      + 3:46 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + Ride + + +
      + + MAX Blue Line + +
      + + + MAX Blue Line + + to + + Hillsboro + + +       + + - + Disembark at + Providence Park MAX Station + + ID 9757 + + +       + +       +
      +
      + +
      +
      + +
      +
      +
      +
      + +
      +
      +
      +
      +
        +
      1. +
        + • +
        +
        + Galleria/SW 10th Ave MAX Station +
        +
        2. +
      +
      +
      +
      + + Typical wait: + 15 min + +
      +
      +
      +
      +
      + +
      +
      3. +
    3. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + Providence Park MAX Station + + ID 9757 + + +
      +
      + 3:49 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 249 feet to + + 1737 SW Morrison St, Portland, OR, USA 97205 + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + WEST + on + + Providence Park (path) + + + 19 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + RIGHT + on + + Unnamed Path + + + 104 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + RIGHT + on + + Unnamed Path + + + 27 feet + + +
        +
        4. +
      4. +
        + + + +
        +
        + + RIGHT + on + + SW Morrison St + + + 99 feet + + +
        +
        5. +
      +
      +
      +       +
      +
      +
      + +
      +
      4. +
    4. +
      +
      +
      +
      + +
      +
      +
      +
      +
      + + 1737 SW Morrison St, Portland, OR, USA 97205 + +
      +
      + 3:50 PM +
      + + Arrive at + 1737 SW Morrison St, Portland, OR, USA 97205 + +
      +
      + +
      +
      5. +
    +`; + +exports[`Storyshots ItineraryBody/otp-ui Tnc Transit Itinerary 1`] = ` + + + +`; + +exports[`Storyshots ItineraryBody/otp-ui Tnc Transit Itinerary 2`] = ` +.c41 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c52 { + color: #f44256; +} + +.c21 { + border-top-style: solid; + border-top-width: 0; + padding-top: 0; + padding-bottom: 10px; +} + +.c17 { + background: transparent; + border: 0; + color: inherit; + cursor: pointer; + font-size: inherit; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c20 { + background-color: #fff; + background-image: none; + border-radius: 4px; + border: 1px solid #ccc; + color: #333; + cursor: pointer; + display: inline-block; + font-size: 14px; + font-weight: 400; + padding: 4px 6px; + text-align: center; + -webkit-text-decoration: none; + text-decoration: none; + touch-action: manipulation; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + white-space: nowrap; +} + +.c20:hover { + color: #333; + background-color: #e6e6e6; + border-color: #adadad; +} + +.c20:active { + color: #333; + background-color: #e6e6e6; + background-image: none; + border-color: #adadad; + outline: 0; + box-shadow: inset 0 3px 5px rgba(0,0,0,0.125); +} + +.c20:focus { + color: #333; + background-color: #e6e6e6; + border-color: #8c8c8c; +} + +.c20:active:hover { + color: #333; + background-color: #d4d4d4; + border-color: #8c8c8c; +} + +.c23 { + color: #008; + margin-left: 5px; +} + +.c23:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c6 { + color: black; + background-color: grey; + border: 2px solid #bbb; + text-align: center; + width: 25px; + height: 25px; + font-size: 1.2em; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; +} + +.c26 { + color: black; + background-color: #e9e9e9; + border: 2px solid #bbb; + text-align: center; + width: 25px; + height: 25px; + font-size: 1.2em; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; +} + +.c48 { + bottom: 0; + left: 110px; + position: absolute; + right: 0; + top: 0; +} + +.c49 { + background-color: #fcf9d3; + display: table; + height: 100%; + width: 100%; +} + +.c47 { + border-bottom: 16px solid transparent; + border-right: 16px solid #fcf9d3; + border-top: 16px solid transparent; + height: 0; + left: 94px; + position: absolute; + top: 0; + width: 0; +} + +.c50 { + color: #444; + display: table-cell; + font-style: italic; + line-height: 0.95; + padding: 0px 2px; + vertical-align: middle; +} + +.c19 { + height: 32px; + margin-bottom: 10px; + margin-top: 10px; + position: relative; +} + +.c40::before { + content: ""; + margin: 0 0.125em; +} + +.c51 { + text-align: center; +} + +.c4 { + border-left: dotted 4px grey; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c25 { + border-left: dotted 4px #484848; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c31 { + border-left: solid 8px #008ab0; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c43 { + display: block; + font-size: 13px; + list-style: none; + padding: 0; +} + +.c0 { + list-style: none; + padding: 0; +} + +.c13 { + color: #676767; + font-size: 13px; + padding-bottom: 12px; +} + +.c18 { + bottom: 0; + cursor: pointer; + left: 0; + position: absolute; + right: 0; + top: 0; + width: 100%; + z-index: 1; +} + +.c14 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + line-height: 16px; + min-height: 31px; + position: relative; +} + +.c10 { + display: inline-block; + grid-row-start: 2; + grid-column-start: 1; + height: 0; + overflow: hidden; + width: 0; +} + +.c16 { + font-weight: inherit; +} + +.c36 { + font-size: 13px; + font-weight: 500; +} + +.c35 { + font-weight: 800; + margin-right: 6px; +} + +.c34 { + color: #807373; + margin-top: 5px; +} + +.c15 { + -webkit-flex-shrink: 0; + -ms-flex-negative: 0; + flex-shrink: 0; +} + +.c3 { + position: relative; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); + height: 100%; +} + +.c5 { + width: 30px; + height: 30px; + border-radius: 50%; + position: absolute; + left: 50%; + top: 0; + -webkit-transform: translate(-51%,-10%); + -ms-transform: translate(-51%,-10%); + transform: translate(-51%,-10%); +} + +.c2 { + grid-column-start: 2; + grid-row: span 2; + padding-right: 5px; +} + +.c27 { + display: grid; + grid-template-columns: 130px auto; +} + +.c1 { + max-width: 500px; + display: grid; + grid-template-areas: "time line title" "time line instructions"; + grid-template-columns: 65px 30px auto; +} + +.c9 { + grid-column-start: 1; + grid-row: 1 / span 2; + padding-right: 5px; + font-size: 0.9em; +} + +.c24 { + padding: 3px 10px 3px 10px; + border: 0; + margin-top: -15px; + width: 35px; + height: 35px; +} + +.c24:hover { + cursor: pointer; +} + +.c22 { + -webkit-flex: 0 0 25px; + -ms-flex: 0 0 25px; + flex: 0 0 25px; + grid-column: -1; +} + +.c11 { + grid-row-start: 2; + grid-column-start: 3; + grid-area: instructions; +} + +.c7 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + font-size: 1.2em; + grid-row-start: 1; + grid-column-start: 3; +} + +.c8 { + font-size: inherit; + font-weight: bold; + height: 1.2em; + margin: 0; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + -webkit-flex: 1 1 auto; + -ms-flex: 1 1 auto; + flex: 1 1 auto; + padding: 3px 0 10px 0; +} + +.c12 { + color: #807373; + font-size: 13px; + font-weight: 300; + padding-top: 1px; + margin-bottom: 10px; + margin-top: -14px; +} + +.c32 { + text-align: center; + min-width: 30px; + min-height: 30px; + font-size: 1.2em; + background-color: #084c8d; + color: white; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; + border: 1px solid; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + cursor: default; +} + +.c33 { + position: absolute; + width: 1px; + height: 1px; + padding: 0; + margin: -1px; + overflow: hidden; + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + border: 0; +} + +.c30 { + display: block; + list-style: none; + padding: 0; +} + +.c28 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-self: center; + -ms-flex-item-align: center; + align-self: center; + margin-top: 10px; +} + +.c28 a { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c29 { + color: #676767; + font-size: 13px; + font-style: normal; + padding: 0; +} + +.c45 { + float: left; + margin-left: -36px; + color: #fff; +} + +.c46 { + color: #676767; + margin-top: 3px; +} + +.c44 { + z-index: 30; + position: relative; +} + +.c37 { + margin-top: 5px; +} + +.c38 { + color: #676767; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; +} + +.c42 { + font-size: 14px; +} + +.c39 { + padding: 0; +} + +
      +
    1. +
      +
      +
      +
      +
      + + + Travel by car + + + + + + +
      +
      +
      +
      +
      + + 128 NW 12th Ave, Portland + +
      +
      + 10:58 AM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + Wait 4 minutes for pickup +
      +
      +
      + + + + - + + + Ride 0.4 miles to + + West Burnside Street + + + + +
      + +
      + Estimated travel time: + 2 min + (does not account for traffic) +
      +
      + Estimated cost: + $17.00 + - + $19.00 +
      +
      +
      +
      +
      + +
      +
      2. +
    2. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + West Burnside Street + +
      +
      + 11:01 AM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk to + + W Burnside & SW 6th + + + + +
      + + + + +
      +
      +
        +
      +
      +       +
      +
      +
      + +
      +
      3. +
    3. +
      +
      +
      +
      +
      + + 20 + + + Burnside/Stark + +
      +
      +
      +
      +
      + + W Burnside & SW 6th + +
      +
      + 11:02 AM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + Ride + + +
      + + 20 + +
      + + + Burnside/Stark + + +       + + - + Disembark at + E Burnside & SE 12th + +       + +       +
      +
      +
      +
      +
      +
      +
      + +
      +
      +
      +
      +
        +
      1. +
        + • +
        +
        + W Burnside & SW 2nd +
        +
        2. +
      2. +
        + • +
        +
        + E Burnside & SE 8th +
        +
        3. +
      +
      +
      +
      +
      +
      +
      +
      +
      + +
      +
      4. +
    4. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + E Burnside & SE 12th + +
      +
      + 11:08 AM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk to + + East Burnside Street + + + + +
      + + + + +
      +
      +
        +
      +
      +       +
      +
      +
      + +
      +
      5. +
    5. +
      +
      +
      +
      +
      + + + Travel by car + + + + + + +
      +
      +
      +
      +
      + + East Burnside Street + +
      +
      + 11:09 AM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + Wait for pickup +
      +
      +
      + + + + - + + + Ride 0.2 miles to + + 407 NE 12th Ave, Portland + + + + +
      +
      + + Book Ride + +
      +
      +
      +
      + Wait until 11:08 AM to book +
      +
      +
      +
      +
      + Estimated travel time: + 1 min + (does not account for traffic) +
      +
      + Estimated cost: + $17.00 + - + $18.00 +
      +
      +
      +
      +
      + +
      +
      6. +
    6. +
      +
      +
      +
      + +
      +
      +
      +
      +
      + + 407 NE 12th Ave, Portland + +
      +
      + 11:10 AM +
      + + Arrive at + 407 NE 12th Ave, Portland + +
      +
      + +
      +
      7. +
    +`; + +exports[`Storyshots ItineraryBody/otp-ui Two Alert Without Collapsing Prop 1`] = ` + + + +`; + +exports[`Storyshots ItineraryBody/otp-ui Two Alert Without Collapsing Prop 2`] = ` +.c22 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c59 { + color: #f44256; +} + +.c29 { + border-top-style: solid; + border-top-width: 0; + padding-top: 0; + padding-bottom: 10px; +} + +.c16 { + background: transparent; + border: 0; + color: inherit; + cursor: pointer; + font-size: inherit; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c31 { + color: #008; + margin-left: 5px; +} + +.c31:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c6 { + color: black; + background-color: grey; + border: 2px solid #bbb; + text-align: center; + width: 25px; + height: 25px; + font-size: 1.2em; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; +} + +.c34 { + color: black; + background-color: #e9e9e9; + border: 2px solid #bbb; + text-align: center; + width: 25px; + height: 25px; + font-size: 1.2em; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; +} + +.c21::before { + content: ""; + margin: 0 0.125em; +} + +.c58 { + text-align: center; +} + +.c4 { + border-left: dotted 4px grey; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c33 { + border-left: dotted 4px #484848; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c35 { + border-left: solid 8px #084C8D; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c54 { + display: block; + font-size: 13px; + list-style: none; + padding: 0; +} + +.c0 { + list-style: none; + padding: 0; +} + +.c12 { + color: #676767; + font-size: 13px; + padding-bottom: 12px; +} + +.c17 { + bottom: 0; + cursor: pointer; + left: 0; + position: absolute; + right: 0; + top: 0; + width: 100%; + z-index: 1; +} + +.c13 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + line-height: 16px; + min-height: 31px; + position: relative; +} + +.c10 { + display: inline-block; + grid-row-start: 2; + grid-column-start: 1; + height: 0; + overflow: hidden; + width: 0; +} + +.c42 { + font-weight: 200; +} + +.c15 { + font-weight: inherit; +} + +.c41 { + font-size: 13px; + font-weight: 500; +} + +.c40 { + font-weight: 800; + margin-right: 6px; +} + +.c39 { + color: #807373; + margin-top: 5px; +} + +.c14 { + -webkit-flex-shrink: 0; + -ms-flex-negative: 0; + flex-shrink: 0; +} + +.c3 { + position: relative; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); + height: 100%; +} + +.c5 { + width: 30px; + height: 30px; + border-radius: 50%; + position: absolute; + left: 50%; + top: 0; + -webkit-transform: translate(-51%,-10%); + -ms-transform: translate(-51%,-10%); + transform: translate(-51%,-10%); +} + +.c2 { + grid-column-start: 2; + grid-row: span 2; + padding-right: 5px; +} + +.c18 { + display: grid; + grid-template-columns: 130px auto; +} + +.c1 { + max-width: 500px; + display: grid; + grid-template-areas: "time line title" "time line instructions"; + grid-template-columns: 65px 30px auto; +} + +.c9 { + grid-column-start: 1; + grid-row: 1 / span 2; + padding-right: 5px; + font-size: 0.9em; +} + +.c32 { + padding: 3px 10px 3px 10px; + border: 0; + margin-top: -15px; + width: 35px; + height: 35px; +} + +.c32:hover { + cursor: pointer; +} + +.c30 { + -webkit-flex: 0 0 25px; + -ms-flex: 0 0 25px; + flex: 0 0 25px; + grid-column: -1; +} + +.c11 { + grid-row-start: 2; + grid-column-start: 3; + grid-area: instructions; +} + +.c7 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + font-size: 1.2em; + grid-row-start: 1; + grid-column-start: 3; +} + +.c8 { + font-size: inherit; + font-weight: bold; + height: 1.2em; + margin: 0; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + -webkit-flex: 1 1 auto; + -ms-flex: 1 1 auto; + flex: 1 1 auto; + padding: 3px 0 10px 0; +} + +.c36 { + text-align: center; + min-width: 30px; + min-height: 30px; + font-size: 1.2em; + background-color: #084C8D; + color: white; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; + border: 1px solid; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + cursor: default; +} + +.c37 { + position: absolute; + width: 1px; + height: 1px; + padding: 0; + margin: -1px; + overflow: hidden; + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + border: 0; +} + +.c23 { + display: block; + list-style: none; + padding: 0; +} + +.c26 { + margin-left: 24px; + line-height: 1.25em; + padding-top: 1px; +} + +.c26 > span { + margin-right: 1ch; +} + +.c19 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-self: center; + -ms-flex-item-align: center; + align-self: center; + margin-top: 10px; +} + +.c19 a { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c20 { + color: #676767; + font-size: 13px; + font-style: normal; + padding: 0; +} + +.c25 { + fill: #676767; + float: left; + height: 16px; + width: 16px; +} + +.c24 { + font-size: 13px; + margin-top: 8px; + color: #676767; + font-style: normal; +} + +.c27 { + font-weight: 500; +} + +.c28 { + font-weight: 200; + opacity: 0.8975; + padding-left: 1ch; +} + +.c38 { + font-weight: 200; + font-size: 0.9em; + margin-left: 10px; +} + +.c56 { + float: left; + margin-left: -36px; + color: #fff; +} + +.c57 { + color: #676767; + margin-top: 3px; +} + +.c55 { + z-index: 30; + position: relative; +} + +.c45 { + background-color: #eee; + border-radius: 4px; + color: #000; + display: block; + margin-top: 5px; + padding: 8px; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c49 { + -webkit-align-items: baseline; + -webkit-box-align: baseline; + -ms-flex-align: baseline; + align-items: baseline; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + gap: 5px; + margin-top: 0.5em; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c49:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c47 { + font-size: 12px; + margin-left: 30px; + white-space: pre-wrap; +} + +.c48 { + margin-top: 5px; + margin-left: 30px; + font-size: 12px; + font-style: italic; +} + +.c46 { + float: left; + font-size: 18px; +} + +.c44 { + display: block; + margin-top: 3px; + padding: 0; +} + +.c43 { + color: #d14727; + cursor: auto; + display: inline-block; + font-weight: 400; + margin-top: 8px; + padding: 0; +} + +.c50 { + margin-top: 5px; +} + +.c51 { + color: #676767; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; +} + +.c53 { + font-size: 14px; +} + +.c52 { + padding: 0; +} + +
      +
    1. +
      +
      +
      +
      +
      + + + Travel by car + + + + +
      +
      +
      +
      +
      + + 330 SW Murray Blvd, Washington County, OR, USA 97005 + +
      +
      + 3:50 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Drive 2.4 miles to + + P+R Sunset TC + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + SOUTHWEST + on + + parking aisle + + + 158 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + RIGHT + on + + SW Murray Blvd + + + 0.2 miles + + +
        +
        3. +
      3. +
        + + + +
        +
        + + CONTINUE + on + + NW Murray Blvd + + + 150 feet + + +
        +
        4. +
      4. +
        + + + +
        +
        + + SLIGHTLY_RIGHT + on + + NW Murray Blvd + + + 0.4 miles + + +
        +
        5. +
      5. +
        + + + +
        +
        + + CONTINUE + on + + NW Sunset Hwy + + + 0.6 miles + + +
        +
        6. +
      6. +
        + + + +
        +
        + + CONTINUE + on + + NW Sunset Hwy + + + 0.3 miles + + +
        +
        7. +
      7. +
        + + + +
        +
        + + LEFT + on + + SW Cedar Hills Blvd + + + 0.2 miles + + +
        +
        8. +
      8. +
        + + + +
        +
        + + RIGHT + on + + SW Barnes Rd + + + 0.5 miles + + +
        +
        9. +
      9. +
        + + + +
        +
        + + RIGHT + on + + service road + + + 0.2 miles + + +
        +
        10. +
      10. +
        + + + +
        +
        + + RIGHT + on + + Sunset TC + + + 76 feet + + +
        +
        11. +
      +
      +
      +       +
      +
      +
      + +
      +
      2. +
    2. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + P+R Sunset TC + +
      +
      + 4:02 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 426 feet to + + Sunset TC MAX Station + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + SLIGHTLY_RIGHT + on + + Unnamed Path + + + 16 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + LEFT + on + + steps + + + 232 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + LEFT + on + + Unnamed Path + + + 19 feet + + +
        +
        4. +
      4. +
        + + + +
        +
        + + RIGHT + on + + Sunset TC (path) + + + 159 feet + + +
        +
        5. +
      +
      +
      +       +
      +
      +
      + +
      +
      3. +
    3. +
      +
      +
      +
      +
      + + MA + + + MAX Blue Line + +
      +
      +
      +
      +
      + + Sunset TC MAX Station + + ID 9969 + + +
      +
      + 4:05 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + Ride + + +
      + + MAX Blue Line + +
      + + + MAX Blue Line + + to + + Gresham + + +       + + - + Disembark at + Oak/ SW 1st Ave MAX Station + + ID 8337 + + +       + +       +
      +
      +
      + + + 2 alerts +
      +
      +
      + +
      +
      +
      +
      + +
      +
      +
      +
      +
        +
      1. +
        + • +
        +
        + Washington Park MAX Station +
        +
        2. +
      2. +
        + • +
        +
        + Goose Hollow/SW Jefferson St MAX Station +
        +
        3. +
      3. +
        + • +
        +
        + Kings Hill/SW Salmon St MAX Station +
        +
        4. +
      4. +
        + • +
        +
        + Providence Park MAX Station +
        +
        5. +
      5. +
        + • +
        +
        + Library/SW 9th Ave MAX Station +
        +
        6. +
      6. +
        + • +
        +
        + Pioneer Square South MAX Station +
        +
        7. +
      7. +
        + • +
        +
        + Mall/SW 4th Ave MAX Station +
        +
        8. +
      8. +
        + • +
        +
        + Yamhill District MAX Station +
        +
        9. +
      +
      +
      +
      +
      +
      +
      +
      +
      + +
      +
      4. +
    4. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + Oak/ SW 1st Ave MAX Station + + ID 8337 + + +
      +
      + 4:27 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 0.1 miles to + + 205 SW Pine St, Portland, OR, USA 97204 + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + NORTHEAST + on + + Oak/SW 1st Ave (path) + + + 13 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + CONTINUE + on + + Unnamed Path + + + 27 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + LEFT + on + + SW Oak St + + + 37 feet + + +
        +
        4. +
      4. +
        + + + +
        +
        + + RIGHT + on + + SW 1st Ave + + + 260 feet + + +
        +
        5. +
      5. +
        + + + +
        +
        + + LEFT + on + + SW Pine St + + + 337 feet + + +
        +
        6. +
      +
      +
      +       +
      +
      +
      + +
      +
      5. +
    5. +
      +
      +
      +
      + +
      +
      +
      +
      +
      + + 205 SW Pine St, Portland, OR, USA 97204 + +
      +
      + 4:29 PM +
      + + Arrive at + 205 SW Pine St, Portland, OR, USA 97204 + +
      +
      + +
      +
      6. +
    +`; + +exports[`Storyshots ItineraryBody/otp-ui Two Alerts Always Collapsing 1`] = ` + + + +`; + +exports[`Storyshots ItineraryBody/otp-ui Two Alerts Always Collapsing 2`] = ` +.c22 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c59 { + color: #f44256; +} + +.c29 { + border-top-style: solid; + border-top-width: 0; + padding-top: 0; + padding-bottom: 10px; +} + +.c16 { + background: transparent; + border: 0; + color: inherit; + cursor: pointer; + font-size: inherit; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c31 { + color: #008; + margin-left: 5px; +} + +.c31:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c6 { + color: black; + background-color: grey; + border: 2px solid #bbb; + text-align: center; + width: 25px; + height: 25px; + font-size: 1.2em; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; +} + +.c34 { + color: black; + background-color: #e9e9e9; + border: 2px solid #bbb; + text-align: center; + width: 25px; + height: 25px; + font-size: 1.2em; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; +} + +.c21::before { + content: ""; + margin: 0 0.125em; +} + +.c58 { + text-align: center; +} + +.c4 { + border-left: dotted 4px grey; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c33 { + border-left: dotted 4px #484848; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c35 { + border-left: solid 8px #084C8D; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c54 { + display: block; + font-size: 13px; + list-style: none; + padding: 0; +} + +.c0 { + list-style: none; + padding: 0; +} + +.c12 { + color: #676767; + font-size: 13px; + padding-bottom: 12px; +} + +.c17 { + bottom: 0; + cursor: pointer; + left: 0; + position: absolute; + right: 0; + top: 0; + width: 100%; + z-index: 1; +} + +.c13 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + line-height: 16px; + min-height: 31px; + position: relative; +} + +.c10 { + display: inline-block; + grid-row-start: 2; + grid-column-start: 1; + height: 0; + overflow: hidden; + width: 0; +} + +.c42 { + font-weight: 200; +} + +.c15 { + font-weight: inherit; +} + +.c41 { + font-size: 13px; + font-weight: 500; +} + +.c40 { + font-weight: 800; + margin-right: 6px; +} + +.c39 { + color: #807373; + margin-top: 5px; +} + +.c14 { + -webkit-flex-shrink: 0; + -ms-flex-negative: 0; + flex-shrink: 0; +} + +.c3 { + position: relative; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); + height: 100%; +} + +.c5 { + width: 30px; + height: 30px; + border-radius: 50%; + position: absolute; + left: 50%; + top: 0; + -webkit-transform: translate(-51%,-10%); + -ms-transform: translate(-51%,-10%); + transform: translate(-51%,-10%); +} + +.c2 { + grid-column-start: 2; + grid-row: span 2; + padding-right: 5px; +} + +.c18 { + display: grid; + grid-template-columns: 130px auto; +} + +.c1 { + max-width: 500px; + display: grid; + grid-template-areas: "time line title" "time line instructions"; + grid-template-columns: 65px 30px auto; +} + +.c9 { + grid-column-start: 1; + grid-row: 1 / span 2; + padding-right: 5px; + font-size: 0.9em; +} + +.c32 { + padding: 3px 10px 3px 10px; + border: 0; + margin-top: -15px; + width: 35px; + height: 35px; +} + +.c32:hover { + cursor: pointer; +} + +.c30 { + -webkit-flex: 0 0 25px; + -ms-flex: 0 0 25px; + flex: 0 0 25px; + grid-column: -1; +} + +.c11 { + grid-row-start: 2; + grid-column-start: 3; + grid-area: instructions; +} + +.c7 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + font-size: 1.2em; + grid-row-start: 1; + grid-column-start: 3; +} + +.c8 { + font-size: inherit; + font-weight: bold; + height: 1.2em; + margin: 0; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + -webkit-flex: 1 1 auto; + -ms-flex: 1 1 auto; + flex: 1 1 auto; + padding: 3px 0 10px 0; +} + +.c36 { + text-align: center; + min-width: 30px; + min-height: 30px; + font-size: 1.2em; + background-color: #084C8D; + color: white; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; + border: 1px solid; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + cursor: default; +} + +.c37 { + position: absolute; + width: 1px; + height: 1px; + padding: 0; + margin: -1px; + overflow: hidden; + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + border: 0; +} + +.c23 { + display: block; + list-style: none; + padding: 0; +} + +.c26 { + margin-left: 24px; + line-height: 1.25em; + padding-top: 1px; +} + +.c26 > span { + margin-right: 1ch; +} + +.c19 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-self: center; + -ms-flex-item-align: center; + align-self: center; + margin-top: 10px; +} + +.c19 a { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c20 { + color: #676767; + font-size: 13px; + font-style: normal; + padding: 0; +} + +.c25 { + fill: #676767; + float: left; + height: 16px; + width: 16px; +} + +.c24 { + font-size: 13px; + margin-top: 8px; + color: #676767; + font-style: normal; +} + +.c27 { + font-weight: 500; +} + +.c28 { + font-weight: 200; + opacity: 0.8975; + padding-left: 1ch; +} + +.c38 { + font-weight: 200; + font-size: 0.9em; + margin-left: 10px; +} + +.c56 { + float: left; + margin-left: -36px; + color: #fff; +} + +.c57 { + color: #676767; + margin-top: 3px; +} + +.c55 { + z-index: 30; + position: relative; +} + +.c45 { + background-color: #eee; + border-radius: 4px; + color: #000; + display: block; + margin-top: 5px; + padding: 8px; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c49 { + -webkit-align-items: baseline; + -webkit-box-align: baseline; + -ms-flex-align: baseline; + align-items: baseline; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + gap: 5px; + margin-top: 0.5em; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c49:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c47 { + font-size: 12px; + margin-left: 30px; + white-space: pre-wrap; +} + +.c48 { + margin-top: 5px; + margin-left: 30px; + font-size: 12px; + font-style: italic; +} + +.c46 { + float: left; + font-size: 18px; +} + +.c44 { + display: block; + margin-top: 3px; + padding: 0; +} + +.c43 { + color: #d14727; + cursor: cursor; + display: inline-block; + font-weight: 400; + margin-top: 8px; + padding: 0; +} + +.c50 { + margin-top: 5px; +} + +.c51 { + color: #676767; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; +} + +.c53 { + font-size: 14px; +} + +.c52 { + padding: 0; +} + +
      +
    1. +
      +
      +
      +
      +
      + + + Travel by car + + + + +
      +
      +
      +
      +
      + + 330 SW Murray Blvd, Washington County, OR, USA 97005 + +
      +
      + 3:50 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Drive 2.4 miles to + + P+R Sunset TC + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + SOUTHWEST + on + + parking aisle + + + 158 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + RIGHT + on + + SW Murray Blvd + + + 0.2 miles + + +
        +
        3. +
      3. +
        + + + +
        +
        + + CONTINUE + on + + NW Murray Blvd + + + 150 feet + + +
        +
        4. +
      4. +
        + + + +
        +
        + + SLIGHTLY_RIGHT + on + + NW Murray Blvd + + + 0.4 miles + + +
        +
        5. +
      5. +
        + + + +
        +
        + + CONTINUE + on + + NW Sunset Hwy + + + 0.6 miles + + +
        +
        6. +
      6. +
        + + + +
        +
        + + CONTINUE + on + + NW Sunset Hwy + + + 0.3 miles + + +
        +
        7. +
      7. +
        + + + +
        +
        + + LEFT + on + + SW Cedar Hills Blvd + + + 0.2 miles + + +
        +
        8. +
      8. +
        + + + +
        +
        + + RIGHT + on + + SW Barnes Rd + + + 0.5 miles + + +
        +
        9. +
      9. +
        + + + +
        +
        + + RIGHT + on + + service road + + + 0.2 miles + + +
        +
        10. +
      10. +
        + + + +
        +
        + + RIGHT + on + + Sunset TC + + + 76 feet + + +
        +
        11. +
      +
      +
      +       +
      +
      +
      + +
      +
      2. +
    2. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + P+R Sunset TC + +
      +
      + 4:02 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 426 feet to + + Sunset TC MAX Station + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + SLIGHTLY_RIGHT + on + + Unnamed Path + + + 16 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + LEFT + on + + steps + + + 232 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + LEFT + on + + Unnamed Path + + + 19 feet + + +
        +
        4. +
      4. +
        + + + +
        +
        + + RIGHT + on + + Sunset TC (path) + + + 159 feet + + +
        +
        5. +
      +
      +
      +       +
      +
      +
      + +
      +
      3. +
    3. +
      +
      +
      +
      +
      + + MA + + + MAX Blue Line + +
      +
      +
      +
      +
      + + Sunset TC MAX Station + + ID 9969 + + +
      +
      + 4:05 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + Ride + + +
      + + MAX Blue Line + +
      + + + MAX Blue Line + + to + + Gresham + + +       + + - + Disembark at + Oak/ SW 1st Ave MAX Station + + ID 8337 + + +       + +       +
      +
      + +
      +
      + +
      +
      +
      +
      + +
      +
      +
      +
      +
        +
      1. +
        + • +
        +
        + Washington Park MAX Station +
        +
        2. +
      2. +
        + • +
        +
        + Goose Hollow/SW Jefferson St MAX Station +
        +
        3. +
      3. +
        + • +
        +
        + Kings Hill/SW Salmon St MAX Station +
        +
        4. +
      4. +
        + • +
        +
        + Providence Park MAX Station +
        +
        5. +
      5. +
        + • +
        +
        + Library/SW 9th Ave MAX Station +
        +
        6. +
      6. +
        + • +
        +
        + Pioneer Square South MAX Station +
        +
        7. +
      7. +
        + • +
        +
        + Mall/SW 4th Ave MAX Station +
        +
        8. +
      8. +
        + • +
        +
        + Yamhill District MAX Station +
        +
        9. +
      +
      +
      +
      +
      +
      +
      +
      +
      + +
      +
      4. +
    4. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + Oak/ SW 1st Ave MAX Station + + ID 8337 + + +
      +
      + 4:27 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 0.1 miles to + + 205 SW Pine St, Portland, OR, USA 97204 + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + NORTHEAST + on + + Oak/SW 1st Ave (path) + + + 13 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + CONTINUE + on + + Unnamed Path + + + 27 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + LEFT + on + + SW Oak St + + + 37 feet + + +
        +
        4. +
      4. +
        + + + +
        +
        + + RIGHT + on + + SW 1st Ave + + + 260 feet + + +
        +
        5. +
      5. +
        + + + +
        +
        + + LEFT + on + + SW Pine St + + + 337 feet + + +
        +
        6. +
      +
      +
      +       +
      +
      +
      + +
      +
      5. +
    5. +
      +
      +
      +
      + +
      +
      +
      +
      +
      + + 205 SW Pine St, Portland, OR, USA 97204 + +
      +
      + 4:29 PM +
      + + Arrive at + 205 SW Pine St, Portland, OR, USA 97204 + +
      +
      + +
      +
      6. +
    +`; + +exports[`Storyshots ItineraryBody/otp-ui Two Alerts Not Always Collapsing 1`] = ` + + + +`; + +exports[`Storyshots ItineraryBody/otp-ui Two Alerts Not Always Collapsing 2`] = ` +.c22 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c59 { + color: #f44256; +} + +.c29 { + border-top-style: solid; + border-top-width: 0; + padding-top: 0; + padding-bottom: 10px; +} + +.c16 { + background: transparent; + border: 0; + color: inherit; + cursor: pointer; + font-size: inherit; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c31 { + color: #008; + margin-left: 5px; +} + +.c31:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c6 { + color: black; + background-color: grey; + border: 2px solid #bbb; + text-align: center; + width: 25px; + height: 25px; + font-size: 1.2em; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; +} + +.c34 { + color: black; + background-color: #e9e9e9; + border: 2px solid #bbb; + text-align: center; + width: 25px; + height: 25px; + font-size: 1.2em; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; +} + +.c21::before { + content: ""; + margin: 0 0.125em; +} + +.c58 { + text-align: center; +} + +.c4 { + border-left: dotted 4px grey; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c33 { + border-left: dotted 4px #484848; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c35 { + border-left: solid 8px #084C8D; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c54 { + display: block; + font-size: 13px; + list-style: none; + padding: 0; +} + +.c0 { + list-style: none; + padding: 0; +} + +.c12 { + color: #676767; + font-size: 13px; + padding-bottom: 12px; +} + +.c17 { + bottom: 0; + cursor: pointer; + left: 0; + position: absolute; + right: 0; + top: 0; + width: 100%; + z-index: 1; +} + +.c13 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + line-height: 16px; + min-height: 31px; + position: relative; +} + +.c10 { + display: inline-block; + grid-row-start: 2; + grid-column-start: 1; + height: 0; + overflow: hidden; + width: 0; +} + +.c42 { + font-weight: 200; +} + +.c15 { + font-weight: inherit; +} + +.c41 { + font-size: 13px; + font-weight: 500; +} + +.c40 { + font-weight: 800; + margin-right: 6px; +} + +.c39 { + color: #807373; + margin-top: 5px; +} + +.c14 { + -webkit-flex-shrink: 0; + -ms-flex-negative: 0; + flex-shrink: 0; +} + +.c3 { + position: relative; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); + height: 100%; +} + +.c5 { + width: 30px; + height: 30px; + border-radius: 50%; + position: absolute; + left: 50%; + top: 0; + -webkit-transform: translate(-51%,-10%); + -ms-transform: translate(-51%,-10%); + transform: translate(-51%,-10%); +} + +.c2 { + grid-column-start: 2; + grid-row: span 2; + padding-right: 5px; +} + +.c18 { + display: grid; + grid-template-columns: 130px auto; +} + +.c1 { + max-width: 500px; + display: grid; + grid-template-areas: "time line title" "time line instructions"; + grid-template-columns: 65px 30px auto; +} + +.c9 { + grid-column-start: 1; + grid-row: 1 / span 2; + padding-right: 5px; + font-size: 0.9em; +} + +.c32 { + padding: 3px 10px 3px 10px; + border: 0; + margin-top: -15px; + width: 35px; + height: 35px; +} + +.c32:hover { + cursor: pointer; +} + +.c30 { + -webkit-flex: 0 0 25px; + -ms-flex: 0 0 25px; + flex: 0 0 25px; + grid-column: -1; +} + +.c11 { + grid-row-start: 2; + grid-column-start: 3; + grid-area: instructions; +} + +.c7 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + font-size: 1.2em; + grid-row-start: 1; + grid-column-start: 3; +} + +.c8 { + font-size: inherit; + font-weight: bold; + height: 1.2em; + margin: 0; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + -webkit-flex: 1 1 auto; + -ms-flex: 1 1 auto; + flex: 1 1 auto; + padding: 3px 0 10px 0; +} + +.c36 { + text-align: center; + min-width: 30px; + min-height: 30px; + font-size: 1.2em; + background-color: #084C8D; + color: white; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; + border: 1px solid; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + cursor: default; +} + +.c37 { + position: absolute; + width: 1px; + height: 1px; + padding: 0; + margin: -1px; + overflow: hidden; + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + border: 0; +} + +.c23 { + display: block; + list-style: none; + padding: 0; +} + +.c26 { + margin-left: 24px; + line-height: 1.25em; + padding-top: 1px; +} + +.c26 > span { + margin-right: 1ch; +} + +.c19 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-self: center; + -ms-flex-item-align: center; + align-self: center; + margin-top: 10px; +} + +.c19 a { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c20 { + color: #676767; + font-size: 13px; + font-style: normal; + padding: 0; +} + +.c25 { + fill: #676767; + float: left; + height: 16px; + width: 16px; +} + +.c24 { + font-size: 13px; + margin-top: 8px; + color: #676767; + font-style: normal; +} + +.c27 { + font-weight: 500; +} + +.c28 { + font-weight: 200; + opacity: 0.8975; + padding-left: 1ch; +} + +.c38 { + font-weight: 200; + font-size: 0.9em; + margin-left: 10px; +} + +.c56 { + float: left; + margin-left: -36px; + color: #fff; +} + +.c57 { + color: #676767; + margin-top: 3px; +} + +.c55 { + z-index: 30; + position: relative; +} + +.c45 { + background-color: #eee; + border-radius: 4px; + color: #000; + display: block; + margin-top: 5px; + padding: 8px; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c49 { + -webkit-align-items: baseline; + -webkit-box-align: baseline; + -ms-flex-align: baseline; + align-items: baseline; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + gap: 5px; + margin-top: 0.5em; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c49:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c47 { + font-size: 12px; + margin-left: 30px; + white-space: pre-wrap; +} + +.c48 { + margin-top: 5px; + margin-left: 30px; + font-size: 12px; + font-style: italic; +} + +.c46 { + float: left; + font-size: 18px; +} + +.c44 { + display: block; + margin-top: 3px; + padding: 0; +} + +.c43 { + color: #d14727; + cursor: auto; + display: inline-block; + font-weight: 400; + margin-top: 8px; + padding: 0; +} + +.c50 { + margin-top: 5px; +} + +.c51 { + color: #676767; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; +} + +.c53 { + font-size: 14px; +} + +.c52 { + padding: 0; +} + +
      +
    1. +
      +
      +
      +
      +
      + + + Travel by car + + + + +
      +
      +
      +
      +
      + + 330 SW Murray Blvd, Washington County, OR, USA 97005 + +
      +
      + 3:50 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Drive 2.4 miles to + + P+R Sunset TC + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + SOUTHWEST + on + + parking aisle + + + 158 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + RIGHT + on + + SW Murray Blvd + + + 0.2 miles + + +
        +
        3. +
      3. +
        + + + +
        +
        + + CONTINUE + on + + NW Murray Blvd + + + 150 feet + + +
        +
        4. +
      4. +
        + + + +
        +
        + + SLIGHTLY_RIGHT + on + + NW Murray Blvd + + + 0.4 miles + + +
        +
        5. +
      5. +
        + + + +
        +
        + + CONTINUE + on + + NW Sunset Hwy + + + 0.6 miles + + +
        +
        6. +
      6. +
        + + + +
        +
        + + CONTINUE + on + + NW Sunset Hwy + + + 0.3 miles + + +
        +
        7. +
      7. +
        + + + +
        +
        + + LEFT + on + + SW Cedar Hills Blvd + + + 0.2 miles + + +
        +
        8. +
      8. +
        + + + +
        +
        + + RIGHT + on + + SW Barnes Rd + + + 0.5 miles + + +
        +
        9. +
      9. +
        + + + +
        +
        + + RIGHT + on + + service road + + + 0.2 miles + + +
        +
        10. +
      10. +
        + + + +
        +
        + + RIGHT + on + + Sunset TC + + + 76 feet + + +
        +
        11. +
      +
      +
      +       +
      +
      +
      + +
      +
      2. +
    2. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + P+R Sunset TC + +
      +
      + 4:02 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 426 feet to + + Sunset TC MAX Station + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + SLIGHTLY_RIGHT + on + + Unnamed Path + + + 16 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + LEFT + on + + steps + + + 232 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + LEFT + on + + Unnamed Path + + + 19 feet + + +
        +
        4. +
      4. +
        + + + +
        +
        + + RIGHT + on + + Sunset TC (path) + + + 159 feet + + +
        +
        5. +
      +
      +
      +       +
      +
      +
      + +
      +
      3. +
    3. +
      +
      +
      +
      +
      + + MA + + + MAX Blue Line + +
      +
      +
      +
      +
      + + Sunset TC MAX Station + + ID 9969 + + +
      +
      + 4:05 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + Ride + + +
      + + MAX Blue Line + +
      + + + MAX Blue Line + + to + + Gresham + + +       + + - + Disembark at + Oak/ SW 1st Ave MAX Station + + ID 8337 + + +       + +       +
      +
      +
      + + + 2 alerts +
      +
      +
      + +
      +
      +
      +
      + +
      +
      +
      +
      +
        +
      1. +
        + • +
        +
        + Washington Park MAX Station +
        +
        2. +
      2. +
        + • +
        +
        + Goose Hollow/SW Jefferson St MAX Station +
        +
        3. +
      3. +
        + • +
        +
        + Kings Hill/SW Salmon St MAX Station +
        +
        4. +
      4. +
        + • +
        +
        + Providence Park MAX Station +
        +
        5. +
      5. +
        + • +
        +
        + Library/SW 9th Ave MAX Station +
        +
        6. +
      6. +
        + • +
        +
        + Pioneer Square South MAX Station +
        +
        7. +
      7. +
        + • +
        +
        + Mall/SW 4th Ave MAX Station +
        +
        8. +
      8. +
        + • +
        +
        + Yamhill District MAX Station +
        +
        9. +
      +
      +
      +
      +
      +
      +
      +
      +
      + +
      +
      4. +
    4. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + Oak/ SW 1st Ave MAX Station + + ID 8337 + + +
      +
      + 4:27 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 0.1 miles to + + 205 SW Pine St, Portland, OR, USA 97204 + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + NORTHEAST + on + + Oak/SW 1st Ave (path) + + + 13 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + CONTINUE + on + + Unnamed Path + + + 27 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + LEFT + on + + SW Oak St + + + 37 feet + + +
        +
        4. +
      4. +
        + + + +
        +
        + + RIGHT + on + + SW 1st Ave + + + 260 feet + + +
        +
        5. +
      5. +
        + + + +
        +
        + + LEFT + on + + SW Pine St + + + 337 feet + + +
        +
        6. +
      +
      +
      +       +
      +
      +
      + +
      +
      5. +
    5. +
      +
      +
      +
      + +
      +
      +
      +
      +
      + + 205 SW Pine St, Portland, OR, USA 97204 + +
      +
      + 4:29 PM +
      + + Arrive at + 205 SW Pine St, Portland, OR, USA 97204 + +
      +
      + +
      +
      6. +
    +`; + +exports[`Storyshots ItineraryBody/otp-ui Walk Interlined Transit Itinerary 1`] = ` + + + +`; + +exports[`Storyshots ItineraryBody/otp-ui Walk Interlined Transit Itinerary 2`] = ` +.c22 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c51 { + color: #f44256; +} + +.c29 { + border-top-style: solid; + border-top-width: 0; + padding-top: 0; + padding-bottom: 10px; +} + +.c16 { + background: transparent; + border: 0; + color: inherit; + cursor: pointer; + font-size: inherit; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c31 { + color: #008; + margin-left: 5px; +} + +.c31:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c6 { + color: black; + background-color: #e9e9e9; + border: 2px solid #bbb; + text-align: center; + width: 25px; + height: 25px; + font-size: 1.2em; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; +} + +.c21::before { + content: ""; + margin: 0 0.125em; +} + +.c50 { + text-align: center; +} + +.c4 { + border-left: dotted 4px #484848; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c33 { + border-left: solid 8px #0070c0; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c48 { + border-left: solid 8px #008ab0; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c44 { + display: block; + font-size: 13px; + list-style: none; + padding: 0; +} + +.c0 { + list-style: none; + padding: 0; +} + +.c12 { + color: #676767; + font-size: 13px; + padding-bottom: 12px; +} + +.c17 { + bottom: 0; + cursor: pointer; + left: 0; + position: absolute; + right: 0; + top: 0; + width: 100%; + z-index: 1; +} + +.c13 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + line-height: 16px; + min-height: 31px; + position: relative; +} + +.c10 { + display: inline-block; + grid-row-start: 2; + grid-column-start: 1; + height: 0; + overflow: hidden; + width: 0; +} + +.c15 { + font-weight: inherit; +} + +.c39 { + font-size: 13px; + font-weight: 500; +} + +.c38 { + font-weight: 800; + margin-right: 6px; +} + +.c37 { + color: #807373; + margin-top: 5px; +} + +.c14 { + -webkit-flex-shrink: 0; + -ms-flex-negative: 0; + flex-shrink: 0; +} + +.c3 { + position: relative; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); + height: 100%; +} + +.c5 { + width: 30px; + height: 30px; + border-radius: 50%; + position: absolute; + left: 50%; + top: 0; + -webkit-transform: translate(-51%,-10%); + -ms-transform: translate(-51%,-10%); + transform: translate(-51%,-10%); +} + +.c2 { + grid-column-start: 2; + grid-row: span 2; + padding-right: 5px; +} + +.c18 { + display: grid; + grid-template-columns: 130px auto; +} + +.c1 { + max-width: 500px; + display: grid; + grid-template-areas: "time line title" "time line instructions"; + grid-template-columns: 65px 30px auto; +} + +.c9 { + grid-column-start: 1; + grid-row: 1 / span 2; + padding-right: 5px; + font-size: 0.9em; +} + +.c32 { + padding: 3px 10px 3px 10px; + border: 0; + margin-top: -15px; + width: 35px; + height: 35px; +} + +.c32:hover { + cursor: pointer; +} + +.c30 { + -webkit-flex: 0 0 25px; + -ms-flex: 0 0 25px; + flex: 0 0 25px; + grid-column: -1; +} + +.c11 { + grid-row-start: 2; + grid-column-start: 3; + grid-area: instructions; +} + +.c7 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + font-size: 1.2em; + grid-row-start: 1; + grid-column-start: 3; +} + +.c8 { + font-size: inherit; + font-weight: bold; + height: 1.2em; + margin: 0; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + -webkit-flex: 1 1 auto; + -ms-flex: 1 1 auto; + flex: 1 1 auto; + padding: 3px 0 10px 0; +} + +.c34 { + text-align: center; + min-width: 30px; + min-height: 30px; + font-size: 1.2em; + background-color: #0070c0; + color: white; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; + border: 1px solid; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + cursor: default; +} + +.c49 { + text-align: center; + min-width: 30px; + min-height: 30px; + font-size: 1.2em; + background-color: #084c8d; + color: white; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; + border: 1px solid; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + cursor: default; +} + +.c35 { + position: absolute; + width: 1px; + height: 1px; + padding: 0; + margin: -1px; + overflow: hidden; + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + border: 0; +} + +.c23 { + display: block; + list-style: none; + padding: 0; +} + +.c26 { + margin-left: 24px; + line-height: 1.25em; + padding-top: 1px; +} + +.c26 > span { + margin-right: 1ch; +} + +.c19 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-self: center; + -ms-flex-item-align: center; + align-self: center; + margin-top: 10px; +} + +.c19 a { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c20 { + color: #676767; + font-size: 13px; + font-style: normal; + padding: 0; +} + +.c25 { + fill: #676767; + float: left; + height: 16px; + width: 16px; +} + +.c24 { + font-size: 13px; + margin-top: 8px; + color: #676767; + font-style: normal; +} + +.c27 { + font-weight: 500; +} + +.c28 { + font-weight: 200; + opacity: 0.8975; + padding-left: 1ch; +} + +.c36 { + font-weight: 200; + font-size: 0.9em; + margin-left: 10px; +} + +.c46 { + float: left; + margin-left: -36px; + color: #fff; +} + +.c47 { + color: #676767; + margin-top: 3px; +} + +.c45 { + z-index: 30; + position: relative; +} + +.c40 { + margin-top: 5px; +} + +.c41 { + color: #676767; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; +} + +.c43 { + font-size: 14px; +} + +.c42 { + padding: 0; +} + +
      +
    1. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + 47.97767, -122.20034 + +
      +
      + 12:57 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 0.3 miles to + + Everett Station Bay C1 + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + SOUTH + on + + service road + + + 0.1 miles + + +
        +
        2. +
      2. +
        + + + +
        +
        + + RIGHT + on + + Smith Avenue + + + 129 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + CONTINUE + on + + Paine Avenue + + + 61 feet + + +
        +
        4. +
      4. +
        + + + +
        +
        + + LEFT + on + + 32nd Street + + + 67 feet + + +
        +
        5. +
      5. +
        + + + +
        +
        + + RIGHT + on + + 32nd Street + + + 313 feet + + +
        +
        6. +
      6. +
        + + + +
        +
        + + LEFT + on + + Unnamed Path + + + 380 feet + + +
        +
        7. +
      +
      +
      +       +
      +
      +
      + +
      +
      2. +
    2. +
      +
      +
      +
      +
      + + 51 + + + Everett - Northgate Station + +
      +
      +
      +
      +
      + + Everett Station Bay C1 + + ID 2345 + + +
      +
      + 1:04 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + Ride + + +
      + + 512 + +
      + + + Northgate Station + + +       + + - + Disembark at + Northgate Station + + ID 2191 + + +       + +       +
      +
      +
      +
      +
      +
      +
      + +
      +
      +
      +
      +
        +
      1. +
        + • +
        +
        + Broadway & 34th St +
        +
        2. +
      2. +
        + • +
        +
        + South Everett Fwy Station Bay 3 +
        +
        3. +
      3. +
        + • +
        +
        + Ash Way Park & Ride Bay 1 +
        +
        4. +
      4. +
        + • +
        +
        + Lynnwood Transit Center Bay D3 +
        +
        5. +
      5. +
        + • +
        +
        + Mountlake Terrace Fwy Station Bay 6 +
        +
        6. +
      +
      +
      +
      +
      +
      +
      +
      +
      + +
      +
      3. +
    3. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + Northgate Station + + ID 2191 + + +
      +
      + 1:51 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk to + + Northgate Station - Bay 4 + + + + +
      + + + + +
      +
      +
        +
      +
      +       +
      +
      +
      + +
      +
      4. +
    4. +
      +
      +
      +
      +
      + + 40 + + + + +
      +
      +
      +
      +
      + + Northgate Station - Bay 4 + + ID 35318 + + +
      +
      + 1:55 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + Ride + + +
      + + 40 + +
      + + + Downtown Seattle Ballard + + +       + + - + Disembark at + N 105th St & Aurora Ave N + + ID 40032 + + +       + +       +
      +
      +
      +
      +
      +
      +
      + +
      +
      +
      +
      +
        +
      1. +
        + • +
        +
        + 1st Ave NE & NE 95th St +
        +
        2. +
      2. +
        + • +
        +
        + N 92nd St & Corliss Ave N +
        +
        3. +
      3. +
        + • +
        +
        + College Way N & N 97th St +
        +
        4. +
      4. +
        + • +
        +
        + College Way N & N 103rd St +
        +
        5. +
      5. +
        + • +
        +
        + Meridian Ave N & N 105th St +
        +
        6. +
      6. +
        + • +
        +
        + N Northgate Way & Meridian Ave N +
        +
        7. +
      7. +
        + • +
        +
        + N Northgate Way & Stone Ave N +
        +
        8. +
      +
      +
      +
      +
      +
      +
      +
      +
      + +
      +
      5. +
    5. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + N 105th St & Aurora Ave N + + ID 40032 + + +
      +
      + 2:06 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 259 feet to + + Aurora Ave N & N 105th St + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + EAST + on + + North 105th Street + + + 64 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + RIGHT + on + + service road + + + 14 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + LEFT + on + + Unnamed Path + + + 180 feet + + +
        +
        4. +
      +
      +
      +       +
      +
      +
      + +
      +
      6. +
    6. +
      +
      +
      +
      +
      + + E + + + + +
      +
      +
      +
      +
      + + Aurora Ave N & N 105th St + + ID 7080 + + +
      +
      + 2:07 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + Ride + + +
      + + E Line + +
      + + + Downtown Seattle + + +       + + - + Disembark at + 3rd Ave & Cherry St + + ID 490 + + +       + +       +
      +
      +
      +
      +
      +
      +
      + +
      +
      +
      +
      +
        +
      1. +
        + • +
        +
        + Aurora Ave N & N 100th St +
        +
        2. +
      2. +
        + • +
        +
        + Aurora Ave N & N 95th St +
        +
        3. +
      3. +
        + • +
        +
        + Aurora Ave N & N 90th St +
        +
        4. +
      4. +
        + • +
        +
        + Aurora Ave N & N 85th St +
        +
        5. +
      5. +
        + • +
        +
        + Aurora Ave N & N 80th St +
        +
        6. +
      6. +
        + • +
        +
        + Aurora Ave N & N 76th St +
        +
        7. +
      7. +
        + • +
        +
        + Aurora Ave N & N 65th St +
        +
        8. +
      8. +
        + • +
        +
        + Aurora Ave N & N 46th St +
        +
        9. +
      9. +
        + • +
        +
        + Aurora Ave N & Lynn St +
        +
        10. +
      10. +
        + • +
        +
        + Aurora Ave N & Galer St +
        +
        11. +
      11. +
        + • +
        +
        + 7th Ave N & Thomas St +
        +
        12. +
      12. +
        + • +
        +
        + Wall St & 5th Ave +
        +
        13. +
      13. +
        + • +
        +
        + 3rd Ave & Bell St +
        +
        14. +
      14. +
        + • +
        +
        + 3rd Ave & Virginia St +
        +
        15. +
      15. +
        + • +
        +
        + 3rd Ave & Pike St +
        +
        16. +
      16. +
        + • +
        +
        + 3rd Ave & Seneca St +
        +
        17. +
      +
      +
      +
      +
      +
      +
      +
      +
      + +
      +
      7. +
    7. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + 3rd Ave & Cherry St + + ID 490 + + +
      +
      + 2:39 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 443 feet to + + 208 James St, Seattle, WA 98104-2212, United States + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + SOUTHEAST + on + + sidewalk + + + 326 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + UTURN_RIGHT + on + + sidewalk + + + 117 feet + + +
        +
        3. +
      +
      +
      +       +
      +
      +
      + +
      +
      8. +
    8. +
      +
      +
      +
      + +
      +
      +
      +
      +
      + + 208 James St, Seattle, WA 98104-2212, United States + +
      +
      + 2:41 PM +
      + + Arrive at + 208 James St, Seattle, WA 98104-2212, United States + +
      +
      + +
      +
      9. +
    +`; + +exports[`Storyshots ItineraryBody/otp-ui Walk Only Itinerary 1`] = ` + + + +`; + +exports[`Storyshots ItineraryBody/otp-ui Walk Only Itinerary 2`] = ` +.c22 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c33 { + color: #f44256; +} + +.c28 { + border-top-style: solid; + border-top-width: 0; + padding-top: 0; + padding-bottom: 10px; +} + +.c16 { + background: transparent; + border: 0; + color: inherit; + cursor: pointer; + font-size: inherit; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c30 { + color: #008; + margin-left: 5px; +} + +.c30:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c6 { + color: black; + background-color: #e9e9e9; + border: 2px solid #bbb; + text-align: center; + width: 25px; + height: 25px; + font-size: 1.2em; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; +} + +.c21::before { + content: ""; + margin: 0 0.125em; +} + +.c32 { + text-align: center; +} + +.c4 { + border-left: dotted 4px #484848; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c0 { + list-style: none; + padding: 0; +} + +.c12 { + color: #676767; + font-size: 13px; + padding-bottom: 12px; +} + +.c17 { + bottom: 0; + cursor: pointer; + left: 0; + position: absolute; + right: 0; + top: 0; + width: 100%; + z-index: 1; +} + +.c13 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + line-height: 16px; + min-height: 31px; + position: relative; +} + +.c10 { + display: inline-block; + grid-row-start: 2; + grid-column-start: 1; + height: 0; + overflow: hidden; + width: 0; +} + +.c15 { + font-weight: inherit; +} + +.c14 { + -webkit-flex-shrink: 0; + -ms-flex-negative: 0; + flex-shrink: 0; +} + +.c3 { + position: relative; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); + height: 100%; +} + +.c5 { + width: 30px; + height: 30px; + border-radius: 50%; + position: absolute; + left: 50%; + top: 0; + -webkit-transform: translate(-51%,-10%); + -ms-transform: translate(-51%,-10%); + transform: translate(-51%,-10%); +} + +.c2 { + grid-column-start: 2; + grid-row: span 2; + padding-right: 5px; +} + +.c18 { + display: grid; + grid-template-columns: 130px auto; +} + +.c1 { + max-width: 500px; + display: grid; + grid-template-areas: "time line title" "time line instructions"; + grid-template-columns: 65px 30px auto; +} + +.c9 { + grid-column-start: 1; + grid-row: 1 / span 2; + padding-right: 5px; + font-size: 0.9em; +} + +.c31 { + padding: 3px 10px 3px 10px; + border: 0; + margin-top: -15px; + width: 35px; + height: 35px; +} + +.c31:hover { + cursor: pointer; +} + +.c29 { + -webkit-flex: 0 0 25px; + -ms-flex: 0 0 25px; + flex: 0 0 25px; + grid-column: -1; +} + +.c11 { + grid-row-start: 2; + grid-column-start: 3; + grid-area: instructions; +} + +.c7 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + font-size: 1.2em; + grid-row-start: 1; + grid-column-start: 3; +} + +.c8 { + font-size: inherit; + font-weight: bold; + height: 1.2em; + margin: 0; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + -webkit-flex: 1 1 auto; + -ms-flex: 1 1 auto; + flex: 1 1 auto; + padding: 3px 0 10px 0; +} + +.c23 { + display: block; + list-style: none; + padding: 0; +} + +.c26 { + margin-left: 24px; + line-height: 1.25em; + padding-top: 1px; +} + +.c26 > span { + margin-right: 1ch; +} + +.c19 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-self: center; + -ms-flex-item-align: center; + align-self: center; + margin-top: 10px; +} + +.c19 a { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c20 { + color: #676767; + font-size: 13px; + font-style: normal; + padding: 0; +} + +.c25 { + fill: #676767; + float: left; + height: 16px; + width: 16px; +} + +.c24 { + font-size: 13px; + margin-top: 8px; + color: #676767; + font-style: normal; +} + +.c27 { + font-weight: 500; +} + +
      +
    1. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + KGW Studio on the Sq, Portland, OR, USA + +
      +
      + 11:29 AM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 166 feet to + + 701 SW 6th Ave, Portland, OR, USA 97204 + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + NORTHWEST + on + + Unnamed Path + + +
        +
        2. +
      2. +
        + + + +
        +
        + + LEFT + on + + Unnamed Path + + +
        +
        3. +
      +
      +
      +       +
      +
      +
      + +
      +
      2. +
    2. +
      +
      +
      +
      + +
      +
      +
      +
      +
      + + 701 SW 6th Ave, Portland, OR, USA 97204 + +
      +
      + 11:30 AM +
      + + Arrive at + 701 SW 6th Ave, Portland, OR, USA 97204 + +
      +
      + +
      +
      3. +
    +`; + +exports[`Storyshots ItineraryBody/otp-ui Walk Transit Transfer Itinerary 1`] = ` + + + +`; + +exports[`Storyshots ItineraryBody/otp-ui Walk Transit Transfer Itinerary 2`] = ` +.c22 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c50 { + color: #f44256; +} + +.c29 { + border-top-style: solid; + border-top-width: 0; + padding-top: 0; + padding-bottom: 10px; +} + +.c16 { + background: transparent; + border: 0; + color: inherit; + cursor: pointer; + font-size: inherit; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c31 { + color: #008; + margin-left: 5px; +} + +.c31:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c6 { + color: black; + background-color: #e9e9e9; + border: 2px solid #bbb; + text-align: center; + width: 25px; + height: 25px; + font-size: 1.2em; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; +} + +.c21::before { + content: ""; + margin: 0 0.125em; +} + +.c49 { + text-align: center; +} + +.c4 { + border-left: dotted 4px #484848; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c33 { + border-left: solid 8px #008ab0; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c45 { + display: block; + font-size: 13px; + list-style: none; + padding: 0; +} + +.c0 { + list-style: none; + padding: 0; +} + +.c12 { + color: #676767; + font-size: 13px; + padding-bottom: 12px; +} + +.c17 { + bottom: 0; + cursor: pointer; + left: 0; + position: absolute; + right: 0; + top: 0; + width: 100%; + z-index: 1; +} + +.c13 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + line-height: 16px; + min-height: 31px; + position: relative; +} + +.c10 { + display: inline-block; + grid-row-start: 2; + grid-column-start: 1; + height: 0; + overflow: hidden; + width: 0; +} + +.c40 { + font-weight: 200; +} + +.c15 { + font-weight: inherit; +} + +.c39 { + font-size: 13px; + font-weight: 500; +} + +.c38 { + font-weight: 800; + margin-right: 6px; +} + +.c37 { + color: #807373; + margin-top: 5px; +} + +.c14 { + -webkit-flex-shrink: 0; + -ms-flex-negative: 0; + flex-shrink: 0; +} + +.c3 { + position: relative; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); + height: 100%; +} + +.c5 { + width: 30px; + height: 30px; + border-radius: 50%; + position: absolute; + left: 50%; + top: 0; + -webkit-transform: translate(-51%,-10%); + -ms-transform: translate(-51%,-10%); + transform: translate(-51%,-10%); +} + +.c2 { + grid-column-start: 2; + grid-row: span 2; + padding-right: 5px; +} + +.c18 { + display: grid; + grid-template-columns: 130px auto; +} + +.c1 { + max-width: 500px; + display: grid; + grid-template-areas: "time line title" "time line instructions"; + grid-template-columns: 65px 30px auto; +} + +.c9 { + grid-column-start: 1; + grid-row: 1 / span 2; + padding-right: 5px; + font-size: 0.9em; +} + +.c32 { + padding: 3px 10px 3px 10px; + border: 0; + margin-top: -15px; + width: 35px; + height: 35px; +} + +.c32:hover { + cursor: pointer; +} + +.c30 { + -webkit-flex: 0 0 25px; + -ms-flex: 0 0 25px; + flex: 0 0 25px; + grid-column: -1; +} + +.c11 { + grid-row-start: 2; + grid-column-start: 3; + grid-area: instructions; +} + +.c7 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + font-size: 1.2em; + grid-row-start: 1; + grid-column-start: 3; +} + +.c8 { + font-size: inherit; + font-weight: bold; + height: 1.2em; + margin: 0; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + -webkit-flex: 1 1 auto; + -ms-flex: 1 1 auto; + flex: 1 1 auto; + padding: 3px 0 10px 0; +} + +.c34 { + text-align: center; + min-width: 30px; + min-height: 30px; + font-size: 1.2em; + background-color: #084c8d; + color: white; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; + border: 1px solid; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + cursor: default; +} + +.c35 { + position: absolute; + width: 1px; + height: 1px; + padding: 0; + margin: -1px; + overflow: hidden; + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + border: 0; +} + +.c23 { + display: block; + list-style: none; + padding: 0; +} + +.c26 { + margin-left: 24px; + line-height: 1.25em; + padding-top: 1px; +} + +.c26 > span { + margin-right: 1ch; +} + +.c19 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-self: center; + -ms-flex-item-align: center; + align-self: center; + margin-top: 10px; +} + +.c19 a { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c20 { + color: #676767; + font-size: 13px; + font-style: normal; + padding: 0; +} + +.c25 { + fill: #676767; + float: left; + height: 16px; + width: 16px; +} + +.c24 { + font-size: 13px; + margin-top: 8px; + color: #676767; + font-style: normal; +} + +.c27 { + font-weight: 500; +} + +.c28 { + font-weight: 200; + opacity: 0.8975; + padding-left: 1ch; +} + +.c36 { + font-weight: 200; + font-size: 0.9em; + margin-left: 10px; +} + +.c47 { + float: left; + margin-left: -36px; + color: #fff; +} + +.c48 { + color: #676767; + margin-top: 3px; +} + +.c46 { + z-index: 30; + position: relative; +} + +.c41 { + margin-top: 5px; +} + +.c42 { + color: #676767; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; +} + +.c44 { + font-size: 14px; +} + +.c43 { + padding: 0; +} + +
      +
    1. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + 3940 SE Brooklyn St, Portland, OR, USA 97202 + +
      +
      + 3:46 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 238 feet to + + SE Cesar Chavez Blvd & Brooklyn (long address that spans multiple lines) + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + WEST + on + + SE Brooklyn St + + + 205 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + RIGHT + on + + SE Cesar E. Chavez Blvd + + + 33 feet + + +
        +
        3. +
      +
      +
      +       +
      +
      +
      + +
      +
      2. +
    2. +
      +
      +
      +
      +
      + + 75 + + + Cesar Chavez/Lombard (very long route name) + +
      +
      +
      +
      +
      + + SE Cesar Chavez Blvd & Brooklyn + + ID 7439 + + +
      +
      + 3:47 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + Ride + + +
      + + 755X + +
      + + + Cesar Chavez/Lombard (very long route name) + + to + + St. Johns via NAYA + + +       + + - + Disembark at + SE Cesar Chavez Blvd & Hawthorne + + ID 7459 + + +       + +       +
      +
      +
      +
      +
      +
      +
      + +
      +
      +
      +
      +
        +
      1. +
        + • +
        +
        + SE Cesar Chavez Blvd & Clinton +
        +
        2. +
      2. +
        + • +
        +
        + SE Cesar Chavez Blvd & Division +
        +
        3. +
      3. +
        + • +
        +
        + SE Cesar Chavez Blvd & Lincoln +
        +
        4. +
      4. +
        + • +
        +
        + SE Cesar Chavez Blvd & Stephens +
        +
        5. +
      +
      +
      +
      +
      +
      +
      +
      +
      + +
      +
      3. +
    3. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + SE Cesar Chavez Blvd & Hawthorne + + ID 7459 + + +
      +
      + 3:52 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 440 feet to + + SE Hawthorne & Cesar Chavez Blvd + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + SOUTH + on + + service road + + + 146 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + RIGHT + on + + SE Cesar E. Chavez Blvd + + + 198 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + LEFT + on + + SE Hawthorne Blvd + + + 96 feet + + +
        +
        4. +
      +
      +
      +       +
      +
      +
      + +
      +
      4. +
    4. +
      +
      +
      +
      +
      + + 1 + + + Hawthorne + +
      +
      +
      +
      +
      + + SE Hawthorne & Cesar Chavez Blvd + + ID 2626 + + +
      +
      + 4:00 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + Ride + + +
      + + 1 + +
      + + + Hawthorne + + to + + Portland + + +       + + - + Disembark at + SE Hawthorne & 27th + + ID 2613 + + +       + +       +
      +
      +
      +
      +
      +
      +
      + +
      +
      +
      +
      +
        +
      1. +
        + • +
        +
        + SE Hawthorne & 37th +
        +
        2. +
      2. +
        + • +
        +
        + SE Hawthorne & 34th +
        +
        3. +
      3. +
        + • +
        +
        + SE Hawthorne & 32nd +
        +
        4. +
      4. +
        + • +
        +
        + SE Hawthorne & 30th +
        +
        5. +
      +
      +
      +
      +
      +
      +
      +
      +
      + +
      +
      5. +
    5. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + SE Hawthorne & 27th + + ID 2613 + + +
      +
      + 4:04 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 479 feet to + + 1415 SE 28th Ave, Portland, OR, USA 97214 + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + WEST + on + + SE Hawthorne Blvd + + + 40 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + RIGHT + on + + SE 27th Ave + + + 294 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + RIGHT + on + + SE Madison St + + + 146 feet + + +
        +
        4. +
      +
      +
      +       +
      +
      +
      + +
      +
      6. +
    6. +
      +
      +
      +
      + +
      +
      +
      +
      +
      + + 1415 SE 28th Ave, Portland, OR, USA 97214 + +
      +
      + 4:06 PM +
      + + Arrive at + 1415 SE 28th Ave, Portland, OR, USA 97214 + +
      +
      + +
      +
      7. +
    +`; + +exports[`Storyshots ItineraryBody/otp-ui Walk Transit Transfer With A 11 Y Itinerary 1`] = ` + + + +`; + +exports[`Storyshots ItineraryBody/otp-ui Walk Transit Transfer With A 11 Y Itinerary 2`] = ` +.c12 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c55 { + color: #f44256; +} + +.c31 { + border-top-style: solid; + border-top-width: 0; + padding-top: 0; + padding-bottom: 10px; +} + +.c19 { + background: transparent; + border: 0; + color: inherit; + cursor: pointer; + font-size: inherit; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c33 { + color: #008; + margin-left: 5px; +} + +.c33:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c6 { + color: black; + background-color: #e9e9e9; + border: 2px solid #bbb; + text-align: center; + width: 25px; + height: 25px; + font-size: 1.2em; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; +} + +.c44 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + background: none; + border: none; + color: #007899; + cursor: pointer; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + font-size: 0.9em; + font-family: inherit; + margin: 0; + margin-top: 5px; + outline: inherit; + padding: 0; + text-align: inherit; +} + +.c24::before { + content: ""; + margin: 0 0.125em; +} + +.c54 { + text-align: center; +} + +.c4 { + border-left: dotted 4px #484848; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c35 { + border-left: solid 8px #008ab0; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c49 { + display: block; + font-size: 13px; + list-style: none; + padding: 0; +} + +.c0 { + list-style: none; + padding: 0; +} + +.c15 { + color: #676767; + font-size: 13px; + padding-bottom: 12px; +} + +.c20 { + bottom: 0; + cursor: pointer; + left: 0; + position: absolute; + right: 0; + top: 0; + width: 100%; + z-index: 1; +} + +.c16 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + line-height: 16px; + min-height: 31px; + position: relative; +} + +.c11 { + display: inline-block; + grid-row-start: 2; + grid-column-start: 1; + height: 0; + overflow: hidden; + width: 0; +} + +.c43 { + font-weight: 200; +} + +.c18 { + font-weight: inherit; +} + +.c42 { + font-size: 13px; + font-weight: 500; +} + +.c41 { + font-weight: 800; + margin-right: 6px; +} + +.c40 { + color: #807373; + margin-top: 5px; +} + +.c17 { + -webkit-flex-shrink: 0; + -ms-flex-negative: 0; + flex-shrink: 0; +} + +.c3 { + position: relative; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); + height: 100%; +} + +.c5 { + width: 30px; + height: 30px; + border-radius: 50%; + position: absolute; + left: 50%; + top: 0; + -webkit-transform: translate(-51%,-10%); + -ms-transform: translate(-51%,-10%); + transform: translate(-51%,-10%); +} + +.c2 { + grid-column-start: 2; + grid-row: span 2; + padding-right: 5px; +} + +.c21 { + display: grid; + grid-template-columns: 130px auto; +} + +.c1 { + max-width: 500px; + display: grid; + grid-template-areas: "time line title" "time line instructions"; + grid-template-columns: 65px 30px auto; +} + +.c9 { + grid-column-start: 1; + grid-row: 1 / span 2; + padding-right: 5px; + font-size: 0.9em; +} + +.c34 { + padding: 3px 10px 3px 10px; + border: 0; + margin-top: -15px; + width: 35px; + height: 35px; +} + +.c34:hover { + cursor: pointer; +} + +.c32 { + -webkit-flex: 0 0 25px; + -ms-flex: 0 0 25px; + flex: 0 0 25px; + grid-column: -1; +} + +.c14 { + grid-row-start: 2; + grid-column-start: 3; + grid-area: instructions; +} + +.c7 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + font-size: 1.2em; + grid-row-start: 1; + grid-column-start: 3; +} + +.c8 { + font-size: inherit; + font-weight: bold; + height: 1.2em; + margin: 0; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + -webkit-flex: 1 1 auto; + -ms-flex: 1 1 auto; + flex: 1 1 auto; + padding: 3px 0 10px 0; +} + +.c36 { + text-align: center; + min-width: 30px; + min-height: 30px; + font-size: 1.2em; + background-color: #084c8d; + color: white; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; + border: 1px solid; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + cursor: default; +} + +.c37 { + position: absolute; + width: 1px; + height: 1px; + padding: 0; + margin: -1px; + overflow: hidden; + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + border: 0; +} + +.c25 { + display: block; + list-style: none; + padding: 0; +} + +.c28 { + margin-left: 24px; + line-height: 1.25em; + padding-top: 1px; +} + +.c28 > span { + margin-right: 1ch; +} + +.c22 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-self: center; + -ms-flex-item-align: center; + align-self: center; + margin-top: 10px; +} + +.c22 a { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c23 { + color: #676767; + font-size: 13px; + font-style: normal; + padding: 0; +} + +.c27 { + fill: #676767; + float: left; + height: 16px; + width: 16px; +} + +.c26 { + font-size: 13px; + margin-top: 8px; + color: #676767; + font-style: normal; +} + +.c29 { + font-weight: 500; +} + +.c30 { + font-weight: 200; + opacity: 0.8975; + padding-left: 1ch; +} + +.c38 { + font-weight: 200; + font-size: 0.9em; + margin-left: 10px; +} + +.c51 { + float: left; + margin-left: -36px; + color: #fff; +} + +.c52 { + color: #676767; + margin-top: 3px; +} + +.c50 { + z-index: 30; + position: relative; +} + +.c45 { + margin-top: 5px; +} + +.c46 { + color: #676767; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; +} + +.c48 { + font-size: 14px; +} + +.c47 { + padding: 0; +} + +.c10 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + border: none; + background-color: #bfffb5; + border-radius: 20px; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-box-pack: justify; + -webkit-justify-content: space-between; + -ms-flex-pack: justify; + justify-content: space-between; + margin-top: 0.25em; + max-width: 75px; + height: 30px; + padding: 0.25em 0.6em 0.25em 0.4em; + word-wrap: anywhere; +} + +.c39 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + border: none; + background-color: #dbe9ff; + border-radius: 20px; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-box-pack: justify; + -webkit-justify-content: space-between; + -ms-flex-pack: justify; + justify-content: space-between; + margin-top: 0.25em; + max-width: 75px; + height: 30px; + padding: 0.25em 0.6em 0.25em 0.4em; + word-wrap: anywhere; +} + +.c53 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + border: none; + background-color: #ffe4e5; + border-radius: 20px; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-box-pack: justify; + -webkit-justify-content: space-between; + -ms-flex-pack: justify; + justify-content: space-between; + margin-top: 0.25em; + max-width: 75px; + height: 30px; + padding: 0.25em 0.6em 0.25em 0.4em; + word-wrap: anywhere; +} + +.c13 { + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; +} + +.c13 span { + display: block; +} + +
      +
    1. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + 3940 SE Brooklyn St, Portland, OR, USA 97202 + +
      +
      + 3:46 PM +
      + + otpUi.ItineraryBody.tripAccessibility.legAccessibilityotpUi.ItineraryBody.tripAccessibility.likelyAccessible + + + + ✅ + +
      +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 238 feet to + + SE Cesar Chavez Blvd & Brooklyn (long address that spans multiple lines) + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + WEST + on + + SE Brooklyn St + + + 205 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + RIGHT + on + + SE Cesar E. Chavez Blvd + + + 33 feet + + +
        +
        3. +
      +
      +
      +       +
      +
      +
      + +
      +
      2. +
    2. +
      +
      +
      +
      +
      + + 75 + + + Cesar Chavez/Lombard (very long route name) + +
      +
      +
      +
      +
      + + SE Cesar Chavez Blvd & Brooklyn + + ID 7439 + + +
      +
      + 3:47 PM +
      + + otpUi.ItineraryBody.tripAccessibility.legAccessibilityotpUi.ItineraryBody.tripAccessibility.unclear + + + + ？ + +
      +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + Ride + + +
      + + 755X + +
      + + + Cesar Chavez/Lombard (very long route name) + + to + + St. Johns via NAYA + + +       + + - + Disembark at + SE Cesar Chavez Blvd & Hawthorne + + ID 7459 + + +       + +       +
      + +
      +
      +
      +
      +
      +
      + +
      +
      +
      +
      +
        +
      1. +
        + • +
        +
        + SE Cesar Chavez Blvd & Clinton +
        +
        2. +
      2. +
        + • +
        +
        + SE Cesar Chavez Blvd & Division +
        +
        3. +
      3. +
        + • +
        +
        + SE Cesar Chavez Blvd & Lincoln +
        +
        4. +
      4. +
        + • +
        +
        + SE Cesar Chavez Blvd & Stephens +
        +
        5. +
      +
      +
      +
      +
      +
      +
      +
      +
      + +
      +
      3. +
    3. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + SE Cesar Chavez Blvd & Hawthorne + + ID 7459 + + +
      +
      + 3:52 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 440 feet to + + SE Hawthorne & Cesar Chavez Blvd + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + SOUTH + on + + service road + + + 146 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + RIGHT + on + + SE Cesar E. Chavez Blvd + + + 198 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + LEFT + on + + SE Hawthorne Blvd + + + 96 feet + + +
        +
        4. +
      +
      +
      +       +
      +
      +
      + +
      +
      4. +
    4. +
      +
      +
      +
      +
      + + 1 + + + Hawthorne + +
      +
      +
      +
      +
      + + SE Hawthorne & Cesar Chavez Blvd + + ID 2626 + + +
      +
      + 4:00 PM +
      + + otpUi.ItineraryBody.tripAccessibility.legAccessibilityotpUi.ItineraryBody.tripAccessibility.inaccessible + + + + ❌ + +
      +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + Ride + + +
      + + 1 + +
      + + + Hawthorne + + to + + Portland + + +       + + - + Disembark at + SE Hawthorne & 27th + + ID 2613 + + +       + +       +
      + +
      +
      +
      +
      +
      +
      + +
      +
      +
      +
      +
        +
      1. +
        + • +
        +
        + SE Hawthorne & 37th +
        +
        2. +
      2. +
        + • +
        +
        + SE Hawthorne & 34th +
        +
        3. +
      3. +
        + • +
        +
        + SE Hawthorne & 32nd +
        +
        4. +
      4. +
        + • +
        +
        + SE Hawthorne & 30th +
        +
        5. +
      +
      +
      +
      +
      +
      +
      +
      +
      + +
      +
      5. +
    5. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + SE Hawthorne & 27th + + ID 2613 + + +
      +
      + 4:04 PM +
      + + otpUi.ItineraryBody.tripAccessibility.legAccessibilityotpUi.ItineraryBody.tripAccessibility.inaccessible + + + + ❌ + +
      +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 479 feet to + + 1415 SE 28th Ave, Portland, OR, USA 97214 + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + WEST + on + + SE Hawthorne Blvd + + + 40 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + RIGHT + on + + SE 27th Ave + + + 294 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + RIGHT + on + + SE Madison St + + + 146 feet + + +
        +
        4. +
      +
      +
      +       +
      +
      +
      + +
      +
      6. +
    6. +
      +
      +
      +
      + +
      +
      +
      +
      +
      + + 1415 SE 28th Ave, Portland, OR, USA 97214 + +
      +
      + 4:06 PM +
      + + Arrive at + 1415 SE 28th Ave, Portland, OR, USA 97214 + +
      +
      + +
      +
      7. +
    +`; + +exports[`Storyshots ItineraryBody/otp-ui Walk Transit Walk Itinerary 1`] = ` + + + +`; + +exports[`Storyshots ItineraryBody/otp-ui Walk Transit Walk Itinerary 2`] = ` +.c22 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c58 { + color: #f44256; +} + +.c29 { + border-top-style: solid; + border-top-width: 0; + padding-top: 0; + padding-bottom: 10px; +} + +.c16 { + background: transparent; + border: 0; + color: inherit; + cursor: pointer; + font-size: inherit; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c31 { + color: #008; + margin-left: 5px; +} + +.c31:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c6 { + color: black; + background-color: #e9e9e9; + border: 2px solid #bbb; + text-align: center; + width: 25px; + height: 25px; + font-size: 1.2em; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; +} + +.c41 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + background: none; + border: none; + color: #007899; + cursor: pointer; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + font-size: 0.9em; + font-family: inherit; + margin: 0; + margin-top: 5px; + outline: inherit; + padding: 0; + text-align: inherit; +} + +.c21::before { + content: ""; + margin: 0 0.125em; +} + +.c57 { + text-align: center; +} + +.c4 { + border-left: dotted 4px #484848; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c33 { + border-left: solid 8px #084C8D; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c53 { + display: block; + font-size: 13px; + list-style: none; + padding: 0; +} + +.c0 { + list-style: none; + padding: 0; +} + +.c12 { + color: #676767; + font-size: 13px; + padding-bottom: 12px; +} + +.c17 { + bottom: 0; + cursor: pointer; + left: 0; + position: absolute; + right: 0; + top: 0; + width: 100%; + z-index: 1; +} + +.c13 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + line-height: 16px; + min-height: 31px; + position: relative; +} + +.c10 { + display: inline-block; + grid-row-start: 2; + grid-column-start: 1; + height: 0; + overflow: hidden; + width: 0; +} + +.c40 { + font-weight: 200; +} + +.c15 { + font-weight: inherit; +} + +.c39 { + font-size: 13px; + font-weight: 500; +} + +.c38 { + font-weight: 800; + margin-right: 6px; +} + +.c37 { + color: #807373; + margin-top: 5px; +} + +.c14 { + -webkit-flex-shrink: 0; + -ms-flex-negative: 0; + flex-shrink: 0; +} + +.c3 { + position: relative; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); + height: 100%; +} + +.c5 { + width: 30px; + height: 30px; + border-radius: 50%; + position: absolute; + left: 50%; + top: 0; + -webkit-transform: translate(-51%,-10%); + -ms-transform: translate(-51%,-10%); + transform: translate(-51%,-10%); +} + +.c2 { + grid-column-start: 2; + grid-row: span 2; + padding-right: 5px; +} + +.c18 { + display: grid; + grid-template-columns: 130px auto; +} + +.c1 { + max-width: 500px; + display: grid; + grid-template-areas: "time line title" "time line instructions"; + grid-template-columns: 65px 30px auto; +} + +.c9 { + grid-column-start: 1; + grid-row: 1 / span 2; + padding-right: 5px; + font-size: 0.9em; +} + +.c32 { + padding: 3px 10px 3px 10px; + border: 0; + margin-top: -15px; + width: 35px; + height: 35px; +} + +.c32:hover { + cursor: pointer; +} + +.c30 { + -webkit-flex: 0 0 25px; + -ms-flex: 0 0 25px; + flex: 0 0 25px; + grid-column: -1; +} + +.c11 { + grid-row-start: 2; + grid-column-start: 3; + grid-area: instructions; +} + +.c7 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + font-size: 1.2em; + grid-row-start: 1; + grid-column-start: 3; +} + +.c8 { + font-size: inherit; + font-weight: bold; + height: 1.2em; + margin: 0; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + -webkit-flex: 1 1 auto; + -ms-flex: 1 1 auto; + flex: 1 1 auto; + padding: 3px 0 10px 0; +} + +.c34 { + text-align: center; + min-width: 30px; + min-height: 30px; + font-size: 1.2em; + background-color: #084C8D; + color: white; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; + border: 1px solid; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + cursor: default; +} + +.c35 { + position: absolute; + width: 1px; + height: 1px; + padding: 0; + margin: -1px; + overflow: hidden; + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + border: 0; +} + +.c23 { + display: block; + list-style: none; + padding: 0; +} + +.c26 { + margin-left: 24px; + line-height: 1.25em; + padding-top: 1px; +} + +.c26 > span { + margin-right: 1ch; +} + +.c19 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-self: center; + -ms-flex-item-align: center; + align-self: center; + margin-top: 10px; +} + +.c19 a { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c20 { + color: #676767; + font-size: 13px; + font-style: normal; + padding: 0; +} + +.c25 { + fill: #676767; + float: left; + height: 16px; + width: 16px; +} + +.c24 { + font-size: 13px; + margin-top: 8px; + color: #676767; + font-style: normal; +} + +.c27 { + font-weight: 500; +} + +.c28 { + font-weight: 200; + opacity: 0.8975; + padding-left: 1ch; +} + +.c36 { + font-weight: 200; + font-size: 0.9em; + margin-left: 10px; +} + +.c55 { + float: left; + margin-left: -36px; + color: #fff; +} + +.c56 { + color: #676767; + margin-top: 3px; +} + +.c54 { + z-index: 30; + position: relative; +} + +.c44 { + background-color: #eee; + border-radius: 4px; + color: #000; + display: block; + margin-top: 5px; + padding: 8px; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c48 { + -webkit-align-items: baseline; + -webkit-box-align: baseline; + -ms-flex-align: baseline; + align-items: baseline; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + gap: 5px; + margin-top: 0.5em; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c48:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c46 { + font-size: 12px; + margin-left: 30px; + white-space: pre-wrap; +} + +.c47 { + margin-top: 5px; + margin-left: 30px; + font-size: 12px; + font-style: italic; +} + +.c45 { + float: left; + font-size: 18px; +} + +.c43 { + display: block; + margin-top: 3px; + padding: 0; +} + +.c42 { + color: #d14727; + cursor: cursor; + display: inline-block; + font-weight: 400; + margin-top: 8px; + padding: 0; +} + +.c49 { + margin-top: 5px; +} + +.c50 { + color: #676767; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; +} + +.c52 { + font-size: 14px; +} + +.c51 { + padding: 0; +} + +
      +
    1. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + KGW Studio on the Sq, Portland, OR, USA + +
      +
      + 3:44 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 269 feet to + + Pioneer Square North MAX Station + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + NORTHWEST + on + + Unnamed Path + + + 167 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + LEFT + on + + Pioneer Sq N (path) + + + 101 feet + + +
        +
        3. +
      +
      +
      +       +
      +
      +
      + +
      +
      2. +
    2. +
      +
      +
      +
      +
      + + MA + + + MAX Blue Line + +
      +
      +
      +
      +
      + + Pioneer Square North MAX Station + + ID 8383 + + +
      +
      + 3:46 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + Ride + + +
      + + MAX Blue Line + +
      + + + MAX Blue Line + + to + + Hillsboro + + +       + + - + Disembark at + Providence Park MAX Station + + ID 9757 + + +       + +       +
      + +
      + +
      +
      + +
      +
      +
      +
      + +
      +
      +
      +
      +
        +
      1. +
        + • +
        +
        + Galleria/SW 10th Ave MAX Station +
        +
        2. +
      +
      +
      +
      + + Typical wait: + 15 min + +
      +
      +
      +
      +
      + +
      +
      3. +
    3. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + Providence Park MAX Station + + ID 9757 + + +
      +
      + 3:49 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 249 feet to + + 1737 SW Morrison St, Portland, OR, USA 97205 + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + WEST + on + + Providence Park (path) + + + 19 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + RIGHT + on + + Unnamed Path + + + 104 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + RIGHT + on + + Unnamed Path + + + 27 feet + + +
        +
        4. +
      4. +
        + + + +
        +
        + + RIGHT + on + + SW Morrison St + + + 99 feet + + +
        +
        5. +
      +
      +
      +       +
      +
      +
      + +
      +
      4. +
    4. +
      +
      +
      +
      + +
      +
      +
      +
      +
      + + 1737 SW Morrison St, Portland, OR, USA 97205 + +
      +
      + 3:50 PM +
      + + Arrive at + 1737 SW Morrison St, Portland, OR, USA 97205 + +
      +
      + +
      +
      5. +
    +`; + +exports[`Storyshots ItineraryBody/otp-ui Walk Transit Walk Itinerary With Agency Information 1`] = ` + + + +`; + +exports[`Storyshots ItineraryBody/otp-ui Walk Transit Walk Itinerary With Agency Information 2`] = ` +.c22 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c58 { + color: #f44256; +} + +.c29 { + border-top-style: solid; + border-top-width: 0; + padding-top: 0; + padding-bottom: 10px; +} + +.c16 { + background: transparent; + border: 0; + color: inherit; + cursor: pointer; + font-size: inherit; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c31 { + color: #008; + margin-left: 5px; +} + +.c31:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c6 { + color: black; + background-color: #e9e9e9; + border: 2px solid #bbb; + text-align: center; + width: 25px; + height: 25px; + font-size: 1.2em; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; +} + +.c21::before { + content: ""; + margin: 0 0.125em; +} + +.c57 { + text-align: center; +} + +.c4 { + border-left: dotted 4px #484848; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c33 { + border-left: solid 8px #084C8D; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c53 { + display: block; + font-size: 13px; + list-style: none; + padding: 0; +} + +.c0 { + list-style: none; + padding: 0; +} + +.c12 { + color: #676767; + font-size: 13px; + padding-bottom: 12px; +} + +.c17 { + bottom: 0; + cursor: pointer; + left: 0; + position: absolute; + right: 0; + top: 0; + width: 100%; + z-index: 1; +} + +.c13 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + line-height: 16px; + min-height: 31px; + position: relative; +} + +.c10 { + display: inline-block; + grid-row-start: 2; + grid-column-start: 1; + height: 0; + overflow: hidden; + width: 0; +} + +.c40 { + font-weight: 200; +} + +.c15 { + font-weight: inherit; +} + +.c39 { + font-size: 13px; + font-weight: 500; +} + +.c38 { + font-weight: 800; + margin-right: 6px; +} + +.c37 { + color: #807373; + margin-top: 5px; +} + +.c14 { + -webkit-flex-shrink: 0; + -ms-flex-negative: 0; + flex-shrink: 0; +} + +.c3 { + position: relative; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); + height: 100%; +} + +.c5 { + width: 30px; + height: 30px; + border-radius: 50%; + position: absolute; + left: 50%; + top: 0; + -webkit-transform: translate(-51%,-10%); + -ms-transform: translate(-51%,-10%); + transform: translate(-51%,-10%); +} + +.c2 { + grid-column-start: 2; + grid-row: span 2; + padding-right: 5px; +} + +.c18 { + display: grid; + grid-template-columns: 130px auto; +} + +.c1 { + max-width: 500px; + display: grid; + grid-template-areas: "time line title" "time line instructions"; + grid-template-columns: 65px 30px auto; +} + +.c9 { + grid-column-start: 1; + grid-row: 1 / span 2; + padding-right: 5px; + font-size: 0.9em; +} + +.c32 { + padding: 3px 10px 3px 10px; + border: 0; + margin-top: -15px; + width: 35px; + height: 35px; +} + +.c32:hover { + cursor: pointer; +} + +.c30 { + -webkit-flex: 0 0 25px; + -ms-flex: 0 0 25px; + flex: 0 0 25px; + grid-column: -1; +} + +.c11 { + grid-row-start: 2; + grid-column-start: 3; + grid-area: instructions; +} + +.c7 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + font-size: 1.2em; + grid-row-start: 1; + grid-column-start: 3; +} + +.c8 { + font-size: inherit; + font-weight: bold; + height: 1.2em; + margin: 0; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + -webkit-flex: 1 1 auto; + -ms-flex: 1 1 auto; + flex: 1 1 auto; + padding: 3px 0 10px 0; +} + +.c34 { + text-align: center; + min-width: 30px; + min-height: 30px; + font-size: 1.2em; + background-color: #084C8D; + color: white; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; + border: 1px solid; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + cursor: default; +} + +.c35 { + position: absolute; + width: 1px; + height: 1px; + padding: 0; + margin: -1px; + overflow: hidden; + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + border: 0; +} + +.c23 { + display: block; + list-style: none; + padding: 0; +} + +.c26 { + margin-left: 24px; + line-height: 1.25em; + padding-top: 1px; +} + +.c26 > span { + margin-right: 1ch; +} + +.c19 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-self: center; + -ms-flex-item-align: center; + align-self: center; + margin-top: 10px; +} + +.c19 a { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c20 { + color: #676767; + font-size: 13px; + font-style: normal; + padding: 0; +} + +.c25 { + fill: #676767; + float: left; + height: 16px; + width: 16px; +} + +.c24 { + font-size: 13px; + margin-top: 8px; + color: #676767; + font-style: normal; +} + +.c27 { + font-weight: 500; +} + +.c28 { + font-weight: 200; + opacity: 0.8975; + padding-left: 1ch; +} + +.c36 { + font-weight: 200; + font-size: 0.9em; + margin-left: 10px; +} + +.c55 { + float: left; + margin-left: -36px; + color: #fff; +} + +.c56 { + color: #676767; + margin-top: 3px; +} + +.c54 { + z-index: 30; + position: relative; +} + +.c44 { + background-color: #eee; + border-radius: 4px; + color: #000; + display: block; + margin-top: 5px; + padding: 8px; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c48 { + -webkit-align-items: baseline; + -webkit-box-align: baseline; + -ms-flex-align: baseline; + align-items: baseline; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + gap: 5px; + margin-top: 0.5em; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c48:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c46 { + font-size: 12px; + margin-left: 30px; + white-space: pre-wrap; +} + +.c47 { + margin-top: 5px; + margin-left: 30px; + font-size: 12px; + font-style: italic; +} + +.c45 { + float: left; + font-size: 18px; +} + +.c43 { + display: block; + margin-top: 3px; + padding: 0; +} + +.c42 { + color: #d14727; + cursor: cursor; + display: inline-block; + font-weight: 400; + margin-top: 8px; + padding: 0; +} + +.c49 { + margin-top: 5px; +} + +.c50 { + color: #676767; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; +} + +.c52 { + font-size: 14px; +} + +.c51 { + padding: 0; +} + +.c41 { + margin-top: 5px; +} + +.c41 a { + color: #337ab7; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c41 a:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c41 img { + margin-left: 5px; + vertical-align: middle; +} + +
      +
    1. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + KGW Studio on the Sq, Portland, OR, USA + +
      +
      + 3:44 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 269 feet to + + Pioneer Square North MAX Station + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + NORTHWEST + on + + Unnamed Path + + + 167 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + LEFT + on + + Pioneer Sq N (path) + + + 101 feet + + +
        +
        3. +
      +
      +
      +       +
      +
      +
      + +
      +
      2. +
    2. +
      +
      +
      +
      +
      + + MA + + + MAX Blue Line + +
      +
      +
      +
      +
      + + Pioneer Square North MAX Station + + ID 8383 + + +
      +
      + 3:46 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + Ride + + +
      + + MAX Blue Line + +
      + + + MAX Blue Line + + to + + Hillsboro + + +       + + - + Disembark at + Providence Park MAX Station + + ID 9757 + + +       + +       +
      +
      +
      + Service operated by + + TriMet + + +
      + +
      +
      + +
      +
      +
      +
      + +
      +
      +
      +
      +
        +
      1. +
        + • +
        +
        + Galleria/SW 10th Ave MAX Station +
        +
        2. +
      +
      +
      +
      + + Typical wait: + 15 min + +
      +
      +
      +
      +
      + +
      +
      3. +
    3. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + Providence Park MAX Station + + ID 9757 + + +
      +
      + 3:49 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 249 feet to + + 1737 SW Morrison St, Portland, OR, USA 97205 + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + WEST + on + + Providence Park (path) + + + 19 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + RIGHT + on + + Unnamed Path + + + 104 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + RIGHT + on + + Unnamed Path + + + 27 feet + + +
        +
        4. +
      4. +
        + + + +
        +
        + + RIGHT + on + + SW Morrison St + + + 99 feet + + +
        +
        5. +
      +
      +
      +       +
      +
      +
      + +
      +
      4. +
    4. +
      +
      +
      +
      + +
      +
      +
      +
      +
      + + 1737 SW Morrison St, Portland, OR, USA 97205 + +
      +
      + 3:50 PM +
      + + Arrive at + 1737 SW Morrison St, Portland, OR, USA 97205 + +
      +
      + +
      +
      5. +
    +`; + +exports[`Storyshots ItineraryBody/otp-ui Walk Transit Walk Itinerary With Custom Place Name Component 1`] = ` + + + +`; + +exports[`Storyshots ItineraryBody/otp-ui Walk Transit Walk Itinerary With Custom Place Name Component 2`] = ` +.c22 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c56 { + color: #f44256; +} + +.c29 { + border-top-style: solid; + border-top-width: 0; + padding-top: 0; + padding-bottom: 10px; +} + +.c16 { + background: transparent; + border: 0; + color: inherit; + cursor: pointer; + font-size: inherit; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c31 { + color: #008; + margin-left: 5px; +} + +.c31:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c6 { + color: black; + background-color: #e9e9e9; + border: 2px solid #bbb; + text-align: center; + width: 25px; + height: 25px; + font-size: 1.2em; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; +} + +.c21::before { + content: ""; + margin: 0 0.125em; +} + +.c55 { + text-align: center; +} + +.c4 { + border-left: dotted 4px #484848; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c33 { + border-left: solid 8px #084C8D; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c51 { + display: block; + font-size: 13px; + list-style: none; + padding: 0; +} + +.c0 { + list-style: none; + padding: 0; +} + +.c12 { + color: #676767; + font-size: 13px; + padding-bottom: 12px; +} + +.c17 { + bottom: 0; + cursor: pointer; + left: 0; + position: absolute; + right: 0; + top: 0; + width: 100%; + z-index: 1; +} + +.c13 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + line-height: 16px; + min-height: 31px; + position: relative; +} + +.c10 { + display: inline-block; + grid-row-start: 2; + grid-column-start: 1; + height: 0; + overflow: hidden; + width: 0; +} + +.c39 { + font-weight: 200; +} + +.c15 { + font-weight: inherit; +} + +.c38 { + font-size: 13px; + font-weight: 500; +} + +.c37 { + font-weight: 800; + margin-right: 6px; +} + +.c36 { + color: #807373; + margin-top: 5px; +} + +.c14 { + -webkit-flex-shrink: 0; + -ms-flex-negative: 0; + flex-shrink: 0; +} + +.c3 { + position: relative; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); + height: 100%; +} + +.c5 { + width: 30px; + height: 30px; + border-radius: 50%; + position: absolute; + left: 50%; + top: 0; + -webkit-transform: translate(-51%,-10%); + -ms-transform: translate(-51%,-10%); + transform: translate(-51%,-10%); +} + +.c2 { + grid-column-start: 2; + grid-row: span 2; + padding-right: 5px; +} + +.c18 { + display: grid; + grid-template-columns: 130px auto; +} + +.c1 { + max-width: 500px; + display: grid; + grid-template-areas: "time line title" "time line instructions"; + grid-template-columns: 65px 30px auto; +} + +.c9 { + grid-column-start: 1; + grid-row: 1 / span 2; + padding-right: 5px; + font-size: 0.9em; +} + +.c32 { + padding: 3px 10px 3px 10px; + border: 0; + margin-top: -15px; + width: 35px; + height: 35px; +} + +.c32:hover { + cursor: pointer; +} + +.c30 { + -webkit-flex: 0 0 25px; + -ms-flex: 0 0 25px; + flex: 0 0 25px; + grid-column: -1; +} + +.c11 { + grid-row-start: 2; + grid-column-start: 3; + grid-area: instructions; +} + +.c7 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + font-size: 1.2em; + grid-row-start: 1; + grid-column-start: 3; +} + +.c8 { + font-size: inherit; + font-weight: bold; + height: 1.2em; + margin: 0; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + -webkit-flex: 1 1 auto; + -ms-flex: 1 1 auto; + flex: 1 1 auto; + padding: 3px 0 10px 0; +} + +.c34 { + text-align: center; + min-width: 30px; + min-height: 30px; + font-size: 1.2em; + background-color: #084C8D; + color: white; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; + border: 1px solid; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + cursor: default; +} + +.c35 { + position: absolute; + width: 1px; + height: 1px; + padding: 0; + margin: -1px; + overflow: hidden; + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + border: 0; +} + +.c23 { + display: block; + list-style: none; + padding: 0; +} + +.c26 { + margin-left: 24px; + line-height: 1.25em; + padding-top: 1px; +} + +.c26 > span { + margin-right: 1ch; +} + +.c19 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-self: center; + -ms-flex-item-align: center; + align-self: center; + margin-top: 10px; +} + +.c19 a { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c20 { + color: #676767; + font-size: 13px; + font-style: normal; + padding: 0; +} + +.c25 { + fill: #676767; + float: left; + height: 16px; + width: 16px; +} + +.c24 { + font-size: 13px; + margin-top: 8px; + color: #676767; + font-style: normal; +} + +.c27 { + font-weight: 500; +} + +.c28 { + font-weight: 200; + opacity: 0.8975; + padding-left: 1ch; +} + +.c53 { + float: left; + margin-left: -36px; + color: #fff; +} + +.c54 { + color: #676767; + margin-top: 3px; +} + +.c52 { + z-index: 30; + position: relative; +} + +.c42 { + background-color: #eee; + border-radius: 4px; + color: #000; + display: block; + margin-top: 5px; + padding: 8px; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c46 { + -webkit-align-items: baseline; + -webkit-box-align: baseline; + -ms-flex-align: baseline; + align-items: baseline; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + gap: 5px; + margin-top: 0.5em; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c46:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c44 { + font-size: 12px; + margin-left: 30px; + white-space: pre-wrap; +} + +.c45 { + margin-top: 5px; + margin-left: 30px; + font-size: 12px; + font-style: italic; +} + +.c43 { + float: left; + font-size: 18px; +} + +.c41 { + display: block; + margin-top: 3px; + padding: 0; +} + +.c40 { + color: #d14727; + cursor: cursor; + display: inline-block; + font-weight: 400; + margin-top: 8px; + padding: 0; +} + +.c47 { + margin-top: 5px; +} + +.c48 { + color: #676767; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; +} + +.c50 { + font-size: 14px; +} + +.c49 { + padding: 0; +} + +
      +
    1. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + 🎉✨🎊 KGW Studio on the Sq, Portland, OR, USA 🎉✨🎊 + +
      +
      + 3:44 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 269 feet to + + Pioneer Square North MAX Station + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + NORTHWEST + on + + Unnamed Path + + + 167 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + LEFT + on + + Pioneer Sq N (path) + + + 101 feet + + +
        +
        3. +
      +
      +
      +       +
      +
      +
      + +
      +
      2. +
    2. +
      +
      +
      +
      +
      + + MA + + + MAX Blue Line + +
      +
      +
      +
      +
      + + 🎉✨🎊 Pioneer Square North MAX Station 🎉✨🎊 + +
      +
      + 3:46 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + Ride + + +
      + + MAX Blue Line + +
      + + + MAX Blue Line + + to + + Hillsboro + + +       + + - + Disembark at + 🎉✨🎊 Providence Park MAX Station 🎉✨🎊 + +       + +       +
      +
      + +
      +
      + +
      +
      +
      +
      + +
      +
      +
      +
      +
        +
      1. +
        + • +
        +
        + Galleria/SW 10th Ave MAX Station +
        +
        2. +
      +
      +
      +
      + + Typical wait: + 15 min + +
      +
      +
      +
      +
      + +
      +
      3. +
    3. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + 🎉✨🎊 Providence Park MAX Station 🎉✨🎊 + +
      +
      + 3:49 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 249 feet to + + 1737 SW Morrison St, Portland, OR, USA 97205 + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + WEST + on + + Providence Park (path) + + + 19 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + RIGHT + on + + Unnamed Path + + + 104 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + RIGHT + on + + Unnamed Path + + + 27 feet + + +
        +
        4. +
      4. +
        + + + +
        +
        + + RIGHT + on + + SW Morrison St + + + 99 feet + + +
        +
        5. +
      +
      +
      +       +
      +
      +
      + +
      +
      4. +
    4. +
      +
      +
      +
      + +
      +
      +
      +
      +
      + + 🎉✨🎊 1737 SW Morrison St, Portland, OR, USA 97205 🎉✨🎊 + +
      +
      + 3:50 PM +
      + + Arrive at + 🎉✨🎊 1737 SW Morrison St, Portland, OR, USA 97205 🎉✨🎊 + +
      +
      + +
      +
      5. +
    +`; + +exports[`Storyshots ItineraryBody/otp-ui Walk Transit Walk Itinerary With Custom Transit Leg Summary Component 1`] = ` + + + +`; + +exports[`Storyshots ItineraryBody/otp-ui Walk Transit Walk Itinerary With Custom Transit Leg Summary Component 2`] = ` +.c22 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c56 { + color: #f44256; +} + +.c29 { + border-top-style: solid; + border-top-width: 0; + padding-top: 0; + padding-bottom: 10px; +} + +.c16 { + background: transparent; + border: 0; + color: inherit; + cursor: pointer; + font-size: inherit; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c31 { + color: #008; + margin-left: 5px; +} + +.c31:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c6 { + color: black; + background-color: #e9e9e9; + border: 2px solid #bbb; + text-align: center; + width: 25px; + height: 25px; + font-size: 1.2em; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; +} + +.c21::before { + content: ""; + margin: 0 0.125em; +} + +.c55 { + text-align: center; +} + +.c4 { + border-left: dotted 4px #484848; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c33 { + border-left: solid 8px #084C8D; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c51 { + display: block; + font-size: 13px; + list-style: none; + padding: 0; +} + +.c0 { + list-style: none; + padding: 0; +} + +.c12 { + color: #676767; + font-size: 13px; + padding-bottom: 12px; +} + +.c17 { + bottom: 0; + cursor: pointer; + left: 0; + position: absolute; + right: 0; + top: 0; + width: 100%; + z-index: 1; +} + +.c13 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + line-height: 16px; + min-height: 31px; + position: relative; +} + +.c10 { + display: inline-block; + grid-row-start: 2; + grid-column-start: 1; + height: 0; + overflow: hidden; + width: 0; +} + +.c40 { + font-weight: 200; +} + +.c15 { + font-weight: inherit; +} + +.c39 { + font-size: 13px; + font-weight: 500; +} + +.c38 { + font-weight: 800; + margin-right: 6px; +} + +.c37 { + color: #807373; + margin-top: 5px; +} + +.c14 { + -webkit-flex-shrink: 0; + -ms-flex-negative: 0; + flex-shrink: 0; +} + +.c3 { + position: relative; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); + height: 100%; +} + +.c5 { + width: 30px; + height: 30px; + border-radius: 50%; + position: absolute; + left: 50%; + top: 0; + -webkit-transform: translate(-51%,-10%); + -ms-transform: translate(-51%,-10%); + transform: translate(-51%,-10%); +} + +.c2 { + grid-column-start: 2; + grid-row: span 2; + padding-right: 5px; +} + +.c18 { + display: grid; + grid-template-columns: 130px auto; +} + +.c1 { + max-width: 500px; + display: grid; + grid-template-areas: "time line title" "time line instructions"; + grid-template-columns: 65px 30px auto; +} + +.c9 { + grid-column-start: 1; + grid-row: 1 / span 2; + padding-right: 5px; + font-size: 0.9em; +} + +.c32 { + padding: 3px 10px 3px 10px; + border: 0; + margin-top: -15px; + width: 35px; + height: 35px; +} + +.c32:hover { + cursor: pointer; +} + +.c30 { + -webkit-flex: 0 0 25px; + -ms-flex: 0 0 25px; + flex: 0 0 25px; + grid-column: -1; +} + +.c11 { + grid-row-start: 2; + grid-column-start: 3; + grid-area: instructions; +} + +.c7 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + font-size: 1.2em; + grid-row-start: 1; + grid-column-start: 3; +} + +.c8 { + font-size: inherit; + font-weight: bold; + height: 1.2em; + margin: 0; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + -webkit-flex: 1 1 auto; + -ms-flex: 1 1 auto; + flex: 1 1 auto; + padding: 3px 0 10px 0; +} + +.c34 { + text-align: center; + min-width: 30px; + min-height: 30px; + font-size: 1.2em; + background-color: #084C8D; + color: white; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; + border: 1px solid; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + cursor: default; +} + +.c35 { + position: absolute; + width: 1px; + height: 1px; + padding: 0; + margin: -1px; + overflow: hidden; + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + border: 0; +} + +.c23 { + display: block; + list-style: none; + padding: 0; +} + +.c26 { + margin-left: 24px; + line-height: 1.25em; + padding-top: 1px; +} + +.c26 > span { + margin-right: 1ch; +} + +.c19 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-self: center; + -ms-flex-item-align: center; + align-self: center; + margin-top: 10px; +} + +.c19 a { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c20 { + color: #676767; + font-size: 13px; + font-style: normal; + padding: 0; +} + +.c25 { + fill: #676767; + float: left; + height: 16px; + width: 16px; +} + +.c24 { + font-size: 13px; + margin-top: 8px; + color: #676767; + font-style: normal; +} + +.c27 { + font-weight: 500; +} + +.c28 { + font-weight: 200; + opacity: 0.8975; + padding-left: 1ch; +} + +.c36 { + font-weight: 200; + font-size: 0.9em; + margin-left: 10px; +} + +.c53 { + float: left; + margin-left: -36px; + color: #fff; +} + +.c54 { + color: #676767; + margin-top: 3px; +} + +.c52 { + z-index: 30; + position: relative; +} + +.c43 { + background-color: #eee; + border-radius: 4px; + color: #000; + display: block; + margin-top: 5px; + padding: 8px; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c47 { + -webkit-align-items: baseline; + -webkit-box-align: baseline; + -ms-flex-align: baseline; + align-items: baseline; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + gap: 5px; + margin-top: 0.5em; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c47:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c45 { + font-size: 12px; + margin-left: 30px; + white-space: pre-wrap; +} + +.c46 { + margin-top: 5px; + margin-left: 30px; + font-size: 12px; + font-style: italic; +} + +.c44 { + float: left; + font-size: 18px; +} + +.c42 { + display: block; + margin-top: 3px; + padding: 0; +} + +.c41 { + color: #d14727; + cursor: cursor; + display: inline-block; + font-weight: 400; + margin-top: 8px; + padding: 0; +} + +.c48 { + margin-top: 5px; +} + +.c49 { + color: #676767; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; +} + +.c50 { + font-size: 14px; +} + +
      +
    1. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + KGW Studio on the Sq, Portland, OR, USA + +
      +
      + 3:44 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 269 feet to + + Pioneer Square North MAX Station + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + NORTHWEST + on + + Unnamed Path + + + 167 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + LEFT + on + + Pioneer Sq N (path) + + + 101 feet + + +
        +
        3. +
      +
      +
      +       +
      +
      +
      + +
      +
      2. +
    2. +
      +
      +
      +
      +
      + + MA + + + MAX Blue Line + +
      +
      +
      +
      +
      + + Pioneer Square North MAX Station + + ID 8383 + + +
      +
      + 3:46 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + Ride + + +
      + + MAX Blue Line + +
      + + + MAX Blue Line + + to + + Hillsboro + + +       + + - + Disembark at + Providence Park MAX Station + + ID 9757 + + +       + +       +
      +
      + +
      +
      + +
      +
      +
      +
      +
      + + Ride for a custom duration of + 3.583 + minutes + + + (2 stops) + + + + +
      +
      +
      +
      +
      +
        +
      1. +
        + • +
        +
        + Galleria/SW 10th Ave MAX Station +
        +
        2. +
      +
      +
      +
      + + Typical wait: + 15 min + +
      +
      +
      +
      +
      + +
      +
      3. +
    3. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + Providence Park MAX Station + + ID 9757 + + +
      +
      + 3:49 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 249 feet to + + 1737 SW Morrison St, Portland, OR, USA 97205 + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + WEST + on + + Providence Park (path) + + + 19 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + RIGHT + on + + Unnamed Path + + + 104 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + RIGHT + on + + Unnamed Path + + + 27 feet + + +
        +
        4. +
      4. +
        + + + +
        +
        + + RIGHT + on + + SW Morrison St + + + 99 feet + + +
        +
        5. +
      +
      +
      +       +
      +
      +
      + +
      +
      4. +
    4. +
      +
      +
      +
      + +
      +
      +
      +
      +
      + + 1737 SW Morrison St, Portland, OR, USA 97205 + +
      +
      + 3:50 PM +
      + + Arrive at + 1737 SW Morrison St, Portland, OR, USA 97205 + +
      +
      + +
      +
      5. +
    +`; + +exports[`Storyshots ItineraryBody/otp-ui Walk Transit Walk Itinerary With Custom View Trip Button Activated And Custom Route Abbreviation 1`] = ` + + + +`; + +exports[`Storyshots ItineraryBody/otp-ui Walk Transit Walk Itinerary With Custom View Trip Button Activated And Custom Route Abbreviation 2`] = ` +.c22 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c58 { + color: #f44256; +} + +.c29 { + border-top-style: solid; + border-top-width: 0; + padding-top: 0; + padding-bottom: 10px; +} + +.c16 { + background: transparent; + border: 0; + color: inherit; + cursor: pointer; + font-size: inherit; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c31 { + color: #008; + margin-left: 5px; +} + +.c31:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c51 { + padding-left: 0px; +} + +.c51:before { + content: "|"; + color: black; + margin-right: 5px; +} + +.c6 { + color: black; + background-color: #e9e9e9; + border: 2px solid #bbb; + text-align: center; + width: 25px; + height: 25px; + font-size: 1.2em; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; +} + +.c21::before { + content: ""; + margin: 0 0.125em; +} + +.c57 { + text-align: center; +} + +.c4 { + border-left: dotted 4px #484848; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c33 { + border-left: solid 8px #084C8D; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c53 { + display: block; + font-size: 13px; + list-style: none; + padding: 0; +} + +.c0 { + list-style: none; + padding: 0; +} + +.c12 { + color: #676767; + font-size: 13px; + padding-bottom: 12px; +} + +.c17 { + bottom: 0; + cursor: pointer; + left: 0; + position: absolute; + right: 0; + top: 0; + width: 100%; + z-index: 1; +} + +.c13 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + line-height: 16px; + min-height: 31px; + position: relative; +} + +.c10 { + display: inline-block; + grid-row-start: 2; + grid-column-start: 1; + height: 0; + overflow: hidden; + width: 0; +} + +.c40 { + font-weight: 200; +} + +.c15 { + font-weight: inherit; +} + +.c39 { + font-size: 13px; + font-weight: 500; +} + +.c38 { + font-weight: 800; + margin-right: 6px; +} + +.c37 { + color: #807373; + margin-top: 5px; +} + +.c14 { + -webkit-flex-shrink: 0; + -ms-flex-negative: 0; + flex-shrink: 0; +} + +.c3 { + position: relative; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); + height: 100%; +} + +.c5 { + width: 30px; + height: 30px; + border-radius: 50%; + position: absolute; + left: 50%; + top: 0; + -webkit-transform: translate(-51%,-10%); + -ms-transform: translate(-51%,-10%); + transform: translate(-51%,-10%); +} + +.c2 { + grid-column-start: 2; + grid-row: span 2; + padding-right: 5px; +} + +.c18 { + display: grid; + grid-template-columns: 130px auto; +} + +.c1 { + max-width: 500px; + display: grid; + grid-template-areas: "time line title" "time line instructions"; + grid-template-columns: 65px 30px auto; +} + +.c9 { + grid-column-start: 1; + grid-row: 1 / span 2; + padding-right: 5px; + font-size: 0.9em; +} + +.c32 { + padding: 3px 10px 3px 10px; + border: 0; + margin-top: -15px; + width: 35px; + height: 35px; +} + +.c32:hover { + cursor: pointer; +} + +.c30 { + -webkit-flex: 0 0 25px; + -ms-flex: 0 0 25px; + flex: 0 0 25px; + grid-column: -1; +} + +.c11 { + grid-row-start: 2; + grid-column-start: 3; + grid-area: instructions; +} + +.c7 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + font-size: 1.2em; + grid-row-start: 1; + grid-column-start: 3; +} + +.c8 { + font-size: inherit; + font-weight: bold; + height: 1.2em; + margin: 0; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + -webkit-flex: 1 1 auto; + -ms-flex: 1 1 auto; + flex: 1 1 auto; + padding: 3px 0 10px 0; +} + +.c34 { + text-align: center; + min-width: 30px; + min-height: 30px; + font-size: 1.2em; + background-color: #084C8D; + color: white; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; + border: 1px solid; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + cursor: default; +} + +.c35 { + position: absolute; + width: 1px; + height: 1px; + padding: 0; + margin: -1px; + overflow: hidden; + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + border: 0; +} + +.c23 { + display: block; + list-style: none; + padding: 0; +} + +.c26 { + margin-left: 24px; + line-height: 1.25em; + padding-top: 1px; +} + +.c26 > span { + margin-right: 1ch; +} + +.c19 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-self: center; + -ms-flex-item-align: center; + align-self: center; + margin-top: 10px; +} + +.c19 a { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c20 { + color: #676767; + font-size: 13px; + font-style: normal; + padding: 0; +} + +.c25 { + fill: #676767; + float: left; + height: 16px; + width: 16px; +} + +.c24 { + font-size: 13px; + margin-top: 8px; + color: #676767; + font-style: normal; +} + +.c27 { + font-weight: 500; +} + +.c28 { + font-weight: 200; + opacity: 0.8975; + padding-left: 1ch; +} + +.c36 { + font-weight: 200; + font-size: 0.9em; + margin-left: 10px; +} + +.c55 { + float: left; + margin-left: -36px; + color: #fff; +} + +.c56 { + color: #676767; + margin-top: 3px; +} + +.c54 { + z-index: 30; + position: relative; +} + +.c43 { + background-color: #eee; + border-radius: 4px; + color: #000; + display: block; + margin-top: 5px; + padding: 8px; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c47 { + -webkit-align-items: baseline; + -webkit-box-align: baseline; + -ms-flex-align: baseline; + align-items: baseline; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + gap: 5px; + margin-top: 0.5em; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c47:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c45 { + font-size: 12px; + margin-left: 30px; + white-space: pre-wrap; +} + +.c46 { + margin-top: 5px; + margin-left: 30px; + font-size: 12px; + font-style: italic; +} + +.c44 { + float: left; + font-size: 18px; +} + +.c42 { + display: block; + margin-top: 3px; + padding: 0; +} + +.c41 { + color: #d14727; + cursor: cursor; + display: inline-block; + font-weight: 400; + margin-top: 8px; + padding: 0; +} + +.c48 { + margin-top: 5px; +} + +.c49 { + color: #676767; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; +} + +.c52 { + font-size: 14px; +} + +.c50 { + padding: 0; +} + +
      +
    1. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + KGW Studio on the Sq, Portland, OR, USA + +
      +
      + 3:44 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 269 feet to + + Pioneer Square North MAX Station + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + NORTHWEST + on + + Unnamed Path + + + 167 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + LEFT + on + + Pioneer Sq N (path) + + + 101 feet + + +
        +
        3. +
      +
      +
      +       +
      +
      +
      + +
      +
      2. +
    2. +
      +
      +
      +
      +
      + + + MAX Blue Line + +
      +
      +
      +
      +
      + + Pioneer Square North MAX Station + + ID 8383 + + +
      +
      + 3:46 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + Ride + + +
      + + MAX Blue Line + +
      + + + MAX Blue Line + + to + + Hillsboro + + +       + + - + Disembark at + Providence Park MAX Station + + ID 9757 + + +       + +       +
      +
      + +
      +
      + +
      +
      +
      +
      + + +
      +
      +
      +
      +
        +
      1. +
        + • +
        +
        + Galleria/SW 10th Ave MAX Station +
        +
        2. +
      +
      +
      +
      + + Typical wait: + 15 min + +
      +
      +
      +
      +
      + +
      +
      3. +
    3. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + Providence Park MAX Station + + ID 9757 + + +
      +
      + 3:49 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 249 feet to + + 1737 SW Morrison St, Portland, OR, USA 97205 + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + WEST + on + + Providence Park (path) + + + 19 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + RIGHT + on + + Unnamed Path + + + 104 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + RIGHT + on + + Unnamed Path + + + 27 feet + + +
        +
        4. +
      4. +
        + + + +
        +
        + + RIGHT + on + + SW Morrison St + + + 99 feet + + +
        +
        5. +
      +
      +
      +       +
      +
      +
      + +
      +
      4. +
    4. +
      +
      +
      +
      + +
      +
      +
      +
      +
      + + 1737 SW Morrison St, Portland, OR, USA 97205 + +
      +
      + 3:50 PM +
      + + Arrive at + 1737 SW Morrison St, Portland, OR, USA 97205 + +
      +
      + +
      +
      5. +
    +`; + +exports[`Storyshots ItineraryBody/otp-ui Zero Alerts Always Collapsing 1`] = ` + + + +`; + +exports[`Storyshots ItineraryBody/otp-ui Zero Alerts Always Collapsing 2`] = ` +.c22 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c51 { + color: #f44256; +} + +.c29 { + border-top-style: solid; + border-top-width: 0; + padding-top: 0; + padding-bottom: 10px; +} + +.c16 { + background: transparent; + border: 0; + color: inherit; + cursor: pointer; + font-size: inherit; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c31 { + color: #008; + margin-left: 5px; +} + +.c31:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c6 { + color: black; + background-color: #e9e9e9; + border: 2px solid #bbb; + text-align: center; + width: 25px; + height: 25px; + font-size: 1.2em; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; +} + +.c21::before { + content: ""; + margin: 0 0.125em; +} + +.c50 { + text-align: center; +} + +.c4 { + border-left: dotted 4px #484848; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c33 { + border-left: solid 8px #0070c0; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c48 { + border-left: solid 8px #008ab0; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c44 { + display: block; + font-size: 13px; + list-style: none; + padding: 0; +} + +.c0 { + list-style: none; + padding: 0; +} + +.c12 { + color: #676767; + font-size: 13px; + padding-bottom: 12px; +} + +.c17 { + bottom: 0; + cursor: pointer; + left: 0; + position: absolute; + right: 0; + top: 0; + width: 100%; + z-index: 1; +} + +.c13 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + line-height: 16px; + min-height: 31px; + position: relative; +} + +.c10 { + display: inline-block; + grid-row-start: 2; + grid-column-start: 1; + height: 0; + overflow: hidden; + width: 0; +} + +.c15 { + font-weight: inherit; +} + +.c39 { + font-size: 13px; + font-weight: 500; +} + +.c38 { + font-weight: 800; + margin-right: 6px; +} + +.c37 { + color: #807373; + margin-top: 5px; +} + +.c14 { + -webkit-flex-shrink: 0; + -ms-flex-negative: 0; + flex-shrink: 0; +} + +.c3 { + position: relative; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); + height: 100%; +} + +.c5 { + width: 30px; + height: 30px; + border-radius: 50%; + position: absolute; + left: 50%; + top: 0; + -webkit-transform: translate(-51%,-10%); + -ms-transform: translate(-51%,-10%); + transform: translate(-51%,-10%); +} + +.c2 { + grid-column-start: 2; + grid-row: span 2; + padding-right: 5px; +} + +.c18 { + display: grid; + grid-template-columns: 130px auto; +} + +.c1 { + max-width: 500px; + display: grid; + grid-template-areas: "time line title" "time line instructions"; + grid-template-columns: 65px 30px auto; +} + +.c9 { + grid-column-start: 1; + grid-row: 1 / span 2; + padding-right: 5px; + font-size: 0.9em; +} + +.c32 { + padding: 3px 10px 3px 10px; + border: 0; + margin-top: -15px; + width: 35px; + height: 35px; +} + +.c32:hover { + cursor: pointer; +} + +.c30 { + -webkit-flex: 0 0 25px; + -ms-flex: 0 0 25px; + flex: 0 0 25px; + grid-column: -1; +} + +.c11 { + grid-row-start: 2; + grid-column-start: 3; + grid-area: instructions; +} + +.c7 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + font-size: 1.2em; + grid-row-start: 1; + grid-column-start: 3; +} + +.c8 { + font-size: inherit; + font-weight: bold; + height: 1.2em; + margin: 0; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + -webkit-flex: 1 1 auto; + -ms-flex: 1 1 auto; + flex: 1 1 auto; + padding: 3px 0 10px 0; +} + +.c34 { + text-align: center; + min-width: 30px; + min-height: 30px; + font-size: 1.2em; + background-color: #0070c0; + color: white; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; + border: 1px solid; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + cursor: default; +} + +.c49 { + text-align: center; + min-width: 30px; + min-height: 30px; + font-size: 1.2em; + background-color: #084c8d; + color: white; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; + border: 1px solid; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + cursor: default; +} + +.c35 { + position: absolute; + width: 1px; + height: 1px; + padding: 0; + margin: -1px; + overflow: hidden; + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + border: 0; +} + +.c23 { + display: block; + list-style: none; + padding: 0; +} + +.c26 { + margin-left: 24px; + line-height: 1.25em; + padding-top: 1px; +} + +.c26 > span { + margin-right: 1ch; +} + +.c19 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-self: center; + -ms-flex-item-align: center; + align-self: center; + margin-top: 10px; +} + +.c19 a { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c20 { + color: #676767; + font-size: 13px; + font-style: normal; + padding: 0; +} + +.c25 { + fill: #676767; + float: left; + height: 16px; + width: 16px; +} + +.c24 { + font-size: 13px; + margin-top: 8px; + color: #676767; + font-style: normal; +} + +.c27 { + font-weight: 500; +} + +.c28 { + font-weight: 200; + opacity: 0.8975; + padding-left: 1ch; +} + +.c36 { + font-weight: 200; + font-size: 0.9em; + margin-left: 10px; +} + +.c46 { + float: left; + margin-left: -36px; + color: #fff; +} + +.c47 { + color: #676767; + margin-top: 3px; +} + +.c45 { + z-index: 30; + position: relative; +} + +.c40 { + margin-top: 5px; +} + +.c41 { + color: #676767; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; +} + +.c43 { + font-size: 14px; +} + +.c42 { + padding: 0; +} + +
      +
    1. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + 47.97767, -122.20034 + +
      +
      + 12:57 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 0.3 miles to + + Everett Station Bay C1 + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + SOUTH + on + + service road + + + 0.1 miles + + +
        +
        2. +
      2. +
        + + + +
        +
        + + RIGHT + on + + Smith Avenue + + + 129 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + CONTINUE + on + + Paine Avenue + + + 61 feet + + +
        +
        4. +
      4. +
        + + + +
        +
        + + LEFT + on + + 32nd Street + + + 67 feet + + +
        +
        5. +
      5. +
        + + + +
        +
        + + RIGHT + on + + 32nd Street + + + 313 feet + + +
        +
        6. +
      6. +
        + + + +
        +
        + + LEFT + on + + Unnamed Path + + + 380 feet + + +
        +
        7. +
      +
      +
      +       +
      +
      +
      + +
      +
      2. +
    2. +
      +
      +
      +
      +
      + + 51 + + + Everett - Northgate Station + +
      +
      +
      +
      +
      + + Everett Station Bay C1 + + ID 2345 + + +
      +
      + 1:04 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + Ride + + +
      + + 512 + +
      + + + Northgate Station + + +       + + - + Disembark at + Northgate Station + + ID 2191 + + +       + +       +
      +
      +
      +
      +
      +
      +
      + +
      +
      +
      +
      +
        +
      1. +
        + • +
        +
        + Broadway & 34th St +
        +
        2. +
      2. +
        + • +
        +
        + South Everett Fwy Station Bay 3 +
        +
        3. +
      3. +
        + • +
        +
        + Ash Way Park & Ride Bay 1 +
        +
        4. +
      4. +
        + • +
        +
        + Lynnwood Transit Center Bay D3 +
        +
        5. +
      5. +
        + • +
        +
        + Mountlake Terrace Fwy Station Bay 6 +
        +
        6. +
      +
      +
      +
      +
      +
      +
      +
      +
      + +
      +
      3. +
    3. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + Northgate Station + + ID 2191 + + +
      +
      + 1:51 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk to + + Northgate Station - Bay 4 + + + + +
      + + + + +
      +
      +
        +
      +
      +       +
      +
      +
      + +
      +
      4. +
    4. +
      +
      +
      +
      +
      + + 40 + + + + +
      +
      +
      +
      +
      + + Northgate Station - Bay 4 + + ID 35318 + + +
      +
      + 1:55 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + Ride + + +
      + + 40 + +
      + + + Downtown Seattle Ballard + + +       + + - + Disembark at + N 105th St & Aurora Ave N + + ID 40032 + + +       + +       +
      +
      +
      +
      +
      +
      +
      + +
      +
      +
      +
      +
        +
      1. +
        + • +
        +
        + 1st Ave NE & NE 95th St +
        +
        2. +
      2. +
        + • +
        +
        + N 92nd St & Corliss Ave N +
        +
        3. +
      3. +
        + • +
        +
        + College Way N & N 97th St +
        +
        4. +
      4. +
        + • +
        +
        + College Way N & N 103rd St +
        +
        5. +
      5. +
        + • +
        +
        + Meridian Ave N & N 105th St +
        +
        6. +
      6. +
        + • +
        +
        + N Northgate Way & Meridian Ave N +
        +
        7. +
      7. +
        + • +
        +
        + N Northgate Way & Stone Ave N +
        +
        8. +
      +
      +
      +
      +
      +
      +
      +
      +
      + +
      +
      5. +
    5. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + N 105th St & Aurora Ave N + + ID 40032 + + +
      +
      + 2:06 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 259 feet to + + Aurora Ave N & N 105th St + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + EAST + on + + North 105th Street + + + 64 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + RIGHT + on + + service road + + + 14 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + LEFT + on + + Unnamed Path + + + 180 feet + + +
        +
        4. +
      +
      +
      +       +
      +
      +
      + +
      +
      6. +
    6. +
      +
      +
      +
      +
      + + E + + + + +
      +
      +
      +
      +
      + + Aurora Ave N & N 105th St + + ID 7080 + + +
      +
      + 2:07 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + Ride + + +
      + + E Line + +
      + + + Downtown Seattle + + +       + + - + Disembark at + 3rd Ave & Cherry St + + ID 490 + + +       + +       +
      +
      +
      +
      +
      +
      +
      + +
      +
      +
      +
      +
        +
      1. +
        + • +
        +
        + Aurora Ave N & N 100th St +
        +
        2. +
      2. +
        + • +
        +
        + Aurora Ave N & N 95th St +
        +
        3. +
      3. +
        + • +
        +
        + Aurora Ave N & N 90th St +
        +
        4. +
      4. +
        + • +
        +
        + Aurora Ave N & N 85th St +
        +
        5. +
      5. +
        + • +
        +
        + Aurora Ave N & N 80th St +
        +
        6. +
      6. +
        + • +
        +
        + Aurora Ave N & N 76th St +
        +
        7. +
      7. +
        + • +
        +
        + Aurora Ave N & N 65th St +
        +
        8. +
      8. +
        + • +
        +
        + Aurora Ave N & N 46th St +
        +
        9. +
      9. +
        + • +
        +
        + Aurora Ave N & Lynn St +
        +
        10. +
      10. +
        + • +
        +
        + Aurora Ave N & Galer St +
        +
        11. +
      11. +
        + • +
        +
        + 7th Ave N & Thomas St +
        +
        12. +
      12. +
        + • +
        +
        + Wall St & 5th Ave +
        +
        13. +
      13. +
        + • +
        +
        + 3rd Ave & Bell St +
        +
        14. +
      14. +
        + • +
        +
        + 3rd Ave & Virginia St +
        +
        15. +
      15. +
        + • +
        +
        + 3rd Ave & Pike St +
        +
        16. +
      16. +
        + • +
        +
        + 3rd Ave & Seneca St +
        +
        17. +
      +
      +
      +
      +
      +
      +
      +
      +
      + +
      +
      7. +
    7. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + 3rd Ave & Cherry St + + ID 490 + + +
      +
      + 2:39 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 443 feet to + + 208 James St, Seattle, WA 98104-2212, United States + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + SOUTHEAST + on + + sidewalk + + + 326 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + UTURN_RIGHT + on + + sidewalk + + + 117 feet + + +
        +
        3. +
      +
      +
      +       +
      +
      +
      + +
      +
      8. +
    8. +
      +
      +
      +
      + +
      +
      +
      +
      +
      + + 208 James St, Seattle, WA 98104-2212, United States + +
      +
      + 2:41 PM +
      + + Arrive at + 208 James St, Seattle, WA 98104-2212, United States + +
      +
      + +
      +
      9. +
    +`; + +exports[`Storyshots ItineraryBody/otp-ui Zero Alerts Not Always Collapsing 1`] = ` + + + +`; + +exports[`Storyshots ItineraryBody/otp-ui Zero Alerts Not Always Collapsing 2`] = ` +.c22 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c51 { + color: #f44256; +} + +.c29 { + border-top-style: solid; + border-top-width: 0; + padding-top: 0; + padding-bottom: 10px; +} + +.c16 { + background: transparent; + border: 0; + color: inherit; + cursor: pointer; + font-size: inherit; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c31 { + color: #008; + margin-left: 5px; +} + +.c31:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c6 { + color: black; + background-color: #e9e9e9; + border: 2px solid #bbb; + text-align: center; + width: 25px; + height: 25px; + font-size: 1.2em; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; +} + +.c21::before { + content: ""; + margin: 0 0.125em; +} + +.c50 { + text-align: center; +} + +.c4 { + border-left: dotted 4px #484848; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c33 { + border-left: solid 8px #0070c0; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c48 { + border-left: solid 8px #008ab0; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c44 { + display: block; + font-size: 13px; + list-style: none; + padding: 0; +} + +.c0 { + list-style: none; + padding: 0; +} + +.c12 { + color: #676767; + font-size: 13px; + padding-bottom: 12px; +} + +.c17 { + bottom: 0; + cursor: pointer; + left: 0; + position: absolute; + right: 0; + top: 0; + width: 100%; + z-index: 1; +} + +.c13 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + line-height: 16px; + min-height: 31px; + position: relative; +} + +.c10 { + display: inline-block; + grid-row-start: 2; + grid-column-start: 1; + height: 0; + overflow: hidden; + width: 0; +} + +.c15 { + font-weight: inherit; +} + +.c39 { + font-size: 13px; + font-weight: 500; +} + +.c38 { + font-weight: 800; + margin-right: 6px; +} + +.c37 { + color: #807373; + margin-top: 5px; +} + +.c14 { + -webkit-flex-shrink: 0; + -ms-flex-negative: 0; + flex-shrink: 0; +} + +.c3 { + position: relative; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); + height: 100%; +} + +.c5 { + width: 30px; + height: 30px; + border-radius: 50%; + position: absolute; + left: 50%; + top: 0; + -webkit-transform: translate(-51%,-10%); + -ms-transform: translate(-51%,-10%); + transform: translate(-51%,-10%); +} + +.c2 { + grid-column-start: 2; + grid-row: span 2; + padding-right: 5px; +} + +.c18 { + display: grid; + grid-template-columns: 130px auto; +} + +.c1 { + max-width: 500px; + display: grid; + grid-template-areas: "time line title" "time line instructions"; + grid-template-columns: 65px 30px auto; +} + +.c9 { + grid-column-start: 1; + grid-row: 1 / span 2; + padding-right: 5px; + font-size: 0.9em; +} + +.c32 { + padding: 3px 10px 3px 10px; + border: 0; + margin-top: -15px; + width: 35px; + height: 35px; +} + +.c32:hover { + cursor: pointer; +} + +.c30 { + -webkit-flex: 0 0 25px; + -ms-flex: 0 0 25px; + flex: 0 0 25px; + grid-column: -1; +} + +.c11 { + grid-row-start: 2; + grid-column-start: 3; + grid-area: instructions; +} + +.c7 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + font-size: 1.2em; + grid-row-start: 1; + grid-column-start: 3; +} + +.c8 { + font-size: inherit; + font-weight: bold; + height: 1.2em; + margin: 0; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + -webkit-flex: 1 1 auto; + -ms-flex: 1 1 auto; + flex: 1 1 auto; + padding: 3px 0 10px 0; +} + +.c34 { + text-align: center; + min-width: 30px; + min-height: 30px; + font-size: 1.2em; + background-color: #0070c0; + color: white; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; + border: 1px solid; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + cursor: default; +} + +.c49 { + text-align: center; + min-width: 30px; + min-height: 30px; + font-size: 1.2em; + background-color: #084c8d; + color: white; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; + border: 1px solid; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + cursor: default; +} + +.c35 { + position: absolute; + width: 1px; + height: 1px; + padding: 0; + margin: -1px; + overflow: hidden; + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + border: 0; +} + +.c23 { + display: block; + list-style: none; + padding: 0; +} + +.c26 { + margin-left: 24px; + line-height: 1.25em; + padding-top: 1px; +} + +.c26 > span { + margin-right: 1ch; +} + +.c19 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-self: center; + -ms-flex-item-align: center; + align-self: center; + margin-top: 10px; +} + +.c19 a { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c20 { + color: #676767; + font-size: 13px; + font-style: normal; + padding: 0; +} + +.c25 { + fill: #676767; + float: left; + height: 16px; + width: 16px; +} + +.c24 { + font-size: 13px; + margin-top: 8px; + color: #676767; + font-style: normal; +} + +.c27 { + font-weight: 500; +} + +.c28 { + font-weight: 200; + opacity: 0.8975; + padding-left: 1ch; +} + +.c36 { + font-weight: 200; + font-size: 0.9em; + margin-left: 10px; +} + +.c46 { + float: left; + margin-left: -36px; + color: #fff; +} + +.c47 { + color: #676767; + margin-top: 3px; +} + +.c45 { + z-index: 30; + position: relative; +} + +.c40 { + margin-top: 5px; +} + +.c41 { + color: #676767; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; +} + +.c43 { + font-size: 14px; +} + +.c42 { + padding: 0; +} + +
      +
    1. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + 47.97767, -122.20034 + +
      +
      + 12:57 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 0.3 miles to + + Everett Station Bay C1 + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + SOUTH + on + + service road + + + 0.1 miles + + +
        +
        2. +
      2. +
        + + + +
        +
        + + RIGHT + on + + Smith Avenue + + + 129 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + CONTINUE + on + + Paine Avenue + + + 61 feet + + +
        +
        4. +
      4. +
        + + + +
        +
        + + LEFT + on + + 32nd Street + + + 67 feet + + +
        +
        5. +
      5. +
        + + + +
        +
        + + RIGHT + on + + 32nd Street + + + 313 feet + + +
        +
        6. +
      6. +
        + + + +
        +
        + + LEFT + on + + Unnamed Path + + + 380 feet + + +
        +
        7. +
      +
      +
      +       +
      +
      +
      + +
      +
      2. +
    2. +
      +
      +
      +
      +
      + + 51 + + + Everett - Northgate Station + +
      +
      +
      +
      +
      + + Everett Station Bay C1 + + ID 2345 + + +
      +
      + 1:04 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + Ride + + +
      + + 512 + +
      + + + Northgate Station + + +       + + - + Disembark at + Northgate Station + + ID 2191 + + +       + +       +
      +
      +
      +
      +
      +
      +
      + +
      +
      +
      +
      +
        +
      1. +
        + • +
        +
        + Broadway & 34th St +
        +
        2. +
      2. +
        + • +
        +
        + South Everett Fwy Station Bay 3 +
        +
        3. +
      3. +
        + • +
        +
        + Ash Way Park & Ride Bay 1 +
        +
        4. +
      4. +
        + • +
        +
        + Lynnwood Transit Center Bay D3 +
        +
        5. +
      5. +
        + • +
        +
        + Mountlake Terrace Fwy Station Bay 6 +
        +
        6. +
      +
      +
      +
      +
      +
      +
      +
      +
      + +
      +
      3. +
    3. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + Northgate Station + + ID 2191 + + +
      +
      + 1:51 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk to + + Northgate Station - Bay 4 + + + + +
      + + + + +
      +
      +
        +
      +
      +       +
      +
      +
      + +
      +
      4. +
    4. +
      +
      +
      +
      +
      + + 40 + + + + +
      +
      +
      +
      +
      + + Northgate Station - Bay 4 + + ID 35318 + + +
      +
      + 1:55 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + Ride + + +
      + + 40 + +
      + + + Downtown Seattle Ballard + + +       + + - + Disembark at + N 105th St & Aurora Ave N + + ID 40032 + + +       + +       +
      +
      +
      +
      +
      +
      +
      + +
      +
      +
      +
      +
        +
      1. +
        + • +
        +
        + 1st Ave NE & NE 95th St +
        +
        2. +
      2. +
        + • +
        +
        + N 92nd St & Corliss Ave N +
        +
        3. +
      3. +
        + • +
        +
        + College Way N & N 97th St +
        +
        4. +
      4. +
        + • +
        +
        + College Way N & N 103rd St +
        +
        5. +
      5. +
        + • +
        +
        + Meridian Ave N & N 105th St +
        +
        6. +
      6. +
        + • +
        +
        + N Northgate Way & Meridian Ave N +
        +
        7. +
      7. +
        + • +
        +
        + N Northgate Way & Stone Ave N +
        +
        8. +
      +
      +
      +
      +
      +
      +
      +
      +
      + +
      +
      5. +
    5. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + N 105th St & Aurora Ave N + + ID 40032 + + +
      +
      + 2:06 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 259 feet to + + Aurora Ave N & N 105th St + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + EAST + on + + North 105th Street + + + 64 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + RIGHT + on + + service road + + + 14 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + LEFT + on + + Unnamed Path + + + 180 feet + + +
        +
        4. +
      +
      +
      +       +
      +
      +
      + +
      +
      6. +
    6. +
      +
      +
      +
      +
      + + E + + + + +
      +
      +
      +
      +
      + + Aurora Ave N & N 105th St + + ID 7080 + + +
      +
      + 2:07 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + Ride + + +
      + + E Line + +
      + + + Downtown Seattle + + +       + + - + Disembark at + 3rd Ave & Cherry St + + ID 490 + + +       + +       +
      +
      +
      +
      +
      +
      +
      + +
      +
      +
      +
      +
        +
      1. +
        + • +
        +
        + Aurora Ave N & N 100th St +
        +
        2. +
      2. +
        + • +
        +
        + Aurora Ave N & N 95th St +
        +
        3. +
      3. +
        + • +
        +
        + Aurora Ave N & N 90th St +
        +
        4. +
      4. +
        + • +
        +
        + Aurora Ave N & N 85th St +
        +
        5. +
      5. +
        + • +
        +
        + Aurora Ave N & N 80th St +
        +
        6. +
      6. +
        + • +
        +
        + Aurora Ave N & N 76th St +
        +
        7. +
      7. +
        + • +
        +
        + Aurora Ave N & N 65th St +
        +
        8. +
      8. +
        + • +
        +
        + Aurora Ave N & N 46th St +
        +
        9. +
      9. +
        + • +
        +
        + Aurora Ave N & Lynn St +
        +
        10. +
      10. +
        + • +
        +
        + Aurora Ave N & Galer St +
        +
        11. +
      11. +
        + • +
        +
        + 7th Ave N & Thomas St +
        +
        12. +
      12. +
        + • +
        +
        + Wall St & 5th Ave +
        +
        13. +
      13. +
        + • +
        +
        + 3rd Ave & Bell St +
        +
        14. +
      14. +
        + • +
        +
        + 3rd Ave & Virginia St +
        +
        15. +
      15. +
        + • +
        +
        + 3rd Ave & Pike St +
        +
        16. +
      16. +
        + • +
        +
        + 3rd Ave & Seneca St +
        +
        17. +
      +
      +
      +
      +
      +
      +
      +
      +
      + +
      +
      7. +
    7. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + 3rd Ave & Cherry St + + ID 490 + + +
      +
      + 2:39 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 443 feet to + + 208 James St, Seattle, WA 98104-2212, United States + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + SOUTHEAST + on + + sidewalk + + + 326 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + UTURN_RIGHT + on + + sidewalk + + + 117 feet + + +
        +
        3. +
      +
      +
      +       +
      +
      +
      + +
      +
      8. +
    8. +
      +
      +
      +
      + +
      +
      +
      +
      +
      + + 208 James St, Seattle, WA 98104-2212, United States + +
      +
      + 2:41 PM +
      + + Arrive at + 208 James St, Seattle, WA 98104-2212, United States + +
      +
      + +
      +
      9. +
    +`; + +exports[`Storyshots ItineraryBody/otp-ui Zero Alerts Without Collapsing Prop 1`] = ` + + + +`; + +exports[`Storyshots ItineraryBody/otp-ui Zero Alerts Without Collapsing Prop 2`] = ` +.c22 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c51 { + color: #f44256; +} + +.c29 { + border-top-style: solid; + border-top-width: 0; + padding-top: 0; + padding-bottom: 10px; +} + +.c16 { + background: transparent; + border: 0; + color: inherit; + cursor: pointer; + font-size: inherit; + -webkit-text-decoration: none; + text-decoration: none; +} + +.c31 { + color: #008; + margin-left: 5px; +} + +.c31:hover { + -webkit-text-decoration: underline; + text-decoration: underline; +} + +.c6 { + color: black; + background-color: #e9e9e9; + border: 2px solid #bbb; + text-align: center; + width: 25px; + height: 25px; + font-size: 1.2em; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; +} + +.c21::before { + content: ""; + margin: 0 0.125em; +} + +.c50 { + text-align: center; +} + +.c4 { + border-left: dotted 4px #484848; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c33 { + border-left: solid 8px #0070c0; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c48 { + border-left: solid 8px #008ab0; + height: 100%; + width: 0; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); +} + +.c44 { + display: block; + font-size: 13px; + list-style: none; + padding: 0; +} + +.c0 { + list-style: none; + padding: 0; +} + +.c12 { + color: #676767; + font-size: 13px; + padding-bottom: 12px; +} + +.c17 { + bottom: 0; + cursor: pointer; + left: 0; + position: absolute; + right: 0; + top: 0; + width: 100%; + z-index: 1; +} + +.c13 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + line-height: 16px; + min-height: 31px; + position: relative; +} + +.c10 { + display: inline-block; + grid-row-start: 2; + grid-column-start: 1; + height: 0; + overflow: hidden; + width: 0; +} + +.c15 { + font-weight: inherit; +} + +.c39 { + font-size: 13px; + font-weight: 500; +} + +.c38 { + font-weight: 800; + margin-right: 6px; +} + +.c37 { + color: #807373; + margin-top: 5px; +} + +.c14 { + -webkit-flex-shrink: 0; + -ms-flex-negative: 0; + flex-shrink: 0; +} + +.c3 { + position: relative; + left: 50%; + -webkit-transform: translateX(-50%); + -ms-transform: translateX(-50%); + transform: translateX(-50%); + height: 100%; +} + +.c5 { + width: 30px; + height: 30px; + border-radius: 50%; + position: absolute; + left: 50%; + top: 0; + -webkit-transform: translate(-51%,-10%); + -ms-transform: translate(-51%,-10%); + transform: translate(-51%,-10%); +} + +.c2 { + grid-column-start: 2; + grid-row: span 2; + padding-right: 5px; +} + +.c18 { + display: grid; + grid-template-columns: 130px auto; +} + +.c1 { + max-width: 500px; + display: grid; + grid-template-areas: "time line title" "time line instructions"; + grid-template-columns: 65px 30px auto; +} + +.c9 { + grid-column-start: 1; + grid-row: 1 / span 2; + padding-right: 5px; + font-size: 0.9em; +} + +.c32 { + padding: 3px 10px 3px 10px; + border: 0; + margin-top: -15px; + width: 35px; + height: 35px; +} + +.c32:hover { + cursor: pointer; +} + +.c30 { + -webkit-flex: 0 0 25px; + -ms-flex: 0 0 25px; + flex: 0 0 25px; + grid-column: -1; +} + +.c11 { + grid-row-start: 2; + grid-column-start: 3; + grid-area: instructions; +} + +.c7 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + font-size: 1.2em; + grid-row-start: 1; + grid-column-start: 3; +} + +.c8 { + font-size: inherit; + font-weight: bold; + height: 1.2em; + margin: 0; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + -webkit-flex: 1 1 auto; + -ms-flex: 1 1 auto; + flex: 1 1 auto; + padding: 3px 0 10px 0; +} + +.c34 { + text-align: center; + min-width: 30px; + min-height: 30px; + font-size: 1.2em; + background-color: #0070c0; + color: white; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; + border: 1px solid; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + cursor: default; +} + +.c49 { + text-align: center; + min-width: 30px; + min-height: 30px; + font-size: 1.2em; + background-color: #084c8d; + color: white; + border-radius: 50%; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + padding-left: 1px; + border: 1px solid; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + cursor: default; +} + +.c35 { + position: absolute; + width: 1px; + height: 1px; + padding: 0; + margin: -1px; + overflow: hidden; + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + border: 0; +} + +.c23 { + display: block; + list-style: none; + padding: 0; +} + +.c26 { + margin-left: 24px; + line-height: 1.25em; + padding-top: 1px; +} + +.c26 > span { + margin-right: 1ch; +} + +.c19 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-align-self: center; + -ms-flex-item-align: center; + align-self: center; + margin-top: 10px; +} + +.c19 a { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c20 { + color: #676767; + font-size: 13px; + font-style: normal; + padding: 0; +} + +.c25 { + fill: #676767; + float: left; + height: 16px; + width: 16px; +} + +.c24 { + font-size: 13px; + margin-top: 8px; + color: #676767; + font-style: normal; +} + +.c27 { + font-weight: 500; +} + +.c28 { + font-weight: 200; + opacity: 0.8975; + padding-left: 1ch; +} + +.c36 { + font-weight: 200; + font-size: 0.9em; + margin-left: 10px; +} + +.c46 { + float: left; + margin-left: -36px; + color: #fff; +} + +.c47 { + color: #676767; + margin-top: 3px; +} + +.c45 { + z-index: 30; + position: relative; +} + +.c40 { + margin-top: 5px; +} + +.c41 { + color: #676767; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; +} + +.c43 { + font-size: 14px; +} + +.c42 { + padding: 0; +} + +
      +
    1. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + 47.97767, -122.20034 + +
      +
      + 12:57 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 0.3 miles to + + Everett Station Bay C1 + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + SOUTH + on + + service road + + + 0.1 miles + + +
        +
        2. +
      2. +
        + + + +
        +
        + + RIGHT + on + + Smith Avenue + + + 129 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + CONTINUE + on + + Paine Avenue + + + 61 feet + + +
        +
        4. +
      4. +
        + + + +
        +
        + + LEFT + on + + 32nd Street + + + 67 feet + + +
        +
        5. +
      5. +
        + + + +
        +
        + + RIGHT + on + + 32nd Street + + + 313 feet + + +
        +
        6. +
      6. +
        + + + +
        +
        + + LEFT + on + + Unnamed Path + + + 380 feet + + +
        +
        7. +
      +
      +
      +       +
      +
      +
      + +
      +
      2. +
    2. +
      +
      +
      +
      +
      + + 51 + + + Everett - Northgate Station + +
      +
      +
      +
      +
      + + Everett Station Bay C1 + + ID 2345 + + +
      +
      + 1:04 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + Ride + + +
      + + 512 + +
      + + + Northgate Station + + +       + + - + Disembark at + Northgate Station + + ID 2191 + + +       + +       +
      +
      +
      +
      +
      +
      +
      + +
      +
      +
      +
      +
        +
      1. +
        + • +
        +
        + Broadway & 34th St +
        +
        2. +
      2. +
        + • +
        +
        + South Everett Fwy Station Bay 3 +
        +
        3. +
      3. +
        + • +
        +
        + Ash Way Park & Ride Bay 1 +
        +
        4. +
      4. +
        + • +
        +
        + Lynnwood Transit Center Bay D3 +
        +
        5. +
      5. +
        + • +
        +
        + Mountlake Terrace Fwy Station Bay 6 +
        +
        6. +
      +
      +
      +
      +
      +
      +
      +
      +
      + +
      +
      3. +
    3. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + Northgate Station + + ID 2191 + + +
      +
      + 1:51 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk to + + Northgate Station - Bay 4 + + + + +
      + + + + +
      +
      +
        +
      +
      +       +
      +
      +
      + +
      +
      4. +
    4. +
      +
      +
      +
      +
      + + 40 + + + + +
      +
      +
      +
      +
      + + Northgate Station - Bay 4 + + ID 35318 + + +
      +
      + 1:55 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + Ride + + +
      + + 40 + +
      + + + Downtown Seattle Ballard + + +       + + - + Disembark at + N 105th St & Aurora Ave N + + ID 40032 + + +       + +       +
      +
      +
      +
      +
      +
      +
      + +
      +
      +
      +
      +
        +
      1. +
        + • +
        +
        + 1st Ave NE & NE 95th St +
        +
        2. +
      2. +
        + • +
        +
        + N 92nd St & Corliss Ave N +
        +
        3. +
      3. +
        + • +
        +
        + College Way N & N 97th St +
        +
        4. +
      4. +
        + • +
        +
        + College Way N & N 103rd St +
        +
        5. +
      5. +
        + • +
        +
        + Meridian Ave N & N 105th St +
        +
        6. +
      6. +
        + • +
        +
        + N Northgate Way & Meridian Ave N +
        +
        7. +
      7. +
        + • +
        +
        + N Northgate Way & Stone Ave N +
        +
        8. +
      +
      +
      +
      +
      +
      +
      +
      +
      + +
      +
      5. +
    5. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + N 105th St & Aurora Ave N + + ID 40032 + + +
      +
      + 2:06 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 259 feet to + + Aurora Ave N & N 105th St + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + EAST + on + + North 105th Street + + + 64 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + RIGHT + on + + service road + + + 14 feet + + +
        +
        3. +
      3. +
        + + + +
        +
        + + LEFT + on + + Unnamed Path + + + 180 feet + + +
        +
        4. +
      +
      +
      +       +
      +
      +
      + +
      +
      6. +
    6. +
      +
      +
      +
      +
      + + E + + + + +
      +
      +
      +
      +
      + + Aurora Ave N & N 105th St + + ID 7080 + + +
      +
      + 2:07 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + Ride + + +
      + + E Line + +
      + + + Downtown Seattle + + +       + + - + Disembark at + 3rd Ave & Cherry St + + ID 490 + + +       + +       +
      +
      +
      +
      +
      +
      +
      + +
      +
      +
      +
      +
        +
      1. +
        + • +
        +
        + Aurora Ave N & N 100th St +
        +
        2. +
      2. +
        + • +
        +
        + Aurora Ave N & N 95th St +
        +
        3. +
      3. +
        + • +
        +
        + Aurora Ave N & N 90th St +
        +
        4. +
      4. +
        + • +
        +
        + Aurora Ave N & N 85th St +
        +
        5. +
      5. +
        + • +
        +
        + Aurora Ave N & N 80th St +
        +
        6. +
      6. +
        + • +
        +
        + Aurora Ave N & N 76th St +
        +
        7. +
      7. +
        + • +
        +
        + Aurora Ave N & N 65th St +
        +
        8. +
      8. +
        + • +
        +
        + Aurora Ave N & N 46th St +
        +
        9. +
      9. +
        + • +
        +
        + Aurora Ave N & Lynn St +
        +
        10. +
      10. +
        + • +
        +
        + Aurora Ave N & Galer St +
        +
        11. +
      11. +
        + • +
        +
        + 7th Ave N & Thomas St +
        +
        12. +
      12. +
        + • +
        +
        + Wall St & 5th Ave +
        +
        13. +
      13. +
        + • +
        +
        + 3rd Ave & Bell St +
        +
        14. +
      14. +
        + • +
        +
        + 3rd Ave & Virginia St +
        +
        15. +
      15. +
        + • +
        +
        + 3rd Ave & Pike St +
        +
        16. +
      16. +
        + • +
        +
        + 3rd Ave & Seneca St +
        +
        17. +
      +
      +
      +
      +
      +
      +
      +
      +
      + +
      +
      7. +
    7. +
      +
      +
      +
      +
      + + + Travel by walking + + + +
      +
      +
      +
      +
      + + 3rd Ave & Cherry St + + ID 490 + + +
      +
      + 2:39 PM +
      + + otpUi.TransitLegBody.fromLocation + +
      +
      +
      + + + + - + + + Walk 443 feet to + + 208 James St, Seattle, WA 98104-2212, United States + + + + +
      + + + + +
      +
      +
        +
      1. +
        + + + +
        +
        + + Head + SOUTHEAST + on + + sidewalk + + + 326 feet + + +
        +
        2. +
      2. +
        + + + +
        +
        + + UTURN_RIGHT + on + + sidewalk + + + 117 feet + + +
        +
        3. +
      +
      +
      +       +
      +
      +
      + +
      +
      8. +
    8. +
      +
      +
      +
      + +
      +
      +
      +
      +
      + + 208 James St, Seattle, WA 98104-2212, United States + +
      +
      + 2:41 PM +
      + + Arrive at + 208 James St, Seattle, WA 98104-2212, United States + +
      +
      + +
      +
      9. +
    +`; + +exports[`Storyshots LocationField/Desktop Context Auto Focus With Multiple Controls 1`] = ` + +
    + + + +
    +     +`; + +exports[`Storyshots LocationField/Desktop Context Auto Focus With Multiple Controls 2`] = ` +.c3 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c4 { + color: #333; +} + +.c6 { + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + display: inline-block; + height: 0; + overflow: hidden; + width: 0; +} + +.c1 { + border: none; + background: none; +} + +.c2 { + width: 30px; +} + +.c8 { + background-clip: padding-box; + background-color: #fff; + border-radius: 4px; + border: 1px solid rgba(0,0,0,0.15); + box-shadow: 0 6px 12px rgba(0,0,0,0.175); + float: left; + font-size: 14px; + left: 0; + list-style: none; + margin: 2px 0 0; + min-width: 160px; + max-height: 75vh; + padding: 5px 0; + position: absolute; + overflow: scroll; + text-align: left; + top: 100%; + z-index: 1000000; +} + +input[aria-expanded="false"] ~ .c7 { + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + display: inline-block; + height: 0; + overflow: hidden; + width: 0; +} + +.c5 { + border: none; + box-shadow: none; + font-size: 17px; + outline: none; +} + +.c0 { + border-bottom: 1px solid #000; + border-collapse: separate; + display: table; + margin-bottom: 15px; + position: relative; +} + +
    + + +
    + + + +
      +
    +
    +`; + +exports[`Storyshots LocationField/Desktop Context Blank 1`] = ` + + + +`; + +exports[`Storyshots LocationField/Desktop Context Blank 2`] = ` +.c3 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c4 { + color: #333; +} + +.c6 { + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + display: inline-block; + height: 0; + overflow: hidden; + width: 0; +} + +.c1 { + border: none; + background: none; +} + +.c2 { + width: 30px; +} + +.c8 { + background-clip: padding-box; + background-color: #fff; + border-radius: 4px; + border: 1px solid rgba(0,0,0,0.15); + box-shadow: 0 6px 12px rgba(0,0,0,0.175); + float: left; + font-size: 14px; + left: 0; + list-style: none; + margin: 2px 0 0; + min-width: 160px; + max-height: 75vh; + padding: 5px 0; + position: absolute; + overflow: scroll; + text-align: left; + top: 100%; + z-index: 1000000; +} + +input[aria-expanded="false"] ~ .c7 { + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + display: inline-block; + height: 0; + overflow: hidden; + width: 0; +} + +.c5 { + border: none; + box-shadow: none; + font-size: 17px; + outline: none; +} + +.c0 { + border-bottom: 1px solid #000; + border-collapse: separate; + display: table; + margin-bottom: 15px; + position: relative; +} + +
    + + + +
      +
    +`; + +exports[`Storyshots LocationField/Desktop Context Geocoder No Results 1`] = ` + + + +`; + +exports[`Storyshots LocationField/Desktop Context Geocoder No Results 2`] = ` +.c3 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c4 { + color: #333; +} + +.c6 { + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + display: inline-block; + height: 0; + overflow: hidden; + width: 0; +} + +.c1 { + border: none; + background: none; +} + +.c2 { + width: 30px; +} + +.c8 { + background-clip: padding-box; + background-color: #fff; + border-radius: 4px; + border: 1px solid rgba(0,0,0,0.15); + box-shadow: 0 6px 12px rgba(0,0,0,0.175); + float: left; + font-size: 14px; + left: 0; + list-style: none; + margin: 2px 0 0; + min-width: 160px; + max-height: 75vh; + padding: 5px 0; + position: absolute; + overflow: scroll; + text-align: left; + top: 100%; + z-index: 1000000; +} + +input[aria-expanded="false"] ~ .c7 { + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + display: inline-block; + height: 0; + overflow: hidden; + width: 0; +} + +.c5 { + border: none; + box-shadow: none; + font-size: 17px; + outline: none; +} + +.c0 { + border-bottom: 1px solid #000; + border-collapse: separate; + display: table; + margin-bottom: 15px; + position: relative; +} + +
    + + + +
      +
    +`; + +exports[`Storyshots LocationField/Desktop Context Geocoder Unreachable 1`] = ` + + + +`; + +exports[`Storyshots LocationField/Desktop Context Geocoder Unreachable 2`] = ` +.c3 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c4 { + color: #333; +} + +.c6 { + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + display: inline-block; + height: 0; + overflow: hidden; + width: 0; +} + +.c1 { + border: none; + background: none; +} + +.c2 { + width: 30px; +} + +.c8 { + background-clip: padding-box; + background-color: #fff; + border-radius: 4px; + border: 1px solid rgba(0,0,0,0.15); + box-shadow: 0 6px 12px rgba(0,0,0,0.175); + float: left; + font-size: 14px; + left: 0; + list-style: none; + margin: 2px 0 0; + min-width: 160px; + max-height: 75vh; + padding: 5px 0; + position: absolute; + overflow: scroll; + text-align: left; + top: 100%; + z-index: 1000000; +} + +input[aria-expanded="false"] ~ .c7 { + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + display: inline-block; + height: 0; + overflow: hidden; + width: 0; +} + +.c5 { + border: none; + box-shadow: none; + font-size: 17px; + outline: none; +} + +.c0 { + border-bottom: 1px solid #000; + border-collapse: separate; + display: table; + margin-bottom: 15px; + position: relative; +} + +
    + + + +
      +
    +`; + +exports[`Storyshots LocationField/Desktop Context Here Geocoder 1`] = ` + + + +`; + +exports[`Storyshots LocationField/Desktop Context Here Geocoder 2`] = ` +.c3 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c4 { + color: #333; +} + +.c6 { + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + display: inline-block; + height: 0; + overflow: hidden; + width: 0; +} + +.c1 { + border: none; + background: none; +} + +.c2 { + width: 30px; +} + +.c8 { + background-clip: padding-box; + background-color: #fff; + border-radius: 4px; + border: 1px solid rgba(0,0,0,0.15); + box-shadow: 0 6px 12px rgba(0,0,0,0.175); + float: left; + font-size: 14px; + left: 0; + list-style: none; + margin: 2px 0 0; + min-width: 160px; + max-height: 75vh; + padding: 5px 0; + position: absolute; + overflow: scroll; + text-align: left; + top: 100%; + z-index: 1000000; +} + +input[aria-expanded="false"] ~ .c7 { + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + display: inline-block; + height: 0; + overflow: hidden; + width: 0; +} + +.c5 { + border: none; + box-shadow: none; + font-size: 17px; + outline: none; +} + +.c0 { + border-bottom: 1px solid #000; + border-collapse: separate; + display: table; + margin-bottom: 15px; + position: relative; +} + +
    + + + +
      +
    +`; + +exports[`Storyshots LocationField/Desktop Context Location Unavailable 1`] = ` + + + +`; + +exports[`Storyshots LocationField/Desktop Context Location Unavailable 2`] = ` +.c3 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c4 { + color: #333; +} + +.c6 { + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + display: inline-block; + height: 0; + overflow: hidden; + width: 0; +} + +.c1 { + border: none; + background: none; +} + +.c2 { + width: 30px; +} + +.c8 { + background-clip: padding-box; + background-color: #fff; + border-radius: 4px; + border: 1px solid rgba(0,0,0,0.15); + box-shadow: 0 6px 12px rgba(0,0,0,0.175); + float: left; + font-size: 14px; + left: 0; + list-style: none; + margin: 2px 0 0; + min-width: 160px; + max-height: 75vh; + padding: 5px 0; + position: absolute; + overflow: scroll; + text-align: left; + top: 100%; + z-index: 1000000; +} + +input[aria-expanded="false"] ~ .c7 { + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + display: inline-block; + height: 0; + overflow: hidden; + width: 0; +} + +.c5 { + border: none; + box-shadow: none; + font-size: 17px; + outline: none; +} + +.c0 { + border-bottom: 1px solid #000; + border-collapse: separate; + display: table; + margin-bottom: 15px; + position: relative; +} + +
    + + + +
      +
    +`; + +exports[`Storyshots LocationField/Desktop Context No Auto Focus With Multiple Controls 1`] = ` + +
    + + + +
    +     +`; + +exports[`Storyshots LocationField/Desktop Context No Auto Focus With Multiple Controls 2`] = ` +.c3 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c4 { + color: #333; +} + +.c6 { + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + display: inline-block; + height: 0; + overflow: hidden; + width: 0; +} + +.c1 { + border: none; + background: none; +} + +.c2 { + width: 30px; +} + +.c8 { + background-clip: padding-box; + background-color: #fff; + border-radius: 4px; + border: 1px solid rgba(0,0,0,0.15); + box-shadow: 0 6px 12px rgba(0,0,0,0.175); + float: left; + font-size: 14px; + left: 0; + list-style: none; + margin: 2px 0 0; + min-width: 160px; + max-height: 75vh; + padding: 5px 0; + position: absolute; + overflow: scroll; + text-align: left; + top: 100%; + z-index: 1000000; +} + +input[aria-expanded="false"] ~ .c7 { + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + display: inline-block; + height: 0; + overflow: hidden; + width: 0; +} + +.c5 { + border: none; + box-shadow: none; + font-size: 17px; + outline: none; +} + +.c0 { + border-bottom: 1px solid #000; + border-collapse: separate; + display: table; + margin-bottom: 15px; + position: relative; +} + +
    + + +
    + + + +
      +
    +
    +`; + +exports[`Storyshots LocationField/Desktop Context Required And Invalid State 1`] = ` + + + +`; + +exports[`Storyshots LocationField/Desktop Context Required And Invalid State 2`] = ` +.c3 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c4 { + color: #333; +} + +.c6 { + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + display: inline-block; + height: 0; + overflow: hidden; + width: 0; +} + +.c1 { + border: none; + background: none; +} + +.c2 { + width: 30px; +} + +.c8 { + background-clip: padding-box; + background-color: #fff; + border-radius: 4px; + border: 1px solid rgba(0,0,0,0.15); + box-shadow: 0 6px 12px rgba(0,0,0,0.175); + float: left; + font-size: 14px; + left: 0; + list-style: none; + margin: 2px 0 0; + min-width: 160px; + max-height: 75vh; + padding: 5px 0; + position: absolute; + overflow: scroll; + text-align: left; + top: 100%; + z-index: 1000000; +} + +input[aria-expanded="false"] ~ .c7 { + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + display: inline-block; + height: 0; + overflow: hidden; + width: 0; +} + +.c5 { + border: none; + box-shadow: none; + font-size: 17px; + outline: none; +} + +.c0 { + border-bottom: 1px solid #000; + border-collapse: separate; + display: table; + margin-bottom: 15px; + position: relative; +} + +
    + + + +
      +
    +`; + +exports[`Storyshots LocationField/Desktop Context Selected Location 1`] = ` + + + +`; + +exports[`Storyshots LocationField/Desktop Context Selected Location 2`] = ` +.c3 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c4 { + color: #f44256; +} + +.c7 { + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + display: inline-block; + height: 0; + overflow: hidden; + width: 0; +} + +.c1 { + border: none; + background: none; +} + +.c6 { + color: #888; + cursor: pointer; + width: 30px; +} + +.c2 { + width: 30px; +} + +.c9 { + background-clip: padding-box; + background-color: #fff; + border-radius: 4px; + border: 1px solid rgba(0,0,0,0.15); + box-shadow: 0 6px 12px rgba(0,0,0,0.175); + float: left; + font-size: 14px; + left: 0; + list-style: none; + margin: 2px 0 0; + min-width: 160px; + max-height: 75vh; + padding: 5px 0; + position: absolute; + overflow: scroll; + text-align: left; + top: 100%; + z-index: 1000000; +} + +input[aria-expanded="false"] ~ .c8 { + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + display: inline-block; + height: 0; + overflow: hidden; + width: 0; +} + +.c5 { + border: none; + box-shadow: none; + font-size: 17px; + outline: none; +} + +.c0 { + border-bottom: 1px solid #000; + border-collapse: separate; + display: table; + margin-bottom: 15px; + position: relative; +} + +
    + + + + +
      +
    +`; + +exports[`Storyshots LocationField/Desktop Context Selected Location Custom Clear 1`] = ` + + + } + currentPosition={ + Object { + "coords": Object { + "latitude": 45.508246, + "longitude": -122.711574, + }, + } + } + geocoderConfig={ + Object { + "baseUrl": "https://ws-st.trimet.org/pelias/v1", + "boundary": Object { + "rect": Object { + "maxLat": 45.7445, + "maxLon": -122.135, + "minLat": 45.273, + "minLon": -123.2034, + }, + }, + "maxNearbyStops": 4, + "type": "PELIAS", + } + } + getCurrentPosition={[Function]} + location={ + Object { + "lat": 0, + "lon": 0, + "name": "123 Main St", + } + } + locationType="to" + onLocationSelected={[Function]} + /> + +`; + +exports[`Storyshots LocationField/Desktop Context Selected Location Custom Clear 2`] = ` +.c3 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c4 { + color: #f44256; +} + +.c7 { + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + display: inline-block; + height: 0; + overflow: hidden; + width: 0; +} + +.c1 { + border: none; + background: none; +} + +.c6 { + color: #888; + cursor: pointer; + width: 30px; +} + +.c2 { + width: 30px; +} + +.c9 { + background-clip: padding-box; + background-color: #fff; + border-radius: 4px; + border: 1px solid rgba(0,0,0,0.15); + box-shadow: 0 6px 12px rgba(0,0,0,0.175); + float: left; + font-size: 14px; + left: 0; + list-style: none; + margin: 2px 0 0; + min-width: 160px; + max-height: 75vh; + padding: 5px 0; + position: absolute; + overflow: scroll; + text-align: left; + top: 100%; + z-index: 1000000; +} + +input[aria-expanded="false"] ~ .c8 { + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + display: inline-block; + height: 0; + overflow: hidden; + width: 0; +} + +.c5 { + border: none; + box-shadow: none; + font-size: 17px; + outline: none; +} + +.c0 { + border-bottom: 1px solid #000; + border-collapse: separate; + display: table; + margin-bottom: 15px; + position: relative; +} + +
    + + + + +
      +
    +`; + +exports[`Storyshots LocationField/Desktop Context Slow Geocoder 1`] = ` + + + +`; + +exports[`Storyshots LocationField/Desktop Context Slow Geocoder 2`] = ` +.c3 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c4 { + color: #333; +} + +.c6 { + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + display: inline-block; + height: 0; + overflow: hidden; + width: 0; +} + +.c1 { + border: none; + background: none; +} + +.c2 { + width: 30px; +} + +.c8 { + background-clip: padding-box; + background-color: #fff; + border-radius: 4px; + border: 1px solid rgba(0,0,0,0.15); + box-shadow: 0 6px 12px rgba(0,0,0,0.175); + float: left; + font-size: 14px; + left: 0; + list-style: none; + margin: 2px 0 0; + min-width: 160px; + max-height: 75vh; + padding: 5px 0; + position: absolute; + overflow: scroll; + text-align: left; + top: 100%; + z-index: 1000000; +} + +input[aria-expanded="false"] ~ .c7 { + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + display: inline-block; + height: 0; + overflow: hidden; + width: 0; +} + +.c5 { + border: none; + box-shadow: none; + font-size: 17px; + outline: none; +} + +.c0 { + border-bottom: 1px solid #000; + border-collapse: separate; + display: table; + margin-bottom: 15px; + position: relative; +} + +
    + + + +
      +
    +`; + +exports[`Storyshots LocationField/Desktop Context With Bad Api Key Handles Bad Autocomplete 1`] = ` + + + +`; + +exports[`Storyshots LocationField/Desktop Context With Bad Api Key Handles Bad Autocomplete 2`] = ` +.c3 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c4 { + color: #333; +} + +.c6 { + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + display: inline-block; + height: 0; + overflow: hidden; + width: 0; +} + +.c1 { + border: none; + background: none; +} + +.c2 { + width: 30px; +} + +.c8 { + background-clip: padding-box; + background-color: #fff; + border-radius: 4px; + border: 1px solid rgba(0,0,0,0.15); + box-shadow: 0 6px 12px rgba(0,0,0,0.175); + float: left; + font-size: 14px; + left: 0; + list-style: none; + margin: 2px 0 0; + min-width: 160px; + max-height: 75vh; + padding: 5px 0; + position: absolute; + overflow: scroll; + text-align: left; + top: 100%; + z-index: 1000000; +} + +input[aria-expanded="false"] ~ .c7 { + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + display: inline-block; + height: 0; + overflow: hidden; + width: 0; +} + +.c5 { + border: none; + box-shadow: none; + font-size: 17px; + outline: none; +} + +.c0 { + border-bottom: 1px solid #000; + border-collapse: separate; + display: table; + margin-bottom: 15px; + position: relative; +} + +
    + + + +
      +
    +`; + +exports[`Storyshots LocationField/Desktop Context With Custom Result Colors And Icons 1`] = ` + + , + } + } + /> + +`; + +exports[`Storyshots LocationField/Desktop Context With Custom Result Colors And Icons 2`] = ` +.c3 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c4 { + color: #333; +} + +.c6 { + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + display: inline-block; + height: 0; + overflow: hidden; + width: 0; +} + +.c1 { + border: none; + background: none; +} + +.c2 { + width: 30px; +} + +.c8 { + background-clip: padding-box; + background-color: #fff; + border-radius: 4px; + border: 1px solid rgba(0,0,0,0.15); + box-shadow: 0 6px 12px rgba(0,0,0,0.175); + float: left; + font-size: 14px; + left: 0; + list-style: none; + margin: 2px 0 0; + min-width: 160px; + max-height: 75vh; + padding: 5px 0; + position: absolute; + overflow: scroll; + text-align: left; + top: 100%; + z-index: 1000000; +} + +input[aria-expanded="false"] ~ .c7 { + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + display: inline-block; + height: 0; + overflow: hidden; + width: 0; +} + +.c5 { + border: none; + box-shadow: none; + font-size: 17px; + outline: none; +} + +.c0 { + border-bottom: 1px solid #000; + border-collapse: separate; + display: table; + margin-bottom: 15px; + position: relative; +} + +
    + + + +
      +
    +`; + +exports[`Storyshots LocationField/Desktop Context With Prefilled Search 1`] = ` + + + +`; + +exports[`Storyshots LocationField/Desktop Context With Prefilled Search 2`] = ` +.c3 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c4 { + color: #333; +} + +.c6 { + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + display: inline-block; + height: 0; + overflow: hidden; + width: 0; +} + +.c1 { + border: none; + background: none; +} + +.c2 { + width: 30px; +} + +.c8 { + background-clip: padding-box; + background-color: #fff; + border-radius: 4px; + border: 1px solid rgba(0,0,0,0.15); + box-shadow: 0 6px 12px rgba(0,0,0,0.175); + float: left; + font-size: 14px; + left: 0; + list-style: none; + margin: 2px 0 0; + min-width: 160px; + max-height: 75vh; + padding: 5px 0; + position: absolute; + overflow: scroll; + text-align: left; + top: 100%; + z-index: 1000000; +} + +input[aria-expanded="false"] ~ .c7 { + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + display: inline-block; + height: 0; + overflow: hidden; + width: 0; +} + +.c5 { + border: none; + box-shadow: none; + font-size: 17px; + outline: none; +} + +.c0 { + border-bottom: 1px solid #000; + border-collapse: separate; + display: table; + margin-bottom: 15px; + position: relative; +} + +
    + + + +
      +
    +`; + +exports[`Storyshots LocationField/Desktop Context With User Settings 1`] = ` + + + +`; + +exports[`Storyshots LocationField/Desktop Context With User Settings 2`] = ` +.c3 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c4 { + color: #333; +} + +.c6 { + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + display: inline-block; + height: 0; + overflow: hidden; + width: 0; +} + +.c1 { + border: none; + background: none; +} + +.c2 { + width: 30px; +} + +.c8 { + background-clip: padding-box; + background-color: #fff; + border-radius: 4px; + border: 1px solid rgba(0,0,0,0.15); + box-shadow: 0 6px 12px rgba(0,0,0,0.175); + float: left; + font-size: 14px; + left: 0; + list-style: none; + margin: 2px 0 0; + min-width: 160px; + max-height: 75vh; + padding: 5px 0; + position: absolute; + overflow: scroll; + text-align: left; + top: 100%; + z-index: 1000000; +} + +input[aria-expanded="false"] ~ .c7 { + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + display: inline-block; + height: 0; + overflow: hidden; + width: 0; +} + +.c5 { + border: none; + box-shadow: none; + font-size: 17px; + outline: none; +} + +.c0 { + border-bottom: 1px solid #000; + border-collapse: separate; + display: table; + margin-bottom: 15px; + position: relative; +} + +
    + + + +
      +
    +`; + +exports[`Storyshots LocationField/Mobile Context Blank 1`] = ` + + + +`; + +exports[`Storyshots LocationField/Mobile Context Blank 2`] = ` +.c3 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c4 { + color: #333; +} + +.c6 { + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + display: inline-block; + height: 0; + overflow: hidden; + width: 0; +} + +.c1 { + border: none; + background: none; +} + +.c2 { + width: 30px; +} + +.c8 { + background-clip: padding-box; + background-color: #fff; + border-radius: 4px; + border: 1px solid rgba(0,0,0,0.15); + box-shadow: 0 6px 12px rgba(0,0,0,0.175); + float: left; + font-size: 14px; + left: 0; + list-style: none; + margin: 2px 0 0; + min-width: 160px; + max-height: 75vh; + padding: 5px 0; + position: absolute; + overflow: scroll; + text-align: left; + top: 100%; + z-index: 1000000; +} + +input[aria-expanded="false"] ~ .c7 { + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + display: inline-block; + height: 0; + overflow: hidden; + width: 0; +} + +.c5 { + border: none; + box-shadow: none; + font-size: 17px; + outline: none; +} + +.c0 { + border-bottom: 1px solid #000; + border-collapse: separate; + display: table; + margin-bottom: 15px; + position: relative; +} + +.c10 { + background-color: transparent; + clear: both; + color: #333; + display: block; + font-weight: 400; + line-height: 1.42857143; + padding: 3px 20px; + -webkit-text-decoration: none; + text-decoration: none; + white-space: nowrap; +} + +.c10:hover { + background-color: #f5f5f5; + cursor: pointer; +} + +.c10[aria-hidden="true"]:hover { + background-color: unset; + cursor: default; +} + +.c11 { + display: block; + padding-top: 5px; + padding-bottom: 3px; +} + +.c13 { + margin-left: 30px; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; +} + +.c12 { + float: left; +} + +.c9 { + border: none; + box-shadow: none; + display: block; +} + +
    + + + +
      +
    • + + + + + + otpUi.LocationField.useCurrentLocation + + +
      • +
    +
    +`; + +exports[`Storyshots LocationField/Mobile Context Geocoder No Results 1`] = ` + + + +`; + +exports[`Storyshots LocationField/Mobile Context Geocoder No Results 2`] = ` +.c3 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c4 { + color: #333; +} + +.c6 { + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + display: inline-block; + height: 0; + overflow: hidden; + width: 0; +} + +.c1 { + border: none; + background: none; +} + +.c2 { + width: 30px; +} + +.c8 { + background-clip: padding-box; + background-color: #fff; + border-radius: 4px; + border: 1px solid rgba(0,0,0,0.15); + box-shadow: 0 6px 12px rgba(0,0,0,0.175); + float: left; + font-size: 14px; + left: 0; + list-style: none; + margin: 2px 0 0; + min-width: 160px; + max-height: 75vh; + padding: 5px 0; + position: absolute; + overflow: scroll; + text-align: left; + top: 100%; + z-index: 1000000; +} + +input[aria-expanded="false"] ~ .c7 { + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + display: inline-block; + height: 0; + overflow: hidden; + width: 0; +} + +.c5 { + border: none; + box-shadow: none; + font-size: 17px; + outline: none; +} + +.c0 { + border-bottom: 1px solid #000; + border-collapse: separate; + display: table; + margin-bottom: 15px; + position: relative; +} + +.c10 { + background-color: transparent; + clear: both; + color: #333; + display: block; + font-weight: 400; + line-height: 1.42857143; + padding: 3px 20px; + -webkit-text-decoration: none; + text-decoration: none; + white-space: nowrap; +} + +.c10:hover { + background-color: #f5f5f5; + cursor: pointer; +} + +.c10[aria-hidden="true"]:hover { + background-color: unset; + cursor: default; +} + +.c11 { + display: block; + padding-top: 5px; + padding-bottom: 3px; +} + +.c13 { + margin-left: 30px; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; +} + +.c12 { + float: left; +} + +.c9 { + border: none; + box-shadow: none; + display: block; +} + +
    + + + +
      +
    • + + + + + + otpUi.LocationField.useCurrentLocation + + +
      • +
    +
    +`; + +exports[`Storyshots LocationField/Mobile Context Geocoder Unreachable 1`] = ` + + + +`; + +exports[`Storyshots LocationField/Mobile Context Geocoder Unreachable 2`] = ` +.c3 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c4 { + color: #333; +} + +.c6 { + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + display: inline-block; + height: 0; + overflow: hidden; + width: 0; +} + +.c1 { + border: none; + background: none; +} + +.c2 { + width: 30px; +} + +.c8 { + background-clip: padding-box; + background-color: #fff; + border-radius: 4px; + border: 1px solid rgba(0,0,0,0.15); + box-shadow: 0 6px 12px rgba(0,0,0,0.175); + float: left; + font-size: 14px; + left: 0; + list-style: none; + margin: 2px 0 0; + min-width: 160px; + max-height: 75vh; + padding: 5px 0; + position: absolute; + overflow: scroll; + text-align: left; + top: 100%; + z-index: 1000000; +} + +input[aria-expanded="false"] ~ .c7 { + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + display: inline-block; + height: 0; + overflow: hidden; + width: 0; +} + +.c5 { + border: none; + box-shadow: none; + font-size: 17px; + outline: none; +} + +.c0 { + border-bottom: 1px solid #000; + border-collapse: separate; + display: table; + margin-bottom: 15px; + position: relative; +} + +.c10 { + background-color: transparent; + clear: both; + color: #333; + display: block; + font-weight: 400; + line-height: 1.42857143; + padding: 3px 20px; + -webkit-text-decoration: none; + text-decoration: none; + white-space: nowrap; +} + +.c10:hover { + background-color: #f5f5f5; + cursor: pointer; +} + +.c10[aria-hidden="true"]:hover { + background-color: unset; + cursor: default; +} + +.c11 { + display: block; + padding-top: 5px; + padding-bottom: 3px; +} + +.c13 { + margin-left: 30px; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; +} + +.c12 { + float: left; +} + +.c9 { + border: none; + box-shadow: none; + display: block; +} + +
    + + + +
      +
    • + + + + + + otpUi.LocationField.useCurrentLocation + + +
      • +
    +
    +`; + +exports[`Storyshots LocationField/Mobile Context Location Unavailable 1`] = ` + + + +`; + +exports[`Storyshots LocationField/Mobile Context Location Unavailable 2`] = ` +.c3 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c4 { + color: #333; +} + +.c6 { + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + display: inline-block; + height: 0; + overflow: hidden; + width: 0; +} + +.c1 { + border: none; + background: none; +} + +.c2 { + width: 30px; +} + +.c8 { + background-clip: padding-box; + background-color: #fff; + border-radius: 4px; + border: 1px solid rgba(0,0,0,0.15); + box-shadow: 0 6px 12px rgba(0,0,0,0.175); + float: left; + font-size: 14px; + left: 0; + list-style: none; + margin: 2px 0 0; + min-width: 160px; + max-height: 75vh; + padding: 5px 0; + position: absolute; + overflow: scroll; + text-align: left; + top: 100%; + z-index: 1000000; +} + +input[aria-expanded="false"] ~ .c7 { + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + display: inline-block; + height: 0; + overflow: hidden; + width: 0; +} + +.c5 { + border: none; + box-shadow: none; + font-size: 17px; + outline: none; +} + +.c0 { + border-bottom: 1px solid #000; + border-collapse: separate; + display: table; + margin-bottom: 15px; + position: relative; +} + +.c10 { + background-color: transparent; + clear: both; + color: #333; + display: block; + font-weight: 400; + line-height: 1.42857143; + padding: 3px 20px; + -webkit-text-decoration: none; + text-decoration: none; + white-space: nowrap; +} + +.c10:hover { + background-color: #f5f5f5; + cursor: pointer; +} + +.c10[aria-hidden="true"]:hover { + background-color: unset; + cursor: default; +} + +.c11 { + display: block; + padding-top: 5px; + padding-bottom: 3px; +} + +.c13 { + margin-left: 30px; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; +} + +.c12 { + float: left; +} + +.c9 { + border: none; + box-shadow: none; + display: block; +} + +
    + + + + otpUi.LocationField.currentLocationUnavailable + +
      +
    • + + + + + + otpUi.LocationField.currentLocationUnavailable + + +
      • +
    +
    +`; + +exports[`Storyshots LocationField/Mobile Context Selected Location 1`] = ` + + + +`; + +exports[`Storyshots LocationField/Mobile Context Selected Location 2`] = ` +.c3 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c4 { + color: #f44256; +} + +.c7 { + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + display: inline-block; + height: 0; + overflow: hidden; + width: 0; +} + +.c1 { + border: none; + background: none; +} + +.c6 { + color: #888; + cursor: pointer; + width: 30px; +} + +.c2 { + width: 30px; +} + +.c9 { + background-clip: padding-box; + background-color: #fff; + border-radius: 4px; + border: 1px solid rgba(0,0,0,0.15); + box-shadow: 0 6px 12px rgba(0,0,0,0.175); + float: left; + font-size: 14px; + left: 0; + list-style: none; + margin: 2px 0 0; + min-width: 160px; + max-height: 75vh; + padding: 5px 0; + position: absolute; + overflow: scroll; + text-align: left; + top: 100%; + z-index: 1000000; +} + +input[aria-expanded="false"] ~ .c8 { + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + display: inline-block; + height: 0; + overflow: hidden; + width: 0; +} + +.c5 { + border: none; + box-shadow: none; + font-size: 17px; + outline: none; +} + +.c0 { + border-bottom: 1px solid #000; + border-collapse: separate; + display: table; + margin-bottom: 15px; + position: relative; +} + +.c11 { + background-color: transparent; + clear: both; + color: #333; + display: block; + font-weight: 400; + line-height: 1.42857143; + padding: 3px 20px; + -webkit-text-decoration: none; + text-decoration: none; + white-space: nowrap; +} + +.c11:hover { + background-color: #f5f5f5; + cursor: pointer; +} + +.c11[aria-hidden="true"]:hover { + background-color: unset; + cursor: default; +} + +.c12 { + display: block; + padding-top: 5px; + padding-bottom: 3px; +} + +.c14 { + margin-left: 30px; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; +} + +.c13 { + float: left; +} + +.c10 { + border: none; + box-shadow: none; + display: block; +} + +
    + + + + +
      +
    • + + + + + + otpUi.LocationField.useCurrentLocation + + +
      • +
    +
    +`; + +exports[`Storyshots LocationField/Mobile Context Selected Location Custom Clear 1`] = ` + + + } + currentPosition={ + Object { + "coords": Object { + "latitude": 45.508246, + "longitude": -122.711574, + }, + } + } + geocoderConfig={ + Object { + "baseUrl": "https://ws-st.trimet.org/pelias/v1", + "boundary": Object { + "rect": Object { + "maxLat": 45.7445, + "maxLon": -122.135, + "minLat": 45.273, + "minLon": -123.2034, + }, + }, + "maxNearbyStops": 4, + "type": "PELIAS", + } + } + getCurrentPosition={[Function]} + isStatic={true} + location={ + Object { + "lat": 0, + "lon": 0, + "name": "123 Main St", + } + } + locationType="to" + onLocationSelected={[Function]} + /> + +`; + +exports[`Storyshots LocationField/Mobile Context Selected Location Custom Clear 2`] = ` +.c3 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c4 { + color: #f44256; +} + +.c7 { + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + display: inline-block; + height: 0; + overflow: hidden; + width: 0; +} + +.c1 { + border: none; + background: none; +} + +.c6 { + color: #888; + cursor: pointer; + width: 30px; +} + +.c2 { + width: 30px; +} + +.c9 { + background-clip: padding-box; + background-color: #fff; + border-radius: 4px; + border: 1px solid rgba(0,0,0,0.15); + box-shadow: 0 6px 12px rgba(0,0,0,0.175); + float: left; + font-size: 14px; + left: 0; + list-style: none; + margin: 2px 0 0; + min-width: 160px; + max-height: 75vh; + padding: 5px 0; + position: absolute; + overflow: scroll; + text-align: left; + top: 100%; + z-index: 1000000; +} + +input[aria-expanded="false"] ~ .c8 { + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + display: inline-block; + height: 0; + overflow: hidden; + width: 0; +} + +.c5 { + border: none; + box-shadow: none; + font-size: 17px; + outline: none; +} + +.c0 { + border-bottom: 1px solid #000; + border-collapse: separate; + display: table; + margin-bottom: 15px; + position: relative; +} + +.c11 { + background-color: transparent; + clear: both; + color: #333; + display: block; + font-weight: 400; + line-height: 1.42857143; + padding: 3px 20px; + -webkit-text-decoration: none; + text-decoration: none; + white-space: nowrap; +} + +.c11:hover { + background-color: #f5f5f5; + cursor: pointer; +} + +.c11[aria-hidden="true"]:hover { + background-color: unset; + cursor: default; +} + +.c12 { + display: block; + padding-top: 5px; + padding-bottom: 3px; +} + +.c14 { + margin-left: 30px; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; +} + +.c13 { + float: left; +} + +.c10 { + border: none; + box-shadow: none; + display: block; +} + +
    + + + + +
      +
    • + + + + + + otpUi.LocationField.useCurrentLocation + + +
      • +
    +
    +`; + +exports[`Storyshots LocationField/Mobile Context Slow Geocoder 1`] = ` + + + +`; + +exports[`Storyshots LocationField/Mobile Context Slow Geocoder 2`] = ` +.c3 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c4 { + color: #333; +} + +.c6 { + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + display: inline-block; + height: 0; + overflow: hidden; + width: 0; +} + +.c1 { + border: none; + background: none; +} + +.c2 { + width: 30px; +} + +.c8 { + background-clip: padding-box; + background-color: #fff; + border-radius: 4px; + border: 1px solid rgba(0,0,0,0.15); + box-shadow: 0 6px 12px rgba(0,0,0,0.175); + float: left; + font-size: 14px; + left: 0; + list-style: none; + margin: 2px 0 0; + min-width: 160px; + max-height: 75vh; + padding: 5px 0; + position: absolute; + overflow: scroll; + text-align: left; + top: 100%; + z-index: 1000000; +} + +input[aria-expanded="false"] ~ .c7 { + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + display: inline-block; + height: 0; + overflow: hidden; + width: 0; +} + +.c5 { + border: none; + box-shadow: none; + font-size: 17px; + outline: none; +} + +.c0 { + border-bottom: 1px solid #000; + border-collapse: separate; + display: table; + margin-bottom: 15px; + position: relative; +} + +.c10 { + background-color: transparent; + clear: both; + color: #333; + display: block; + font-weight: 400; + line-height: 1.42857143; + padding: 3px 20px; + -webkit-text-decoration: none; + text-decoration: none; + white-space: nowrap; +} + +.c10:hover { + background-color: #f5f5f5; + cursor: pointer; +} + +.c10[aria-hidden="true"]:hover { + background-color: unset; + cursor: default; +} + +.c11 { + display: block; + padding-top: 5px; + padding-bottom: 3px; +} + +.c13 { + margin-left: 30px; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; +} + +.c12 { + float: left; +} + +.c9 { + border: none; + box-shadow: none; + display: block; +} + +
    + + + +
      +
    • + + + + + + otpUi.LocationField.useCurrentLocation + + +
      • +
    +
    +`; + +exports[`Storyshots LocationField/Mobile Context Styled 1`] = ` + + + +`; + +exports[`Storyshots LocationField/Mobile Context Styled 2`] = ` +.c4 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c5 { + color: #333; +} + +.c7 { + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + display: inline-block; + height: 0; + overflow: hidden; + width: 0; +} + +.c2 { + border: none; + background: none; +} + +.c3 { + width: 30px; +} + +.c9 { + background-clip: padding-box; + background-color: #fff; + border-radius: 4px; + border: 1px solid rgba(0,0,0,0.15); + box-shadow: 0 6px 12px rgba(0,0,0,0.175); + float: left; + font-size: 14px; + left: 0; + list-style: none; + margin: 2px 0 0; + min-width: 160px; + max-height: 75vh; + padding: 5px 0; + position: absolute; + overflow: scroll; + text-align: left; + top: 100%; + z-index: 1000000; +} + +input[aria-expanded="false"] ~ .c8 { + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + display: inline-block; + height: 0; + overflow: hidden; + width: 0; +} + +.c6 { + border: none; + box-shadow: none; + font-size: 17px; + outline: none; +} + +.c0 { + border-bottom: 1px solid #000; + border-collapse: separate; + display: table; + margin-bottom: 15px; + position: relative; +} + +.c11 { + background-color: transparent; + clear: both; + color: #333; + display: block; + font-weight: 400; + line-height: 1.42857143; + padding: 3px 20px; + -webkit-text-decoration: none; + text-decoration: none; + white-space: nowrap; +} + +.c11:hover { + background-color: #f5f5f5; + cursor: pointer; +} + +.c11[aria-hidden="true"]:hover { + background-color: unset; + cursor: default; +} + +.c13 { + display: block; + padding-top: 5px; + padding-bottom: 3px; +} + +.c15 { + margin-left: 30px; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; +} + +.c14 { + float: left; +} + +.c10 { + border: none; + box-shadow: none; + display: block; +} + +.c1 .c12 { + background-color: pink; + font-size: 24px; +} + +
    + + + +
      +
    • + + + + + + otpUi.LocationField.useCurrentLocation + + +
      • +
    +
    +`; + +exports[`Storyshots LocationField/Mobile Context With Custom Icons 1`] = ` + + + } + currentPositionUnavailableIcon={ + + } + geocoderConfig={ + Object { + "baseUrl": "https://ws-st.trimet.org/pelias/v1", + "boundary": Object { + "rect": Object { + "maxLat": 45.7445, + "maxLon": -122.135, + "minLat": 45.273, + "minLon": -123.2034, + }, + }, + "maxNearbyStops": 4, + "type": "PELIAS", + } + } + getCurrentPosition={[Function]} + isStatic={true} + layerColorMap={ + Object { + "locality": "orange", + "stations": "navy", + "stops": "purple", + } + } + locationType="to" + nearbyStops={ + Array [ + "1", + "2", + ] + } + onLocationSelected={[Function]} + sessionOptionIcon={ + + } + sessionSearches={ + Array [ + Object { + "lat": 12.34, + "lon": 34.45, + "name": "123 Main St", + }, + ] + } + showUserSettings={true} + stopOptionIcon={ + + } + stopsIndex={ + Object { + "1": Object { + "code": "1", + "dist": 123, + "lat": 12.34, + "lon": 34.56, + "name": "1st & Main", + "routes": Array [ + Object { + "shortName": "1", + }, + ], + }, + "2": Object { + "code": "2", + "dist": 345, + "lat": 23.45, + "lon": 67.89, + "name": "Main & 2nd", + "routes": Array [ + Object { + "shortName": "2", + }, + ], + }, + } + } + userLocationsAndRecentPlaces={ + Array [ + Object { + "icon": "home", + "lat": 45.89, + "lon": 67.12, + "name": "456 Suburb St", + "type": "home", + }, + Object { + "icon": "work", + "lat": 54.32, + "lon": 43.21, + "name": "789 Busy St", + "type": "work", + }, + Object { + "icon": "map-marker", + "lat": 34.22, + "lon": -84.11, + "name": "Coffee Roasters Shop, 55 Coffee Street", + "type": "custom", + }, + Object { + "lat": 12.34, + "lon": 34.45, + "name": "123 Main St", + "type": "recent", + }, + ] + } + /> + +`; + +exports[`Storyshots LocationField/Mobile Context With Custom Icons 2`] = ` +.c3 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c5 { + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + display: inline-block; + height: 0; + overflow: hidden; + width: 0; +} + +.c1 { + border: none; + background: none; +} + +.c16 { + clear: both; +} + +.c2 { + width: 30px; +} + +.c7 { + background-clip: padding-box; + background-color: #fff; + border-radius: 4px; + border: 1px solid rgba(0,0,0,0.15); + box-shadow: 0 6px 12px rgba(0,0,0,0.175); + float: left; + font-size: 14px; + left: 0; + list-style: none; + margin: 2px 0 0; + min-width: 160px; + max-height: 75vh; + padding: 5px 0; + position: absolute; + overflow: scroll; + text-align: left; + top: 100%; + z-index: 1000000; +} + +input[aria-expanded="false"] ~ .c6 { + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + display: inline-block; + height: 0; + overflow: hidden; + width: 0; +} + +.c4 { + border: none; + box-shadow: none; + font-size: 17px; + outline: none; +} + +.c0 { + border-bottom: 1px solid #000; + border-collapse: separate; + display: table; + margin-bottom: 15px; + position: relative; +} + +.c9 { + color: #eee; + background-color: #333; + font-size: 12px; + font-weight: normal; + line-height: 1.42857143; + margin: 0; + padding: 0px 10px; + text-align: center; + white-space: nowrap; +} + +.c10 { + background-color: transparent; + clear: both; + color: #333; + display: block; + font-weight: 400; + line-height: 1.42857143; + padding: 3px 20px; + -webkit-text-decoration: none; + text-decoration: none; + white-space: nowrap; +} + +.c10:hover { + background-color: #f5f5f5; + cursor: pointer; +} + +.c10[aria-hidden="true"]:hover { + background-color: unset; + cursor: default; +} + +.c17 { + display: block; + padding-top: 5px; + padding-bottom: 3px; +} + +.c19 { + margin-left: 30px; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; +} + +.c18 { + float: left; +} + +.c15 { + background-color: gray; + color: white; + padding: 2px 3px 0px; + margin-right: 5px; +} + +.c8 { + border: none; + box-shadow: none; + display: block; +} + +.c13 { + margin-left: 30px; +} + +.c12 { + font-size: 8px; +} + +.c11 { + float: left; + padding-top: 3px; +} + +.c14 { + font-size: 9px; +} + +
    + + + +
      +

      + otpUi.LocationField.nearby +

      +
    • + + + + 404 ft + + + + + 1st & Main + ( + 1 + ) + + + + 1 + + + +
      +
      • +
    • + + + + 0.2 mi + + + + + Main & 2nd + ( + 2 + ) + + + + 2 + + + +
      +
      • +

      + otpUi.LocationField.recentlySearched +

      +
    • + + + + + + 123 Main St + + + +
      • +

      + otpUi.LocationField.myPlaces +

      +
    • + + + + + + otpUi.LocationField.parenthesisFormat + + +
      • +
    • + + + + + + otpUi.LocationField.parenthesisFormat + + +
      • +
    • + + + + + + Coffee Roasters Shop, 55 Coffee Street + + +
      • +
    • + + + + + + 123 Main St + + +
      • +
    • + + + + + + otpUi.LocationField.useCurrentLocation + + +
      • +
    +
    +`; + +exports[`Storyshots LocationField/Mobile Context With Nearby Stops 1`] = ` + + + +`; + +exports[`Storyshots LocationField/Mobile Context With Nearby Stops 2`] = ` +.c3 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c4 { + color: #f44256; +} + +.c6 { + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + display: inline-block; + height: 0; + overflow: hidden; + width: 0; +} + +.c1 { + border: none; + background: none; +} + +.c17 { + clear: both; +} + +.c2 { + width: 30px; +} + +.c8 { + background-clip: padding-box; + background-color: #fff; + border-radius: 4px; + border: 1px solid rgba(0,0,0,0.15); + box-shadow: 0 6px 12px rgba(0,0,0,0.175); + float: left; + font-size: 14px; + left: 0; + list-style: none; + margin: 2px 0 0; + min-width: 160px; + max-height: 75vh; + padding: 5px 0; + position: absolute; + overflow: scroll; + text-align: left; + top: 100%; + z-index: 1000000; +} + +input[aria-expanded="false"] ~ .c7 { + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + display: inline-block; + height: 0; + overflow: hidden; + width: 0; +} + +.c5 { + border: none; + box-shadow: none; + font-size: 17px; + outline: none; +} + +.c0 { + border-bottom: 1px solid #000; + border-collapse: separate; + display: table; + margin-bottom: 15px; + position: relative; +} + +.c10 { + color: #eee; + background-color: #333; + font-size: 12px; + font-weight: normal; + line-height: 1.42857143; + margin: 0; + padding: 0px 10px; + text-align: center; + white-space: nowrap; +} + +.c11 { + background-color: transparent; + clear: both; + color: #333; + display: block; + font-weight: 400; + line-height: 1.42857143; + padding: 3px 20px; + -webkit-text-decoration: none; + text-decoration: none; + white-space: nowrap; +} + +.c11:hover { + background-color: #f5f5f5; + cursor: pointer; +} + +.c11[aria-hidden="true"]:hover { + background-color: unset; + cursor: default; +} + +.c18 { + display: block; + padding-top: 5px; + padding-bottom: 3px; +} + +.c20 { + margin-left: 30px; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; +} + +.c19 { + float: left; +} + +.c16 { + background-color: gray; + color: white; + padding: 2px 3px 0px; + margin-right: 5px; +} + +.c9 { + border: none; + box-shadow: none; + display: block; +} + +.c14 { + margin-left: 30px; +} + +.c13 { + font-size: 8px; +} + +.c12 { + float: left; + padding-top: 3px; +} + +.c15 { + font-size: 9px; +} + +
    + + + +
      +

      + otpUi.LocationField.nearby +

      +
    • + + + + 404 ft + + + + + 1st & Main + ( + 1 + ) + + + + 1 + + + +
      +
      • +
    • + + + + 0.2 mi + + + + + Main & 2nd + ( + 2 + ) + + + + 2 + + + +
      +
      • +
    • + + + + + + otpUi.LocationField.useCurrentLocation + + +
      • +
    +
    +`; + +exports[`Storyshots LocationField/Mobile Context With Session Searches 1`] = ` + + + +`; + +exports[`Storyshots LocationField/Mobile Context With Session Searches 2`] = ` +.c3 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c4 { + color: #f44256; +} + +.c6 { + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + display: inline-block; + height: 0; + overflow: hidden; + width: 0; +} + +.c1 { + border: none; + background: none; +} + +.c2 { + width: 30px; +} + +.c8 { + background-clip: padding-box; + background-color: #fff; + border-radius: 4px; + border: 1px solid rgba(0,0,0,0.15); + box-shadow: 0 6px 12px rgba(0,0,0,0.175); + float: left; + font-size: 14px; + left: 0; + list-style: none; + margin: 2px 0 0; + min-width: 160px; + max-height: 75vh; + padding: 5px 0; + position: absolute; + overflow: scroll; + text-align: left; + top: 100%; + z-index: 1000000; +} + +input[aria-expanded="false"] ~ .c7 { + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + display: inline-block; + height: 0; + overflow: hidden; + width: 0; +} + +.c5 { + border: none; + box-shadow: none; + font-size: 17px; + outline: none; +} + +.c0 { + border-bottom: 1px solid #000; + border-collapse: separate; + display: table; + margin-bottom: 15px; + position: relative; +} + +.c10 { + color: #eee; + background-color: #333; + font-size: 12px; + font-weight: normal; + line-height: 1.42857143; + margin: 0; + padding: 0px 10px; + text-align: center; + white-space: nowrap; +} + +.c11 { + background-color: transparent; + clear: both; + color: #333; + display: block; + font-weight: 400; + line-height: 1.42857143; + padding: 3px 20px; + -webkit-text-decoration: none; + text-decoration: none; + white-space: nowrap; +} + +.c11:hover { + background-color: #f5f5f5; + cursor: pointer; +} + +.c11[aria-hidden="true"]:hover { + background-color: unset; + cursor: default; +} + +.c12 { + display: block; + padding-top: 5px; + padding-bottom: 3px; +} + +.c14 { + margin-left: 30px; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; +} + +.c13 { + float: left; +} + +.c9 { + border: none; + box-shadow: none; + display: block; +} + +
    + + + +
      +

      + otpUi.LocationField.recentlySearched +

      +
    • + + + + + + 123 Main St + + + +
      • +
    • + + + + + + otpUi.LocationField.useCurrentLocation + + +
      • +
    +
    +`; + +exports[`Storyshots LocationField/Mobile Context With User Settings 1`] = ` + + + +`; + +exports[`Storyshots LocationField/Mobile Context With User Settings 2`] = ` +.c3 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c4 { + color: #f44256; +} + +.c6 { + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + display: inline-block; + height: 0; + overflow: hidden; + width: 0; +} + +.c1 { + border: none; + background: none; +} + +.c2 { + width: 30px; +} + +.c8 { + background-clip: padding-box; + background-color: #fff; + border-radius: 4px; + border: 1px solid rgba(0,0,0,0.15); + box-shadow: 0 6px 12px rgba(0,0,0,0.175); + float: left; + font-size: 14px; + left: 0; + list-style: none; + margin: 2px 0 0; + min-width: 160px; + max-height: 75vh; + padding: 5px 0; + position: absolute; + overflow: scroll; + text-align: left; + top: 100%; + z-index: 1000000; +} + +input[aria-expanded="false"] ~ .c7 { + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + display: inline-block; + height: 0; + overflow: hidden; + width: 0; +} + +.c5 { + border: none; + box-shadow: none; + font-size: 17px; + outline: none; +} + +.c0 { + border-bottom: 1px solid #000; + border-collapse: separate; + display: table; + margin-bottom: 15px; + position: relative; +} + +.c10 { + color: #eee; + background-color: #333; + font-size: 12px; + font-weight: normal; + line-height: 1.42857143; + margin: 0; + padding: 0px 10px; + text-align: center; + white-space: nowrap; +} + +.c11 { + background-color: transparent; + clear: both; + color: #333; + display: block; + font-weight: 400; + line-height: 1.42857143; + padding: 3px 20px; + -webkit-text-decoration: none; + text-decoration: none; + white-space: nowrap; +} + +.c11:hover { + background-color: #f5f5f5; + cursor: pointer; +} + +.c11[aria-hidden="true"]:hover { + background-color: unset; + cursor: default; +} + +.c12 { + display: block; + padding-top: 5px; + padding-bottom: 3px; +} + +.c14 { + margin-left: 30px; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; +} + +.c13 { + float: left; +} + +.c9 { + border: none; + box-shadow: none; + display: block; +} + +
    + + + +
      +

      + otpUi.LocationField.myPlaces +

      +
    • + + + + + + otpUi.LocationField.parenthesisFormat + + +
      • +
    • + + + + + + otpUi.LocationField.parenthesisFormat + + +
      • +
    • + + + + + + Coffee Roasters Shop, 55 Coffee Street + + +
      • +
    • + + + + + + 123 Main St + + +
      • +
    • + + + + + + otpUi.LocationField.useCurrentLocation + + +
      • +
    +
    +`; + +exports[`Storyshots LocationIcon Custom Style For To 1`] = ` + + + +`; + +exports[`Storyshots LocationIcon Custom Style For To 2`] = ` +.c0 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c1 { + color: #f44256; +} + +.c2 { + color: blue; +} + + +`; + +exports[`Storyshots LocationIcon From 1`] = ` + + + +`; + +exports[`Storyshots LocationIcon From 2`] = ` +.c0 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c1 { + color: #333; +} + + +`; + +exports[`Storyshots LocationIcon Generic Place 1`] = ` + + + +`; + +exports[`Storyshots LocationIcon Generic Place 2`] = ` +.c0 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c1 { + color: #333; +} + + +`; + +exports[`Storyshots LocationIcon To 1`] = ` + + + +`; + +exports[`Storyshots LocationIcon To 2`] = ` +.c0 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c1 { + color: #f44256; +} + + +`; + +exports[`Storyshots Map Popup Floating Vehicle Entity 1`] = ` + + + +`; + +exports[`Storyshots Map Popup Floating Vehicle Entity 2`] = ` +.c5 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c6 { + color: #333; +} + +.c8 { + color: #f44256; +} + +.c4:first-of-type { + border-left: none; +} + +.c3 > * { + padding-left: 0.4em; + border-left: 1px solid black; +} + +.c7 { + background: none; + border: none; + color: navy; + font-family: inherit; + font-size: inherit; + line-height: inherit; + padding-left: 0.2em; +} + +.c7:hover { + -webkit-text-decoration: underline; + text-decoration: underline; + cursor: pointer; +} + +.c0 { + font-size: 12px; + line-height: 1.5; + min-width: 250px; +} + +.c2 { + margin-top: 6px; +} + +.c1 { + font-size: 18px; + font-weight: 500; + margin-bottom: 6px; +} + +
    +
    + Free-floating bike: 0541 BIKETOWN +
    +

    + + Plan a trip: + + + + + + + + + + + +

    +
    +`; + +exports[`Storyshots Map Popup Station Entity 1`] = ` + + + +`; + +exports[`Storyshots Map Popup Station Entity 2`] = ` +.c5 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c6 { + color: #333; +} + +.c8 { + color: #f44256; +} + +.c4:first-of-type { + border-left: none; +} + +.c3 > * { + padding-left: 0.4em; + border-left: 1px solid black; +} + +.c7 { + background: none; + border: none; + color: navy; + font-family: inherit; + font-size: inherit; + line-height: inherit; + padding-left: 0.2em; +} + +.c7:hover { + -webkit-text-decoration: underline; + text-decoration: underline; + cursor: pointer; +} + +.c0 { + font-size: 12px; + line-height: 1.5; + min-width: 250px; +} + +.c2 { + margin-top: 6px; +} + +.c1 { + font-size: 18px; + font-weight: 500; + margin-bottom: 6px; +} + +
    +
    + SW Morrison at 18th +
    +

    +

    + Available bikes: 6 +
    +
    + Available docks: 11 +
    +

    +

    + + Plan a trip: + + + + + + + + + + + +

    +
    +`; + +exports[`Storyshots Map Popup Stop Entity 1`] = ` + + + +`; + +exports[`Storyshots Map Popup Stop Entity 2`] = ` +.c6 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c7 { + color: #333; +} + +.c9 { + color: #f44256; +} + +.c5:first-of-type { + border-left: none; +} + +.c4 > * { + padding-left: 0.4em; + border-left: 1px solid black; +} + +.c8 { + background: none; + border: none; + color: navy; + font-family: inherit; + font-size: inherit; + line-height: inherit; + padding-left: 0.2em; +} + +.c8:hover { + -webkit-text-decoration: underline; + text-decoration: underline; + cursor: pointer; +} + +.c3 { + background: none; + border-bottom: none; + border-left: 1px solid #000; + border-right: none; + border-top: none; + color: #008; + font-family: inherit; + margin-left: 5px; + padding-top: 0; +} + +.c0 { + font-size: 12px; + line-height: 1.5; + min-width: 250px; +} + +.c2 { + margin-top: 6px; +} + +.c1 { + font-size: 18px; + font-weight: 500; + margin-bottom: 6px; +} + +
    +
    + W Burnside & SW 2nd +
    +

    + + Stop ID: 9526 + + +

    +

    + + Plan a trip: + + + + + + + + + + + +

    +
    +`; + +exports[`Storyshots Map Popup Stop Entity No Handlers 1`] = ` + + + +`; + +exports[`Storyshots Map Popup Stop Entity No Handlers 2`] = ` +.c0 { + font-size: 12px; + line-height: 1.5; + min-width: 250px; +} + +.c1 { + font-size: 18px; + font-weight: 500; + margin-bottom: 6px; +} + +
    +
    + W Burnside & SW 2nd +
    +
    +`; + +exports[`Storyshots Map Popup Stop Entity With Focus Trap 1`] = ` + + + + + +`; + +exports[`Storyshots Map Popup Stop Entity With Focus Trap 2`] = ` +.c6 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c7 { + color: #333; +} + +.c9 { + color: #f44256; +} + +.c5:first-of-type { + border-left: none; +} + +.c4 > * { + padding-left: 0.4em; + border-left: 1px solid black; +} + +.c8 { + background: none; + border: none; + color: navy; + font-family: inherit; + font-size: inherit; + line-height: inherit; + padding-left: 0.2em; +} + +.c8:hover { + -webkit-text-decoration: underline; + text-decoration: underline; + cursor: pointer; +} + +.c3 { + background: none; + border-bottom: none; + border-left: 1px solid #000; + border-right: none; + border-top: none; + color: #008; + font-family: inherit; + margin-left: 5px; + padding-top: 0; +} + +.c0 { + font-size: 12px; + line-height: 1.5; + min-width: 250px; +} + +.c2 { + margin-top: 6px; +} + +.c1 { + font-size: 18px; + font-weight: 500; + margin-bottom: 6px; +} + + +`; + +exports[`Storyshots ParkAndRideOverlay Default 1`] = ` + + + + + + + +`; + +exports[`Storyshots ParkAndRideOverlay Default 2`] = ` +.c0 { + height: 90vh; +} + +
    +
    +
    +`; + +exports[`Storyshots PrintableItinerary Bike Only Itinerary 1`] = ` + + + +`; + +exports[`Storyshots PrintableItinerary Bike Only Itinerary 2`] = ` +.c7 { + font-weight: inherit; +} + +.c12 { + font-weight: 500; +} + +.c13 { + font-weight: 200; + opacity: 0.8975; + padding-left: 1ch; +} + +.c0 { + margin-bottom: 10px; + border-top: 1px solid grey; + padding-top: 18px; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; +} + +.c1 { + border-top: none; + padding-top: 0; +} + +.c2 { + margin-left: 10px; +} + +.c9 { + font-size: 14px; + margin-top: 3px; +} + +.c8 { + margin-top: 5px; +} + +.c3 { + font-size: 18px; +} + +.c6 { + font-size: 18px; +} + +.c4 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + height: 100%; + min-width: 70px; +} + +.c10 .c11 { + font-weight: bold; +} + +.c5 { + float: left; + width: 32px; + height: 32px; +} + +
    +
    +
    +
    + + Depart + + from + + 503 SW Alder St, Portland, OR, USA 97204 + +
    +
    +
    +
    +
    +
    + + + + +
    +
    +
    + + Bicycle 0.7 miles to + + 1737 SW Morrison St, Portland, OR, USA 97205 + + +
    +
    + + Head + EAST + on + + SW Alder St + + + 87 feet + + +
    +
    + + RIGHT + on + + SW 5th Ave + + + 257 feet + + +
    +
    + + RIGHT + on + + SW Morrison St + + + 0.6 miles + + +
    +
    +
    +
    +
    +`; + +exports[`Storyshots PrintableItinerary Bike Rental Itinerary 1`] = ` + + + +`; + +exports[`Storyshots PrintableItinerary Bike Rental Itinerary 2`] = ` +.c7 { + font-weight: inherit; +} + +.c12 { + font-weight: 500; +} + +.c13 { + font-weight: 200; + opacity: 0.8975; + padding-left: 1ch; +} + +.c0 { + margin-bottom: 10px; + border-top: 1px solid grey; + padding-top: 18px; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; +} + +.c1 { + border-top: none; + padding-top: 0; +} + +.c2 { + margin-left: 10px; +} + +.c9 { + font-size: 14px; + margin-top: 3px; +} + +.c8 { + margin-top: 5px; +} + +.c3 { + font-size: 18px; +} + +.c6 { + font-size: 18px; +} + +.c4 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + height: 100%; + min-width: 70px; +} + +.c10 .c11 { + font-weight: bold; +} + +.c5 { + float: left; + width: 32px; + height: 32px; +} + +
    +
    +
    +
    + + Depart + + from + + 2624 SE 30th Ave, Portland, OR, USA 97202 + +
    +
    +
    +
    +
    +
    + + + +
    +
    +
    + + Walk 498 feet to + + SE 30th at Division + + +
    +
    + + Head + WEST + on + + SE Clinton St + + + 79 feet + + +
    +
    + + RIGHT + on + + SE 30th Ave + + + 419 feet + + +
    +
    +
    +
    +
    +
    +
    + + + + + + + + + + +
    +
    +
    + + Bicycle 0.6 miles to + + SE 29th at Hawthorne + + +
    +
    + + CONTINUE + on + + SE 30th Ave + + + 0.3 miles + + +
    +
    + + LEFT + on + + SE Harrison St + + + 361 feet + + +
    +
    + + RIGHT + on + + SE 29th Ave + + + 0.2 miles + + +
    +
    + + LEFT + on + + SE Hawthorne Blvd + + + 50 feet + + +
    +
    +
    +
    +
    +
    +
    + + + +
    +
    +
    + + Walk 0.1 miles to + + 1415 SE 28th Ave, Portland, OR, USA 97214 + + +
    +
    + + CONTINUE + on + + SE Hawthorne Blvd + + + 210 feet + + +
    +
    + + RIGHT + on + + SE 28th Ave + + + 295 feet + + +
    +
    + + LEFT + on + + SE Madison St + + + 114 feet + + +
    +
    +
    +
    +
    +`; + +exports[`Storyshots PrintableItinerary Bike Rental Transit Itinerary 1`] = ` + + + +`; + +exports[`Storyshots PrintableItinerary Bike Rental Transit Itinerary 2`] = ` +.c16 { + font-weight: 200; +} + +.c7 { + font-weight: inherit; +} + +.c12 { + font-weight: 500; +} + +.c13 { + font-weight: 200; + opacity: 0.8975; + padding-left: 1ch; +} + +.c0 { + margin-bottom: 10px; + border-top: 1px solid grey; + padding-top: 18px; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; +} + +.c1 { + border-top: none; + padding-top: 0; +} + +.c2 { + margin-left: 10px; +} + +.c9 { + font-size: 14px; + margin-top: 3px; +} + +.c8 { + margin-top: 5px; +} + +.c3 { + font-size: 18px; +} + +.c6 { + font-size: 18px; +} + +.c4 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + height: 100%; + min-width: 70px; +} + +.c10 .c11 { + font-weight: bold; +} + +.c14 { + font-weight: bold; +} + +.c14 .c15 { + font-weight: normal; +} + +.c5 { + float: left; + width: 32px; + height: 32px; +} + +
    +
    +
    +
    + + Depart + + from + + 2943 SE Washington St, Portland, OR, USA 97214 + +
    +
    +
    +
    +
    +
    + + + +
    +
    +
    + + Walk 400 feet to + + SE 29th at Stark + + +
    +
    + + Head + NORTH + on + + SE 30th Ave + + + 103 feet + + +
    +
    + + RIGHT + on + + SE Stark St + + + 277 feet + + +
    +
    + + RIGHT + on + + SE 29th Ave + + + 19 feet + + +
    +
    +
    +
    +
    +
    +
    + + + + + + + + + + +
    +
    +
    + + Bicycle 0.8 miles to + + NE Glisan at 24th + + +
    +
    + + CONTINUE + on + + SE 29th Ave + + + 492 feet + + +
    +
    + + LEFT + on + + SE Pine St + + + 358 feet + + +
    +
    + + RIGHT + on + + SE 28th Ave + + + 518 feet + + +
    +
    + + LEFT + on + + SE Ankeny St + + + 0.2 miles + + +
    +
    + + RIGHT + on + + SE 24th Ave + + + 259 feet + + +
    +
    + + CONTINUE + on + + NE 24th Ave + + + 0.2 miles + + +
    +
    + + LEFT + on + + NE Glisan St + + + 57 feet + + +
    +
    +
    +
    +
    +
    +
    + + + +
    +
    +
    + + Walk 497 feet to + + NE Sandy & 24th + + +
    +
    + + HARD_LEFT + on + + NE Glisan St + + + 57 feet + + +
    +
    + + LEFT + on + + NE 24th Ave + + + 382 feet + + +
    +
    + + RIGHT + on + + NE Sandy Blvd + + + 58 feet + + +
    +
    +
    +
    +
    +
    +
    + + + +
    +
    +
    +
    + + 12 + + + + Barbur/Sandy Blvd + + to + + Parkrose TC + +
    +
    +
    + Board at + + NE Sandy & 24th + + (5066) at + + 4:02 PM + +
    +
    + Get off at + + NE Sandy & 57th + + (5104) at + + 4:14 PM + +
    +
    +
    +
    +
    +
    +
    + + + +
    +
    +
    + + Walk 279 feet to + + 0086 BIKETOWN + + +
    +
    + + Head + NORTHEAST + on + + NE Sandy Blvd + + + 75 feet + + +
    +
    + + HARD_LEFT + on + + NE Alameda St + + + 203 feet + + +
    +
    +
    +
    +
    +
    +
    + + + + + + + + + + +
    +
    +
    + + Bicycle 1 mile to + + NE 60th at Cully + + +
    +
    + + HARD_LEFT + on + + NE Alameda St + + + 203 feet + + +
    +
    + + HARD_LEFT + on + + NE 57th Ave + + + 0.6 miles + + +
    +
    + + CONTINUE + on + + NE Cully Blvd + + + 0.3 miles + + +
    +
    + + LEFT + on + + NE 60th Ave + + + 171 feet + + +
    +
    +
    +
    +
    +
    +
    + + + +
    +
    +
    + + Walk 494 feet to + + 5916 NE Going St, Portland, OR, USA 97218 + + +
    +
    + + CONTINUE + on + + NE 60th Ave + + + 270 feet + + +
    +
    + + LEFT + on + + NE Going St + + + 225 feet + + +
    +
    +
    +
    +
    +`; + +exports[`Storyshots PrintableItinerary Bike Transit Bike Itinerary 1`] = ` + + + +`; + +exports[`Storyshots PrintableItinerary Bike Transit Bike Itinerary 2`] = ` +.c16 { + font-weight: 200; +} + +.c7 { + font-weight: inherit; +} + +.c12 { + font-weight: 500; +} + +.c13 { + font-weight: 200; + opacity: 0.8975; + padding-left: 1ch; +} + +.c0 { + margin-bottom: 10px; + border-top: 1px solid grey; + padding-top: 18px; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; +} + +.c1 { + border-top: none; + padding-top: 0; +} + +.c2 { + margin-left: 10px; +} + +.c9 { + font-size: 14px; + margin-top: 3px; +} + +.c8 { + margin-top: 5px; +} + +.c3 { + font-size: 18px; +} + +.c6 { + font-size: 18px; +} + +.c4 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + height: 100%; + min-width: 70px; +} + +.c10 .c11 { + font-weight: bold; +} + +.c14 { + font-weight: bold; +} + +.c14 .c15 { + font-weight: normal; +} + +.c5 { + float: left; + width: 32px; + height: 32px; +} + +
    +
    +
    +
    + + Depart + + from + + KGW Studio on the Sq, Portland, OR, USA + +
    +
    +
    +
    +
    +
    + + + +
    +
    +
    + + Walk 91 feet to + + corner of path and Pioneer Courthouse Sq (pedestrian street) + + +
    +
    + + Head + SOUTHEAST + on + + Unnamed Path + + + 91 feet + + +
    +
    +
    +
    +
    +
    +
    + + + + +
    +
    +
    + + Bicycle 0.1 miles to + + corner of path and Pioneer Sq N (path) + + +
    +
    + + LEFT + on + + Unnamed Path + + + 20 feet + + +
    +
    + + LEFT + on + + SW 6th Ave + + + 245 feet + + +
    +
    + + LEFT + on + + SW Morrison St + + + 241 feet + + +
    +
    + + LEFT + on + + Unnamed Path + + + 27 feet + + +
    +
    +
    +
    +
    +
    +
    + + + +
    +
    +
    + + Walk 22 feet to + + Pioneer Square North MAX Station + + +
    +
    + + LEFT + on + + Pioneer Sq N (path) + + + 22 feet + + +
    +
    +
    +
    +
    +
    +
    + + + +
    +
    +
    +
    + + MAX Blue Line + + + + MAX Blue Line + + to + + Hillsboro + +
    +
    +
    + Board at + + Pioneer Square North MAX Station + + (8383) at + + 3:46 PM + +
    +
    + Get off at + + Providence Park MAX Station + + (9757) at + + 3:49 PM + +
    +
    +
    +
    +
    +
    +
    + + + +
    +
    +
    + + Walk 19 feet to + + corner of path and Providence Park (path) + + +
    +
    + + Head + WEST + on + + Providence Park (path) + + + 19 feet + + +
    +
    +
    +
    +
    +
    +
    + + + + +
    +
    +
    + + Bicycle 230 feet to + + 1737 SW Morrison St, Portland, OR, USA 97205 + + +
    +
    + + RIGHT + on + + Unnamed Path + + + 104 feet + + +
    +
    + + RIGHT + on + + Unnamed Path + + + 27 feet + + +
    +
    + + RIGHT + on + + SW Morrison St + + + 99 feet + + +
    +
    +
    +
    +
    +`; + +exports[`Storyshots PrintableItinerary Classic Icons And Park And Ride Itinerary 1`] = ` + + + +`; + +exports[`Storyshots PrintableItinerary Classic Icons And Park And Ride Itinerary 2`] = ` +.c16 { + font-weight: 200; +} + +.c7 { + font-weight: inherit; +} + +.c12 { + font-weight: 500; +} + +.c13 { + font-weight: 200; + opacity: 0.8975; + padding-left: 1ch; +} + +.c0 { + margin-bottom: 10px; + border-top: 1px solid grey; + padding-top: 18px; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; +} + +.c1 { + border-top: none; + padding-top: 0; +} + +.c2 { + margin-left: 10px; +} + +.c9 { + font-size: 14px; + margin-top: 3px; +} + +.c8 { + margin-top: 5px; +} + +.c3 { + font-size: 18px; +} + +.c6 { + font-size: 18px; +} + +.c4 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + height: 100%; + min-width: 70px; +} + +.c10 .c11 { + font-weight: bold; +} + +.c14 { + font-weight: bold; +} + +.c14 .c15 { + font-weight: normal; +} + +.c5 { + float: left; + width: 32px; + height: 32px; +} + +
    +
    +
    +
    + + Depart + + from + + 330 SW Murray Blvd, Washington County, OR, USA 97005 + +
    +
    +
    +
    +
    +
    + + + +
    +
    +
    + + Drive 2.4 miles to + + P+R Sunset TC + + +
    +
    + + Head + SOUTHWEST + on + + parking aisle + + + 158 feet + + +
    +
    + + RIGHT + on + + SW Murray Blvd + + + 0.2 miles + + +
    +
    + + CONTINUE + on + + NW Murray Blvd + + + 150 feet + + +
    +
    + + SLIGHTLY_RIGHT + on + + NW Murray Blvd + + + 0.4 miles + + +
    +
    + + CONTINUE + on + + NW Sunset Hwy + + + 0.6 miles + + +
    +
    + + CONTINUE + on + + NW Sunset Hwy + + + 0.3 miles + + +
    +
    + + LEFT + on + + SW Cedar Hills Blvd + + + 0.2 miles + + +
    +
    + + RIGHT + on + + SW Barnes Rd + + + 0.5 miles + + +
    +
    + + RIGHT + on + + service road + + + 0.2 miles + + +
    +
    + + RIGHT + on + + Sunset TC + + + 76 feet + + +
    +
    +
    +
    +
    +
    +
    + + + + +
    +
    +
    + + Walk 426 feet to + + Sunset TC MAX Station + + +
    +
    + + SLIGHTLY_RIGHT + on + + Unnamed Path + + + 16 feet + + +
    +
    + + LEFT + on + + steps + + + 232 feet + + +
    +
    + + LEFT + on + + Unnamed Path + + + 19 feet + + +
    +
    + + RIGHT + on + + Sunset TC (path) + + + 159 feet + + +
    +
    +
    +
    +
    +
    +
    + + + + + +
    +
    +
    +
    + + MAX Blue Line + + + + MAX Blue Line + + to + + Gresham + +
    +
    +
    + Board at + + Sunset TC MAX Station + + (2600) at + + 4:05 PM + +
    +
    + Get off at + + Oak/ SW 1st Ave MAX Station + + (8337) at + + 4:27 PM + +
    +
    +
    +
    +
    +
    +
    + + + + +
    +
    +
    + + Walk 0.1 miles to + + 205 SW Pine St, Portland, OR, USA 97204 + + +
    +
    + + Head + NORTHEAST + on + + Oak/SW 1st Ave (path) + + + 13 feet + + +
    +
    + + CONTINUE + on + + Unnamed Path + + + 27 feet + + +
    +
    + + LEFT + on + + SW Oak St + + + 37 feet + + +
    +
    + + RIGHT + on + + SW 1st Ave + + + 260 feet + + +
    +
    + + LEFT + on + + SW Pine St + + + 337 feet + + +
    +
    +
    +
    +
    +`; + +exports[`Storyshots PrintableItinerary E Scooter Rental Itinerary 1`] = ` + + + +`; + +exports[`Storyshots PrintableItinerary E Scooter Rental Itinerary 2`] = ` +.c7 { + font-weight: inherit; +} + +.c12 { + font-weight: 500; +} + +.c13 { + font-weight: 200; + opacity: 0.8975; + padding-left: 1ch; +} + +.c0 { + margin-bottom: 10px; + border-top: 1px solid grey; + padding-top: 18px; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; +} + +.c1 { + border-top: none; + padding-top: 0; +} + +.c2 { + margin-left: 10px; +} + +.c9 { + font-size: 14px; + margin-top: 3px; +} + +.c8 { + margin-top: 5px; +} + +.c3 { + font-size: 18px; +} + +.c6 { + font-size: 18px; +} + +.c4 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + height: 100%; + min-width: 70px; +} + +.c10 .c11 { + font-weight: bold; +} + +.c5 { + float: left; + width: 32px; + height: 32px; +} + +
    +
    +
    +
    + + Depart + + from + + 600 SW 5th Ave, Portland, OR, USA 97204 + +
    +
    +
    +
    +
    +
    + + + +
    +
    +
    + + Walk 206 feet to + + EMAQ + + +
    +
    + + Head + EAST + on + + SW Alder St + + + 118 feet + + +
    +
    + + LEFT + on + + SW 4th Ave + + + 88 feet + + +
    +
    +
    +
    +
    +
    +
    + + + + + + + + + +
    +
    +
    + + Ride 0.3 miles to + + 205 SW Pine St, Portland, OR, USA 97204 + + +
    +
    + + CONTINUE + on + + SW 4th Ave + + + 0.2 miles + + +
    +
    + + RIGHT + on + + SW Pine St + + + 456 feet + + +
    +
    +
    +
    +
    +`; + +exports[`Storyshots PrintableItinerary E Scooter Rental Transit Itinerary 1`] = ` + + + +`; + +exports[`Storyshots PrintableItinerary E Scooter Rental Transit Itinerary 2`] = ` +.c16 { + font-weight: 200; +} + +.c7 { + font-weight: inherit; +} + +.c12 { + font-weight: 500; +} + +.c13 { + font-weight: 200; + opacity: 0.8975; + padding-left: 1ch; +} + +.c0 { + margin-bottom: 10px; + border-top: 1px solid grey; + padding-top: 18px; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; +} + +.c1 { + border-top: none; + padding-top: 0; +} + +.c2 { + margin-left: 10px; +} + +.c9 { + font-size: 14px; + margin-top: 3px; +} + +.c8 { + margin-top: 5px; +} + +.c3 { + font-size: 18px; +} + +.c6 { + font-size: 18px; +} + +.c4 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + height: 100%; + min-width: 70px; +} + +.c10 .c11 { + font-weight: bold; +} + +.c14 { + font-weight: bold; +} + +.c14 .c15 { + font-weight: normal; +} + +.c5 { + float: left; + width: 32px; + height: 32px; +} + +
    +
    +
    +
    + + Depart + + from + + 2943 SE Washington St, Portland, OR, USA 97214 + +
    +
    +
    +
    +
    +
    + + + +
    +
    +
    + + Walk 0.4 miles to + + Shared E-scooter + + +
    +
    + + Head + SOUTH + on + + SE 30th Ave + + + 0.2 miles + + +
    +
    + + RIGHT + on + + SE Belmont St + + + 330 feet + + +
    +
    + + LEFT + on + + SE 29th Ave + + + 511 feet + + +
    +
    + + RIGHT + on + + SE Taylor St + + + 235 feet + + +
    +
    +
    +
    +
    +
    +
    + + + + + + + + + + +
    +
    +
    + + Ride 1.4 miles to + + NE Broadway + + +
    +
    + + CONTINUE + on + + SE Taylor St + + + 26 feet + + +
    +
    + + RIGHT + on + + SE 28th Ave + + + 0.6 miles + + +
    +
    + + CONTINUE + on + + NE 28th Ave + + + 0.7 miles + + +
    +
    + + SLIGHTLY_RIGHT + on + + NE Halsey St + + + 17 feet + + +
    +
    + + RIGHT + on + + NE Halsey St + + + 59 feet + + +
    +
    + + SLIGHTLY_LEFT + on + + NE 28th Ave + + + 28 feet + + +
    +
    + + SLIGHTLY_LEFT + on + + NE 28th Ave + + + 489 feet + + +
    +
    + + RIGHT + on + + NE Broadway + + + 86 feet + + +
    +
    +
    +
    +
    +
    +
    + + + +
    +
    +
    + + Walk to + + NE Broadway & 28th + + +
    +
    + + RIGHT + on + + street transit link + + +
    +
    +
    +
    +
    +
    +
    + + + +
    +
    +
    +
    + + 70 + + + + 12th/NE 33rd Ave + + to + + NE Sunderland + +
    +
    +
    + Board at + + NE Broadway & 28th + + (638) at + + 4:08 PM + +
    +
    + Get off at + + NE 33rd & Shaver + + (7393) at + + 4:17 PM + +
    +
    +
    +
    +
    +
    +
    + + + +
    +
    +
    + + Walk 0.4 miles to + + Shared E-scooter + + +
    +
    + + Head + NORTH + on + + NE 33rd Ave + + + 33 feet + + +
    +
    + + RIGHT + on + + NE Shaver St + + + 0.3 miles + + +
    +
    + + LEFT + on + + NE 38th Ave + + + 332 feet + + +
    +
    +
    +
    +
    +
    +
    + + + + + + + + + + +
    +
    +
    + + Ride 1 mile to + + 5112 NE 47th Pl, Portland, OR, USA 97218 + + +
    +
    + + CONTINUE + on + + NE 38th Ave + + + 355 feet + + +
    +
    + + RIGHT + on + + NE Skidmore St + + + 0.2 miles + + +
    +
    + + LEFT + on + + NE 42nd Ave + + + 0.4 miles + + +
    +
    + + RIGHT + on + + NE Alberta St + + + 0.3 miles + + +
    +
    + + LEFT + on + + NE 47th Pl + + + 313 feet + + +
    +
    +
    +
    +
    +`; + +exports[`Storyshots PrintableItinerary OTP 2 Scooter Itinerary 1`] = ` + + + +`; + +exports[`Storyshots PrintableItinerary OTP 2 Scooter Itinerary 2`] = ` +.c7 { + font-weight: inherit; +} + +.c12 { + font-weight: 500; +} + +.c13 { + font-weight: 200; + opacity: 0.8975; + padding-left: 1ch; +} + +.c0 { + margin-bottom: 10px; + border-top: 1px solid grey; + padding-top: 18px; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; +} + +.c1 { + border-top: none; + padding-top: 0; +} + +.c2 { + margin-left: 10px; +} + +.c9 { + font-size: 14px; + margin-top: 3px; +} + +.c8 { + margin-top: 5px; +} + +.c3 { + font-size: 18px; +} + +.c6 { + font-size: 18px; +} + +.c4 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + height: 100%; + min-width: 70px; +} + +.c10 .c11 { + font-weight: bold; +} + +.c5 { + float: left; + width: 32px; + height: 32px; +} + +
    +
    +
    +
    + + Depart + + from + + 300 Courtland St NE, Atlanta, GA 30303-12ND, United States + +
    +
    +
    +
    +
    +
    + + + + +
    +
    +
    + + Walk 0.2 miles to + + Razor Vehicle + + +
    +
    + + Head + SOUTH + on + + Courtland Street Northeast + + + 172 feet + + +
    +
    + + RIGHT + on + + Unnamed Path + + + 0.1 miles + + +
    +
    + + LEFT + on + + Peachtree Center Avenue Northeast + + + 140 feet + + +
    +
    +
    +
    +
    +
    +
    + + + +
    +
    +
    + + Ride 1 mile to + + 126 Mitchell St SW, Atlanta, GA 30303-3524, United States + + +
    +
    + + HARD_RIGHT + on + + Peachtree Center Avenue Northeast + + + 12 feet + + +
    +
    + + LEFT + on + + service road + + + 10 feet + + +
    +
    + + LEFT + on + + Peachtree Center Cycle Track + + + 0.5 miles + + +
    +
    + + RIGHT + on + + Edgewood Avenue Northeast + + + 0.1 miles + + +
    +
    + + LEFT + on + + Pryor Street Southwest + + + 269 feet + + +
    +
    + + CONTINUE + on + + Pryor Street + + + 518 feet + + +
    +
    + + CONTINUE + on + + Pryor Street Southwest + + + 0.2 miles + + +
    +
    + + RIGHT + on + + Unnamed Path + + + 19 feet + + +
    +
    + + RIGHT + on + + sidewalk + + + 22 feet + + +
    +
    +
    +
    +
    +`; + +exports[`Storyshots PrintableItinerary OTP 24 Itinerary 1`] = ` + + + +`; + +exports[`Storyshots PrintableItinerary OTP 24 Itinerary 2`] = ` +.c16 { + font-weight: 200; +} + +.c7 { + font-weight: inherit; +} + +.c12 { + font-weight: 500; +} + +.c13 { + font-weight: 200; + opacity: 0.8975; + padding-left: 1ch; +} + +.c0 { + margin-bottom: 10px; + border-top: 1px solid grey; + padding-top: 18px; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; +} + +.c1 { + border-top: none; + padding-top: 0; +} + +.c2 { + margin-left: 10px; +} + +.c9 { + font-size: 14px; + margin-top: 3px; +} + +.c8 { + margin-top: 5px; +} + +.c3 { + font-size: 18px; +} + +.c6 { + font-size: 18px; +} + +.c4 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + height: 100%; + min-width: 70px; +} + +.c10 .c11 { + font-weight: bold; +} + +.c14 { + font-weight: bold; +} + +.c14 .c15 { + font-weight: normal; +} + +.c5 { + float: left; + width: 32px; + height: 32px; +} + +
    +
    +
    +
    + + Depart + + from + + 1375 NE Cherry Lane, Hillsboro + +
    +
    +
    +
    +
    +
    + + + +
    +
    +
    + + Walk 0.9 miles to + + Orenco MAX Station + + +
    +
    + + Head + NORTHEAST + on + + parking aisle + + + 212 feet + + +
    +
    + + LEFT + on + + Northeast Cherry Lane + + + 342 feet + + +
    +
    + + LEFT + on + + Northeast Cherry Drive + + + 0.7 miles + + +
    +
    + + LEFT + on + + Northeast Century Boulevard + + + 332 feet + + +
    +
    + + RIGHT + on + + Northeast Century Boulevard (path) + + + 26 feet + + +
    +
    + + CONTINUE + on + + Unnamed Path + + + 204 feet + + +
    +
    + + CONTINUE + on + + Orenco + + + 98 feet + + +
    +
    +
    +
    +
    +
    +
    + + + +
    +
    +
    +
    + + + + MAX Blue Line + + to + + Gresham + +
    +
    +
    + Board at + + Orenco MAX Station + + (9835) at + + 8:15 AM + +
    +
    + Get off at + + Providence Park MAX Station + + (9758) at + + 8:49 AM + +
    +
    +
    +
    +
    +
    +
    + + + +
    +
    +
    + + Walk 0.2 miles to + + W Burnside & SW 18th + + +
    +
    + + Head + EAST + on + + Providence Park + + + 81 feet + + +
    +
    + + LEFT + on + + Unnamed Path + + + 19 feet + + +
    +
    + + RIGHT + on + + Unnamed Path + + + 19 feet + + +
    +
    + + LEFT + on + + Southwest 17th Avenue + + + 0.1 miles + + +
    +
    + + LEFT + on + + West Burnside Street + + + 276 feet + + +
    +
    +
    +
    +
    +
    +
    + + + +
    +
    +
    +
    + + 20 + + + + Burnside/Stark + + to + + Gresham TC + +
    +
    +
    + Board at + + W Burnside & SW 18th + + (9860) at + + 8:57 AM + +
    +
    + Get off at + + E Burnside & SE 94th + + (822) at + + 9:25 AM + +
    +
    +
    +
    +
    +
    +
    + + + +
    +
    +
    + + Walk 0.5 miles to + + 766 NE 94th Avenue, Portland + + +
    +
    + + Head + WEST + on + + East Burnside Street (sidewalk) + + + 79 feet + + +
    +
    + + RIGHT + on + + Southeast 94th Avenue + + + 28 feet + + +
    +
    + + CONTINUE + on + + Northeast 94th Avenue + + + 0.4 miles + + +
    +
    + + RIGHT + on + + Northeast Oregon Street + + + 107 feet + + +
    +
    +
    +
    +
    +`; + +exports[`Storyshots PrintableItinerary Park And Ride Itinerary 1`] = ` + + + +`; + +exports[`Storyshots PrintableItinerary Park And Ride Itinerary 2`] = ` +.c16 { + font-weight: 200; +} + +.c7 { + font-weight: inherit; +} + +.c12 { + font-weight: 500; +} + +.c13 { + font-weight: 200; + opacity: 0.8975; + padding-left: 1ch; +} + +.c0 { + margin-bottom: 10px; + border-top: 1px solid grey; + padding-top: 18px; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; +} + +.c1 { + border-top: none; + padding-top: 0; +} + +.c2 { + margin-left: 10px; +} + +.c9 { + font-size: 14px; + margin-top: 3px; +} + +.c8 { + margin-top: 5px; +} + +.c3 { + font-size: 18px; +} + +.c6 { + font-size: 18px; +} + +.c4 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + height: 100%; + min-width: 70px; +} + +.c10 .c11 { + font-weight: bold; +} + +.c14 { + font-weight: bold; +} + +.c14 .c15 { + font-weight: normal; +} + +.c5 { + float: left; + width: 32px; + height: 32px; +} + +
    +
    +
    +
    + + Depart + + from + + 330 SW Murray Blvd, Washington County, OR, USA 97005 + +
    +
    +
    +
    +
    +
    + + + + +
    +
    +
    + + Drive 2.4 miles to + + P+R Sunset TC + + +
    +
    + + Head + SOUTHWEST + on + + parking aisle + + + 158 feet + + +
    +
    + + RIGHT + on + + SW Murray Blvd + + + 0.2 miles + + +
    +
    + + CONTINUE + on + + NW Murray Blvd + + + 150 feet + + +
    +
    + + SLIGHTLY_RIGHT + on + + NW Murray Blvd + + + 0.4 miles + + +
    +
    + + CONTINUE + on + + NW Sunset Hwy + + + 0.6 miles + + +
    +
    + + CONTINUE + on + + NW Sunset Hwy + + + 0.3 miles + + +
    +
    + + LEFT + on + + SW Cedar Hills Blvd + + + 0.2 miles + + +
    +
    + + RIGHT + on + + SW Barnes Rd + + + 0.5 miles + + +
    +
    + + RIGHT + on + + service road + + + 0.2 miles + + +
    +
    + + RIGHT + on + + Sunset TC + + + 76 feet + + +
    +
    +
    +
    +
    +
    +
    + + + +
    +
    +
    + + Walk 426 feet to + + Sunset TC MAX Station + + +
    +
    + + SLIGHTLY_RIGHT + on + + Unnamed Path + + + 16 feet + + +
    +
    + + LEFT + on + + steps + + + 232 feet + + +
    +
    + + LEFT + on + + Unnamed Path + + + 19 feet + + +
    +
    + + RIGHT + on + + Sunset TC (path) + + + 159 feet + + +
    +
    +
    +
    +
    +
    +
    + + + +
    +
    +
    +
    + + MAX Blue Line + + + + MAX Blue Line + + to + + Gresham + +
    +
    +
    + Board at + + Sunset TC MAX Station + + (2600) at + + 4:05 PM + +
    +
    + Get off at + + Oak/ SW 1st Ave MAX Station + + (8337) at + + 4:27 PM + +
    +
    +
    +
    +
    +
    +
    + + + +
    +
    +
    + + Walk 0.1 miles to + + 205 SW Pine St, Portland, OR, USA 97204 + + +
    +
    + + Head + NORTHEAST + on + + Oak/SW 1st Ave (path) + + + 13 feet + + +
    +
    + + CONTINUE + on + + Unnamed Path + + + 27 feet + + +
    +
    + + LEFT + on + + SW Oak St + + + 37 feet + + +
    +
    + + RIGHT + on + + SW 1st Ave + + + 260 feet + + +
    +
    + + LEFT + on + + SW Pine St + + + 337 feet + + +
    +
    +
    +
    +
    +`; + +exports[`Storyshots PrintableItinerary Styled Walk Transit Walk Itinerary 1`] = ` + + + +`; + +exports[`Storyshots PrintableItinerary Styled Walk Transit Walk Itinerary 2`] = ` +.c18 { + font-weight: 200; +} + +.c9 { + font-weight: inherit; +} + +.c14 { + font-weight: 500; +} + +.c15 { + font-weight: 200; + opacity: 0.8975; + padding-left: 1ch; +} + +.c1 { + margin-bottom: 10px; + border-top: 1px solid grey; + padding-top: 18px; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; +} + +.c2 { + border-top: none; + padding-top: 0; +} + +.c4 { + margin-left: 10px; +} + +.c11 { + font-size: 14px; + margin-top: 3px; +} + +.c10 { + margin-top: 5px; +} + +.c5 { + font-size: 18px; +} + +.c8 { + font-size: 18px; +} + +.c6 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + height: 100%; + min-width: 70px; +} + +.c12 .c13 { + font-weight: bold; +} + +.c16 { + font-weight: bold; +} + +.c16 .c17 { + font-weight: normal; +} + +.c7 { + float: left; + width: 32px; + height: 32px; +} + +.c0 .c3 { + background-color: pink; +} + +
    +
    +
    +
    + + Depart + + from + + KGW Studio on the Sq, Portland, OR, USA + +
    +
    +
    +
    +
    +
    + + + +
    +
    +
    + + Walk 269 feet to + + Pioneer Square North MAX Station + + +
    +
    + + Head + NORTHWEST + on + + Unnamed Path + + + 167 feet + + +
    +
    + + LEFT + on + + Pioneer Sq N (path) + + + 101 feet + + +
    +
    +
    +
    +
    +
    +
    + + + +
    +
    +
    +
    + + MAX Blue Line + + + + MAX Blue Line + + to + + Hillsboro + +
    +
    +
    + Board at + + Pioneer Square North MAX Station + + (8383) at + + 3:46 PM + +
    +
    + Get off at + + Providence Park MAX Station + + (9757) at + + 3:49 PM + +
    +
    +
    +
    +
    +
    +
    + + + +
    +
    +
    + + Walk 249 feet to + + 1737 SW Morrison St, Portland, OR, USA 97205 + + +
    +
    + + Head + WEST + on + + Providence Park (path) + + + 19 feet + + +
    +
    + + RIGHT + on + + Unnamed Path + + + 104 feet + + +
    +
    + + RIGHT + on + + Unnamed Path + + + 27 feet + + +
    +
    + + RIGHT + on + + SW Morrison St + + + 99 feet + + +
    +
    +
    +
    +
    +`; + +exports[`Storyshots PrintableItinerary Tnc Transit Itinerary 1`] = ` + + + +`; + +exports[`Storyshots PrintableItinerary Tnc Transit Itinerary 2`] = ` +.c9 { + font-weight: inherit; +} + +.c0 { + margin-bottom: 10px; + border-top: 1px solid grey; + padding-top: 18px; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; +} + +.c1 { + border-top: none; + padding-top: 0; +} + +.c2 { + margin-left: 10px; +} + +.c7 { + font-size: 14px; + margin-top: 3px; +} + +.c6 { + margin-top: 5px; +} + +.c3 { + font-size: 18px; +} + +.c8 { + font-size: 18px; +} + +.c4 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + height: 100%; + min-width: 70px; +} + +.c10 { + font-weight: bold; +} + +.c5 { + float: left; + width: 32px; + height: 32px; +} + +
    +
    +
    +
    + + Depart + + from + + 128 NW 12th Ave, Portland + +
    +
    +
    +
    +
    +
    + + + + + + +
    +
    +
    +
    + + Take + + to + + West Burnside Street + +
    +
    +
    + Estimated wait time for pickup: + + 4 min + +
    +
    + Estimated travel time: + + 2 min + + (does not account for traffic) +
    +
    +
    +
    +
    +
    +
    + + + +
    +
    +
    + + Walk to + + W Burnside & SW 6th + + +
    +
    +
    +
    +
    +
    + + + +
    +
    +
    +
    + + 20 + + + + Burnside/Stark + +
    +
    +
    + Board at + + W Burnside & SW 6th + + () at + + 11:02 AM + +
    +
    + Get off at + + E Burnside & SE 12th + + () at + + 11:08 AM + +
    +
    +
    +
    +
    +
    +
    + + + +
    +
    +
    + + Walk to + + East Burnside Street + + +
    +
    +
    +
    +
    +
    + + + + + + +
    +
    +
    +
    + + Take + + to + + 407 NE 12th Ave, Portland + +
    +
    +
    + Estimated wait time for pickup: + + 2 min + +
    +
    + Estimated travel time: + + 1 min + + (does not account for traffic) +
    +
    +
    +
    +
    +`; + +exports[`Storyshots PrintableItinerary Walk Interlined Transit Itinerary 1`] = ` + + + +`; + +exports[`Storyshots PrintableItinerary Walk Interlined Transit Itinerary 2`] = ` +.c7 { + font-weight: inherit; +} + +.c12 { + font-weight: 500; +} + +.c13 { + font-weight: 200; + opacity: 0.8975; + padding-left: 1ch; +} + +.c0 { + margin-bottom: 10px; + border-top: 1px solid grey; + padding-top: 18px; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; +} + +.c1 { + border-top: none; + padding-top: 0; +} + +.c2 { + margin-left: 10px; +} + +.c9 { + font-size: 14px; + margin-top: 3px; +} + +.c8 { + margin-top: 5px; +} + +.c3 { + font-size: 18px; +} + +.c6 { + font-size: 18px; +} + +.c4 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + height: 100%; + min-width: 70px; +} + +.c10 .c11 { + font-weight: bold; +} + +.c14 { + font-weight: bold; +} + +.c5 { + float: left; + width: 32px; + height: 32px; +} + +
    +
    +
    +
    + + Depart + + from + + 47.97767, -122.20034 + +
    +
    +
    +
    +
    +
    + + + +
    +
    +
    + + Walk 0.3 miles to + + Everett Station Bay C1 + + +
    +
    + + Head + SOUTH + on + + service road + + + 0.1 miles + + +
    +
    + + RIGHT + on + + Smith Avenue + + + 129 feet + + +
    +
    + + CONTINUE + on + + Paine Avenue + + + 61 feet + + +
    +
    + + LEFT + on + + 32nd Street + + + 67 feet + + +
    +
    + + RIGHT + on + + 32nd Street + + + 313 feet + + +
    +
    + + LEFT + on + + Unnamed Path + + + 380 feet + + +
    +
    +
    +
    +
    +
    +
    + + + +
    +
    +
    +
    + + 512 + + + + Northgate Station + +
    +
    +
    + Board at + + Everett Station Bay C1 + + (2345) at + + 1:04 PM + +
    +
    + Get off at + + Northgate Station + + (2191) at + + 1:51 PM + +
    +
    +
    +
    +
    +
    +
    + + + +
    +
    +
    + + Walk to + + Northgate Station - Bay 4 + + +
    +
    +
    +
    +
    +
    + + + +
    +
    +
    +
    + + 40 + + + + Downtown Seattle Ballard + +
    +
    +
    + Board at + + Northgate Station - Bay 4 + + (35318) at + + 1:55 PM + +
    +
    + Get off at + + N 105th St & Aurora Ave N + + (40032) at + + 2:06 PM + +
    +
    +
    +
    +
    +
    +
    + + + +
    +
    +
    + + Walk 259 feet to + + Aurora Ave N & N 105th St + + +
    +
    + + Head + EAST + on + + North 105th Street + + + 64 feet + + +
    +
    + + RIGHT + on + + service road + + + 14 feet + + +
    +
    + + LEFT + on + + Unnamed Path + + + 180 feet + + +
    +
    +
    +
    +
    +
    +
    + + + +
    +
    +
    +
    + + E Line + + + + Downtown Seattle + +
    +
    +
    + Board at + + Aurora Ave N & N 105th St + + (7080) at + + 2:07 PM + +
    +
    + Get off at + + 3rd Ave & Cherry St + + (490) at + + 2:39 PM + +
    +
    +
    +
    +
    +
    +
    + + + +
    +
    +
    + + Walk 443 feet to + + 208 James St, Seattle, WA 98104-2212, United States + + +
    +
    + + Head + SOUTHEAST + on + + sidewalk + + + 326 feet + + +
    +
    + + UTURN_RIGHT + on + + sidewalk + + + 117 feet + + +
    +
    +
    +
    +
    +`; + +exports[`Storyshots PrintableItinerary Walk Only Itinerary 1`] = ` + + + +`; + +exports[`Storyshots PrintableItinerary Walk Only Itinerary 2`] = ` +.c7 { + font-weight: inherit; +} + +.c12 { + font-weight: 500; +} + +.c0 { + margin-bottom: 10px; + border-top: 1px solid grey; + padding-top: 18px; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; +} + +.c1 { + border-top: none; + padding-top: 0; +} + +.c2 { + margin-left: 10px; +} + +.c9 { + font-size: 14px; + margin-top: 3px; +} + +.c8 { + margin-top: 5px; +} + +.c3 { + font-size: 18px; +} + +.c6 { + font-size: 18px; +} + +.c4 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + height: 100%; + min-width: 70px; +} + +.c10 .c11 { + font-weight: bold; +} + +.c5 { + float: left; + width: 32px; + height: 32px; +} + +
    +
    +
    +
    + + Depart + + from + + KGW Studio on the Sq, Portland, OR, USA + +
    +
    +
    +
    +
    +
    + + + +
    +
    +
    + + Walk 166 feet to + + 701 SW 6th Ave, Portland, OR, USA 97204 + + +
    +
    + + Head + NORTHWEST + on + + Unnamed Path + + +
    +
    + + LEFT + on + + Unnamed Path + + +
    +
    +
    +
    +
    +`; + +exports[`Storyshots PrintableItinerary Walk Transit Transfer Itinerary 1`] = ` + + + +`; + +exports[`Storyshots PrintableItinerary Walk Transit Transfer Itinerary 2`] = ` +.c16 { + font-weight: 200; +} + +.c7 { + font-weight: inherit; +} + +.c12 { + font-weight: 500; +} + +.c13 { + font-weight: 200; + opacity: 0.8975; + padding-left: 1ch; +} + +.c0 { + margin-bottom: 10px; + border-top: 1px solid grey; + padding-top: 18px; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; +} + +.c1 { + border-top: none; + padding-top: 0; +} + +.c2 { + margin-left: 10px; +} + +.c9 { + font-size: 14px; + margin-top: 3px; +} + +.c8 { + margin-top: 5px; +} + +.c3 { + font-size: 18px; +} + +.c6 { + font-size: 18px; +} + +.c4 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + height: 100%; + min-width: 70px; +} + +.c10 .c11 { + font-weight: bold; +} + +.c14 { + font-weight: bold; +} + +.c14 .c15 { + font-weight: normal; +} + +.c5 { + float: left; + width: 32px; + height: 32px; +} + +
    +
    +
    +
    + + Depart + + from + + 3940 SE Brooklyn St, Portland, OR, USA 97202 + +
    +
    +
    +
    +
    +
    + + + +
    +
    +
    + + Walk 238 feet to + + SE Cesar Chavez Blvd & Brooklyn (long address that spans multiple lines) + + +
    +
    + + Head + WEST + on + + SE Brooklyn St + + + 205 feet + + +
    +
    + + RIGHT + on + + SE Cesar E. Chavez Blvd + + + 33 feet + + +
    +
    +
    +
    +
    +
    +
    + + + +
    +
    +
    +
    + + 755X + + + + Cesar Chavez/Lombard (very long route name) + + to + + St. Johns via NAYA + +
    +
    +
    + Board at + + SE Cesar Chavez Blvd & Brooklyn + + (7439) at + + 3:47 PM + +
    +
    + Get off at + + SE Cesar Chavez Blvd & Hawthorne + + (7459) at + + 3:52 PM + +
    +
    +
    +
    +
    +
    +
    + + + +
    +
    +
    + + Walk 440 feet to + + SE Hawthorne & Cesar Chavez Blvd + + +
    +
    + + Head + SOUTH + on + + service road + + + 146 feet + + +
    +
    + + RIGHT + on + + SE Cesar E. Chavez Blvd + + + 198 feet + + +
    +
    + + LEFT + on + + SE Hawthorne Blvd + + + 96 feet + + +
    +
    +
    +
    +
    +
    +
    + + + +
    +
    +
    +
    + + 1 + + + + Hawthorne + + to + + Portland + +
    +
    +
    + Board at + + SE Hawthorne & Cesar Chavez Blvd + + (2626) at + + 4:00 PM + +
    +
    + Get off at + + SE Hawthorne & 27th + + (2613) at + + 4:04 PM + +
    +
    +
    +
    +
    +
    +
    + + + +
    +
    +
    + + Walk 479 feet to + + 1415 SE 28th Ave, Portland, OR, USA 97214 + + +
    +
    + + Head + WEST + on + + SE Hawthorne Blvd + + + 40 feet + + +
    +
    + + RIGHT + on + + SE 27th Ave + + + 294 feet + + +
    +
    + + RIGHT + on + + SE Madison St + + + 146 feet + + +
    +
    +
    +
    +
    +`; + +exports[`Storyshots PrintableItinerary Walk Transit Transfer With A 11 Y Itinerary 1`] = ` + + - - - - -`; - -exports[`Storyshots RouteViewerOverlay Flex Route 3 2`] = ` -.c0 { - height: 90vh; -} - -
    -
    -
    -`; - -exports[`Storyshots RouteViewerOverlay OTP 2 Route Outside Of Initial View 1`] = ` - - - - - - - - - -`; - -exports[`Storyshots RouteViewerOverlay OTP 2 Route Outside Of Initial View 2`] = ` -.c0 { - height: 90vh; -} - -
    -
    -
    -`; - -exports[`Storyshots RouteViewerOverlay With Changing Path 1`] = ` - - - - - - - -`; - -exports[`Storyshots RouteViewerOverlay With Changing Path 2`] = ` -.c0 { - height: 90vh; -} - -
    -
    -
    -`; - -exports[`Storyshots RouteViewerOverlay With Path Styling 1`] = ` - - - - - - - - + Object { + "absoluteDirection": "EAST", + "area": false, + "bogusName": false, + "distance": 44.39, + "elevation": Array [ + Object { + "first": 0, + "second": 45.00284254544678, + }, + Object { + "first": 10, + "second": 45.25284254544678, + }, + Object { + "first": 20, + "second": 45.402842545446774, + }, + Object { + "first": 30, + "second": 45.63284254544678, + }, + Object { + "first": 41.55, + "second": 46.06284254544678, + }, + Object { + "first": 41.547, + "second": 46.06284254544678, + }, + Object { + "first": 44.387, + "second": 46.24284254544678, + }, + ], + "lat": 45.5128815, + "lon": -122.6381445, + "relativeDirection": "RIGHT", + "stayOn": false, + "streetName": "SE Madison St", + }, + ], + "to": Object { + "arrival": 1573690001000, + "lat": 45.51258575759002, + "lon": -122.63757592401461, + "name": "1415 SE 28th Ave, Portland, OR, USA 97214", + "orig": "1415 SE 28th Ave, Portland, OR, USA 97214", + "vertexType": "NORMAL", + }, + "transitLeg": false, + }, + ], + "startTime": 1573688769000, + "tooSloped": false, + "transfers": 1, + "transitTime": 550, + "waitingTime": 379, + "walkDistance": 352.75874626614717, + "walkLimitExceeded": false, + "walkTime": 303, + } + } + /> `; -exports[`Storyshots RouteViewerOverlay With Path Styling 2`] = ` -.c0 { - height: 90vh; +exports[`Storyshots PrintableItinerary Walk Transit Transfer With A 11 Y Itinerary 2`] = ` +.c8 { + display: inline-block; + vertical-align: middle; + overflow: hidden; } -
    -
    -
    -`; +.c7 { + display: inline-block; + grid-row-start: 2; + grid-column-start: 1; + height: 0; + overflow: hidden; + width: 0; +} -exports[`Storyshots SeṯtingsSelectorPanel Settings Selector Panel 1`] = ` - -
    - - -
    -     -`; +.c20 { + font-weight: 200; +} -exports[`Storyshots SeṯtingsSelectorPanel Settings Selector Panel 2`] = ` -.c6 { - font-weight: normal; - padding-left: 6px; +.c11 { + font-weight: inherit; } -.c0 { - padding: 0px 5px; - box-sizing: border-box; +.c16 { + font-weight: 500; } -.c0 > * { - width: 100%; +.c17 { + font-weight: 200; + opacity: 0.8975; + padding-left: 1ch; } -.c3 > * { - width: 33.333333%; - padding: 0px 5px; +.c6 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + border: 1px solid #333; + background-color: transparent; + border-radius: 20px; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-box-pack: justify; + -webkit-justify-content: space-between; + -ms-flex-pack: justify; + justify-content: space-between; + margin-top: 0.25em; + max-width: 75px; + height: 30px; + padding: 0.25em 0.6em 0.25em 0.4em; + word-wrap: anywhere; } -.c5 > * { - width: 33.333333%; - padding: 0px 5px; +.c9 { + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; +} + +.c9 span { + display: block; +} + +.c0 { + margin-bottom: 10px; + border-top: 1px solid grey; + padding-top: 18px; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; } .c1 { - display: inline-block; - text-align: center; - box-sizing: border-box; + border-top: none; + padding-top: 0; } -.c1 > * { - box-sizing: border-box; - overflow: hidden; - white-space: nowrap; +.c2 { + margin-left: 10px; } -.c4 { - font-size: 70%; +.c13 { + font-size: 14px; + margin-top: 3px; } -.c4.disabled { - color: #686868; +.c12 { + margin-top: 5px; } -.c2 { - cursor: pointer; - width: 100%; - height: 100%; +.c3 { + font-size: 18px; } -.c2 svg, -.c2 img { - vertical-align: middle; - max-width: 1.25em; - margin: 0 0.25em; - height: 1.25em; +.c10 { + font-size: 18px; } -.c2.active { - font-weight: 600; - box-shadow: 0 0 2px 2px rgba(0,64,255,0.5); +.c4 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + height: 100%; + min-width: 70px; } -.c2.disabled { - cursor: default; +.c14 .c15 { + font-weight: bold; } -.c2.disabled svg { - fill: #ccc; +.c18 { + font-weight: bold; } -.c7 > div { - width: 50%; - display: inline-block; - box-sizing: border-box; - position: relative; +.c18 .c19 { + font-weight: normal; } -.c7 select { - width: 100%; - box-sizing: border-box; - cursor: pointer; +.c5 { + float: left; + width: 32px; + height: 32px; } -
    +
    -
    - -
    + + Depart + + from + + 3940 SE Brooklyn St, Portland, OR, USA 97202 +
    +
    +
    +
    +
    -
    - -
    - Transports + Marche -
    -
    -
    - -
    - Transports + Vélo personnel -
    -
    -
    - -
    - Transports + Biketown -
    -
    -
    - -
    - Transports + Trottinette électrique -
    -
    -
    - -
    - Parc relais -
    -
    -
    - -
    - Transports + Uber -
    -
    + + +
    +
    + + otpUi.ItineraryBody.tripAccessibility.itineraryAccessibilityotpUi.ItineraryBody.tripAccessibility.likelyAccessible + + + + ✅ + +
    +
    +
    + + Walk 238 feet to + + SE Cesar Chavez Blvd & Brooklyn (long address that spans multiple lines) + + +
    - -
    - Transports + ReachNow -
    + + 205 feet + +
    - -
    - Transports + Car2Go -
    + + 33 feet + +
    +
    +
    +
    +
    -
    -
    +
    + + otpUi.ItineraryBody.tripAccessibility.itineraryAccessibilityotpUi.ItineraryBody.tripAccessibility.unclear + + + + ？ + +
    +
    +
    +
    + + 755X + + + + Cesar Chavez/Lombard (very long route name) + - - - - - - Walk Only - - -
    + to + + St. Johns via NAYA + +
    +
    - + Board at + + SE Cesar Chavez Blvd & Brooklyn + + (7439) at + + 3:47 PM +
    - + Get off at + + SE Cesar Chavez Blvd & Hawthorne + + (7459) at + + 3:52 PM +
    +
    +
    - Travel Preferences +
    + + + +
    - -
    -
    - +
    - + + 198 feet + +
    - + + 96 feet + +
    +
    +
    -
    -
    +
    + + otpUi.ItineraryBody.tripAccessibility.itineraryAccessibilityotpUi.ItineraryBody.tripAccessibility.inaccessible + + + + ❌ + +
    +
    +
    +
    + + 1 + + + + Hawthorne + - Maximum Walk - + to + + Portland + +
    +
    +
    + Board at + + SE Hawthorne & Cesar Chavez Blvd + + (2626) at + + 4:00 PM +
    -
    - + 146 feet + +
    -
    `; -exports[`Storyshots SeṯtingsSelectorPanel Settings Selector Panel With Custom Icons 1`] = ` +exports[`Storyshots PrintableItinerary Walk Transit Walk Itinerary 1`] = ` -
    - - -
    +     `; -exports[`Storyshots SeṯtingsSelectorPanel Settings Selector Panel With Custom Icons 2`] = ` -.c6 { - font-weight: normal; - padding-left: 6px; +exports[`Storyshots PrintableItinerary Walk Transit Walk Itinerary 2`] = ` +.c16 { + font-weight: 200; } -.c0 { - padding: 0px 5px; - box-sizing: border-box; +.c7 { + font-weight: inherit; } -.c0 > * { - width: 100%; +.c12 { + font-weight: 500; } -.c3 > * { - width: 33.333333%; - padding: 0px 5px; +.c13 { + font-weight: 200; + opacity: 0.8975; + padding-left: 1ch; } -.c5 > * { - width: 33.333333%; - padding: 0px 5px; +.c0 { + margin-bottom: 10px; + border-top: 1px solid grey; + padding-top: 18px; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; } .c1 { - display: inline-block; - text-align: center; - box-sizing: border-box; + border-top: none; + padding-top: 0; } -.c1 > * { - box-sizing: border-box; - overflow: hidden; - white-space: nowrap; +.c2 { + margin-left: 10px; } -.c4 { - font-size: 70%; +.c9 { + font-size: 14px; + margin-top: 3px; } -.c4.disabled { - color: #686868; +.c8 { + margin-top: 5px; } -.c2 { - cursor: pointer; - width: 100%; - height: 100%; +.c3 { + font-size: 18px; } -.c2 svg, -.c2 img { - vertical-align: middle; - max-width: 1.25em; - margin: 0 0.25em; - height: 1.25em; +.c6 { + font-size: 18px; } -.c2.active { - font-weight: 600; - box-shadow: 0 0 2px 2px rgba(0,64,255,0.5); +.c4 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + height: 100%; + min-width: 70px; } -.c2.disabled { - cursor: default; +.c10 .c11 { + font-weight: bold; } -.c2.disabled svg { - fill: #ccc; +.c14 { + font-weight: bold; } -.c7 > div { - width: 50%; - display: inline-block; - box-sizing: border-box; - position: relative; +.c14 .c15 { + font-weight: normal; } -.c7 select { - width: 100%; - box-sizing: border-box; - cursor: pointer; +.c5 { + float: left; + width: 32px; + height: 32px; } -
    +
    -
    - -
    + + Depart + + from + + KGW Studio on the Sq, Portland, OR, USA +
    +
    +
    +
    +
    -
    - -
    - Transports + Marche -
    -
    -
    + +
    +
    +
    + + Walk 269 feet to + - -
    - Transports + Vélo personnel -
    -
    + Pioneer Square North MAX Station + + +
    - -
    - Transports + Biketown -
    -
    -
    - -
    - Transports + Trottinette électrique -
    +
    - -
    - Parc relais -
    -
    -
    - -
    - Transports + Uber -
    +
    -
    +
    +
    +
    +
    +
    + - - - - - - - - - - + - - - - - - - - -
    + +
    +
    +
    +
    + + MAX Blue Line + + + + MAX Blue Line + - Transports + ReachNow -
    -
    + to + + Hillsboro + +
    +
    - -
    - Transports + Car2Go -
    + Board at + + Pioneer Square North MAX Station + + (8383) at + + 3:46 PM + +
    +
    + Get off at + + Providence Park MAX Station + + (9757) at + + 3:49 PM +
    +
    +
    +
    +
    + + + +
    +
    +
    + + Walk 249 feet to + + 1737 SW Morrison St, Portland, OR, USA 97205 + + +
    - + + 19 feet + +
    - + + 104 feet + +
    - + + 27 feet + + +
    +
    + + RIGHT + on + + SW Morrison St + + + 99 feet + +
    -
    +
    +`; + +exports[`Storyshots RouteViewerOverlay Default 1`] = ` + + + - Travel Preferences -
    -
    + + + + + +`; + +exports[`Storyshots RouteViewerOverlay Default 2`] = ` +.c0 { + height: 90vh; +} + +
    +
    +
    +`; + +exports[`Storyshots RouteViewerOverlay Flex Route 1`] = ` + + + + + + + + + + + + + + +`; + +exports[`Storyshots RouteViewerOverlay Flex Route 2`] = ` +.c0 { + height: 90vh; +} + +
    +
    +
    +`; + +exports[`Storyshots RouteViewerOverlay Flex Route 2 1`] = ` + + + - -
    -
    - -
    -
    - -
    -
    - -
    -
    + - -
    -
    -
    -
    -
    -
    - -
    -
    - -
    -
    -
    -
    - + + + + + + + + + +`; + +exports[`Storyshots RouteViewerOverlay Flex Route 2 2`] = ` +.c0 { + height: 90vh; +} + +
    +
    `; -exports[`Storyshots SeṯtingsSelectorPanel Settings Selector Panel With Undefined Params 1`] = ` +exports[`Storyshots RouteViewerOverlay Flex Route 3 1`] = ` -
    - - -
    -     -`; - -exports[`Storyshots SeṯtingsSelectorPanel Settings Selector Panel With Undefined Params 2`] = ` -.c5 { - font-weight: normal; - padding-left: 6px; -} - -.c0 { - padding: 0px 5px; - box-sizing: border-box; -} - -.c0 > * { - width: 100%; -} - -.c3 > * { - width: 33.333333%; - padding: 0px 5px; -} - -.c1 { - display: inline-block; - text-align: center; - box-sizing: border-box; -} - -.c1 > * { - box-sizing: border-box; - overflow: hidden; - white-space: nowrap; -} - -.c2 { - cursor: pointer; - width: 100%; - height: 100%; -} - -.c2 svg, -.c2 img { - vertical-align: middle; - max-width: 1.25em; - margin: 0 0.25em; - height: 1.25em; -} - -.c2.active { - font-weight: 600; - box-shadow: 0 0 2px 2px rgba(0,64,255,0.5); -} - -.c2.disabled { - cursor: default; -} - -.c2.disabled svg { - fill: #ccc; -} - -.c4 > div { - width: 50%; - display: inline-block; - box-sizing: border-box; - position: relative; -} - -.c4 select { - width: 100%; - box-sizing: border-box; - cursor: pointer; -} - -
    -
    -
    + -
    -
    - -
    -
    -
    -
    -
    - Travel Preferences -
    -
    -
    -
    - -
    -
    - -
    -
    -
    -
    - -
    -`; - -exports[`Storyshots StopViewerOverlay Default 1`] = ` - - - - - - - -`; - -exports[`Storyshots StopViewerOverlay Default 2`] = ` -.c0 { - height: 90vh; -} - -
    -
    -
    -`; - -exports[`Storyshots StopViewerOverlay With Custom Marker 1`] = ` - - - - - - - -`; - -exports[`Storyshots StopViewerOverlay With Custom Marker 2`] = ` -.c0 { - height: 90vh; -} - -
    -
    -
    -`; - -exports[`Storyshots StopsOverlay Default 1`] = ` - - - - - - - -`; - -exports[`Storyshots StopsOverlay Default 2`] = ` -.c0 { - height: 90vh; -} - -
    -
    -
    -`; - -exports[`Storyshots StopsOverlay Flex Stops 1`] = ` - - - - - + - - - - - - -`; - -exports[`Storyshots StopsOverlay Flex Stops 2`] = ` -.c0 { - height: 90vh; -} - -
    -
    -
    -`; - -exports[`Storyshots StopsOverlay No Min Zoom 1`] = ` - - - - - - With MapLibreGL, strong performance can be achieved without needing to rely on minZoom - - @@ -255258,447 +259558,7 @@ exports[`Storyshots StopsOverlay No Min Zoom 1`] = ` `; -exports[`Storyshots StopsOverlay No Min Zoom 2`] = ` -.c0 { - height: 90vh; -} - -
    -
    -
    -`; - -exports[`Storyshots TransitVehicleOverlay Custom Mode Icon 1`] = ` - - - - - - - -`; - -exports[`Storyshots TransitVehicleOverlay Custom Mode Icon 2`] = ` -.c0 { - height: 90vh; -} - -
    -
    -
    -`; - -exports[`Storyshots TransitVehicleOverlay Default 1`] = ` - - - - - - - -`; - -exports[`Storyshots TransitVehicleOverlay Default 2`] = ` +exports[`Storyshots RouteViewerOverlay Flex Route 3 2`] = ` .c0 { height: 90vh; } @@ -255718,7 +259578,7 @@ exports[`Storyshots TransitVehicleOverlay Default 2`] = `
    `; -exports[`Storyshots TransitVehicleOverlay Default Route Color When Vehicle Route Color Absent 1`] = ` +exports[`Storyshots RouteViewerOverlay OTP 2 Route Outside Of Initial View 1`] = ` - + + "routeBikesAllowed": "NO_INFORMATION", + "shortName": "101", + "textColor": "f2f2f2", + "type": 3, + "url": null, + "v2": true, + } + } + /> + `; -exports[`Storyshots TransitVehicleOverlay Default Route Color When Vehicle Route Color Absent 2`] = ` +exports[`Storyshots RouteViewerOverlay OTP 2 Route Outside Of Initial View 2`] = ` .c0 { height: 90vh; } @@ -255966,7 +260314,7 @@ exports[`Storyshots TransitVehicleOverlay Default Route Color When Vehicle Route
    `; -exports[`Storyshots TransitVehicleOverlay Inner Caret 1`] = ` +exports[`Storyshots RouteViewerOverlay With Changing Path 1`] = ` - + `; -exports[`Storyshots TransitVehicleOverlay Inner Caret 2`] = ` +exports[`Storyshots RouteViewerOverlay With Changing Path 2`] = ` .c0 { height: 90vh; } @@ -256187,7 +260361,7 @@ exports[`Storyshots TransitVehicleOverlay Inner Caret 2`] = `
    `; -exports[`Storyshots TransitVehicleOverlay Outer Caret With Custom Size 1`] = ` +exports[`Storyshots RouteViewerOverlay With Path Styling 1`] = ` - + - - - -`; - -exports[`Storyshots TransitVehicleOverlay Outer Caret With Custom Size 2`] = ` -.c0 { - height: 90vh; -} - -
    -
    -
    -`; - -exports[`Storyshots TransitVehicleOverlay Rotating Icons No Caret 1`] = ` - - - - + "routeBikesAllowed": 0, + "sortOrder": 120, + "sortOrderSet": true, + "textColor": "FFFFFF", + "type": 0, + "url": "http://trimet.org//schedules/r090.htm", + } + } + /> + `; -exports[`Storyshots TransitVehicleOverlay Rotating Icons No Caret 2`] = ` +exports[`Storyshots RouteViewerOverlay With Path Styling 2`] = ` .c0 { height: 90vh; } @@ -256666,7 +260496,939 @@ exports[`Storyshots TransitVehicleOverlay Rotating Icons No Caret 2`] = `
    `; -exports[`Storyshots TransitVehicleOverlay Route Color Background 1`] = ` +exports[`Storyshots SeṯtingsSelectorPanel Settings Selector Panel 1`] = ` + +
    + + +
    +     +`; + +exports[`Storyshots SeṯtingsSelectorPanel Settings Selector Panel 2`] = ` +.c6 { + font-weight: normal; + padding-left: 6px; +} + +.c0 { + padding: 0px 5px; + box-sizing: border-box; +} + +.c0 > * { + width: 100%; +} + +.c3 > * { + width: 33.333333%; + padding: 0px 5px; +} + +.c5 > * { + width: 33.333333%; + padding: 0px 5px; +} + +.c1 { + display: inline-block; + text-align: center; + box-sizing: border-box; +} + +.c1 > * { + box-sizing: border-box; + overflow: hidden; + white-space: nowrap; +} + +.c4 { + font-size: 70%; +} + +.c4.disabled { + color: #686868; +} + +.c2 { + cursor: pointer; + width: 100%; + height: 100%; +} + +.c2 svg, +.c2 img { + vertical-align: middle; + max-width: 1.25em; + margin: 0 0.25em; + height: 1.25em; +} + +.c2.active { + font-weight: 600; + box-shadow: 0 0 2px 2px rgba(0,64,255,0.5); +} + +.c2.disabled { + cursor: default; +} + +.c2.disabled svg { + fill: #ccc; +} + +.c7 > div { + width: 50%; + display: inline-block; + box-sizing: border-box; + position: relative; +} + +.c7 select { + width: 100%; + box-sizing: border-box; + cursor: pointer; +} + +
    +
    +
    +
    +
    + +
    +
    +
    +
    + +
    + Transports + Marche +
    +
    +
    + +
    + Transports + Vélo personnel +
    +
    +
    + +
    + Transports + Biketown +
    +
    +
    + +
    + Transports + Trottinette électrique +
    +
    +
    + +
    + Parc relais +
    +
    +
    + +
    + Transports + Uber +
    +
    +
    + +
    + Transports + ReachNow +
    +
    +
    + +
    + Transports + Car2Go +
    +
    +
    +
    +
    + +
    +
    + +
    +
    + +
    +
    +
    +
    + Travel Preferences +
    +
    + +
    +
    + +
    +
    + +
    +
    + +
    +
    + +
    +
    +
    +
    +
    +
    + +
    +
    + +
    +
    +
    +
    + +
    +`; + +exports[`Storyshots SeṯtingsSelectorPanel Settings Selector Panel With Custom Icons 1`] = ` - - - - - +
    + + +
    `; -exports[`Storyshots TransitVehicleOverlay Route Color Background 2`] = ` +exports[`Storyshots SeṯtingsSelectorPanel Settings Selector Panel With Custom Icons 2`] = ` +.c6 { + font-weight: normal; + padding-left: 6px; +} + .c0 { - height: 90vh; + padding: 0px 5px; + box-sizing: border-box; } -
    +.c0 > * { + width: 100%; +} + +.c3 > * { + width: 33.333333%; + padding: 0px 5px; +} + +.c5 > * { + width: 33.333333%; + padding: 0px 5px; +} + +.c1 { + display: inline-block; + text-align: center; + box-sizing: border-box; +} + +.c1 > * { + box-sizing: border-box; + overflow: hidden; + white-space: nowrap; +} + +.c4 { + font-size: 70%; +} + +.c4.disabled { + color: #686868; +} + +.c2 { + cursor: pointer; + width: 100%; + height: 100%; +} + +.c2 svg, +.c2 img { + vertical-align: middle; + max-width: 1.25em; + margin: 0 0.25em; + height: 1.25em; +} + +.c2.active { + font-weight: 600; + box-shadow: 0 0 2px 2px rgba(0,64,255,0.5); +} + +.c2.disabled { + cursor: default; +} + +.c2.disabled svg { + fill: #ccc; +} + +.c7 > div { + width: 50%; + display: inline-block; + box-sizing: border-box; + position: relative; +} + +.c7 select { + width: 100%; + box-sizing: border-box; + cursor: pointer; +} + +
    +
    + > +
    +
    + +
    +
    +
    +
    + +
    + Transports + Marche +
    +
    +
    + +
    + Transports + Vélo personnel +
    +
    +
    + +
    + Transports + Biketown +
    +
    +
    + +
    + Transports + Trottinette électrique +
    +
    +
    + +
    + Parc relais +
    +
    +
    + +
    + Transports + Uber +
    +
    +
    + +
    + Transports + ReachNow +
    +
    +
    + +
    + Transports + Car2Go +
    +
    +
    +
    +
    + +
    +
    + +
    +
    + +
    +
    +
    +
    + Travel Preferences +
    +
    + +
    +
    + +
    +
    + +
    +
    + +
    +
    + +
    +
    +
    +
    +
    +
    + +
    +
    + +
    +
    +
    +
    +
    `; -exports[`Storyshots TransitVehicleOverlay Route Color Background With Inner Caret 1`] = ` +exports[`Storyshots SeṯtingsSelectorPanel Settings Selector Panel With Undefined Params 1`] = ` - - - - - +
    + + +
    `; -exports[`Storyshots TransitVehicleOverlay Route Color Background With Inner Caret 2`] = ` +exports[`Storyshots SeṯtingsSelectorPanel Settings Selector Panel With Undefined Params 2`] = ` +.c5 { + font-weight: normal; + padding-left: 6px; +} + .c0 { - height: 90vh; + padding: 0px 5px; + box-sizing: border-box; } -
    -
    -
    -`; +.c0 > * { + width: 100%; +} -exports[`Storyshots TransitVehicleOverlay Route Color Background With Transparency On Hover 1`] = ` - - - - - - - -`; +.c3 > * { + width: 33.333333%; + padding: 0px 5px; +} -exports[`Storyshots TransitVehicleOverlay Route Color Background With Transparency On Hover 2`] = ` -.c0 { - height: 90vh; +.c1 { + display: inline-block; + text-align: center; + box-sizing: border-box; } -
    -
    -
    -`; +.c1 > * { + box-sizing: border-box; + overflow: hidden; + white-space: nowrap; +} -exports[`Storyshots TransitVehicleOverlay Route Numbers Only With Custom Size And Padding 1`] = ` - - - - - - - -`; +.c2 { + cursor: pointer; + width: 100%; + height: 100%; +} -exports[`Storyshots TransitVehicleOverlay Route Numbers Only With Custom Size And Padding 2`] = ` -.c0 { - height: 90vh; +.c2 svg, +.c2 img { + vertical-align: middle; + max-width: 1.25em; + margin: 0 0.25em; + height: 1.25em; } -
    +.c2.active { + font-weight: 600; + box-shadow: 0 0 2px 2px rgba(0,64,255,0.5); +} + +.c2.disabled { + cursor: default; +} + +.c2.disabled svg { + fill: #ccc; +} + +.c4 > div { + width: 50%; + display: inline-block; + box-sizing: border-box; + position: relative; +} + +.c4 select { + width: 100%; + box-sizing: border-box; + cursor: pointer; +} + +
    +
    + > +
    +
    + +
    +
    +
    +
    +
    + Travel Preferences +
    +
    +
    +
    + +
    +
    + +
    +
    +
    +
    +
    `; -exports[`Storyshots TransitiveOverlay Bike Only Itinerary 1`] = ` +exports[`Storyshots StopViewerOverlay Default 1`] = ` - - - - - - - - + } + visible={true} + /> `; -exports[`Storyshots TransitiveOverlay Bike Only Itinerary 2`] = ` +exports[`Storyshots StopViewerOverlay Default 2`] = ` .c0 { height: 90vh; } @@ -257802,7 +262703,7 @@ exports[`Storyshots TransitiveOverlay Bike Only Itinerary 2`] = `
    `; -exports[`Storyshots TransitiveOverlay Bike Rental Itinerary 1`] = ` +exports[`Storyshots StopViewerOverlay With Custom Marker 1`] = ` - - - - - - - - + } + visible={true} + /> `; -exports[`Storyshots TransitiveOverlay Bike Rental Itinerary 2`] = ` +exports[`Storyshots StopViewerOverlay With Custom Marker 2`] = ` .c0 { height: 90vh; } @@ -258002,7 +262761,7 @@ exports[`Storyshots TransitiveOverlay Bike Rental Itinerary 2`] = `
    `; -exports[`Storyshots TransitiveOverlay Bike Rental Transit Itinerary 1`] = ` +exports[`Storyshots StopsOverlay Default 1`] = ` - - - - - - - - + `; -exports[`Storyshots TransitiveOverlay Bike Rental Transit Itinerary 2`] = ` +exports[`Storyshots StopsOverlay Default 2`] = ` .c0 { height: 90vh; } @@ -258451,7 +262808,7 @@ exports[`Storyshots TransitiveOverlay Bike Rental Transit Itinerary 2`] = `
    `; -exports[`Storyshots TransitiveOverlay Bike Transit Bike Itinerary 1`] = ` +exports[`Storyshots StopsOverlay Flex Stops 1`] = ` - - - - - - - - - -`; - -exports[`Storyshots TransitiveOverlay Bike Transit Bike Itinerary 2`] = ` -.c0 { - height: 90vh; -} - -
    -
    -
    -`; - -exports[`Storyshots TransitiveOverlay E Scooter Rental Itinerary 1`] = ` - - - - - - - [Function] - + }, + "id": "Cobb-flex:zone_3", + "lat": 33.825846635310214, + "locationType": "STOP", + "lon": -84.63430143459385, + "name": "Flex Zone 3", + }, + ] + } + /> @@ -258781,7 +263457,7 @@ exports[`Storyshots TransitiveOverlay E Scooter Rental Itinerary 1`] = ` `; -exports[`Storyshots TransitiveOverlay E Scooter Rental Itinerary 2`] = ` +exports[`Storyshots StopsOverlay Flex Stops 2`] = ` .c0 { height: 90vh; } @@ -258801,7 +263477,7 @@ exports[`Storyshots TransitiveOverlay E Scooter Rental Itinerary 2`] = `
    `; -exports[`Storyshots TransitiveOverlay E Scooter Rental Transit Itinerary 1`] = ` +exports[`Storyshots StopsOverlay No Min Zoom 1`] = ` - - + - - [Function] - - - + With MapLibreGL, strong performance can be achieved without needing to rely on minZoom + + + `; -exports[`Storyshots TransitiveOverlay E Scooter Rental Transit Itinerary 2`] = ` +exports[`Storyshots StopsOverlay No Min Zoom 2`] = ` .c0 { height: 90vh; } @@ -258862,7 +263538,7 @@ exports[`Storyshots TransitiveOverlay E Scooter Rental Transit Itinerary 2`] = `
    `; -exports[`Storyshots TransitiveOverlay Empty 1`] = ` +exports[`Storyshots TransitVehicleOverlay Custom Mode Icon 1`] = ` - `; -exports[`Storyshots TransitiveOverlay Empty 2`] = ` +exports[`Storyshots TransitVehicleOverlay Custom Mode Icon 2`] = ` .c0 { height: 90vh; } @@ -258912,7 +263758,7 @@ exports[`Storyshots TransitiveOverlay Empty 2`] = `
    `; -exports[`Storyshots TransitiveOverlay Flex Itinerary 1`] = ` +exports[`Storyshots TransitVehicleOverlay Default 1`] = ` - - - - - - - - + `; -exports[`Storyshots TransitiveOverlay Flex Itinerary 2`] = ` +exports[`Storyshots TransitVehicleOverlay Default 2`] = ` .c0 { height: 90vh; } @@ -259239,7 +263978,7 @@ exports[`Storyshots TransitiveOverlay Flex Itinerary 2`] = `
    `; -exports[`Storyshots TransitiveOverlay OTP 2 Scooter Itinerary 1`] = ` +exports[`Storyshots TransitVehicleOverlay Default Route Color When Vehicle Route Color Absent 1`] = ` - - - - [Function] - - - + } + ModeIcon={[Function]} + vehicles={ + Array [ + Object { + "label": "406", + "lastUpdated": 1663680673, + "lat": 47.6146202, + "lon": -122.3207016, + "routeShortName": "FH", + "speed": 4, + "stopRelationship": Object { + "status": "IN_TRANSIT_TO", + "stop": Object { + "gtfsId": "kcm:41970", + "name": "Broadway & E Pine St", + }, + }, + "trip": Object { + "pattern": Object { + "id": "UGF0dGVybjprY206MTAyNjM4OjA6MDE", + }, + }, + "vehicleId": "kcm:406", + }, + Object { + "heading": 258, + "label": "402", + "lastUpdated": 1663680670, + "lat": 47.6017303, + "lon": -122.3171387, + "routeShortName": "FH", + "routeType": "TRAM", + "speed": null, + "stopRelationship": Object { + "status": "IN_TRANSIT_TO", + "stop": Object { + "gtfsId": "kcm:27420", + "name": "E Yesler Way & Broadway", + }, + }, + "trip": Object { + "pattern": Object { + "id": "UGF0dGVybjprY206MTAyNjM4OjA6MDE", + }, + }, + "vehicleId": "kcm:402", + }, + Object { + "heading": 135, + "label": "422", + "lastUpdated": 1663680670, + "lat": 47.6617303, + "lon": -122.1171387, + "routeShortName": "FH", + "speed": null, + "stopRelationship": Object { + "status": "IN_TRANSIT_TO", + "stop": Object { + "gtfsId": "kcm:27420", + "name": "E Yesler Way & Broadway", + }, + }, + "trip": Object { + "pattern": Object { + "id": "UGF0dGVybjprY206MTAyNjM4OjA6MDE", + }, + }, + "vehicleId": "kcm:422", + }, + Object { + "heading": 278, + "label": "405", + "lastUpdated": 1663680676, + "lat": 47.5993271, + "lon": -122.3333588, + "routeShortName": "FHH", + "routeType": "DUMMY", + "speed": null, + "stopRelationship": Object { + "status": "STOPPED_AT", + "stop": Object { + "gtfsId": "kcm:1551", + "name": "S Jackson St & Occidental Ave Walk", + }, + }, + "trip": Object { + "pattern": Object { + "id": "UGF0dGVybjprY206MTAyNjM4OjA6MDE", + }, + }, + "vehicleId": "kcm:405", + }, + Object { + "heading": 180, + "label": "409", + "lastUpdated": 1663680676, + "lat": 47.6993271, + "lon": -122.2333588, + "routeShortName": "FH", + "speed": null, + "stopRelationship": Object { + "status": "IN_TRANSIT_TO", + "stop": Object { + "gtfsId": "kcm:1551", + "name": "S Jackson St & Occidental Ave Walk", + }, + }, + "trip": Object { + "pattern": Object { + "id": "UGF0dGVybjprY206MTAyNjM4OjA6MDE", + }, + }, + "vehicleId": "kcm:409", + }, + Object { + "heading": null, + "label": "", + "lastUpdated": null, + "lat": 0, + "lon": 0, + "routeShortName": "FH", + "speed": null, + "stopRelationship": null, + "trip": Object { + "pattern": Object { + "id": "UGF0dGVybjprY206MTAyNjM4OjA6MDE", + }, + }, + "vehicleId": "kcm:403", + }, + Object { + "heading": null, + "label": "", + "lastUpdated": null, + "lat": 0, + "lon": 0, + "routeShortName": "FH", + "speed": null, + "stopRelationship": null, + "trip": Object { + "pattern": Object { + "id": "UGF0dGVybjprY206MTAyNjM4OjA6MDE", + }, + }, + "vehicleId": "kcm:404", + }, + Object { + "heading": null, + "label": "", + "lastUpdated": null, + "lat": 0, + "lon": 0, + "routeShortName": "FH", + "speed": null, + "stopRelationship": null, + "trip": Object { + "pattern": Object { + "id": "UGF0dGVybjprY206MTAyNjM4OjA6MDE", + }, + }, + "vehicleId": "kcm:406", + }, + ] + } + /> `; -exports[`Storyshots TransitiveOverlay OTP 2 Scooter Itinerary 2`] = ` +exports[`Storyshots TransitVehicleOverlay Default Route Color When Vehicle Route Color Absent 2`] = ` .c0 { height: 90vh; } @@ -259300,7 +264226,7 @@ exports[`Storyshots TransitiveOverlay OTP 2 Scooter Itinerary 2`] = `
    `; -exports[`Storyshots TransitiveOverlay Park And Ride Itinerary 1`] = ` +exports[`Storyshots TransitVehicleOverlay Inner Caret 1`] = ` - - - - - - - - + `; -exports[`Storyshots TransitiveOverlay Park And Ride Itinerary 2`] = ` +exports[`Storyshots TransitVehicleOverlay Inner Caret 2`] = ` .c0 { height: 90vh; } @@ -259622,7 +264447,7 @@ exports[`Storyshots TransitiveOverlay Park And Ride Itinerary 2`] = `
    `; -exports[`Storyshots TransitiveOverlay Tnc Transit Itinerary 1`] = ` +exports[`Storyshots TransitVehicleOverlay Outer Caret With Custom Size 1`] = ` - - - - - - - - + `; -exports[`Storyshots TransitiveOverlay Tnc Transit Itinerary 2`] = ` +exports[`Storyshots TransitVehicleOverlay Outer Caret With Custom Size 2`] = ` .c0 { height: 90vh; } @@ -259887,7 +264669,7 @@ exports[`Storyshots TransitiveOverlay Tnc Transit Itinerary 2`] = `
    `; -exports[`Storyshots TransitiveOverlay Walk Interlined Transit Itinerary 1`] = ` +exports[`Storyshots TransitVehicleOverlay Rotating Icons No Caret 1`] = ` - - - - - - - - + } + ModeIcon={[Function]} + vehicles={ + Array [ + Object { + "label": "406", + "lastUpdated": 1663680673, + "lat": 47.6146202, + "lon": -122.3207016, + "routeColor": "#FF2233", + "routeShortName": "FH", + "speed": 4, + "stopRelationship": Object { + "status": "IN_TRANSIT_TO", + "stop": Object { + "gtfsId": "kcm:41970", + "name": "Broadway & E Pine St", + }, + }, + "trip": Object { + "pattern": Object { + "id": "UGF0dGVybjprY206MTAyNjM4OjA6MDE", + }, + }, + "vehicleId": "kcm:406", + }, + Object { + "heading": 258, + "label": "402", + "lastUpdated": 1663680670, + "lat": 47.6017303, + "lon": -122.3171387, + "routeColor": "#2233AA", + "routeShortName": "FH", + "routeType": "TRAM", + "speed": null, + "stopRelationship": Object { + "status": "IN_TRANSIT_TO", + "stop": Object { + "gtfsId": "kcm:27420", + "name": "E Yesler Way & Broadway", + }, + }, + "trip": Object { + "pattern": Object { + "id": "UGF0dGVybjprY206MTAyNjM4OjA6MDE", + }, + }, + "vehicleId": "kcm:402", + }, + Object { + "heading": 135, + "label": "422", + "lastUpdated": 1663680670, + "lat": 47.6617303, + "lon": -122.1171387, + "routeColor": "#CCFF88", + "routeShortName": "FH", + "speed": null, + "stopRelationship": Object { + "status": "IN_TRANSIT_TO", + "stop": Object { + "gtfsId": "kcm:27420", + "name": "E Yesler Way & Broadway", + }, + }, + "trip": Object { + "pattern": Object { + "id": "UGF0dGVybjprY206MTAyNjM4OjA6MDE", + }, + }, + "vehicleId": "kcm:422", + }, + Object { + "heading": 278, + "label": "405", + "lastUpdated": 1663680676, + "lat": 47.5993271, + "lon": -122.3333588, + "routeColor": "#449966", + "routeShortName": "FHH", + "routeType": "DUMMY", + "speed": null, + "stopRelationship": Object { + "status": "STOPPED_AT", + "stop": Object { + "gtfsId": "kcm:1551", + "name": "S Jackson St & Occidental Ave Walk", + }, + }, + "trip": Object { + "pattern": Object { + "id": "UGF0dGVybjprY206MTAyNjM4OjA6MDE", + }, + }, + "vehicleId": "kcm:405", + }, + Object { + "heading": 180, + "label": "409", + "lastUpdated": 1663680676, + "lat": 47.6993271, + "lon": -122.2333588, + "routeColor": "#FFFF00", + "routeShortName": "FH", + "speed": null, + "stopRelationship": Object { + "status": "IN_TRANSIT_TO", + "stop": Object { + "gtfsId": "kcm:1551", + "name": "S Jackson St & Occidental Ave Walk", + }, + }, + "trip": Object { + "pattern": Object { + "id": "UGF0dGVybjprY206MTAyNjM4OjA6MDE", + }, + }, + "vehicleId": "kcm:409", + }, + Object { + "heading": null, + "label": "", + "lastUpdated": null, + "lat": 0, + "lon": 0, + "routeColor": "#FFFF00", + "routeShortName": "FH", + "speed": null, + "stopRelationship": null, + "trip": Object { + "pattern": Object { + "id": "UGF0dGVybjprY206MTAyNjM4OjA6MDE", + }, + }, + "vehicleId": "kcm:403", + }, + Object { + "heading": null, + "label": "", + "lastUpdated": null, + "lat": 0, + "lon": 0, + "routeColor": "#FFFF00", + "routeShortName": "FH", + "speed": null, + "stopRelationship": null, + "trip": Object { + "pattern": Object { + "id": "UGF0dGVybjprY206MTAyNjM4OjA6MDE", + }, + }, + "vehicleId": "kcm:404", + }, + Object { + "heading": null, + "label": "", + "lastUpdated": null, + "lat": 0, + "lon": 0, + "routeColor": "#FFFF00", + "routeShortName": "FH", + "speed": null, + "stopRelationship": null, + "trip": Object { + "pattern": Object { + "id": "UGF0dGVybjprY206MTAyNjM4OjA6MDE", + }, + }, + "vehicleId": "kcm:406", + }, + ] + } + /> `; -exports[`Storyshots TransitiveOverlay Walk Interlined Transit Itinerary 2`] = ` +exports[`Storyshots TransitVehicleOverlay Rotating Icons No Caret 2`] = ` .c0 { height: 90vh; } @@ -260518,7 +264926,7 @@ exports[`Storyshots TransitiveOverlay Walk Interlined Transit Itinerary 2`] = `
    `; -exports[`Storyshots TransitiveOverlay Walk Transit Transfer Itinerary 1`] = ` +exports[`Storyshots TransitVehicleOverlay Route Color Background 1`] = ` - - - - - - - - + `; -exports[`Storyshots TransitiveOverlay Walk Transit Transfer Itinerary 2`] = ` +exports[`Storyshots TransitVehicleOverlay Route Color Background 2`] = ` .c0 { height: 90vh; } @@ -260879,7 +265182,7 @@ exports[`Storyshots TransitiveOverlay Walk Transit Transfer Itinerary 2`] = `
    `; -exports[`Storyshots TransitiveOverlay Walk Transit Walk Itinerary 1`] = ` +exports[`Storyshots TransitVehicleOverlay Route Color Background With Inner Caret 1`] = ` - - - - - - - - + } + ModeIcon={[Function]} + iconPadding={4} + vehicles={ + Array [ + Object { + "label": "406", + "lastUpdated": 1663680673, + "lat": 47.6146202, + "lon": -122.3207016, + "routeColor": "#FF2233", + "routeShortName": "FH", + "speed": 4, + "stopRelationship": Object { + "status": "IN_TRANSIT_TO", + "stop": Object { + "gtfsId": "kcm:41970", + "name": "Broadway & E Pine St", + }, + }, + "trip": Object { + "pattern": Object { + "id": "UGF0dGVybjprY206MTAyNjM4OjA6MDE", + }, + }, + "vehicleId": "kcm:406", + }, + Object { + "heading": 258, + "label": "402", + "lastUpdated": 1663680670, + "lat": 47.6017303, + "lon": -122.3171387, + "routeColor": "#2233AA", + "routeShortName": "FH", + "routeType": "TRAM", + "speed": null, + "stopRelationship": Object { + "status": "IN_TRANSIT_TO", + "stop": Object { + "gtfsId": "kcm:27420", + "name": "E Yesler Way & Broadway", + }, + }, + "trip": Object { + "pattern": Object { + "id": "UGF0dGVybjprY206MTAyNjM4OjA6MDE", + }, + }, + "vehicleId": "kcm:402", + }, + Object { + "heading": 135, + "label": "422", + "lastUpdated": 1663680670, + "lat": 47.6617303, + "lon": -122.1171387, + "routeColor": "#CCFF88", + "routeShortName": "FH", + "speed": null, + "stopRelationship": Object { + "status": "IN_TRANSIT_TO", + "stop": Object { + "gtfsId": "kcm:27420", + "name": "E Yesler Way & Broadway", + }, + }, + "trip": Object { + "pattern": Object { + "id": "UGF0dGVybjprY206MTAyNjM4OjA6MDE", + }, + }, + "vehicleId": "kcm:422", + }, + Object { + "heading": 278, + "label": "405", + "lastUpdated": 1663680676, + "lat": 47.5993271, + "lon": -122.3333588, + "routeColor": "#449966", + "routeShortName": "FHH", + "routeType": "DUMMY", + "speed": null, + "stopRelationship": Object { + "status": "STOPPED_AT", + "stop": Object { + "gtfsId": "kcm:1551", + "name": "S Jackson St & Occidental Ave Walk", + }, + }, + "trip": Object { + "pattern": Object { + "id": "UGF0dGVybjprY206MTAyNjM4OjA6MDE", + }, + }, + "vehicleId": "kcm:405", + }, + Object { + "heading": 180, + "label": "409", + "lastUpdated": 1663680676, + "lat": 47.6993271, + "lon": -122.2333588, + "routeColor": "#FFFF00", + "routeShortName": "FH", + "speed": null, + "stopRelationship": Object { + "status": "IN_TRANSIT_TO", + "stop": Object { + "gtfsId": "kcm:1551", + "name": "S Jackson St & Occidental Ave Walk", + }, + }, + "trip": Object { + "pattern": Object { + "id": "UGF0dGVybjprY206MTAyNjM4OjA6MDE", + }, + }, + "vehicleId": "kcm:409", + }, + Object { + "heading": null, + "label": "", + "lastUpdated": null, + "lat": 0, + "lon": 0, + "routeColor": "#FFFF00", + "routeShortName": "FH", + "speed": null, + "stopRelationship": null, + "trip": Object { + "pattern": Object { + "id": "UGF0dGVybjprY206MTAyNjM4OjA6MDE", + }, + }, + "vehicleId": "kcm:403", + }, + Object { + "heading": null, + "label": "", + "lastUpdated": null, + "lat": 0, + "lon": 0, + "routeColor": "#FFFF00", + "routeShortName": "FH", + "speed": null, + "stopRelationship": null, + "trip": Object { + "pattern": Object { + "id": "UGF0dGVybjprY206MTAyNjM4OjA6MDE", + }, + }, + "vehicleId": "kcm:404", + }, + Object { + "heading": null, + "label": "", + "lastUpdated": null, + "lat": 0, + "lon": 0, + "routeColor": "#FFFF00", + "routeShortName": "FH", + "speed": null, + "stopRelationship": null, + "trip": Object { + "pattern": Object { + "id": "UGF0dGVybjprY206MTAyNjM4OjA6MDE", + }, + }, + "vehicleId": "kcm:406", + }, + ] + } + /> `; -exports[`Storyshots TransitiveOverlay Walk Transit Walk Itinerary 2`] = ` +exports[`Storyshots TransitVehicleOverlay Route Color Background With Inner Caret 2`] = ` .c0 { height: 90vh; } @@ -261102,7 +265439,7 @@ exports[`Storyshots TransitiveOverlay Walk Transit Walk Itinerary 2`] = `
    `; -exports[`Storyshots TransitiveOverlay Walk Transit Walk Itinerary With No Intermediate Stops 1`] = ` +exports[`Storyshots TransitVehicleOverlay Route Color Background With Transparency On Hover 1`] = ` - - - - - - - - + } + ModeIcon={[Function]} + vehicles={ + Array [ + Object { + "label": "406", + "lastUpdated": 1663680673, + "lat": 47.6146202, + "lon": -122.3207016, + "routeColor": "#FF2233", + "routeShortName": "FH", + "speed": 4, + "stopRelationship": Object { + "status": "IN_TRANSIT_TO", + "stop": Object { + "gtfsId": "kcm:41970", + "name": "Broadway & E Pine St", + }, + }, + "trip": Object { + "pattern": Object { + "id": "UGF0dGVybjprY206MTAyNjM4OjA6MDE", + }, + }, + "vehicleId": "kcm:406", + }, + Object { + "heading": 258, + "label": "402", + "lastUpdated": 1663680670, + "lat": 47.6017303, + "lon": -122.3171387, + "routeColor": "#2233AA", + "routeShortName": "FH", + "routeType": "TRAM", + "speed": null, + "stopRelationship": Object { + "status": "IN_TRANSIT_TO", + "stop": Object { + "gtfsId": "kcm:27420", + "name": "E Yesler Way & Broadway", + }, + }, + "trip": Object { + "pattern": Object { + "id": "UGF0dGVybjprY206MTAyNjM4OjA6MDE", + }, + }, + "vehicleId": "kcm:402", + }, + Object { + "heading": 135, + "label": "422", + "lastUpdated": 1663680670, + "lat": 47.6617303, + "lon": -122.1171387, + "routeColor": "#CCFF88", + "routeShortName": "FH", + "speed": null, + "stopRelationship": Object { + "status": "IN_TRANSIT_TO", + "stop": Object { + "gtfsId": "kcm:27420", + "name": "E Yesler Way & Broadway", + }, + }, + "trip": Object { + "pattern": Object { + "id": "UGF0dGVybjprY206MTAyNjM4OjA6MDE", + }, + }, + "vehicleId": "kcm:422", + }, + Object { + "heading": 278, + "label": "405", + "lastUpdated": 1663680676, + "lat": 47.5993271, + "lon": -122.3333588, + "routeColor": "#449966", + "routeShortName": "FHH", + "routeType": "DUMMY", + "speed": null, + "stopRelationship": Object { + "status": "STOPPED_AT", + "stop": Object { + "gtfsId": "kcm:1551", + "name": "S Jackson St & Occidental Ave Walk", + }, + }, + "trip": Object { + "pattern": Object { + "id": "UGF0dGVybjprY206MTAyNjM4OjA6MDE", + }, + }, + "vehicleId": "kcm:405", + }, + Object { + "heading": 180, + "label": "409", + "lastUpdated": 1663680676, + "lat": 47.6993271, + "lon": -122.2333588, + "routeColor": "#FFFF00", + "routeShortName": "FH", + "speed": null, + "stopRelationship": Object { + "status": "IN_TRANSIT_TO", + "stop": Object { + "gtfsId": "kcm:1551", + "name": "S Jackson St & Occidental Ave Walk", + }, + }, + "trip": Object { + "pattern": Object { + "id": "UGF0dGVybjprY206MTAyNjM4OjA6MDE", + }, + }, + "vehicleId": "kcm:409", + }, + Object { + "heading": null, + "label": "", + "lastUpdated": null, + "lat": 0, + "lon": 0, + "routeColor": "#FFFF00", + "routeShortName": "FH", + "speed": null, + "stopRelationship": null, + "trip": Object { + "pattern": Object { + "id": "UGF0dGVybjprY206MTAyNjM4OjA6MDE", + }, + }, + "vehicleId": "kcm:403", + }, + Object { + "heading": null, + "label": "", + "lastUpdated": null, + "lat": 0, + "lon": 0, + "routeColor": "#FFFF00", + "routeShortName": "FH", + "speed": null, + "stopRelationship": null, + "trip": Object { + "pattern": Object { + "id": "UGF0dGVybjprY206MTAyNjM4OjA6MDE", + }, + }, + "vehicleId": "kcm:404", + }, + Object { + "heading": null, + "label": "", + "lastUpdated": null, + "lat": 0, + "lon": 0, + "routeColor": "#FFFF00", + "routeShortName": "FH", + "speed": null, + "stopRelationship": null, + "trip": Object { + "pattern": Object { + "id": "UGF0dGVybjprY206MTAyNjM4OjA6MDE", + }, + }, + "vehicleId": "kcm:406", + }, + ] + } + /> `; -exports[`Storyshots TransitiveOverlay Walk Transit Walk Itinerary With No Intermediate Stops 2`] = ` +exports[`Storyshots TransitVehicleOverlay Route Color Background With Transparency On Hover 2`] = ` .c0 { height: 90vh; } @@ -261315,7 +265697,7 @@ exports[`Storyshots TransitiveOverlay Walk Transit Walk Itinerary With No Interm
    `; -exports[`Storyshots TransitiveOverlay Walking Itinerary 1`] = ` +exports[`Storyshots TransitVehicleOverlay Route Numbers Only With Custom Size And Padding 1`] = ` - - - - - - - - + `; -exports[`Storyshots TransitiveOverlay Walking Itinerary 2`] = ` +exports[`Storyshots TransitVehicleOverlay Route Numbers Only With Custom Size And Padding 2`] = ` .c0 { height: 90vh; } @@ -265793,6 +270256,561 @@ exports[`Storyshots Trip Form Components/Metro Mode Selector Metro Mode Selector `; +exports[`Storyshots TripDetails Approximate Prefix Itinerary 1`] = ` + + + +`; + +exports[`Storyshots TripDetails Approximate Prefix Itinerary 2`] = ` +.c4 { + display: inline-block; + vertical-align: middle; + overflow: hidden; +} + +.c7 { + background: transparent; + border: 0; + cursor: pointer; + display: inline-block; + font-size: 14px; + font-weight: 400; + line-height: 1.42857143; + margin: 0; + padding: 0; + -webkit-text-decoration: none; + text-decoration: none; + touch-action: manipulation; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + vertical-align: middle; + white-space: nowrap; +} + +.c9 { + color: #00f; + font-size: 16px; + margin-left: 6px; + margin-top: -2px; +} + +.c8 { + float: right; +} + +.c2 { + margin-top: 6px; +} + +.c6 { + background-color: #fff; + border: 1px solid #888; + font-size: 12px; + margin-top: 2px; + padding: 8px; +} + +.c3 { + float: left; + font-size: 17px; +} + +.c0 { + background-color: #eee; + border-radius: 6px; + margin-bottom: 15px; + margin-top: 16px; + padding: 10px 16px; +} + +.c1 { + font-size: 18px; + font-weight: 600; + margin: 0; +} + +.c5 { + margin-left: 28px; + padding-top: 2px; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: baseline; + -webkit-box-align: baseline; + -ms-flex-align: baseline; + align-items: baseline; + white-space: pre-wrap; +} + +
    +

    + Trip Details +

    +
    +
    +
    + +
    +
    + + Depart + + December 13, 2019 + + at + + 11:29 AM + + +
    +
    +
    +
    + +
    +
    +
    +
    +
    +
    + +
    +
    + Time Spent Active: + + ~1 minute + + +
    +
    +
    +
    + + By taking this trip, you'll spend + + 1 minute + + walking and + + 0 minutes + + biking. + +
    +
    +
    +
    +
    +
    + +
    +
    + + CO₂ Emitted: + + 1g + + + +
    +
    +
    +
    + + CO₂ intensity is calculated by multiplying the distance of each leg of a trip by the CO₂ intensity of each mode. CO₂ intensity of each mode is derived from + + this spreadsheet + + . +
    +
    +
    +
    +
    +
    +`; + exports[`Storyshots TripDetails Bike Only Itinerary 1`] = ` setShowPopup(false)} > - {popupContents} + setShowPopup(false)} + id="map-popup" + > + {popupContents} + )} diff --git a/packages/building-blocks/package.json b/packages/building-blocks/package.json index beef81036..ba6dbb76c 100644 --- a/packages/building-blocks/package.json +++ b/packages/building-blocks/package.json @@ -1,6 +1,6 @@ { "name": "@opentripplanner/building-blocks", - "version": "1.0.3", + "version": "1.1.0", "description": "Styling and UI Component Library", "author": "@binh-dam-ibigroup", "homepage": "https://github.com/opentripplanner/otp-ui/#readme", diff --git a/packages/building-blocks/src/dropdown/index.tsx b/packages/building-blocks/src/dropdown/index.tsx new file mode 100644 index 000000000..da5b14cf5 --- /dev/null +++ b/packages/building-blocks/src/dropdown/index.tsx @@ -0,0 +1,139 @@ +import React, { + HTMLAttributes, + KeyboardEvent, + useCallback, + useEffect, + useRef, + useState +} from "react"; + +import { getNextSibling, getPreviousSibling } from "../utils/dom-query"; +import { DropdownButton, DropdownMenu, DropdownWrapper } from "./styled"; + +export interface Props extends HTMLAttributes { + alignMenuLeft?: boolean; + buttonStyle?: React.CSSProperties; + label?: string; + listLabel?: string; + text?: JSX.Element | string; + nav?: boolean; +} + +/** + * Renders a dropdown menu. By default, only a passed "text" is rendered. If clicked, + * a floating div is rendered below the "text" with list contents inside. Clicking anywhere + * outside the floating div will close the dropdown. + */ +const Dropdown = ({ + alignMenuLeft, + children, + className, + id, + label, + listLabel, + text, + buttonStyle +}: Props): JSX.Element => { + const [open, setOpen] = useState(false); + + const containerRef = useRef(null); + + const toggleOpen = useCallback(() => setOpen(!open), [open, setOpen]); + + // Argument for document.querySelectorAll to target focusable elements. + const queryId = `#${id} button, #${id}-label`; + + const isList = Array.isArray(children) + ? children.every( + child => React.isValidElement(child) && child.type === "li" + ) + : React.isValidElement(children) && children.type === "li"; + + // Adding document event listeners allows us to close the dropdown + // when the user interacts with any part of the page that isn't the dropdown + useEffect(() => { + const handleExternalAction = (e: Event): void => { + if (!containerRef?.current?.contains(e.target as HTMLElement)) { + setOpen(false); + } + }; + document.addEventListener("mousedown", handleExternalAction); + document.addEventListener("focusin", handleExternalAction); + document.addEventListener("keydown", handleExternalAction); + return () => { + document.removeEventListener("mousedown", handleExternalAction); + document.removeEventListener("focusin", handleExternalAction); + document.removeEventListener("keydown", handleExternalAction); + }; + }, [containerRef]); + + const handleKeyDown = useCallback( + (e: KeyboardEvent): void => { + const element = e.target as HTMLElement; + switch (e.key) { + case "ArrowUp": + e.preventDefault(); + getPreviousSibling(queryId, element)?.focus(); + break; + case "ArrowDown": + e.preventDefault(); + getNextSibling(queryId, element)?.focus(); + break; + case "Escape": + setOpen(false); + break; + case " ": + case "Enter": + e.preventDefault(); + element.click(); + if (element.id === `${id}-label` || element.id === `${id}-wrapper`) { + toggleOpen(); + } + break; + default: + } + }, + [id, toggleOpen] + ); + + return ( + + + {text} + + + {open && ( + + {children} + + )} + + ); +}; + +export default Dropdown; diff --git a/packages/building-blocks/src/dropdown/styled.tsx b/packages/building-blocks/src/dropdown/styled.tsx new file mode 100644 index 000000000..a0364829f --- /dev/null +++ b/packages/building-blocks/src/dropdown/styled.tsx @@ -0,0 +1,71 @@ +import styled from "styled-components"; +import grey from "../colors/grey"; + +export const DropdownButton = styled.button` + background: #fff; + border: 1px solid black; + border-radius: 5px; + color: inherit; + padding: 5px 7px; + transition: all 0.1s ease-in-out; + + span.caret { + border-left: 4px solid transparent; + border-right: 4px solid transparent; + border-top: 4px solid; + color: inherit; + display: inline-block; + height: 0; + margin-left: 5px; + vertical-align: middle; + width: 0; + } + + &:hover, + &[aria-expanded="true"] { + background: ${grey[50]}; + color: black; + cursor: pointer; + } +`; + +export const DropdownMenu = styled.div<{ alignLeft?: boolean }>` + background-clip: padding-box; + background-color: #fff; + border-radius: 4px; + border: 1px solid rgba(0, 0, 0, 0.15); + box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175); + color: #333; + list-style: none; + margin: 2px 0 0; + min-width: 160px; + padding: 5px 0; + position: absolute; + ${props => (props.alignLeft ? "left: 0;" : "right: 0;")} + top: 100%; + width: 100%; + z-index: 1000; + + hr { + margin: 0; + padding: 0; + } + a, + button { + background: transparent; + border: none; + cursor: pointer; + padding: 5px 15px; + text-align: start; + width: 100%; + + &:hover { + background: ${grey[50]}; + } + } +`; + +export const DropdownWrapper = styled.span<{ pullRight?: boolean }>` + float: ${props => (props.pullRight ? "right" : "left")}; + position: relative; +`; diff --git a/packages/building-blocks/src/index.ts b/packages/building-blocks/src/index.ts index 287eb38e6..2ea4b722a 100644 --- a/packages/building-blocks/src/index.ts +++ b/packages/building-blocks/src/index.ts @@ -1,5 +1,7 @@ import blue from "./colors/blue"; import red from "./colors/red"; import grey from "./colors/grey"; +import Dropdown from "./dropdown"; +export { Dropdown }; export default { blue, red, grey }; diff --git a/packages/building-blocks/src/stories/dropdown.story.tsx b/packages/building-blocks/src/stories/dropdown.story.tsx new file mode 100644 index 000000000..c9b8e7804 --- /dev/null +++ b/packages/building-blocks/src/stories/dropdown.story.tsx @@ -0,0 +1,105 @@ +import React from "react"; +import { ComponentMeta } from "@storybook/react"; +import styled from "styled-components"; +import Dropdown from "../dropdown"; +import blue from "../colors/blue"; + +const options = [ + { value: "1", label: "One" }, + { value: "2", label: "Two" }, + { value: "3", label: "Three" } +]; + +const NavItemWrapper = styled.div` + align-items: center; + background: ${blue[900]}; + display: flex; + min-height: 50px; + padding: 0 10px; + position: relative; + width: 100%; + + .navBarItem { + position: static; + & > button { + background: transparent; + border: none; + color: white; + padding: 15px; + + @media (max-width: 768px) { + padding: 10px; + } + + &:hover { + background: rgba(0, 0, 0, 0.05); + color: #ececec; + } + } + } +`; + +export default { + title: "Building-Blocks/Dropdown", + component: Dropdown +} as ComponentMeta; + +export const DropdownWithLabel = (): React.ReactElement => ( + + More content here + +); + +export const DropdownWithList = (): React.ReactElement => ( + + {options.map(option => ( +
  • + +
    • + ))} +     +); + +export const DropdownWithListAlignMenuLeft = (): React.ReactElement => ( + + {options.map(option => ( +
  • + +
    • + ))} +     +); + +export const DropdownAsOtprrNavItem = (): React.ReactElement => ( + + + {options.map(option => ( + + ))} + + +); diff --git a/packages/building-blocks/src/utils/dom-query.ts b/packages/building-blocks/src/utils/dom-query.ts new file mode 100644 index 000000000..83e134342 --- /dev/null +++ b/packages/building-blocks/src/utils/dom-query.ts @@ -0,0 +1,49 @@ +function getEntries(query: string) { + const entries = Array.from(document.querySelectorAll(query)); + const firstElement = entries[0]; + const lastElement = entries[entries.length - 1]; + + return { entries, firstElement, lastElement }; +} + +/** + * Helper method to find the next focusable sibling element relative to the + * specified element. + * + * @param {string} query - Argument that gets passed to document.querySelectorAll + * @param {HTMLElement} element - Specified element (e.target) + * @returns {HTMLElement} - element to be focused + */ +export function getNextSibling( + query: string, + element: EventTarget +): HTMLElement { + const { entries, firstElement, lastElement } = getEntries(query); + + if (element === lastElement) { + return firstElement as HTMLElement; + } + const elementIndex = entries.indexOf(element as HTMLElement); + return entries[elementIndex + 1] as HTMLElement; +} + +/** + * Helper method to find the previous focusable sibling element relative to the + * specified element. + * + * @param {string} query - Argument that gets passed to document.querySelectorAll + * @param {HTMLElement} element - Specified element (e.target) + * @returns {HTMLElement} - element to be focused + */ +export function getPreviousSibling( + query: string, + element: EventTarget +): HTMLElement { + const { entries, firstElement, lastElement } = getEntries(query); + + if (element === firstElement) { + return lastElement as HTMLElement; + } + const elementIndex = entries.indexOf(element as HTMLButtonElement); + return entries[elementIndex - 1] as HTMLElement; +} diff --git a/packages/core-utils/package.json b/packages/core-utils/package.json index 180e86c81..0ea1e7375 100644 --- a/packages/core-utils/package.json +++ b/packages/core-utils/package.json @@ -1,6 +1,6 @@ { "name": "@opentripplanner/core-utils", - "version": "11.4.1", + "version": "11.4.2", "description": "Core functionality that is shared among numerous UI components", "engines": { "node": ">=13" diff --git a/packages/endpoints-overlay/i18n/zh_Hant.yml b/packages/endpoints-overlay/i18n/zh_Hant.yml new file mode 100644 index 000000000..f2ea30fb8 --- /dev/null +++ b/packages/endpoints-overlay/i18n/zh_Hant.yml @@ -0,0 +1,9 @@ +otpUi: + EndpointsOverlay: + clearLocation: 移除{locationType}位置 + coordinates: "{lat, number, ::.00000}; {lon, number, ::.00000}" + forgetHome: 忘記住家 + forgetWork: 忘記工作 + saveAsHome: 儲存為住家 + saveAsWork: 儲存為工作 + swapLocation: 變更為{locationType}位置 diff --git a/packages/endpoints-overlay/package.json b/packages/endpoints-overlay/package.json index 7ee15f961..0a4b75a03 100644 --- a/packages/endpoints-overlay/package.json +++ b/packages/endpoints-overlay/package.json @@ -1,6 +1,6 @@ { "name": "@opentripplanner/endpoints-overlay", - "version": "2.0.12", + "version": "2.1.1", "description": "A map overlay to show the from and to locations of an itinerary", "main": "lib/index.js", "module": "esm/index.js", @@ -23,7 +23,8 @@ "@opentripplanner/location-icon": "^1.4.1", "@opentripplanner/core-utils": "^11.4.0", "flat": "^5.0.2", - "@styled-icons/fa-solid": "^10.34.0" + "@styled-icons/fa-solid": "^10.34.0", + "@opentripplanner/map-popup": "^3.1.0" }, "devDependencies": { "@opentripplanner/types": "^6.5.0", diff --git a/packages/endpoints-overlay/src/endpoint.tsx b/packages/endpoints-overlay/src/endpoint.tsx index 9433107d7..12f8c16e5 100644 --- a/packages/endpoints-overlay/src/endpoint.tsx +++ b/packages/endpoints-overlay/src/endpoint.tsx @@ -13,6 +13,7 @@ import { Marker, MarkerDragEvent } from "react-map-gl"; import { Sync } from "@styled-icons/fa-solid/Sync"; import { Times } from "@styled-icons/fa-solid/Times"; import coreUtils from "@opentripplanner/core-utils"; +import { FocusTrapWrapper } from "@opentripplanner/map-popup"; import flatten from "flat"; import React, { ComponentType, useState } from "react"; @@ -165,82 +166,87 @@ const Endpoint = (props: Props): JSX.Element => { draggable latitude={location.lat} longitude={location.lon} + onClick={e => { + // prevent Popup onClose from triggering immediately + e.originalEvent.stopPropagation(); + setShowPopup(true); + }} onDragEnd={onDragEnd} onDragStart={() => setShowPopup(false)} - onClick={() => setShowPopup(true)} > {iconHtml} {showPopup && showUserSettings && ( setShowPopup(false)} latitude={location.lat} longitude={location.lon} + onClose={() => setShowPopup(false)} > -
    + setShowPopup(false)} + id="endpoint-overlay" + > {location.name} -
    - - {isHome ? ( - <> - - - - ) : ( - <> - - - - )} - -
    -
    - - {isWork ? ( - <> - - - - ) : ( - <> - - - - )} - -
    + {!isWork && ( +
    + + {isHome ? ( + <> + + + + ) : ( + <> + + + + )} + +
    + )} + {!isHome && ( +
    + + {isWork ? ( + <> + + + + ) : ( + <> + + + + )} + +
    + )}
    @@ -267,7 +273,7 @@ const Endpoint = (props: Props): JSX.Element => { />
    -
    +     )} diff --git a/packages/from-to-location-picker/i18n/zh_Hant.yml b/packages/from-to-location-picker/i18n/zh_Hant.yml new file mode 100644 index 000000000..0d94bd232 --- /dev/null +++ b/packages/from-to-location-picker/i18n/zh_Hant.yml @@ -0,0 +1,5 @@ +otpUi: + FromToLocationPicker: + from: 從這裡 + planATrip: 規劃行程： + to: 前往這裡 diff --git a/packages/from-to-location-picker/package.json b/packages/from-to-location-picker/package.json index a767651f0..360bec62a 100644 --- a/packages/from-to-location-picker/package.json +++ b/packages/from-to-location-picker/package.json @@ -1,6 +1,6 @@ { "name": "@opentripplanner/from-to-location-picker", - "version": "2.1.12", + "version": "2.1.13", "description": "Location Picker Component", "author": "@binh-dam-ibigroup", "homepage": "https://github.com/opentripplanner/otp-ui/#readme", diff --git a/packages/from-to-location-picker/src/types.ts b/packages/from-to-location-picker/src/types.ts index ebd111bf6..97d447ac2 100644 --- a/packages/from-to-location-picker/src/types.ts +++ b/packages/from-to-location-picker/src/types.ts @@ -26,7 +26,7 @@ export type FromToPickerProps = { * Passes an argument as follows: * { locationType: "from/to", location, reverseGeocode: false } */ - setLocation?: ({ + setLocation?: (_: { locationType: string, // eslint-disable-next-line @typescript-eslint/no-shadow location: Location, diff --git a/packages/icons/package.json b/packages/icons/package.json index 4395d7c3a..a5fcc894e 100644 --- a/packages/icons/package.json +++ b/packages/icons/package.json @@ -1,6 +1,6 @@ { "name": "@opentripplanner/icons", - "version": "2.0.10", + "version": "2.0.11", "description": "Icons for otp-ui", "main": "lib/index.js", "module": "esm/index.js", diff --git a/packages/icons/src/index.js b/packages/icons/src/index.js index b07705e37..1f07bc066 100644 --- a/packages/icons/src/index.js +++ b/packages/icons/src/index.js @@ -13,6 +13,8 @@ import StandardModeIcon from "./standard-mode-icon"; import TriMetLegIcon from "./trimet-leg-icon"; import TriMetModeIcon from "./trimet-mode-icon"; import TriMetModeIcon2021 from "./trimet-mode-icon-2021"; +import SeptaIcon from "./septa-icons"; +import * as septa from "./septa"; const { ClassicBike, @@ -104,6 +106,8 @@ const { ZoomAngle } = trimet; +const { Metro } = septa; + export { Accessible, AerialTram, @@ -153,6 +157,7 @@ export { MapMarkerSolid, Max, MaxCircle, + Metro, Micromobility, Parking, Phone, @@ -160,6 +165,7 @@ export { Refresh, Right, Schedule, + SeptaIcon, SlightLeft, SlightRight, Snow, diff --git a/packages/icons/src/septa-icons.js b/packages/icons/src/septa-icons.js new file mode 100644 index 000000000..4a6479ea7 --- /dev/null +++ b/packages/icons/src/septa-icons.js @@ -0,0 +1,35 @@ +import React from "react"; + +import { Bike, Bus, Car, Rail, Walk, Metro } from "./septa"; + +/** + * These icons are not an entire set, but contain everything needed in southeastern Pennsylvania + */ +function SeptaModeIcon({ mode, ...props }) { + if (!mode) return null; + switch (mode.toLowerCase()) { + case "bicycle": + case "bicycle_rent": + return ; + case "bus": + case "trolleybus": + return ; + case "car": + case "car_park": + case "car_hail": + return ; + case "streetcar": + case "tram": + case "transit": + case "subway": + return ; + case "walk": + return ; + case "rail": + return ; + default: + return null; + } +} + +export default SeptaModeIcon; diff --git a/packages/icons/src/septa/Bike.js b/packages/icons/src/septa/Bike.js new file mode 100644 index 000000000..7a9f5c0a6 --- /dev/null +++ b/packages/icons/src/septa/Bike.js @@ -0,0 +1,18 @@ +import React from "react"; + +const Bike = () => ( + + + +); + +export default Bike; diff --git a/packages/icons/src/septa/Bus.js b/packages/icons/src/septa/Bus.js new file mode 100644 index 000000000..b3e6fe120 --- /dev/null +++ b/packages/icons/src/septa/Bus.js @@ -0,0 +1,37 @@ +import React from "react"; + +const Bus = () => ( + + + + + + + + + +); + +export default Bus; diff --git a/packages/icons/src/septa/Car.js b/packages/icons/src/septa/Car.js new file mode 100644 index 000000000..52cc09231 --- /dev/null +++ b/packages/icons/src/septa/Car.js @@ -0,0 +1,18 @@ +import React from "react"; + +const Car = () => ( + + + +); + +export default Car; diff --git a/packages/icons/src/septa/Metro.js b/packages/icons/src/septa/Metro.js new file mode 100644 index 000000000..6ec38f0e8 --- /dev/null +++ b/packages/icons/src/septa/Metro.js @@ -0,0 +1,35 @@ +import React from "react"; + +const Metro = () => ( + + + + + + +); + +export default Metro; diff --git a/packages/icons/src/septa/Rail.js b/packages/icons/src/septa/Rail.js new file mode 100644 index 000000000..09c26a904 --- /dev/null +++ b/packages/icons/src/septa/Rail.js @@ -0,0 +1,243 @@ +import React from "react"; + +const Rail = () => ( + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +); + +export default Rail; diff --git a/packages/icons/src/septa/Walk.js b/packages/icons/src/septa/Walk.js new file mode 100644 index 000000000..33ed8c987 --- /dev/null +++ b/packages/icons/src/septa/Walk.js @@ -0,0 +1,18 @@ +import React from "react"; + +const Walk = () => ( + + + +); + +export default Walk; diff --git a/packages/icons/src/septa/index.js b/packages/icons/src/septa/index.js new file mode 100644 index 000000000..51131fea6 --- /dev/null +++ b/packages/icons/src/septa/index.js @@ -0,0 +1,8 @@ +import Bus from "./Bus"; +import Bike from "./Bike"; +import Car from "./Car"; +import Metro from "./Metro"; +import Rail from "./Rail"; +import Walk from "./Walk"; + +export { Bike, Bus, Car, Metro, Rail, Walk }; diff --git a/packages/icons/src/stories/septa-mode-icon.story.js b/packages/icons/src/stories/septa-mode-icon.story.js new file mode 100644 index 000000000..2d135d64e --- /dev/null +++ b/packages/icons/src/stories/septa-mode-icon.story.js @@ -0,0 +1,14 @@ +import React from "react"; + +import SeptaModeIcon from "../septa-icons"; + +import ModeIconRenderer from "./mode-icon-renderer"; + +export default { + title: "Icons/SeptaModeIcon", + component: SeptaModeIcon +}; + +export const SeptaModeIconExamples = () => ( + +); diff --git a/packages/itinerary-body/i18n/en-US.yml b/packages/itinerary-body/i18n/en-US.yml index a30217e24..0fbfb8d95 100644 --- a/packages/itinerary-body/i18n/en-US.yml +++ b/packages/itinerary-body/i18n/en-US.yml @@ -69,7 +69,9 @@ otpUi: vehicle: Vehicle ItineraryBody: common: - durationShort: "{hours, plural, =0 {} other {# hr }}{minutes} min" + durationShort: >- + {approximatePrefix, select, true {About } other {}}{hours, plural, =0 {} + other {# hr }}{minutes} min flexAdvanceNotice: " at least {leadDays, plural, one {# day} other {# days}} in advance" flexCallAhead: call ahead flexCallNumber: call {phoneNumber} diff --git a/packages/itinerary-body/i18n/es.yml b/packages/itinerary-body/i18n/es.yml index 623a44ba6..f62a0263e 100644 --- a/packages/itinerary-body/i18n/es.yml +++ b/packages/itinerary-body/i18n/es.yml @@ -18,15 +18,12 @@ otpUi: bookRide: Reservar un viaje bookRideLater: Espere hasta las {timeMillis, time, short} para reservar estimatedCost: "Costo estimado: {minFare} - {maxFare}" - estimatedTravelTime: "Tiempo de viaje estimado: {duration} (no tiene en cuenta - el tráfico)" - waitForPickup: "Espera al conductor {company}{minutes, plural, =0 {} other { - # minutos}}" + estimatedTravelTime: "Tiempo de viaje estimado: {duration} (no tiene en cuenta el tráfico)" + waitForPickup: "Espera al conductor {company}{minutes, plural, =0 {} other { # minutos}}" mapillaryTooltip: Mostrar imágenes de la calle en esta ubicación step: circleClockwise: Siga el círculo en el sentido de las agujas del reloj - circleCounterClockwise: Siga el círculo en sentido contrario a las agujas del - reloj + circleCounterClockwise: Siga el círculo en sentido contrario a las agujas del reloj continue: Continuar enterStation: Entrar a la estación exitStation: Salir de la estación @@ -72,9 +69,10 @@ otpUi: vehicle: Vehículo ItineraryBody: common: - durationShort: "{hours, plural, =0 {} other {# hr. }}{minutes} min" - flexAdvanceNotice: " al menos {leadDays, plural, one {# día} other {# días}} de - antelación" + durationShort: >- + {approximatePrefix, select, true {Unos } other {}}{hours, plural, =0 {} + other {# hr. }}{minutes} min + flexAdvanceNotice: " al menos {leadDays, plural, one {# día} other {# días}} de antelación" flexCallAhead: llama con anticipación flexCallNumber: llama {phoneNumber} flexPickupMessage: Para tomar esta ruta, tiene que {action}{advanceNotice}. @@ -85,17 +83,20 @@ otpUi: car: en carro escooter: en patineta walk: a pie - viewOnMap: Ver en el mapa tripAccessibility: inaccessible: inaccesible - unclear: desconocido - legAccessibility: 'Accesibilidad para sillas de ruedas en este tramo del viaje: ' + itineraryAccessibility: "Accesibilidad para sillas de ruedas en este viaje: " + legAccessibility: "Accesibilidad para sillas de ruedas en este tramo del viaje: " likelyAccessible: probablemente accesible - itineraryAccessibility: 'Accesibilidad para sillas de ruedas en este viaje: ' + unclear: desconocido + viewOnMap: Ver en el mapa TransitLegBody: AlertsBody: + alertLinkText: Ver la alerta en la web {agency} effectiveDate: A partir de {dateTime, date, long} effectiveTimeAndDate: A partir de {dateTime, time, short}, {day} + linkOpensNewWindow: (Abrir una nueva ventana) + noAgencyAlertLinkText: Ver alerta en la web de la agencia today: Hoy tomorrow: Mañana yesterday: Ayer diff --git a/packages/itinerary-body/i18n/fr.yml b/packages/itinerary-body/i18n/fr.yml index 862a7ab94..82568da0e 100644 --- a/packages/itinerary-body/i18n/fr.yml +++ b/packages/itinerary-body/i18n/fr.yml @@ -73,7 +73,9 @@ otpUi: vehicle: Véhicule ItineraryBody: common: - durationShort: "{hours, plural, =0 {} other {# h }}{minutes} min" + durationShort: >- + {approximatePrefix, select, true {Environ } other {}}{hours, plural, =0 + {} other {# h }}{minutes} min flexAdvanceNotice: " au moins {leadDays, plural, one {# jour} other {# jours}} à l'avance" flexCallAhead: réserver au préalable flexCallNumber: réserver au {phoneNumber} diff --git a/packages/itinerary-body/i18n/ko.yml b/packages/itinerary-body/i18n/ko.yml index 80b66eec7..8ca12417e 100644 --- a/packages/itinerary-body/i18n/ko.yml +++ b/packages/itinerary-body/i18n/ko.yml @@ -69,7 +69,9 @@ otpUi: vehicle: 차량 ItineraryBody: common: - durationShort: "{hours, plural, =0 {} other {# 시간 }}{minutes} 분" + durationShort: >- + {approximatePrefix, select, true {약 } other {}}{hours, plural, =0 {} + other {# 시간 }}{minutes} 분 flexAdvanceNotice: " 최소 {leadDays}일 전에" flexCallAhead: 미리 전화 flexCallNumber: "{phoneNumber}에 전화" diff --git a/packages/itinerary-body/i18n/ru.yml b/packages/itinerary-body/i18n/ru.yml index 393c3769e..467ed8e28 100644 --- a/packages/itinerary-body/i18n/ru.yml +++ b/packages/itinerary-body/i18n/ru.yml @@ -69,7 +69,9 @@ otpUi: vehicle: Транспортное средство ItineraryBody: common: - durationShort: "{hours, plural, =0 {} other {# ч }}{minutes} мин" + durationShort: >- + {approximatePrefix, select, true {Около } other {}}{hours, plural, =0 {} + other {# ч }}{minutes} мин flexCallAhead: звоните заранее flexCallNumber: звоните {phoneNumber} flexPickupMessage: Чтобы воспользоваться этим маршрутом, {action}{advanceNotice}. diff --git a/packages/itinerary-body/i18n/tr.yml b/packages/itinerary-body/i18n/tr.yml index 347c5b60f..6cd69eed5 100644 --- a/packages/itinerary-body/i18n/tr.yml +++ b/packages/itinerary-body/i18n/tr.yml @@ -2,3 +2,19 @@ otpUi: AccessLegBody: LegDiagramPreview: elevationChart: Yükseklik tablosu + noElevationData: Yükseklik verisi mevcut değil. + toggleElevationChart: Yükseklik grafiğini değiştir + RentedVehicleSubheader: + resumeRentalRide: Kiralamayı kullanmaya devam et + vehicleType: + bike: bisiklet + bikeshare: paylaşımlı bisiklet + car: araba + escooter: E-Skutır + vehicle: araç + TncLeg: + estimatedCost: "Tahmini maliyet: {minFare} - {maxFare}" + estimatedTravelTime: "Tahmini seyahat süresi: {duration} (trafiği hesaba katmaz)" + mapillaryTooltip: Bu konumdaki sokak görüntülerini göster + step: + continue: Devam et diff --git a/packages/itinerary-body/i18n/vi.yml b/packages/itinerary-body/i18n/vi.yml index 1e5caa211..f836bf665 100644 --- a/packages/itinerary-body/i18n/vi.yml +++ b/packages/itinerary-body/i18n/vi.yml @@ -69,7 +69,9 @@ otpUi: vehicle: Xe ItineraryBody: common: - durationShort: "{hours, plural, =0 {} other {# giờ }}{minutes} phút" + durationShort: >- + {approximatePrefix, select, true {Khoảng } other {}}{hours, plural, =0 + {} other {# giờ }}{minutes} phút flexAdvanceNotice: " ít nhất trước {leadDays} ngày" flexCallAhead: gọi điện trước khi đi flexCallNumber: gọi {phoneNumber} diff --git a/packages/itinerary-body/i18n/zh_Hans.yml b/packages/itinerary-body/i18n/zh_Hans.yml index f8541a3f4..d66d9c3f2 100644 --- a/packages/itinerary-body/i18n/zh_Hans.yml +++ b/packages/itinerary-body/i18n/zh_Hans.yml @@ -69,7 +69,9 @@ otpUi: vehicle: 车辆 ItineraryBody: common: - durationShort: "{hours, plural, =0 {} other {# 시간 }}{minutes} 分钟" + durationShort: >- + {approximatePrefix, select, true {约 } other {}}{hours, plural, =0 {} + other {# 시간 }}{minutes} 分钟 flexAdvanceNotice: " 至少提前 {leadDays} 天" flexCallAhead: 提前打电话 flexCallNumber: 拨打 {phoneNumber} diff --git a/packages/itinerary-body/i18n/zh_Hant.yml b/packages/itinerary-body/i18n/zh_Hant.yml new file mode 100644 index 000000000..bff734785 --- /dev/null +++ b/packages/itinerary-body/i18n/zh_Hant.yml @@ -0,0 +1,114 @@ +otpUi: + AccessLegBody: + LegDiagramPreview: + elevationChart: 海拔圖表 + noElevationData: 沒有可用的海拔資料。 + toggleElevationChart: 切換海拔圖表 + RentedVehicleSubheader: + pickupRental: 領取{company} {vehicleType} {vehicleName} + resumeRentalRide: 繼續使用租賃 + vehicleType: + bike: 騎行 + bikeshare: 自行車共享 + car: 汽車 + escooter: 電動滑板車 + vehicle: 車輛 + walkVehicle: 沿著{place}牽車步行 + TncLeg: + bookRide: 預約乘車 + bookRideLater: 等到{timeMillis, time, short}再預約 + estimatedCost: 預估費用：{minFare} - {maxFare} + estimatedTravelTime: 預估行程時間：{duration} (不考慮車流) + waitForPickup: "等待{minutes, plural, =0 {} other { #分鐘}}由{company}接車" + mapillaryTooltip: 顯示此位置的街道影像 + step: + circleClockwise: 順時鐘沿著圓環 + circleCounterClockwise: 逆時鐘沿著圓環 + continue: 繼續 + enterStation: 輸入車站 + exitStation: 退出車站 + hardLeft: 向左急轉 + hardRight: 向右急轉 + left: 左 + right: 右 + slightlyLeft: 稍微向左 + slightlyRight: 稍微向右 + uTurnLeft: 左邊迴轉 + uTurnRight: 右邊迴轉 + stepDepart: 往 {heading} 在 {street} + stepElevator: 搭乘電梯到{street} + stepFollowSigns: 跟著指示牌前往 {street} + stepGeneric: "{step} 在 {street}" + stepHeading: + east: 東 + north: 北 + northeast: 東北 + northwest: 西北 + south: 南 + southeast: 東南 + southwest: 西南 + west: 西 + stepStation: "{step} 在 {street}" + summary: "{mode} 到{place}" + summaryAndDistance: "{mode} {distance} 到{place}" + summaryMode: + bike: 自行車 + bikeshare: 自行車共享 + carDrive: 駕車 + carHail: 乘車 + escooter: 騎車 + walk: 步行 + unnamedPath: 未命名路線 + unnamedRoad: 未命名道路 + vehicleTitle: "{company} {vehicleType}" + vehicleType: + bike: 騎行 + bikeshare: 共享自行車 + car: 汽車 + escooter: 騎電動滑板車 + vehicle: 車輛 + ItineraryBody: + common: + durationShort: "{hours, plural, =0 {} other {#小時}}{minutes}分鐘" + flexAdvanceNotice: " 至少提前{leadDays}天" + flexCallAhead: 撥打事先 + flexCallNumber: 撥打{phoneNumber} + flexPickupMessage: 若要使用此路線，您必須{action}{advanceNotice}. + stayOnBoard: 留在{place}車上 + travelBy: 透過{mode}旅行 + travelByMode: + bike: 騎自行車 + car: 開車 + escooter: 騎電動滑板車 + walk: 步行 + tripAccessibility: + inaccessible: 無法到達 + itineraryAccessibility: "此行程的輪椅無障礙設施： " + legAccessibility: "此行程路段的輪椅無障礙設施： " + likelyAccessible: 可能可以到達 + unclear: 未知 + viewOnMap: 在地圖上檢視 + TransitLegBody: + AlertsBody: + effectiveDate: 自{dateTime, date, long}起生效 + effectiveTimeAndDate: 自{dateTime, time, short}, {day}起生效 + linkOpensNewWindow: (開啟新視窗) + today: 今天 + tomorrow: 明天 + yesterday: 昨天 + agencyExternalLink: "{agencyName} (外部連結)" + alertsHeader: "{alertCount}則警示" + expandDetails: (展開詳細資訊) + fare: 票價：{fare} + fromLocation: 從{location} + legDetails: 路段詳細資訊 + operatedBy: 由{agencyLink}提供服務 + ride: 搭車 + rideDurationAndStops: "搭乘{duration}{numStops, plural, =1 {} other { / # 站}}" + routeDescription: "{routeName}到{headsign}" + stopId: 車站ID {stopId} + stopIdBasic: ID {stopId} + stopViewer: 車站檢視器 + tripViewer: 行程檢視器 + typicalWait: 一般等待時間：{waitTime} + zoomToLeg: 縮放至地圖上的路段 diff --git a/packages/itinerary-body/package.json b/packages/itinerary-body/package.json index 8578181f5..2ffe85659 100644 --- a/packages/itinerary-body/package.json +++ b/packages/itinerary-body/package.json @@ -1,6 +1,6 @@ { "name": "@opentripplanner/itinerary-body", - "version": "5.3.0", + "version": "5.3.3", "description": "A component for displaying an itinerary body of a trip planning result", "main": "lib/index.js", "module": "esm/index.js", diff --git a/packages/itinerary-body/src/AccessLegBody/index.tsx b/packages/itinerary-body/src/AccessLegBody/index.tsx index 4f9a3e51b..989702a7b 100644 --- a/packages/itinerary-body/src/AccessLegBody/index.tsx +++ b/packages/itinerary-body/src/AccessLegBody/index.tsx @@ -1,4 +1,5 @@ import { Config, Leg, LegIconComponent } from "@opentripplanner/types"; +import { isTransit } from "@opentripplanner/core-utils/lib/itinerary"; import React, { Component, FunctionComponent, ReactElement } from "react"; import AnimateHeight from "react-animate-height"; import { FormattedMessage } from "react-intl"; @@ -35,6 +36,7 @@ interface Props { mapillaryKey?: string; setActiveLeg: SetActiveLegFunction; setLegDiagram: (leg: Leg) => void; + showApproximateTravelTime?: boolean; showElevationProfile: boolean; showLegIcon: boolean; TransitLegSubheader?: FunctionComponent; @@ -75,6 +77,7 @@ class AccessLegBody extends Component { mapillaryCallback, mapillaryKey, setLegDiagram, + showApproximateTravelTime, showElevationProfile, showLegIcon, TransitLegSubheader @@ -137,7 +140,12 @@ class AccessLegBody extends Component { aria-expanded={expanded} onClick={this.onStepsHeaderClick} > - + {leg.steps && leg.steps.length > 0 && ( )} diff --git a/packages/itinerary-body/src/ItineraryBody/index.tsx b/packages/itinerary-body/src/ItineraryBody/index.tsx index 8bc960db7..8851e9539 100755 --- a/packages/itinerary-body/src/ItineraryBody/index.tsx +++ b/packages/itinerary-body/src/ItineraryBody/index.tsx @@ -33,6 +33,7 @@ const ItineraryBody = ({ setActiveLeg, setLegDiagram, setViewedTrip, + showApproximateAccessLegTravelTimes, showAgencyInfo, showElevationProfile, showLegIcon, @@ -82,6 +83,9 @@ const ItineraryBody = ({ setActiveLeg={setActiveLeg} setLegDiagram={setLegDiagram} setViewedTrip={setViewedTrip} + showApproximateAccessLegTravelTimes={ + showApproximateAccessLegTravelTimes + } showAgencyInfo={showAgencyInfo} showElevationProfile={showElevationProfile} showLegIcon={showLegIcon} diff --git a/packages/itinerary-body/src/ItineraryBody/place-row.tsx b/packages/itinerary-body/src/ItineraryBody/place-row.tsx index d1e652878..f1960af85 100755 --- a/packages/itinerary-body/src/ItineraryBody/place-row.tsx +++ b/packages/itinerary-body/src/ItineraryBody/place-row.tsx @@ -40,6 +40,7 @@ export default function PlaceRow({ setLegDiagram, setViewedTrip, showAgencyInfo, + showApproximateAccessLegTravelTimes, showElevationProfile, showLegIcon, showMapButtonColumn, @@ -76,7 +77,10 @@ export default function PlaceRow({ ); return ( - + )} - + {/* Show the leg, if not rendering the destination */} {!isDestination && (leg.transitLeg ? ( @@ -172,6 +178,7 @@ export default function PlaceRow({ mapillaryKey={mapillaryKey} setActiveLeg={setActiveLeg} setLegDiagram={setLegDiagram} + showApproximateTravelTime={showApproximateAccessLegTravelTimes} showElevationProfile={showElevationProfile} showLegIcon={showLegIcon} TransitLegSubheader={TransitLegSubheader} diff --git a/packages/itinerary-body/src/TransitLegBody/alerts-body.tsx b/packages/itinerary-body/src/TransitLegBody/alerts-body.tsx index f03472e67..95ec7ed9c 100644 --- a/packages/itinerary-body/src/TransitLegBody/alerts-body.tsx +++ b/packages/itinerary-body/src/TransitLegBody/alerts-body.tsx @@ -71,7 +71,7 @@ export default function AlertsBody({ }: Props): ReactElement { if (typeof alerts !== "object") return null; return ( - + {alerts .sort((a, b) => b.effectiveStartDate - a.effectiveStartDate) .map( diff --git a/packages/itinerary-body/src/TransitLegBody/index.tsx b/packages/itinerary-body/src/TransitLegBody/index.tsx index 057ba35c1..5453889c2 100644 --- a/packages/itinerary-body/src/TransitLegBody/index.tsx +++ b/packages/itinerary-body/src/TransitLegBody/index.tsx @@ -218,7 +218,10 @@ class TransitLegBody extends Component { /> - + { {RouteDescriptionFooter && }
    { > {/* Agency information */} {showAgencyInfo && ( - + { {/* Alerts toggle */} {alerts?.length > 0 && ( { {/* The "Ride X Min / X Stops" Row, including IntermediateStops body */} {leg.intermediateStops && leg.intermediateStops.length > 0 && ( - + {/* The header summary row, clickable to expand intermediate stops */} ); } diff --git a/packages/itinerary-body/src/otp-react-redux/itinerary-body.ts b/packages/itinerary-body/src/otp-react-redux/itinerary-body.ts index 2e5e336e3..74fcf2aea 100644 --- a/packages/itinerary-body/src/otp-react-redux/itinerary-body.ts +++ b/packages/itinerary-body/src/otp-react-redux/itinerary-body.ts @@ -37,6 +37,7 @@ const StyledItineraryBody = styled(ItineraryBody)` } ${ItineraryBodyClasses.LineColumn} { + grid-area: line; display: table-cell; max-width: 20px; width: 20px; @@ -45,6 +46,7 @@ const StyledItineraryBody = styled(ItineraryBody)` } ${ItineraryBodyClasses.PlaceHeader} { + grid-area: title; color: #000; font-size: 18px; font-weight: 500; @@ -65,6 +67,7 @@ const StyledItineraryBody = styled(ItineraryBody)` } ${ItineraryBodyClasses.TimeColumn} { + grid-area: time; color: #676767; display: table-cell; font-size: 14px; diff --git a/packages/itinerary-body/src/otp-react-redux/line-column-content.tsx b/packages/itinerary-body/src/otp-react-redux/line-column-content.tsx index 135bee0ef..f578e9342 100644 --- a/packages/itinerary-body/src/otp-react-redux/line-column-content.tsx +++ b/packages/itinerary-body/src/otp-react-redux/line-column-content.tsx @@ -209,7 +209,9 @@ export default function LineColumnContent({ return ( <> - {!isDestination && } + {!isDestination && ( + + )} {legBadge} ); diff --git a/packages/itinerary-body/src/otp-react-redux/transit-leg-subheader.tsx b/packages/itinerary-body/src/otp-react-redux/transit-leg-subheader.tsx index 5f85f6c65..762c4c5ec 100644 --- a/packages/itinerary-body/src/otp-react-redux/transit-leg-subheader.tsx +++ b/packages/itinerary-body/src/otp-react-redux/transit-leg-subheader.tsx @@ -16,7 +16,7 @@ export default function TransitLegSubheader({ }: TransitLegSubheaderProps): ReactElement { const { from } = leg; return ( - + ; } @@ -67,6 +68,7 @@ function OtpRRItineraryBodyWrapper({ defaultFareSelector, hideDrivingDirections = false, itinerary, + showApproximateAccessLegTravelTimes = false, TimeColumnContent }: StoryWrapperProps): ReactElement { return ( @@ -80,6 +82,7 @@ function OtpRRItineraryBodyWrapper({ PlaceName={OtpRRPlaceName} RouteDescription={OtpRRRouteDescription} showAgencyInfo + showApproximateAccessLegTravelTimes={showApproximateAccessLegTravelTimes} showLegIcon showMapButtonColumn={false} showViewTripButton @@ -243,3 +246,10 @@ export const HideDrivingDirections = (): ReactElement => ( itinerary={parkAndRideItinerary} /> ); + +export const ApproximatePrefixItinerary = (): ReactElement => ( + +); diff --git a/packages/itinerary-body/src/stories/OtpUiItineraryBody.story.tsx b/packages/itinerary-body/src/stories/OtpUiItineraryBody.story.tsx index 3a8708fce..7a3a733df 100644 --- a/packages/itinerary-body/src/stories/OtpUiItineraryBody.story.tsx +++ b/packages/itinerary-body/src/stories/OtpUiItineraryBody.story.tsx @@ -226,3 +226,10 @@ export const HideDrivingDirections = (): ReactElement => ( itinerary={parkAndRideItinerary} /> ); + +export const ApproximatePrefixItinerary = (): ReactElement => ( + +); diff --git a/packages/itinerary-body/src/stories/itinerary-body-defaults-wrapper.tsx b/packages/itinerary-body/src/stories/itinerary-body-defaults-wrapper.tsx index 1b68669c8..07ef9972d 100644 --- a/packages/itinerary-body/src/stories/itinerary-body-defaults-wrapper.tsx +++ b/packages/itinerary-body/src/stories/itinerary-body-defaults-wrapper.tsx @@ -53,6 +53,7 @@ export default class ItineraryBodyDefaultsWrapper extends Component< RouteDescription, RouteDescriptionFooter = undefined, showAgencyInfo, + showApproximateAccessLegTravelTimes = false, showLegIcon, showMapButtonColumn = true, showViewTripButton, @@ -104,6 +105,9 @@ export default class ItineraryBodyDefaultsWrapper extends Component< setLegDiagram={this.setLegDiagram} setViewedTrip={action("setViewedTrip")} showAgencyInfo={showAgencyInfo} + showApproximateAccessLegTravelTimes={ + showApproximateAccessLegTravelTimes + } showElevationProfile showLegIcon={showLegIcon} showMapButtonColumn={showMapButtonColumn} diff --git a/packages/itinerary-body/src/styled.tsx b/packages/itinerary-body/src/styled.tsx index f676b0039..d88865830 100755 --- a/packages/itinerary-body/src/styled.tsx +++ b/packages/itinerary-body/src/styled.tsx @@ -1,3 +1,4 @@ +// stylelint-disable declaration-block-no-shorthand-property-overrides // eslint-disable-next-line @typescript-eslint/ban-ts-comment // @ts-ignore FIXME: Create TypeScript types for the icons package. import { Map } from "@opentripplanner/icons"; @@ -300,7 +301,9 @@ export const LegDescription = styled.span` `; // additional description added to ClickableLeg for screenreaders -export const InvisibleAdditionalDetails = styled.span` +export const InvisibleAdditionalDetails = styled.span.attrs({ + className: "invisible-additional-details" +})` display: inline-block; grid-row-start: 2; grid-column-start: 1; @@ -384,13 +387,16 @@ export const LineColumn = styled.div` export const LegDetails = styled.span` display: grid; - grid-template-columns: 100px auto; + grid-template-columns: 130px auto; `; export const PlaceRowWrapper = styled.li` /* needs to be a flexbox row */ max-width: 500px; display: grid; + grid-template-areas: + "time line title" + "time line instructions"; grid-template-columns: 65px 30px auto; `; @@ -454,6 +460,7 @@ export const MapIcon = styled(Map).attrs(props => ({ export const PlaceDetails = styled.div` grid-row-start: 2; grid-column-start: 3; + grid-area: instructions; `; export const PlaceHeader = styled.div` diff --git a/packages/itinerary-body/src/types.ts b/packages/itinerary-body/src/types.ts index 934a6829a..0b634bc53 100644 --- a/packages/itinerary-body/src/types.ts +++ b/packages/itinerary-body/src/types.ts @@ -201,6 +201,8 @@ interface ItineraryBodySharedProps { setViewedTrip: SetViewedTripFunction; /** If true, will show agency information in transit legs */ showAgencyInfo?: boolean; + /** Whether to prefix non transit legs with 'About' text */ + showApproximateAccessLegTravelTimes?: boolean; /** If true, will show the elevation profile for walk/bike legs */ showElevationProfile?: boolean; /** If true will show the leg icon in the leg body */ diff --git a/packages/location-field/i18n/zh_Hant.yml b/packages/location-field/i18n/zh_Hant.yml new file mode 100644 index 000000000..1ef7587a3 --- /dev/null +++ b/packages/location-field/i18n/zh_Hant.yml @@ -0,0 +1,25 @@ +otpUi: + LocationField: + beginTypingPrompt: 開始輸入以搜尋位置 + clearLocation: 清除位置 + currentLocationUnavailable: 目前的位置無法使用 + fetchingLocation: 正在擷取位置…… + fetchingSuggestions: 正在擷取建議… + homeLocation: 住家 + howToAccessResults: 使用向下箭頭鍵瀏覽結果清單。若要選取結果，請使用Enter鍵。 + myPlaces: 我的地點 + nearby: 附近的車站 + noResults: 找不到符合 + other: 其他 + otherCount: "{count}興趣點" + parenthesisFormat: "{main} ({detail})" + recentlySearched: 最近搜尋過 + resultsFound: 為 "{input}" 找到 {results}。 + stationCount: "{count}車站" + stations: 車站 + stopCount: "{count}車站" + stops: 車站 + suggestedLocations: 建議地點 + suggestedLocationsLong: 顯示/不顯示建議位置清單 + useCurrentLocation: 使用目前位置 + workLocation: 工作 diff --git a/packages/location-field/package.json b/packages/location-field/package.json index 215150bf6..7a91f7d07 100644 --- a/packages/location-field/package.json +++ b/packages/location-field/package.json @@ -1,6 +1,6 @@ { "name": "@opentripplanner/location-field", - "version": "2.0.18", + "version": "2.0.20", "description": "A component for display and finding a location", "main": "lib/index.js", "module": "esm/index.js", diff --git a/packages/location-field/src/index.tsx b/packages/location-field/src/index.tsx index 4679b4728..c0295be35 100644 --- a/packages/location-field/src/index.tsx +++ b/packages/location-field/src/index.tsx @@ -177,6 +177,7 @@ const LocationField = ({ sessionOptionIcon = , sessionSearches = [], showClearButton = true, + showSecondaryLabels = true, showUserSettings = false, sortByDistance = false, stopOptionIcon = , @@ -579,6 +580,7 @@ const LocationField = ({ title={main} subTitle={secondary} secondaryLabels={secondaryLabels} + showSecondaryLabels={showSecondaryLabels} /> ); }; diff --git a/packages/location-field/src/options.tsx b/packages/location-field/src/options.tsx index eddd32850..1c4c64415 100644 --- a/packages/location-field/src/options.tsx +++ b/packages/location-field/src/options.tsx @@ -75,6 +75,7 @@ export function Option({ isActive = false, onClick, secondaryLabels = [], + showSecondaryLabels = true, subTitle = null, title = null }: { @@ -86,6 +87,7 @@ export function Option({ isActive?: boolean; onClick?: () => void; secondaryLabels?: string[]; + showSecondaryLabels?: boolean; subTitle?: React.ReactNode; title?: React.ReactNode; }): React.ReactElement { @@ -102,12 +104,13 @@ export function Option({ )} {/* Only show top 5 results to avoid chaos */} - {secondaryLabels?.slice(0, 5).map((label, idx) => ( - - , - {label} - - ))} + {showSecondaryLabels && + secondaryLabels?.slice(0, 5).map((label, idx) => ( + + , + {label} + + ))} diff --git a/packages/location-field/src/stories/Desktop.story.tsx b/packages/location-field/src/stories/Desktop.story.tsx index 3eaa64d6e..cc08967c4 100644 --- a/packages/location-field/src/stories/Desktop.story.tsx +++ b/packages/location-field/src/stories/Desktop.story.tsx @@ -120,6 +120,7 @@ export const SlowGeocoder = (): JSX.Element => ( inputPlaceholder="Select from location" locationType="from" onLocationSelected={onLocationSelected} + showSecondaryLabels={false} /> ); diff --git a/packages/location-field/src/types.ts b/packages/location-field/src/types.ts index 048a28e24..8762e20da 100644 --- a/packages/location-field/src/types.ts +++ b/packages/location-field/src/types.ts @@ -228,6 +228,10 @@ export interface LocationFieldProps { * Whether or not to show the clear button */ showClearButton?: boolean; + /** + * Whether to show alternate stop names when they are provided + */ + showSecondaryLabels?: boolean; /** * Whether or not to show user settings dialog */ diff --git a/packages/map-popup/package.json b/packages/map-popup/package.json index f86942c73..bd1f12a04 100644 --- a/packages/map-popup/package.json +++ b/packages/map-popup/package.json @@ -1,6 +1,6 @@ { "name": "@opentripplanner/map-popup", - "version": "3.1.0", + "version": "3.1.1", "description": "A component for displaying map popup contents", "main": "lib/index.js", "module": "esm/index.js", @@ -11,7 +11,6 @@ "license": "MIT", "private": false, "dependencies": { - "@opentripplanner/base-map": "^3.1.0", "@opentripplanner/core-utils": "^11.4.0", "@opentripplanner/from-to-location-picker": "^2.1.12", "flat": "^5.0.2" diff --git a/packages/map-popup/src/index.tsx b/packages/map-popup/src/index.tsx index 7b9f07248..f321bc80d 100644 --- a/packages/map-popup/src/index.tsx +++ b/packages/map-popup/src/index.tsx @@ -1,6 +1,4 @@ import React, { useCallback } from "react"; - -import { Styled as BaseMapStyled } from "@opentripplanner/base-map"; import FromToLocationPicker from "@opentripplanner/from-to-location-picker"; // eslint-disable-next-line prettier/prettier import type { Company, ConfiguredCompany, Location, Station, Stop, StopEventHandler } from "@opentripplanner/types"; @@ -33,7 +31,7 @@ const generateLocation = (entity: Entity, name: string) => { const StationHubDetails = ({ station }: { station: Station }) => { return ( - +
    { values={{ value: station.spacesAvailable }} />
    -     + ) } const StopDetails = ({ id, setViewedStop }: { id: string, setViewedStop: () => void; }) => { return ( - + v id="otpUi.MapPopup.stopViewer" /> - + ) } @@ -111,8 +109,8 @@ export function MapPopup({ configCompanies, entity, getEntityName, setLocation, const stopId = !bikesAvailablePresent && entity?.code || entity.id.split(":")[1] || entity.id return ( - - {name} + + {name} {/* render dock info if it is available */} {entityIsStationHub && } @@ -126,15 +124,15 @@ export function MapPopup({ configCompanies, entity, getEntityName, setLocation, {/* The "Set as [from/to]" ButtonGroup */} {setLocation && ( - + - + )} - + ); } diff --git a/packages/map-popup/src/styled.ts b/packages/map-popup/src/styled.ts index d9fa591d8..8c20184bb 100644 --- a/packages/map-popup/src/styled.ts +++ b/packages/map-popup/src/styled.ts @@ -1,5 +1,7 @@ import styled from "styled-components"; +import { Popup as MapGlPopup } from "react-map-gl"; + /* eslint-disable-next-line import/prefer-default-export */ export const ViewStopButton = styled.button` background: none; @@ -12,3 +14,30 @@ export const ViewStopButton = styled.button` margin-left: 5px; padding-top: 0; `; + +/** + * Adds a box shadow and tweaks border radius to make popups easier to read. + */ +export const Popup = styled(MapGlPopup)` + & > .maplibregl-popup-content, + & > .mapboxgl-popup-content { + border-radius: 10px; + box-shadow: 0 3px 14px 4px rgb(0 0 0 / 20%); + } +`; + +export const MapOverlayPopup = styled.div` + font-size: 12px; + line-height: 1.5; + min-width: 250px; +`; + +export const PopupRow = styled.p` + margin-top: 6px; +`; + +export const PopupTitle = styled.header` + font-size: 18px; + font-weight: 500; + margin-bottom: 6px; +`; diff --git a/packages/printable-itinerary/i18n/zh_Hant.yml b/packages/printable-itinerary/i18n/zh_Hant.yml new file mode 100644 index 000000000..813af1223 --- /dev/null +++ b/packages/printable-itinerary/i18n/zh_Hant.yml @@ -0,0 +1,15 @@ +otpUi: + PrintableItinerary: + TncLeg: + estimatedTravelTime: 預估行程時間：{duration} (不考慮車流) + estimatedWaitTime: 預估等待接車時間：{duration} + header: 搭乘{company}前往{place} + TransitLeg: + alight: >- + {time, time, short}於{place} + ({stopId})下車 + board: >- + {time, time, short}於{place} + ({stopId})上車 + continuesAs: 繼續{routeDescription} + depart: 從{place}出發 diff --git a/packages/printable-itinerary/package.json b/packages/printable-itinerary/package.json index 924013bcc..1ef8e96e6 100644 --- a/packages/printable-itinerary/package.json +++ b/packages/printable-itinerary/package.json @@ -1,6 +1,6 @@ { "name": "@opentripplanner/printable-itinerary", - "version": "2.0.20", + "version": "2.0.21", "description": "A component for displaying a printable itinerary body of a trip planning result", "main": "lib/index.js", "module": "esm/index.js", diff --git a/packages/stops-overlay/package.json b/packages/stops-overlay/package.json index b7bf04a44..66181a216 100644 --- a/packages/stops-overlay/package.json +++ b/packages/stops-overlay/package.json @@ -1,6 +1,6 @@ { "name": "@opentripplanner/stops-overlay", - "version": "5.2.2", + "version": "5.3.0", "description": "A map overlay to show transit stops", "main": "lib/index.js", "module": "esm/index.js", diff --git a/packages/stops-overlay/src/index.tsx b/packages/stops-overlay/src/index.tsx index 676416171..45c25cbb3 100644 --- a/packages/stops-overlay/src/index.tsx +++ b/packages/stops-overlay/src/index.tsx @@ -8,7 +8,7 @@ import { EventData } from "mapbox-gl"; import { Layer, Source, useMap } from "react-map-gl"; import React, { useCallback, useEffect, useMemo, useState } from "react"; -import StopPopup from "@opentripplanner/map-popup"; +import StopPopup, { FocusTrapWrapper } from "@opentripplanner/map-popup"; import { isGeoJsonFlex } from "./utils"; type Props = { @@ -204,17 +204,19 @@ const StopsOverlay = (props: Props): JSX.Element => { maxWidth="100%" onClose={setNullStop} > - { - setNullStop(); - setLocation(location); - }} - setViewedStop={stop => { - setNullStop(); - setViewedStop(stop); - }} - entity={clickedStop} - /> + + { + setNullStop(); + setLocation(location); + }} + setViewedStop={stop => { + setNullStop(); + setViewedStop(stop); + }} + /> + )} {flexStops.map(stop => ( diff --git a/packages/transit-vehicle-overlay/i18n/zh_Hant.yml b/packages/transit-vehicle-overlay/i18n/zh_Hant.yml new file mode 100644 index 000000000..9fed5537a --- /dev/null +++ b/packages/transit-vehicle-overlay/i18n/zh_Hant.yml @@ -0,0 +1,8 @@ +otpUi: + TransitVehicleOverlay: + defaultTooltip: "{route}： {duration}前" + durationWithSeconds: >- + {hours, plural, =0 {} other {#小時}}{minutes, plural, =0 {{seconds, plural, + =0 {#分鐘} other {}}} other {#分鐘}}{seconds, plural, =0 {} other {#秒}} + routeTitle: "{type} {name}" + transitLine: 路線 diff --git a/packages/transit-vehicle-overlay/package.json b/packages/transit-vehicle-overlay/package.json index 66f62d91a..89a55b24e 100644 --- a/packages/transit-vehicle-overlay/package.json +++ b/packages/transit-vehicle-overlay/package.json @@ -1,6 +1,6 @@ { "name": "@opentripplanner/transit-vehicle-overlay", - "version": "4.0.10", + "version": "4.0.11", "description": "Realtime Transit Vehicles Component", "author": "Frank Purcell", "homepage": "https://github.com/opentripplanner/otp-ui/tree/master/packages/transit-vehicle-overlay/#readme", diff --git a/packages/transitive-overlay/package.json b/packages/transitive-overlay/package.json index c6e050632..481c07455 100644 --- a/packages/transitive-overlay/package.json +++ b/packages/transitive-overlay/package.json @@ -1,6 +1,6 @@ { "name": "@opentripplanner/transitive-overlay", - "version": "3.0.18", + "version": "3.0.19", "description": "A map overlay to show an itinerary based on transitive.js", "main": "lib/index.js", "module": "esm/index.js", diff --git a/packages/transitive-overlay/src/TransitiveOverlay.story.tsx b/packages/transitive-overlay/src/TransitiveOverlay.story.tsx index a7c7603bf..d9f091dff 100644 --- a/packages/transitive-overlay/src/TransitiveOverlay.story.tsx +++ b/packages/transitive-overlay/src/TransitiveOverlay.story.tsx @@ -1,3 +1,4 @@ +/* eslint-disable react/jsx-props-no-spreading */ import EndpointsOverlay from "@opentripplanner/endpoints-overlay"; import React from "react"; import { action } from "@storybook/addon-actions"; @@ -49,291 +50,144 @@ function getToLocation(itinerary) { export default { title: "TransitiveOverlay", decorators: [withMap()], - component: TransitiveOverlay + component: TransitiveOverlay, + argTypes: { + showRouteArrows: { + control: "boolean", + description: "Toggle to show or hide route arrows on the map" + }, + accessLegColorOverride: { + control: "color", + description: "Override the color of the route" + } + }, + args: { + showRouteArrows: false, + accessLegColorOverride: null, + visible: true + } }; -export const Empty = (): JSX.Element => ( - +const Template = injectIntl( + ({ itinerary, mapCoords, mapZoom, intl, ...args }) => ( + <> + + + + ) ); -export const WalkingItinerary = (): JSX.Element => ( - <> - - - -); -WalkingItinerary.decorators = [withMap([45.518841, -122.679302], 19)]; +export const WalkingItinerary = Template.bind({}); +WalkingItinerary.args = { + itinerary: walkOnlyItinerary, + mapCoords: [45.518841, -122.679302], + mapZoom: 19 +}; -export const BikeOnlyItinerary = (): JSX.Element => ( - <> - - - -); -BikeOnlyItinerary.decorators = [withMap([45.520441, -122.68302], 16)]; +export const BikeOnlyItinerary = Template.bind({}); +BikeOnlyItinerary.args = { + itinerary: bikeOnlyItinerary, + mapCoords: [45.520441, -122.68302], + mapZoom: 16 +}; -export const WalkTransitWalkItinerary = (): JSX.Element => ( - <> - - - -); -WalkTransitWalkItinerary.decorators = [withMap([45.520441, -122.68302], 16)]; +export const WalkTransitWalkItinerary = Template.bind({}); +WalkTransitWalkItinerary.args = { + itinerary: walkTransitWalkItinerary, + mapCoords: [45.520441, -122.68302], + mapZoom: 16 +}; -export const WalkTransitWalkItineraryWithNoIntermediateStops = (): JSX.Element => ( - <> - - - +export const WalkTransitWalkItineraryWithNoIntermediateStops = Template.bind( + {} ); -WalkTransitWalkItineraryWithNoIntermediateStops.decorators = [ - withMap([45.525841, -122.649302], 13) -]; +WalkTransitWalkItineraryWithNoIntermediateStops.args = { + itinerary: walkTransitWalkItineraryNoIntermediateStops, + mapCoords: [45.525841, -122.649302], + mapZoom: 13 +}; -export const BikeTransitBikeItinerary = (): JSX.Element => ( - <> - - - -); -BikeTransitBikeItinerary.decorators = [withMap([45.520441, -122.68302], 16)]; +export const BikeTransitBikeItinerary = Template.bind({}); +BikeTransitBikeItinerary.args = { + itinerary: bikeTransitBikeItinerary, + mapCoords: [45.520441, -122.68302], + mapZoom: 16 +}; -export const WalkInterlinedTransitItinerary = (): JSX.Element => ( - <> - - - -); -WalkInterlinedTransitItinerary.decorators = [ - withMap([47.703022, -122.328041], 12.5) -]; +export const WalkInterlinedTransitItinerary = Template.bind({}); +WalkInterlinedTransitItinerary.args = { + itinerary: walkInterlinedTransitItinerary, + mapCoords: [47.703022, -122.328041], + mapZoom: 12.5 +}; -export const WalkTransitTransferItinerary = (): JSX.Element => ( - <> - - - -); -WalkTransitTransferItinerary.decorators = [ - withMap([45.505841, -122.631302], 14) -]; +export const WalkTransitTransferItinerary = Template.bind({}); +WalkTransitTransferItinerary.args = { + itinerary: walkTransitWalkTransitWalkItinerary, + mapCoords: [45.505841, -122.631302], + mapZoom: 14 +}; -export const BikeRentalItinerary = (): JSX.Element => ( - <> - - - -); -BikeRentalItinerary.decorators = [withMap([45.508841, -122.631302], 14)]; +export const BikeRentalItinerary = Template.bind({}); +BikeRentalItinerary.args = { + itinerary: bikeRentalItinerary, + mapCoords: [45.508841, -122.631302], + mapZoom: 14 +}; -export const EScooterRentalItinerary = injectIntl(({ intl }) => ( - <> - - - -)); -EScooterRentalItinerary.decorators = [withMap([45.52041, -122.675302], 16)]; +export const EScooterRentalItinerary = Template.bind({}); +EScooterRentalItinerary.args = { + itinerary: eScooterRentalItinerary, + mapCoords: [45.52041, -122.675302], + mapZoom: 16 +}; -export const ParkAndRideItinerary = (): JSX.Element => ( - <> - - - -); -ParkAndRideItinerary.decorators = [withMap([45.515841, -122.75302], 13)]; +export const ParkAndRideItinerary = Template.bind({}); +ParkAndRideItinerary.args = { + itinerary: parkAndRideItinerary, + mapCoords: [45.515841, -122.75302], + mapZoom: 13 +}; -export const BikeRentalTransitItinerary = (): JSX.Element => ( - <> - - - -); -BikeRentalTransitItinerary.decorators = [withMap([45.538841, -122.6302], 12)]; +export const BikeRentalTransitItinerary = Template.bind({}); +BikeRentalTransitItinerary.args = { + itinerary: bikeRentalTransitBikeRentalItinerary, + mapCoords: [45.538841, -122.6302], + mapZoom: 12 +}; -export const EScooterRentalTransitItinerary = injectIntl(({ intl }) => ( - <> - - - -)); -EScooterRentalTransitItinerary.decorators = [ - withMap([45.538841, -122.6302], 12) -]; +export const EScooterRentalTransitItinerary = Template.bind({}); +EScooterRentalTransitItinerary.args = { + itinerary: eScooterRentalTransiteScooterRentalItinerary, + mapCoords: [45.538841, -122.6302], + mapZoom: 12 +}; -export const TncTransitItinerary = (): JSX.Element => ( - <> - - - -); -TncTransitItinerary.decorators = [withMap([45.538841, -122.6302], 12)]; +export const TncTransitItinerary = Template.bind({}); +TncTransitItinerary.args = { + itinerary: tncTransitTncItinerary, + mapCoords: [45.538841, -122.6302], + mapZoom: 12 +}; -export const FlexItinerary = (): JSX.Element => ( - <> - - - -); -FlexItinerary.decorators = [withMap([40.038487, -105.0529011], 11)]; +export const FlexItinerary = Template.bind({}); +FlexItinerary.args = { + itinerary: flexItinerary, + mapCoords: [40.038487, -105.0529011], + mapZoom: 11 +}; -export const OTP2ScooterItinerary = injectIntl(({ intl }) => ( - <> - - - -)); -OTP2ScooterItinerary.decorators = [withMap([33.749, -84.388], 11)]; +export const OTP2ScooterItinerary = Template.bind({}); +OTP2ScooterItinerary.args = { + itinerary: otp2ScooterItinerary, + mapCoords: [33.749, -84.388], + mapZoom: 11 +}; diff --git a/packages/transitive-overlay/src/images/route_arrow.png b/packages/transitive-overlay/src/images/route_arrow.png new file mode 100644 index 000000000..3ef456862 Binary files /dev/null and b/packages/transitive-overlay/src/images/route_arrow.png differ diff --git a/packages/transitive-overlay/src/index.tsx b/packages/transitive-overlay/src/index.tsx index 8afd3e1cd..678fabee5 100644 --- a/packages/transitive-overlay/src/index.tsx +++ b/packages/transitive-overlay/src/index.tsx @@ -17,6 +17,8 @@ import { drawArc, getFromToAnchors, itineraryToTransitive } from "./util"; export { itineraryToTransitive }; +const routeArrow = require("./images/route_arrow.png"); + // TODO: BETTER COLORS const modeColorMap = { CAR: "#888", @@ -87,14 +89,48 @@ const accessLegFilter = [ type Props = { activeLeg?: Leg; + accessLegColorOverride?: string; + showRouteArrows?: boolean; transitiveData?: TransitiveData; }; +const images = [ + { + id: "arrow-icon", + url: routeArrow + } +]; + const TransitiveCanvasOverlay = ({ activeLeg, + accessLegColorOverride, + showRouteArrows, transitiveData }: Props): JSX.Element => { const { current: map } = useMap(); + useEffect(() => { + if (!map) return; + const loadImages = () => { + images.forEach(img => { + map.loadImage(img.url, (error, image) => { + if (error) { + // eslint-disable-next-line no-console + console.error(`Error loading image ${img.id}:`, error); + return; + } + if (!map.hasImage(img.id)) { + map.addImage(img.id, image, { sdf: true }); + } + }); + }); + }; + + if (map) { + loadImages(); + } else { + map.on("load", loadImages); + } + }, [map, images]); const geojson: GeoJSON.FeatureCollection< GeoJSON.Geometry, @@ -139,7 +175,10 @@ const TransitiveCanvasOverlay = ({ type: "Feature", properties: { type: "street-edge", - color: modeColorMap[segment.type] || "#008", + color: + accessLegColorOverride || + modeColorMap[segment.type] || + "#008", mode: segment.type }, geometry: segment.arc ? drawArc(straight) : straight @@ -269,7 +308,25 @@ const TransitiveCanvasOverlay = ({ }} type="line" /> - + {showRouteArrows && ( + + )} {/* Render access leg places then transit stops so that they appear sandwiched between text and lines, with transit stops appearing above access leg places. */} - - Time Spent Active: {minutes, plural, one {# minute} other {# - minutes}} + Time Spent Active: {approximatePrefix, select, true {~} other + {}}{minutes, plural, one {# minute} other {# minutes}} missingFareTotal: No fare total available showDetail: Show details timeActiveDescription: > diff --git a/packages/trip-details/i18n/es.yml b/packages/trip-details/i18n/es.yml index 1f89ba261..37a03a35f 100644 --- a/packages/trip-details/i18n/es.yml +++ b/packages/trip-details/i18n/es.yml @@ -16,9 +16,11 @@ otpUi: Salida {departureDate, date, long} a las {departureDate, time, short} hideDetail: Ocultar detalles + legMissingFareInfo: No hay información sobre tarifas para este tramo minutesActive: >- - Tiempo de actividad: {minutes, plural, one {# minuto} other {# - minutos}} + Tiempo de actividad: {approximatePrefix, select, true {~} other + {}}{minutes, plural, one {# minuto} other {# minutos}} + missingFareTotal: No hay tarifas disponibles showDetail: Mostrar detalles timeActiveDescription: > Al hacer este viaje, gastarás {walkMinutes, plural, one {# minuto} @@ -30,5 +32,3 @@ otpUi: transitFare: Tarifa de tránsito transitFareEntry: "{name} : {value}" tripIncludesFlex: Este viaje incluye rutas flexibles. {extraMessage} - missingFareTotal: No hay tarifas disponibles - legMissingFareInfo: No hay información sobre tarifas para este tramo diff --git a/packages/trip-details/i18n/fr.yml b/packages/trip-details/i18n/fr.yml index 9b388ddb3..de8b1ab23 100644 --- a/packages/trip-details/i18n/fr.yml +++ b/packages/trip-details/i18n/fr.yml @@ -17,7 +17,7 @@ otpUi: {departureDate, time, short} hideDetail: Masquer les détails legMissingFareInfo: Tarif inconnu pour cette étape - minutesActive: "Activité physique\_: {minutes, plural, one {# minute} other {# minutes}}" + minutesActive: "Activité physique\_: {approximatePrefix, select, true {~} other {}}{minutes, plural, one {# minute} other {# minutes}}" missingFareTotal: Tarif total inconnu showDetail: Afficher les détails timeActiveDescription: > diff --git a/packages/trip-details/i18n/ko.yml b/packages/trip-details/i18n/ko.yml index 122d29cdb..0ed824742 100644 --- a/packages/trip-details/i18n/ko.yml +++ b/packages/trip-details/i18n/ko.yml @@ -15,7 +15,9 @@ otpUi: {departureDate, time, short}에 {departureDate, date, long} 출발 hideDetail: 세부정보 숨기기 - minutesActive: "소요 시간 사용 중: {minutes} 분" + minutesActive: >- + 소요 시간 사용 중: {approximatePrefix, select, true {약 } other + {}}{minutes} 분 showDetail: 세부정보 표시 timeActiveDescription: > 이 이동편을 이용하면, 도보로 {walkMinutes} 분 및 자전거로 diff --git a/packages/trip-details/i18n/ru.yml b/packages/trip-details/i18n/ru.yml index 9c4bf0df9..442549802 100644 --- a/packages/trip-details/i18n/ru.yml +++ b/packages/trip-details/i18n/ru.yml @@ -18,8 +18,8 @@ otpUi: {departureDate, time, short} hideDetail: Скрыть детали minutesActive: >- - Время в активном режиме: {minutes, plural, one {# минуту} other {# - минуты}} + Время в активном режиме: {approximatePrefix, select, true {~} + other {}}{minutes, plural, one {# минуту} other {# минуты}} showDetail: Показать детали timeActiveDescription: > Проделав этот маршрут, вы потратите {walkMinutes, plural, one {# diff --git a/packages/trip-details/i18n/tl.yml b/packages/trip-details/i18n/tl.yml index 455fcb178..b65540fb1 100644 --- a/packages/trip-details/i18n/tl.yml +++ b/packages/trip-details/i18n/tl.yml @@ -17,7 +17,9 @@ otpUi: Aalis {departureDate, date, long} nang {departureDate, time, short} hideDetail: Itago ang mga detalye - minutesActive: "Oras na Ginugol sa pagiging Aktibo: {minutes} minuto" + minutesActive: >- + Oras na Ginugol sa pagiging Aktibo: {approximatePrefix, select, + true {~} other {}}{minutes} minuto showDetail: Ipakita ang mga detalye timeActiveDescription: > Sa pagbiyahe nang ganitong paraan, gugugol ka ng {walkMinutes} diff --git a/packages/trip-details/i18n/vi.yml b/packages/trip-details/i18n/vi.yml index 96fff1c9b..7f39055b9 100644 --- a/packages/trip-details/i18n/vi.yml +++ b/packages/trip-details/i18n/vi.yml @@ -16,7 +16,9 @@ otpUi: Khởi hành {departureDate, date, long} lúc {departureDate, time, short} hideDetail: Ẩn chi tiết - minutesActive: "Thời gian hoạt động: {minutes} phút" + minutesActive: >- + Thời gian hoạt động: {approximatePrefix, select, true {~} other + {}}{minutes} phút showDetail: Hiển thị chi tiết timeActiveDescription: > Nếu thực hiện chuyến đi này, quý vị sẽ dành {walkMinutes} diff --git a/packages/trip-details/i18n/zh_Hans.yml b/packages/trip-details/i18n/zh_Hans.yml index e90006efb..6a29f2553 100644 --- a/packages/trip-details/i18n/zh_Hans.yml +++ b/packages/trip-details/i18n/zh_Hans.yml @@ -13,7 +13,9 @@ otpUi: {departureDate, date, long} {departureDate, time, short} 出发 hideDetail: 隐藏细节 - minutesActive: "活动时间: {minutes} 分钟" + minutesActive: >- + 活动时间: {approximatePrefix, select, true {约 } other {}}{minutes} + 分钟 showDetail: 显示详细资料 timeActiveDescription: > 在本次行程中，您将步行 {walkMinutes} 分钟，骑行{bikeMinutes} diff --git a/packages/trip-details/i18n/zh_Hant.yml b/packages/trip-details/i18n/zh_Hant.yml new file mode 100644 index 000000000..29a3a40a4 --- /dev/null +++ b/packages/trip-details/i18n/zh_Hant.yml @@ -0,0 +1,26 @@ +otpUi: + TripDetails: + FareTable: + cash: 現金 + electronic: 電子 + regular: 成人 + senior: 年長者 + special: 特殊 + youth: 青少年 + co2: 排放的二氧化碳：{co2} + co2description: 二氧化碳密度是以一個行程每條腿的距離乘以各個模式的二氧化碳密度來計算。各個模式的二氧化碳密度是從此試算表中取得。 + departure: >- + {departureDate, date, long}的{departureDate, time, + short}出發 + hideDetail: 隱藏詳細資訊 + minutesActive: 活躍時間：{minutes}分鐘前 + showDetail: 顯示詳細資訊 + timeActiveDescription: > + 採用此行程即表示您將花費 {walkMinutes} 分鐘 的步行時間以及 + {bikeMinutes} 分鐘 的自行車騎乘時間。 + title: 行程詳細資訊 + tncFare: "{companies} 票價：{minTNCFare} - {maxTNCFare}" + transferDiscountExplanation: 已套用{transferAmount}的轉乘折扣 + transitFare: 公共交通票價 + transitFareEntry: "{name}：{value}" + tripIncludesFlex: 此行程包括彈性的路線。{extraMessage} diff --git a/packages/trip-details/package.json b/packages/trip-details/package.json index 655373fb3..da2c4a6af 100644 --- a/packages/trip-details/package.json +++ b/packages/trip-details/package.json @@ -1,6 +1,6 @@ { "name": "@opentripplanner/trip-details", - "version": "5.0.11", + "version": "5.0.13", "description": "A component for displaying details about a trip planning itinerary", "main": "lib/index.js", "module": "esm/index.js", diff --git a/packages/trip-details/src/TripDetails.story.tsx b/packages/trip-details/src/TripDetails.story.tsx index b1c92da3d..5c80027d3 100644 --- a/packages/trip-details/src/TripDetails.story.tsx +++ b/packages/trip-details/src/TripDetails.story.tsx @@ -189,8 +189,9 @@ function createTripDetailsTemplate( DepartureDetails, FareDetails, fareDetailsLayout, + itinerary, TimeActiveDetails, - itinerary + showApproximateMinutesActive }: TripDetailsProps, { globals, parameters }: StoryContext ): ReactElement => { @@ -211,6 +212,7 @@ function createTripDetailsTemplate( itinerary={itinerary} co2Config={defaultCo2Config} defaultFareType={defaultFareType} + showApproximateMinutesActive={showApproximateMinutesActive} /> ); }; @@ -251,6 +253,11 @@ export const WalkOnlyItinerary = makeStory({ itinerary: walkOnlyItinerary }); +export const ApproximatePrefixItinerary = makeStory({ + itinerary: walkOnlyItinerary, + showApproximateMinutesActive: true +}); + export const BikeOnlyItinerary = makeStory({ itinerary: bikeOnlyItinerary }); diff --git a/packages/trip-details/src/index.tsx b/packages/trip-details/src/index.tsx index 5e25d28b6..308b0e20c 100644 --- a/packages/trip-details/src/index.tsx +++ b/packages/trip-details/src/index.tsx @@ -72,6 +72,7 @@ export function TripDetails({ fareDetailsLayout, fareKeyNameMap = {}, itinerary, + showApproximateMinutesActive, TimeActiveDetails = DefaultTimeActiveDetails }: TripDetailsProps): ReactElement { // process the transit fare @@ -320,6 +321,7 @@ export function TripDetails({ description="Text showing the number of minutes spent walking or biking throughout trip." id="otpUi.TripDetails.minutesActive" values={{ + approximatePrefix: showApproximateMinutesActive, minutes: minutesActive, strong: boldText }} diff --git a/packages/trip-details/src/types.ts b/packages/trip-details/src/types.ts index 1feba9d6c..deed93711 100644 --- a/packages/trip-details/src/types.ts +++ b/packages/trip-details/src/types.ts @@ -93,7 +93,11 @@ export interface TripDetailsProps { * Itinerary that the user has selected to view, contains multiple legs. */ itinerary: Itinerary; - /** + /** + * show the '~' symbol in the trip details panel + */ + showApproximateMinutesActive?: boolean; + /** * Slot for a custom component to render the expandable section for time active. */ TimeActiveDetails?: React.ElementType; diff --git a/packages/trip-form/i18n/zh_Hant.yml b/packages/trip-form/i18n/zh_Hant.yml new file mode 100644 index 000000000..06b663576 --- /dev/null +++ b/packages/trip-form/i18n/zh_Hant.yml @@ -0,0 +1,67 @@ +otpUi: + DateTimeSelector: + arrive: 最晚抵達時間 + date: 日期 + dateTimeSelector: 日期/時間選擇器 + depart: 出發時間 + now: 現在出發 + time: 時間 + ModeSelector: + labels: + bicycle: 騎行 + car: 駕車 + rent: 租用 + transit: 公共交通 + walk: 步行 + settings: + bikeTolerance-label: 自行車接受度 + bikeTolerance-labelHigh: 自行車騎乘較多 + bikeTolerance-labelLow: 自行車騎乘較少 + bus-label: 搭乘公車 + carTolerance-label: 駕車接受度 + carTolerance-labelHigh: 駕車較多 + carTolerance-labelLow: 駕車較少 + ferry-label: 渡船 + rail-label: 火車 + subway-label: 捷運 + tram-label: 電車 + walkReluctance-label: 避開步行路線 + walkTolerance-label: 步行接受度 + walkTolerance-labelHigh: 步行較多 + walkTolerance-labelLow: 步行較少 + wheelchair-label: 可到達路線 + settingsLabel: "{mode} 設定" + SettingsSelectorPanel: + bikeOnly: 僅限自行車 + escooterOnly: 僅限電動滑板車 + takeTransit: 使用公共交通 + travelPreferences: 旅行偏好 + use: 使用 + useCompanies: 使用公司 + walkOnly: 僅限步行 + TripOptions: + transitOnly: 公共交通 + queryParameters: + bikeSpeed: 自行車速度 + distanceInMiles: | + {miles, number, :: unit/mile unit-width-full-name} + maxBikeDistance: 最大自行車 + maxBikeTime: 最大自行車時間 + maxEScooterDistance: 最大電動滑板車距離 + maxWalkDistance: 最大步行 + maxWalkTime: 最大步行時間 + optimizeBikeFlat: 平坦的行程 + optimizeBikeFriendly: 適合自行車的行程 + optimizeBikeSpeed: 速度 + optimizeFor: 最佳化 + speedInMilesPerHour: "{mph} MPH" + walkReluctance: 避免步行 + walkReluctanceHigh: 更多公共交通 + walkReluctanceLow: 步行較多 + walkSpeed: 步行速度 + watts: 電動滑板車動力 + watts125kidsHoverboard: 兒童用漂浮滑板 (6 mph) + watts1500powerfulEscooter: 強力電動滑板車 (24 mph) + watts250entryLevelEscooter: 入門級電動滑板車 (11 mph) + watts500robustEscooter: 強大的電動滑板車 (18 mph) + wheelchair: 偏好可供輪椅進出的路線 diff --git a/packages/trip-form/package.json b/packages/trip-form/package.json index b2b16208e..249419fbd 100644 --- a/packages/trip-form/package.json +++ b/packages/trip-form/package.json @@ -1,6 +1,6 @@ { "name": "@opentripplanner/trip-form", - "version": "3.6.0", + "version": "3.6.2", "description": "Trip Settings Form and Related Components", "author": "@binh-dam-ibigroup", "homepage": "https://github.com/opentripplanner/otp-ui/#readme", diff --git a/packages/types/package.json b/packages/types/package.json index 7cfe8d07b..986804c71 100644 --- a/packages/types/package.json +++ b/packages/types/package.json @@ -1,6 +1,6 @@ { "name": "@opentripplanner/types", - "version": "6.5.0", + "version": "6.5.1", "description": "TypeScript types used across multiple OTP-UI packages", "main": "lib/index.js", "types": "lib/index.d.ts", diff --git a/yarn.lock b/yarn.lock index 09b8e2bf5..dbe0c1bd6 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3246,6 +3246,11 @@ resolved "https://registry.yarnpkg.com/@open-draft/until/-/until-1.0.3.tgz#db9cc719191a62e7d9200f6e7bab21c5b848adca" integrity sha512-Aq58f5HiWdyDlFffbbSjAlv596h/cOnt2DO1w3DOC7OJ5EHs0hd/nycJfiu9RJbT6Yk6F1knnRRXNSpxoIVZ9Q== +"@opentripplanner/types@6.5.0": + version "6.5.0" + resolved "https://registry.yarnpkg.com/@opentripplanner/types/-/types-6.5.0.tgz#d8cca355bf30f0984283faa793113ad6c0dba38d" + integrity sha512-FllEyE+1WQ2GOSKXQOuzrk+OPcJEqr4+zacsHQLB9WVyfm5D/BPHR1/OjfuVngrwLTK5bKP8VlDRS1ba/R8rtg== + "@peculiar/asn1-schema@^2.1.6", "@peculiar/asn1-schema@^2.3.0": version "2.3.3" resolved "https://registry.yarnpkg.com/@peculiar/asn1-schema/-/asn1-schema-2.3.3.tgz#21418e1f3819e0b353ceff0c2dad8ccb61acd777"