1 files changed, 83 insertions, 0 deletions
diff --git a/ui/app/css/itcss/components/account-dropdown.scss b/ui/app/css/itcss/components/account-dropdown.scss
new file mode 100644
index 000000000..725da9d39
--- /dev/null
+++ b/ui/app/css/itcss/components/account-dropdown.scss
@@ -0,0 +1,83 @@
+.account-dropdown-name {
+  font-family: Roboto;
+}
+
+.account-dropdown-balance {
+  color: $dusty-gray;
+  line-height: 19px;
+}
+
+.account-dropdown-edit-button {
+  color: $dusty-gray;
+  font-family: Roboto;
+
+  &:hover {
+    color: $white;
+  }
+}
+
+.account-list-item {
+  &__top-row {
+    display: flex;
+    margin-top: 10px;
+    margin-left: 8px;
+    position: relative;
+  }
+
+  &__account-balances {
+    height: auto;
+    border: none;
+    background-color: transparent;
+    color: #9b9b9b;
+    margin-left: 34px;
+    margin-top: 4px;
+    position: relative;
+  }
+  
+  &__account-name {
+    font-size: 16px;
+    margin-left: 8px;
+  }
+
+  &__icon {
+    position: absolute;
+    right: 12px;
+    top: 1px;
+  }
+
+  &__account-primary-balance,
+  &__account-secondary-balance {
+    font-family: Roboto;
+    line-height: 16px;
+    font-size: 12px;
+    font-weight: 300;
+  }
+
+  &__account-primary-balance {
+    color: $scorpion;
+    border: none;
+    outline: 0 !important;
+  }
+
+  &__account-secondary-balance {
+    color: $dusty-gray;
+  }
+
+  &__account-address {
+    margin-left: 35px;
+    width: 80%;
+    overflow: hidden;
+    text-overflow: ellipsis;
+  }
+
+  &__dropdown {
+    &:hover {
+      background: rgba($alto, .2);
+      cursor: pointer;
+
+      input {
+        background: rgba($alto, .1);
+      }
+    }
+  }
+}