appearance: some dialogs fixed

src/components/router/RouterDialog.jsx

@@ -27,7 +27,7 @@ const firstPoint = ({ routerCancel }: Props) => (
   <div className="helper router-helper">
     <div className="helper__text">
       <Icon icon="icon-pin-1" />
-      <div className="big white upper">Теперь - следующую</div>
+      <div className="big white upper">УКАЖИТЕ СЛЕДУЮЩУЮ ТОЧКУ</div>
     </div>
     <div className="helper__buttons">
       <div className="button router-helper__button" onClick={routerCancel}>

src/components/trash/TrashDialog.jsx

@@ -12,8 +12,9 @@ export const TrashDialog = ({
   clearPoly, clearStickers, clearAll, clearCancel
 }: Props) => (
   <div className="helper trash-helper">
-    <div className="helper__text">
+    <div className="helper__text danger">
-      <div className="big white upper">Уверены?</div>
+      <Icon icon="icon-trash-4" />
+      <div className="big upper">Уверены?</div>
     </div>
     <div className="helper__buttons">
       <div className="button-group">
@@ -23,7 +24,7 @@ export const TrashDialog = ({
         <div className="button router-helper__button" onClick={clearStickers}>
           Стикеры
         </div>
-        <div className="button danger router-helper__button" onClick={clearAll}>
+        <div className="button router-helper__button" onClick={clearAll}>
           Удалить все
         </div>
       </div>

src/index.html

@@ -3,7 +3,7 @@
   <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
   <meta name="viewport" content="initial-scale=1, maximum-scale=0.8">
   <link rel="icon" href="favicon.png?d" type="image/png" />
-  <link href="https://fonts.googleapis.com/css?family=PT+Sans+Narrow|PT+Sans:200,400,700|Rubik&amp;subset=cyrillic" rel="stylesheet">
+  <link href="https://fonts.googleapis.com/css?family=Rubik:300,400,500,700&amp;subset=cyrillic" rel="stylesheet">
   <title>@ORCHID</title>
 
   <link rel="shortcut icon" href="/favicon.png?wd" type="image/png">

src/styles/button.less

@@ -12,7 +12,7 @@
   user-select: none;
   box-shadow: inset rgba(100,100,100, 0.3) 1px 0, inset rgba(0,0,0, 0.1) -1px 0;
   color: white;
-  font-weight: 200;
+  font-weight: 400;
 
   &.primary {
     background: #3c78db;

src/styles/colors.less

@@ -19,3 +19,4 @@
 
 @color_primary: #4597d0;
 @color_success: #7cd766;
+@color_danger: #ff3344;

src/styles/main.less

@@ -14,6 +14,8 @@ body {
   font-size: 15px;
   // letter-spacing: 0.4px;
   padding: 0;
+  font-weight: 400;
+  -webkit-font-smoothing: antialiased;
 }
 
 .gray {
@@ -22,6 +24,7 @@ body {
 
 .big {
   font-size: 1em;
+  font-weight: 500;
 }
 
 .upper {
@@ -43,3 +46,7 @@ body {
 .primary {
   color: @color_primary;
 }
+
+.danger {
+  color: @color_danger;
+}

src/styles/panel.less

@@ -77,7 +77,7 @@
     span {
       margin-right: 8px;
       font-size: 14px;
-      font-weight: 200;
+      font-weight: 500;
       margin-left: 8px;
     }
 
@@ -174,6 +174,7 @@
   svg {
     fill: white;
     width: 24px;
+    height: 24px;
     margin-right: 6px;
   }
 
@@ -184,6 +185,22 @@
       fill: @color_success;
     }
   }
+
+  &.primary {
+    color: @color_danger;
+
+    svg {
+      fill: @color_danger;
+    }
+  }
+
+  &.danger {
+    color: @color_danger;
+
+    svg {
+      fill: @color_danger;
+    }
+  }
 }
 
 .helper__buttons {