feat(riot-mui): set material-icon size to 24px globally

Author: Joxit

src/style.scss

@@ -29,13 +29,14 @@
 
 @import './roboto.scss';
 @import './material-icons.scss';
- 
+
 html > body {
   font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif !important;
   font-size: 16px;
 }
 
-html, body {
+html,
+body {
   margin: 0;
   height: 100%;
 }
@@ -70,7 +71,7 @@ pagination .container {
 }
 
 /* 1515px * 0.95 = 1440px */
-@media screen and (min-width: 1515px){
+@media screen and (min-width: 1515px) {
   material-card,
   material-tabs,
   pagination .container {
@@ -80,11 +81,11 @@ pagination .container {
 
 material-tabs {
   display: block;
-  -webkit-box-shadow: 0 2px 5px 0 rgba(0,0,0,.16), 0 2px 10px 0 rgba(0,0,0,.12);
-  -ms-box-shadow: 0 2px 5px 0 rgba(0,0,0,.16),0 2px 10px 0 rgba(0,0,0,.12);
-  -moz-box-shadow: 0 2px 5px 0 rgba(0,0,0,.16),0 2px 10px 0 rgba(0,0,0,.12);
-  -o-box-shadow: 0 2px 5px 0 rgba(0,0,0,.16),0 2px 10px 0 rgba(0,0,0,.12);
-  box-shadow: 0 2px 5px 0 rgba(0,0,0,.16), 0 2px 10px 0 rgba(0,0,0,.12);
+  -webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
+  -ms-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
+  -moz-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
+  -o-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
+  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
 }
 
 material-tabs material-button,
@@ -114,7 +115,7 @@ material-spinner {
   text-decoration: none;
   font-size: 20px;
   line-height: 1;
-  letter-spacing: .02em;
+  letter-spacing: 0.02em;
   font-weight: 400;
 }
 
@@ -153,18 +154,22 @@ h2 {
   overflow: hidden;
 }
 
+docker-registry-ui material-button > :first-child .content i.material-icons,
+docker-registry-ui material-button > :first-child .content i.material-icons.material-icons {
+  font-size: 24px;
+}
+
 .list > span i.material-icons,
 .list > li i.material-icons {
   margin-right: 32px;
   height: 24px;
   width: 24px;
-  font-size: 24px;
   box-sizing: border-box;
   color: #757575;
 }
 
 .list > span .right i.material-icons.animated {
-  transition: all 350ms cubic-bezier(.4,0,.2,1);
+  transition: all 350ms cubic-bezier(0.4, 0, 0.2, 1);
   margin-right: 10px;
 }
 
@@ -221,7 +226,7 @@ material-card table {
   width: 100%;
   border: none;
   position: relative;
-  border: 1px solid rgba(0, 0, 0, .12);
+  border: 1px solid rgba(0, 0, 0, 0.12);
   border-collapse: collapse;
   white-space: nowrap;
   font-size: 13px;
@@ -234,7 +239,7 @@ material-card table th {
   vertical-align: bottom;
   line-height: 24px;
   height: 48px;
-  color: rgba(0, 0, 0, .54);
+  color: rgba(0, 0, 0, 0.54);
   box-sizing: border-box;
   padding: 0 18px 12px 18px;
   text-align: right;
@@ -252,8 +257,8 @@ material-card table tbody tr:hover {
 
 material-button > :first-child[inverted='true'],
 material-card table tbody tr {
-  transition-duration: .28s;
-  transition-timing-function: cubic-bezier(.4, 0, .2, 1);
+  transition-duration: 0.28s;
+  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
   transition-property: background-color;
 }
 
@@ -266,36 +271,39 @@ material-card table td {
   font-size: 16px;
   position: relative;
   height: 48px;
-  border-top: 1px solid rgba(0, 0, 0, .12);
-  border-bottom: 1px solid rgba(0, 0, 0, .12);
+  border-top: 1px solid rgba(0, 0, 0, 0.12);
+  border-bottom: 1px solid rgba(0, 0, 0, 0.12);
   padding: 12px 18px;
   box-sizing: border-box;
   vertical-align: middle;
   text-align: right;
 }
 
 tag-history-button button:hover,
-material-card table th.material-card-th-sorted-ascending:hover, material-card table th.material-card-th-sorted-descending:hover {
+material-card table th.material-card-th-sorted-ascending:hover,
+material-card table th.material-card-th-sorted-descending:hover {
   cursor: pointer;
 }
 
-material-card table th.material-card-th-sorted-ascending:hover:before, material-card table th.material-card-th-sorted-descending:hover:before {
-  color: rgba(0, 0, 0, .26);
+material-card table th.material-card-th-sorted-ascending:hover:before,
+material-card table th.material-card-th-sorted-descending:hover:before {
+  color: rgba(0, 0, 0, 0.26);
 }
 
-material-card table th.material-card-th-sorted-ascending:before, material-card table th.material-card-th-sorted-descending:before {
+material-card table th.material-card-th-sorted-ascending:before,
+material-card table th.material-card-th-sorted-descending:before {
   font-family: 'Material Icons';
   font-weight: 400;
   font-style: normal;
   line-height: 1;
   font-size: 16px;
-  content: "\e5d8";
+  content: '\e5d8';
   margin-right: 5px;
   vertical-align: sub;
 }
 
 material-card table th.material-card-th-sorted-descending:before {
-  content: "\e5db";
+  content: '\e5db';
 }
 
 material-button .content i.material-icons,
@@ -313,7 +321,7 @@ material-snackbar .toast {
 }
 
 material-popup material-button:hover material-waves {
-  background-color: hsla(0, 0%, 75%, .2);
+  background-color: hsla(0, 0%, 75%, 0.2);
 }
 
 material-popup .popup > .content {
@@ -343,7 +351,8 @@ material-footer {
   /* 5 + 2 + 3 + 24 + 3 + 2 + 18 */
   padding-right: 57px;
 }
-image-tag, .copy-to-clipboard {
+image-tag,
+.copy-to-clipboard {
   display: inline-block;
 }
 image-content-digest {
@@ -396,7 +405,7 @@ catalog-element material-card {
 }
 
 catalog-element catalog-element material-card {
-  transition: all 350ms cubic-bezier(.4,0,.2,1);
+  transition: all 350ms cubic-bezier(0.4, 0, 0.2, 1);
   z-index: 1;
   position: relative;
 }
@@ -411,7 +420,7 @@ catalog-element catalog-element > .content {
   margin-left: 3em;
 }
 
-@media screen and (min-width: 1515px){
+@media screen and (min-width: 1515px) {
   catalog-element catalog-element > .content material-card {
     max-width: calc(1440px - 3em);
   }