Skip to content
This repository was archived by the owner on Oct 27, 2022. It is now read-only.

Commit bf6f55d

Browse files
author
Nick Kozlov
committed
refactor css
1 parent 01dda3d commit bf6f55d

File tree

5 files changed

+174
-43
lines changed

5 files changed

+174
-43
lines changed

‎angular/dist/bnbbrowser/index.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -9,5 +9,5 @@
99
<link rel="stylesheet" href="styles.9b5e5c7ed5f939436c31.css"></head>
1010
<body>
1111
<app-root></app-root>
12-
<script src="runtime.741402d1d47331ce975c.js"></script><script src="polyfills-es5.7f9896f05667ed1b2b2b.js" nomodule></script><script src="polyfills.4ff4d4d37857c508ba08.js"></script><script src="scripts.c1872b03322eabb9e005.js"></script><script src="main.0adb2a12aa3dbcd41540.js"></script></body>
12+
<script src="runtime.741402d1d47331ce975c.js"></script><script src="polyfills-es5.7f9896f05667ed1b2b2b.js" nomodule></script><script src="polyfills.4ff4d4d37857c508ba08.js"></script><script src="scripts.c1872b03322eabb9e005.js"></script><script src="main.ab89458c123ee71caddc.js"></script></body>
1313
</html>

‎angular/dist/bnbbrowser/main.0adb2a12aa3dbcd41540.js renamed to ‎angular/dist/bnbbrowser/main.ab89458c123ee71caddc.js

+1-1
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎angular/src/app/app.module.ts

+2-3
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@ import { HistoryComponentComponent } from './history-component/history-component
1919
import {StorageService} from "./services/storage.service";
2020
import { UnlockComponent } from './unlock/unlock.component';
2121
import { EditFormComponent } from './edit-form/edit-form.component';
22-
import { UsersListComponent } from './users-list/users-list.component';
22+
2323

2424
@NgModule({
2525
declarations: [
@@ -32,8 +32,7 @@ import { UsersListComponent } from './users-list/users-list.component';
3232
ImportMnemonicComponent,
3333
HistoryComponentComponent,
3434
UnlockComponent,
35-
EditFormComponent,
36-
UsersListComponent
35+
EditFormComponent
3736
],
3837
imports: [
3938
BrowserModule,

‎angular/src/app/main/main.component.css

+142-2
Original file line numberDiff line numberDiff line change
@@ -41,6 +41,50 @@
4141
transform: rotate(180deg);
4242
}
4343

44+
#top-account-col {
45+
background: rgb(33, 40, 51);
46+
border-bottom-left-radius: 2px;
47+
z-index: 9999 !important;
48+
border-bottom-right-radius: 2px
49+
}
50+
51+
#menuUsers {
52+
color: rgb(132, 142, 156);;
53+
margin-right: -2em;
54+
font-size: 10px !important
55+
}
56+
57+
#users-wrapper {
58+
margin-top: 2em;
59+
margin-left: 0.2em;
60+
margin-right: 1.2em
61+
}
62+
63+
#AccountsHeader {
64+
font-weight: bold;
65+
color: white;
66+
white-space: nowrap;
67+
margin-top: 1.2em
68+
}
69+
70+
#logOut {
71+
margin-top: 0.5em !important
72+
}
73+
74+
#logOutBtn {
75+
margin-left: -15px
76+
}
77+
78+
.pop-hr {
79+
border: 1px solid white
80+
}
81+
82+
#scrollableUsers {
83+
height: 200px !important;
84+
position: fixed;
85+
overflow-y: scroll;
86+
}
87+
4488
.tooltip-wrapper {
4589
padding: 4px;
4690
background: rgba(0, 0, 0, 0.7);
@@ -55,6 +99,102 @@
5599
z-index: 9999;
56100
}
57101

102+
#bottom-users {
103+
margin-top: 13em
104+
}
105+
106+
#networkBtn {
107+
color: white;
108+
width: 155px !important;
109+
margin-top: 1.85em;
110+
border-radius: 15px;
111+
background: linear-gradient(90deg, rgb(239, 184, 11) 0%, rgb(251, 218, 60) 100%) !important;
112+
border: 1.47px solid rgb(240, 185, 11);
113+
max-width: 155px !important;
114+
line-height: 1 !important;
115+
font-weight: bold
116+
}
117+
118+
#NetworkWord {
119+
color: rgb(33, 40, 51);
120+
}
121+
122+
#editIcon {
123+
font-size: 12px !important
124+
}
125+
126+
#unusualHr {
127+
width: 100%;
128+
margin-top: -0.65em;
129+
border: 1px solid #c5c5c5;
130+
border-radius: 15px;
131+
margin-right: 2em;
132+
margin-left: 2em
133+
}
134+
135+
#imageBNB {
136+
margin-top: 1.5em;
137+
-webkit-user-drag: none;
138+
-khtml-user-drag: none;
139+
-moz-user-drag: none;
140+
-o-user-drag: none;
141+
user-drag: none;
142+
-webkit-user-select: none;
143+
-khtml-user-select: none;
144+
-moz-user-select: none;
145+
-o-user-select: none;
146+
user-select: none;
147+
}
148+
149+
.bold {
150+
font-weight: bold;
151+
}
152+
153+
#fiat {
154+
font-weight: bold;
155+
margin-top: -1em;
156+
margin-bottom: 0px;
157+
color: grey;
158+
font-size: 16px !important
159+
}
160+
161+
#more {
162+
font-weight: bold;
163+
color: grey;
164+
margin-top: 0em;
165+
text-decoration: underline;
166+
font-size: 13px
167+
}
168+
169+
.main-btn {
170+
width: 9.5em !important;
171+
margin-right: 0.25em;
172+
}
173+
174+
#historyDiv, #buttonsDiv {
175+
margin-top: 1.5em
176+
}
177+
178+
#historyP {
179+
margin-bottom: 0;
180+
font-weight: bold;
181+
color: #5a5a5a;
182+
font-size: 16px
183+
}
184+
185+
#unusualHrSecond {
186+
width: 100% !important;
187+
border: 1px solid #c5c5c5;
188+
margin-left: 3em !important;
189+
margin-right: 3em;
190+
margin-top: 0.5em;
191+
}
192+
193+
#col-hist {
194+
margin: 0 !important;
195+
padding: 0 !important
196+
}
197+
58198
button#addressButton.btn.btn-sm.btn-link.hover-anchor {
59199

60200
}
@@ -104,7 +244,7 @@ button#addressButton.btn.btn-sm.btn-link.hover-anchor {
104244
.menu-wrapper-users {
105245
margin-top: 4em;
106246
margin-left: -4px;
107-
border: rgba(11, 14, 17, 0.9);
247+
border: rgba(11, 14, 17, 0.9);
108248
background: rgba(11, 14, 17, 0.9);
109249
max-width: 300px !important;
110250
width: 290px !important;
@@ -130,6 +270,6 @@ button#addressButton.btn.btn-sm.btn-link.hover-anchor {
130270

131271
.menu-item-users:hover {
132272
font-size: 23px;
133-
color: rgb(239, 184, 11);
273+
color: rgb(239, 184, 11);
134274
font-weight: bold;
135275
}

‎angular/src/app/main/main.component.html

+28-36
Original file line numberDiff line numberDiff line change
@@ -1,45 +1,40 @@
11
<div class="container">
2-
<div style="background:rgb(33, 40, 51); border-bottom-left-radius: 2px;z-index: 9999 !important; border-bottom-right-radius: 2px"
2+
<div id="top-account-col"
33
class="row text-center">
44
<div class="col" align="left">
55
<button [satPopoverAnchor]="menuUsers" (click)="updateUsersList(); menuUsers.toggle()"
6-
class="btn btn-link btn-just-icon btn-lg"
7-
style="color: rgb(132, 142, 156);; margin-right:-2em; font-size: 10px !important" href="/main">
6+
class="btn btn-link btn-just-icon btn-lg" id="menuUsers" href="/main">
87
<fa name="users" size="sm"></fa>
98
</button>
109
<sat-popover #menuUsers horizontalAlign="center" verticalAlign="center">
11-
<div style="z-index: 300" class="menu-wrapper-users" tabIndex="0">
10+
<div class="menu-wrapper-users" tabIndex="0">
1211
<div class="container">
13-
<div style="margin-top: 2em; margin-left: 0.2em; margin-right: 1.2em" class="row">
14-
<div style="font-weight: bold; color: white; white-space: nowrap; margin-top: 1.2em"
15-
align="left"
16-
class="col-8">
12+
<div id="users-wrapper" class="row">
13+
<div id="AccountsHeader" align="left" class="col-8">
1714
My Accounts
1815
</div>
19-
<div style="margin-top: 0.5em !important" align="right" class="col-4">
20-
<button style="margin-left: -10px" class="btn btn-binance-outline btn-sm">Log out
16+
<div id="logOut" align="right" class="col-4">
17+
<button id="logOutBtn" class="btn btn-binance-outline btn-sm">Log out
2118
</button>
2219
</div>
2320
</div>
24-
<hr style="border: 1px solid white">
21+
<hr class="pop-hr">
2522
</div>
26-
<div style="height: 200px !important; position:fixed;
27-
overflow-y:scroll;" class="container">
23+
<div id="scrollableUsers" class="container">
2824
<div class="row">
2925
<div class="col-12">
30-
<button *ngFor="let item of usersMenu"
31-
class="menu-item-users"
26+
<button *ngFor="let item of usersMenu" class="menu-item-users"
3227
(click)="selectUser(item.val); menuUsers.toggle()">
3328
<button class="btn btn-just-icon"> {{item.val.charAt(0).toUpperCase()}}</button>
3429
{{ item.val }}
3530
</button>
3631
</div>
3732
</div>
3833
</div>
39-
<div style="margin-top: 13em" class="container">
34+
<div id="bottom-users" class="container">
4035
<div class="row">
4136
<div class="col-12">
42-
<hr style="border: 1px solid white">
37+
<hr class="pop-hr">
4338
<button class="menu-item-users">
4439
<fa name="plus" size="sm"></fa>
4540
Create Account
@@ -57,10 +52,9 @@
5752
<div class="col">
5853
<button [satPopoverAnchor]="menuNetwork" (click)="menuNetwork.toggle()"
5954
class="btn btn-link btn-outline btn-sm"
60-
style="color: white; width: 155px !important; margin-top: 1.85em; border-radius: 15px; background: linear-gradient(90deg, rgb(239, 184, 11) 0%, rgb(251, 218, 60) 100%) !important; border: 1.47px solid rgb(240, 185, 11); max-width: 155px !important; line-height: 1 !important; font-weight: bold"
61-
href="/main">
62-
<strong style="color:rgb(33, 40, 51);">Network:</strong> {{ this.selectedNetwork }}
63-
<fa style="font-weight: 900 !important;" name="caret-down" size="sm"></fa>
55+
href="/main" id="networkBtn">
56+
<strong id="NetworkWord">Network:</strong> {{ this.selectedNetwork }}
57+
<fa name="caret-down" size="sm"></fa>
6458
</button>
6559
<sat-popover #menuNetwork horizontalAlign="center" verticalAlign="center">
6660
<div class="menu-wrapper" tabIndex="0">
@@ -82,7 +76,7 @@
8276
<div class="col-12">
8377
<button [satPopoverAnchor]="name" (click)="name.open()" class="btn btn-sm btn-link" id="editButton">
8478
{{this.accountName}}
85-
<fa style="font-size: 12px !important" id="editIcon" name="edit" size="sm"></fa>
79+
<fa id="editIcon" name="edit" size="sm"></fa>
8680
</button>
8781
<br>
8882
<button [satPopoverAnchor]="p"
@@ -105,35 +99,33 @@
10599
<sat-popover #name hasBackdrop forceAlignment>
106100
<app-edit-form (update)="this.accountName = $event"></app-edit-form>
107101
</sat-popover>
108-
<hr style="width: 100%; margin-top: -0.65em; border: 1px solid #c5c5c5; border-radius: 15px; margin-right: 2em; margin-left: 2em">
102+
<hr id="unusualHr">
109103
<div class="col-12">
110-
<img style="margin-top: 1.5em; -webkit-user-drag: none; -khtml-user-drag: none; -moz-user-drag: none;-o-user-drag: none; user-drag: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -o-user-select: none; user-select: none;"
104+
<img id="imageBNB"
111105
draggable="false" width="48" src="../../assets/icons/icon128.png">
112-
<h3 style="font-weight: bold;">{{(bnb$ | async) || 'pending'}}</h3>
113-
<h4 style="font-weight: bold; margin-top: -1em;margin-bottom: 0px; color: grey; font-size:16px !important">
106+
<h3 class="bold">{{(bnb$ | async) || 'pending'}}</h3>
107+
<h4 id="fiat">
114108
{{(fiat$ | async) || 'pending'}}
115109
</h4>
116-
<a style="font-weight: bold; color: grey; margin-top: 0em; text-decoration: underline; font-size: 13px">More
110+
<a id="more">More
117111
balances</a>
118112
</div>
119-
<div style="margin-top: 1.5em" class="col-12">
120-
<button style="width: 9.5em !important; margin-right: 0.25em;" class="btn btn-binance-outline btn-lg">
113+
<div id="buttonsDiv" class="col-12">
114+
<button class="btn btn-binance-outline btn-lg main-btn">
121115
RECEIVE
122116
</button>
123-
<button style="width: 9.5em !important; margin-left: 0.25em;" class="btn btn-binance-outline btn-lg">SEND
117+
<button class="btn btn-binance-outline btn-lg main-btn">SEND
124118
</button>
125119
</div>
126-
127120
</div>
128-
129121
<div class="row">
130-
<div style="margin-top: 1.5em" align="center" class="col-12">
131-
<p style="margin-bottom: 0; font-weight: bold; color: #5a5a5a; font-size: 16px">History</p>
122+
<div id="historyDiv" align="center" class="col-12">
123+
<p id="historyP">History</p>
132124
</div>
133-
<hr style="width: 100% !important; border: 1px solid #c5c5c5; margin-left: 3em !important; margin-right: 3em; margin-top: 0.5em;">
125+
<hr id="unusualHrSecond">
134126
</div>
135127
<div class="row">
136-
<div style="margin: 0 !important; padding: 0 !important" class="col-12">
128+
<div id="col-hist" class="col-12">
137129
<app-history-component></app-history-component>
138130
</div>
139131
</div>

0 commit comments

Comments
 (0)