Survey (#328)

Elements promoting the survey inside Maputnik

src/styles/_base.scss

@@ -80,3 +80,7 @@ a {
 .hide {
   display: none !important;
 }
+
+.green {
+  color: $color-green;
+}

src/styles/_components.scss

@@ -56,6 +56,7 @@
   border-width: 0;
   border-radius: 2px;
   box-sizing: border-box;
+  text-decoration: none;
 
   &:hover {
     background-color: lighten($color-midgray, 12);
@@ -70,6 +71,25 @@
   font-size: $font-size-5;
 }
 
+.maputnik-wide-button {
+  padding: $margin-2 $margin-3;
+}
+
+.maputnik-green-button {
+  background-color: $color-green;
+  color: $color-black;
+}
+
+.maputnik-green-hover-button:hover, .maputnik-green-hover-button:focus {
+  background-color: $color-green;
+  color: $color-white;
+}
+
+.maputnik-white-button {
+  background-color: $color-white;
+  color: $color-black;
+}
+
 .maputnik-icon-button {
   background-color: transparent;
 
@@ -135,9 +155,3 @@
     color: $color-red;
   }
 }
-
-.maputnik-dialog {
-  &__buttons {
-    text-align: right;
-  }
-}

src/styles/_toolbar.scss

@@ -57,6 +57,33 @@
   }
 }
 
+.maputnik-toolbar-link--highlighted {
+  color: $color-green; 
+}
+
+.maputnik-toolbar-link--highlighted2 {
+  line-height: 1;
+  padding: $margin-2 $margin-3;
+
+  .maputnik-toolbar-link-wrapper {
+    background-color: $color-white;
+    border-radius: 2px;
+    padding: $margin-2;
+    margin-top: $margin-1;
+    color: $color-black;
+    display: block;
+  }
+
+  &:hover {
+    background-color: $color-black;
+  }
+
+  &:hover .maputnik-toolbar-link-wrapper {
+    background-color: $color-green;
+    color: $color-white;
+  }
+}
+
 .maputnik-toolbar-version {
   font-size: 10px;
   margin-left: 4px;

src/styles/index.scss

@@ -4,6 +4,7 @@ $color-midgray: #36383e;
 $color-lowgray: #8e8e8e;
 $color-white: #f0f0f0;
 $color-red: #cf4a4a;
+$color-green: #53b972;
 $margin-1: 3px;
 $margin-2: 5px;
 $margin-3: 10px;