stars at route-row-view

.eslintrc

@@ -30,7 +30,7 @@
     "prefer-promise-reject-errors": 0,
     "jsx-a11y/mouse-events-have-key-events": 0,
     "camelcase": 0,
-    "no-trailing-spaces": 0,
+    "no-trailing-spaces": 0
   },
   "globals": {
     "document": false,
@@ -41,7 +41,7 @@
     "FormData": false,
     "WebSocket": true,
     "Element": true,
-    "localStorage": true,
+    "localStorage": true
   },
   "env": {},
   "settings": {

src/components/maps/RouteRowView.tsx

@@ -37,8 +37,8 @@ export const RouteRowView = ({
       <div className="route-row-fav" onClick={toggleStarred.bind(null, _id)}>
         {
           is_starred
-            ? <Icon icon="icon-star-fill" size={24}/>
+            ? <Icon icon="icon-star-fill" size={24} />
-            : <Icon icon="icon-star-blank" size={24}/>
+            : <Icon icon="icon-star-blank" size={24} />
         }
       </div>
     }
@@ -47,6 +47,10 @@ export const RouteRowView = ({
       onClick={() => openRoute(_id)}
     >
       <div className="route-title">
+        {
+          (tab === 'all' || tab === 'starred') && is_starred && !is_admin &&
+          <Icon icon="icon-star-fill" size={18} />
+        }
         <span>{(title || _id)}</span>
       </div>
 

src/styles/dialogs.less

@@ -337,68 +337,21 @@
 
 }
 
-//.route-row-panel {
-//  position: absolute;
-//  top: 100%;
-//  height: 32px;
-//  width: 100%;
-//  left: 0;
-//  background: mix(@dialog_background, white, 80%);
-//  border-radius: 0 0 @panel_radius @panel_radius;
-//  z-index: 1;
-//  transform: scaleY(0);
-//  pointer-events: none;
-//  touch-action: none;
-//  transition: transform 250ms;
-//  transform-origin: 0 0;
-//  padding: 0 5px;
-//  box-sizing: border-box;
-//  // display: flex;
-//  align-items: center;
-//  fill: white;
-//
-//  display: none;
-//
-//  & > div {
-//    display: flex;
-//    align-items: center;
-//
-//    svg {
-//      margin-right: 2px;
-//    }
-//  }
-//}
-//
-//.route-row-edit {
-//  fill: rgba(255, 255, 255, 0.3);
-//  right: -48px;
-//  padding-left: 0px;
-//  stroke: none;
-//  position: absolute;
-//  top: 0;
-//  width: 58px;
-//  height: 100%;
-//  transition: all 500ms;
-//  display: flex;
-//  align-items: center;
-//  justify-content: center;
-//  cursor: pointer;
-//
-//  &:hover {
-//    fill: @green_secondary;
-//  }
-//}
-
 .route-title {
   margin-bottom: 5px;
   font-weight: bold;
 
   text-overflow: ellipsis;
   overflow: hidden;
-  //white-space: nowrap;
   position: relative;
   max-height: 2.4em;
   word-break: break-word;
+  display: flex;
+
+  svg {
+    fill: fade(white, 50%);
+    margin-right: 2px;
+  }
 }
 
 .route-description {

tsconfig.json

@@ -28,6 +28,6 @@
   "include": [
     "./src/**/*",
     "./backend/**/*",
-    "./custom.d.ts",
+    "./custom.d.ts"
   ]
 }