Skip to content

Commit caa18b5

Browse files
tmunzer-AIDEtmunzer-AIDE
committed
scss cleanup and other improvements
1 parent a3c8583 commit caa18b5

57 files changed

Lines changed: 1246 additions & 1230 deletions

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

‎angular/package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "mist-extension",
3-
"version": "5.0.0",
3+
"version": "4.0.0",
44
"description": "Generated with @larscom/ng-mist-extension",
55
"scripts": {
66
"start": "npm run watch",

‎angular/src/app/app.component.scss‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -58,13 +58,13 @@ button.bottom {
5858
}
5959

6060
button.bottom.selected {
61-
color: #63b4ee;
61+
color: var(--primary) ;
6262
transition: all 0.2s ease-in-out;
6363
box-shadow: rgba(50, 50, 93, 0.25) 0px 30px 60px -12px inset, rgba(0, 0, 0, 0.3) 0px 18px 36px -18px inset;
6464
}
6565

6666
button.bottom:not(.selected):hover {
67-
color: #63b4ee;
67+
color: var(--primary) ;
6868
transition: all 0.2s ease-in-out;
6969
box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
7070
}

‎angular/src/app/pages/about/about.component.html‎

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11

22

3-
<div class="content no-grow">
3+
<div class="content">
44
<h2>Extension information</h2>
5-
<div class="box-version">
5+
<div class="content data-container box-version">
66
<div class="version-info">
77
<div class="version-text">Current Version:</div>
88
<div class="version-value">{{current_version}}</div>
@@ -29,17 +29,17 @@ <h2>Extension information</h2>
2929
</div>
3030
</div>
3131
</div>
32-
<div class="box-links">
32+
<div class="links-container">
3333
<button class="links xlarge" (click)="openTab('github')">
3434
<div>Github Page</div>
3535
<img class="icon-open" src="assets/open.svg" alt="open">
3636
</button>
3737
</div>
3838
</div>
3939

40-
<div class="content no-grow">
40+
<div class="content">
4141
<h2>Mist API Documentation</h2>
42-
<div class="box-links">
42+
<div class="links-container">
4343
<button class="links xlarge" (click)="openTab('openapi')">
4444
<div>API Documentation</div>
4545
<img class="icon-open" src="assets/open.svg" alt="open">
@@ -51,9 +51,9 @@ <h2>Mist API Documentation</h2>
5151
</div>
5252
</div>
5353

54-
<div class="content no-grow">
54+
<div class="content">
5555
<h2>Mist Integrations</h2>
56-
<div class="box-links">
56+
<div class="links-container">
5757
<button class="links xlarge" (click)="openTab('https://store.servicenow.com/sn_appstore_store.do#!/store/search?q=juniper')">
5858
<div>Servicenow</div>
5959
<img class="icon-open" src="assets/open.svg" alt="open">

‎angular/src/app/pages/about/about.component.scss‎

Lines changed: 49 additions & 114 deletions
Original file line numberDiff line numberDiff line change
@@ -1,116 +1,51 @@
1-
// CONTENAIRS
2-
.content {
3-
margin: 0.5em 1em;
4-
display: flex;
5-
align-items: stretch;
6-
flex-direction: column;
7-
}
8-
9-
.content.no-grow {
10-
flex-grow: 0;
11-
}
12-
13-
.content.grow {
14-
flex-grow: 1;
15-
}
16-
17-
// TITLES
18-
h2 {
19-
font-weight: 300;
20-
margin-left: 0.8em;
21-
}
22-
23-
// links
24-
.box-links {
25-
align-items: center;
26-
flex-direction: column;
27-
display: flex;
28-
justify-content: flex-start;
29-
margin: 0 1em;
30-
}
31-
32-
// VERSION
1+
////////////////////////VERSION
332
.box-version {
34-
margin: 1em 1em;
35-
display: flex;
36-
align-items: stretch;
37-
flex-direction: column;
38-
background-color: #161c26;
39-
border: 1px solid #4f5560;
40-
box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
41-
border-radius: 15px;
42-
}
43-
44-
.version-info {
45-
display: flex;
46-
flex-direction: row;
47-
margin: 0.5em 1em;
48-
}
49-
50-
.version-text {
51-
font-weight: 300;
52-
margin-right: 1em;
53-
}
54-
55-
.version-unknown,
56-
.version-uptodate {
57-
display: flex;
58-
flex-direction: row;
59-
}
60-
61-
.version-newversion {
62-
display: flex;
63-
flex-direction: column;
64-
}
65-
66-
.version-unknown img {
67-
height: 1.4em;
68-
margin-left: 1em;
69-
filter: invert(42%) sepia(93%) saturate(1352%) hue-rotate(7deg) brightness(90%) contrast(119%);
70-
}
71-
72-
.version-uptodate img {
73-
height: 1.4em;
74-
margin-left: 1em;
75-
filter: invert(42%) sepia(93%) saturate(1352%) hue-rotate(45deg) brightness(90%) contrast(119%);
76-
}
77-
78-
.version-newversion img {
79-
height: 1.4em;
80-
margin-left: 1em;
81-
filter: invert(48%) sepia(20%) saturate(1500%) hue-rotate(6deg) brightness(100%) contrast(300%);
82-
}
83-
84-
.download {
85-
margin: 0.5em 0;
86-
transition: background-color 0.2s ease-in-out;
87-
background-color: #ddd;
88-
}
89-
90-
.download:hover {
91-
background-color: #bbb;
92-
}
93-
94-
.check-version {
95-
width: 100%;
96-
margin: 0;
97-
transition: background-color 0.2s ease-in-out;
98-
background-color: #ddd;
99-
cursor: pointer;
100-
}
101-
102-
.check-version:hover {
103-
background-color: #bbb;
104-
}
105-
106-
img.icon-open {
107-
height: 15px;
108-
padding: 0 5px;
109-
filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(0deg) brightness(100%) contrast(100%);
110-
}
111-
112-
button.links {
113-
display: flex;
114-
flex-direction: row;
115-
justify-content: space-between;
3+
margin: 0 1em 1em;
4+
padding: 0;
5+
6+
.version-info {
7+
display: flex;
8+
flex-direction: row;
9+
margin: 0.5em 1em;
10+
11+
.version-text {
12+
font-weight: 300;
13+
margin-right: 1em;
14+
}
15+
16+
.version-unknown {
17+
display: flex;
18+
flex-direction: row;
19+
img {
20+
height: 1.4em;
21+
margin-left: 1em;
22+
filter: invert(42%) sepia(93%) saturate(1352%) hue-rotate(7deg) brightness(90%) contrast(119%);
23+
}
24+
25+
}
26+
27+
.version-uptodate {
28+
display: flex;
29+
flex-direction: row;
30+
img {
31+
height: 1.4em;
32+
margin-left: 1em;
33+
filter: invert(42%) sepia(93%) saturate(1352%) hue-rotate(45deg) brightness(90%) contrast(119%);
34+
}
35+
}
36+
37+
.version-newversion {
38+
display: flex;
39+
flex-direction: column;
40+
button.download {
41+
margin: 0.5em 0;
42+
width: 100%;
43+
img {
44+
height: 1.4em;
45+
margin-left: 1em;
46+
filter: invert(48%) sepia(20%) saturate(1500%) hue-rotate(6deg) brightness(100%) contrast(300%);
47+
}
48+
}
49+
}
50+
}
11651
}

‎angular/src/app/pages/about/about.component.ts‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,8 +11,9 @@ export interface linkElement {
1111
selector: 'app-about',
1212
templateUrl: 'about.component.html',
1313
styleUrls: [
14+
'../../scss/button.component.scss',
15+
'../../scss/container.component.scss',
1416
'about.component.scss',
15-
'../../scss/button.component.scss'
1617
]
1718
})
1819
export class AboutComponent implements OnInit {

‎angular/src/app/pages/account/account.component.html‎

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -46,13 +46,13 @@ <h3 class="title-cloud">API Usage</h3>
4646
</div>
4747
</div>
4848
<div class="box-cloud-token-buttons">
49-
<button class="box-cloud-token-button tooltip" (click)="openManageTokens(session.domain, 'user')" [disabled]="!session.two_factor_passed">
49+
<button class="circle tooltip" (click)="openManageTokens(session.domain, 'user')" [disabled]="!session.two_factor_passed">
5050
<img class="icon"src="assets/list.svg">
51-
<span *ngIf="session.two_factor_passed" class="tooltiptext">Manage</span>
51+
<span *ngIf="session.two_factor_passed" class="tooltiptext top">Manage</span>
5252
</button>
53-
<button class="box-cloud-token-button stroked tooltip" (click)="openCreateToken(session.domain, 'user')" [disabled]="!session.two_factor_passed">
53+
<button class="circle secondary tooltip" (click)="openCreateToken(session.domain, 'user')" [disabled]="!session.two_factor_passed">
5454
<img class="icon" src="assets/add.svg">
55-
<span *ngIf="session.two_factor_passed" class="tooltiptext">Create</span>
55+
<span *ngIf="session.two_factor_passed" class="tooltiptext top">Create</span>
5656
</button>
5757
</div>
5858
</div>
@@ -65,13 +65,13 @@ <h3 class="title-cloud">API Usage</h3>
6565
</div>
6666
</div>
6767
<div class="box-cloud-token-buttons">
68-
<button class="box-cloud-token-button tooltip" (click)="openManageTokens(session.domain, 'org')" [disabled]="!session.two_factor_passed">
68+
<button class="circle tooltip" (click)="openManageTokens(session.domain, 'org')" [disabled]="!session.two_factor_passed">
6969
<img class="icon"src="assets/list.svg">
70-
<span *ngIf="session.two_factor_passed" class="tooltiptext">Manage</span>
70+
<span *ngIf="session.two_factor_passed" class="tooltiptext top">Manage</span>
7171
</button>
72-
<button class="box-cloud-token-button stroked tooltip" (click)="openCreateToken(session.domain, 'org')" [disabled]="!session.two_factor_passed">
72+
<button class="circle secondary tooltip" (click)="openCreateToken(session.domain, 'org')" [disabled]="!session.two_factor_passed">
7373
<img class="icon" src="assets/add.svg">
74-
<span *ngIf="session.two_factor_passed" class="tooltiptext">Create</span>
74+
<span *ngIf="session.two_factor_passed" class="tooltiptext top">Create</span>
7575
</button>
7676
</div>
7777
</div>

0 commit comments

Comments
 (0)