transit-departures-widget 2.0.0

package/public/css/transit-departures-widget-styles.css

@@ -0,0 +1,200 @@
+/* General Styles */
+
+body {
+  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
+  font-size: 14px;
+  line-height: 1.4;
+  color: #333333;
+  background-color: #ffffff;
+}
+
+.transit-departures-widget {
+  max-width: 600px;
+}
+
+.transit-departures-widget .hidden-form {
+  display: none;
+}
+
+.transit-departures-widget .stop-code-invalid {
+  display: none;
+  color: #821515;
+  padding-bottom: 10px;
+}
+
+.transit-departures-widget .departure-results {
+  display: none;
+  margin-top: 25px;
+}
+
+.transit-departures-widget .departure-results-none {
+  display: none;
+  margin-top: 10px;
+}
+
+.transit-departures-widget .departure-results-error {
+  display: none;
+  margin-top: 10px;
+  color: #821515;
+}
+
+.transit-departures-widget .departure-results-stop,
+.transit-departures-widget .departure-results-stop-unknown {
+  font-size: 24px;
+  line-height: 1;
+}
+
+.transit-departures-widget .departure-result {
+  background-color: #eee;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  margin-top: 8px;
+}
+
+.transit-departures-widget .departure-results-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: flex-end;
+}
+
+.transit-departures-widget .departure-results-fetchtime {
+  flex-shrink: 0;
+  font-size: 12px;
+  margin-left: 8px;
+  padding: 0 0 0 15px;
+  border: none;
+  background-color: transparent;
+  background-image: url('../img/refresh.svg');
+  background-repeat: no-repeat;
+  background-size: 12px 12px;
+  background-position-y: 1px;
+}
+
+.transit-departures-widget .departure-results-fetchtime:hover {
+  text-decoration: underline;
+}
+
+.transit-departures-widget .departure-result-route-name {
+  display: flex;
+  align-items: center;
+  line-height: 1;
+}
+
+.transit-departures-widget .departure-result-route-direction {
+  font-size: 22px;
+  margin-top: 2px;
+}
+
+.transit-departures-widget .departure-result-route-circle {
+  margin: 5px 9px 5px;
+  width: 30px;
+  height: 30px;
+  border-radius: 50%;
+  line-height: 30px;
+  text-align: center;
+  flex-shrink: 0;
+  overflow: hidden;
+}
+
+.transit-departures-widget .departure-result-times {
+  display: flex;
+  align-items: stretch;
+  flex-shrink: 0;
+  align-self: stretch;
+}
+
+.transit-departures-widget .departure-result-time-container {
+  padding: 0 5px;
+  width: 76px;
+  border-left: 1px solid #ddd;
+  align-self: stretch;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex-shrink: 0;
+  flex-grow: 0;
+}
+
+.transit-departures-widget .departure-result-time {
+  font-size: 24px;
+}
+
+.transit-departures-widget .departure-result-time-label {
+  font-size: 14px;
+  padding-left: 2px;
+}
+
+.transit-departures-widget .loader,
+.transit-departures-widget .loader:after {
+  border-radius: 50%;
+  width: 10em;
+  height: 10em;
+}
+
+.transit-departures-widget .loader {
+  margin: 20px auto;
+  font-size: 10px;
+  position: relative;
+  text-indent: -9999em;
+  border-top: 1.1em solid rgba(79, 79, 79, 0.2);
+  border-right: 1.1em solid rgba(79, 79, 79, 0.2);
+  border-bottom: 1.1em solid rgba(79, 79, 79, 0.2);
+  border-left: 1.1em solid #4f4f4f;
+  -webkit-transform: translateZ(0);
+  -ms-transform: translateZ(0);
+  transform: translateZ(0);
+  -webkit-animation: transitDeparturesWidgetLoader 1.1s infinite linear;
+  animation: transitDeparturesWidgetLoader 1.1s infinite linear;
+  display: none;
+}
+
+@-webkit-keyframes transitDeparturesWidgetLoader {
+  0% {
+    -webkit-transform: rotate(0deg);
+    transform: rotate(0deg);
+  }
+  100% {
+    -webkit-transform: rotate(360deg);
+    transform: rotate(360deg);
+  }
+}
+
+@keyframes transitDeparturesWidgetLoader {
+  0% {
+    -webkit-transform: rotate(0deg);
+    transform: rotate(0deg);
+  }
+  100% {
+    -webkit-transform: rotate(360deg);
+    transform: rotate(360deg);
+  }
+}
+
+.autocomplete {
+  background: white;
+  z-index: 1000;
+  overflow: auto;
+  box-sizing: border-box;
+  border: 1px solid rgba(0, 0, 0, 0.125);
+}
+
+.autocomplete * {
+  font: inherit;
+}
+
+.autocomplete > div {
+  padding: 4px 4px;
+}
+
+.autocomplete .group {
+  background: #eee;
+}
+
+.autocomplete > div:hover:not(.group),
+.autocomplete > div.selected {
+  background: #007bff;
+  color: #fff;
+  font-weight: bold;
+  cursor: pointer;
+}

package/public/img/refresh.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" x="0px" y="0px" viewBox="0 0 256 256" style="enable-background:new 0 0 256 256;" xml:space="preserve"><path d="M226.74,199.28c-0.76,0.48-1.68,0.49-2.46,0.04l-16.82-9.7l-1.08,1.29c-19.26,23.11-47.55,36.37-77.61,36.37  c-48.57,0-90.32-34.6-99.26-82.27c-0.43-2.31,0.18-4.68,1.69-6.5c1.53-1.85,3.78-2.91,6.18-2.91H50.9c3.77,0,6.98,2.59,7.81,6.3  c3.49,15.69,12.32,29.94,24.87,40.12c12.73,10.33,28.78,16.02,45.21,16.02c19.4,0,37.57-7.62,51.17-21.45l1.81-1.84l-15.56-8.98  c-0.78-0.45-1.22-1.25-1.19-2.15c0.03-0.9,0.54-1.67,1.35-2.05l53.59-25.73c0.71-0.35,1.52-0.32,2.21,0.08  c0.69,0.4,1.12,1.08,1.18,1.88l4.51,59.27C227.92,197.99,227.5,198.81,226.74,199.28z"></path><path d="M226.03,119.33c-1.53,1.85-3.78,2.91-6.18,2.91h-13.51c-3.77,0-6.98-2.59-7.81-6.3c-3.49-15.69-12.32-29.94-24.87-40.12  c-12.73-10.33-28.78-16.02-45.21-16.02c-19.4,0-37.57,7.62-51.17,21.45l-1.81,1.84l15.56,8.98c0.78,0.45,1.22,1.25,1.19,2.15  c-0.03,0.9-0.54,1.67-1.35,2.05L37.29,122c-0.71,0.35-1.52,0.32-2.21-0.08c-0.69-0.4-1.12-1.08-1.18-1.88l-4.51-59.27  c-0.07-0.9,0.35-1.72,1.11-2.2s1.68-0.49,2.46-0.04l16.82,9.7l1.08-1.29c19.26-23.11,47.55-36.37,77.61-36.37  c48.57,0,90.32,34.6,99.26,82.27C228.15,115.14,227.54,117.51,226.03,119.33z"></path></svg>