Skip to content

Commit 2f84c18

Browse files
taylordolantaylordolan
authored
Merge pull request #1669 from CodeNow/aha-guide-milestone2
Aha guide milestone2
2 parents 5b169c6 + 4d174c9 commit 2f84c18

52 files changed

Lines changed: 705 additions & 247 deletions

Some content is hidden

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

‎client/assets/styles/scss/components/aha-guide.scss‎

Lines changed: 125 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,58 @@
11
.aha-guide {
22
color: $gray;
33
overflow: hidden;
4+
position: relative;
5+
6+
&.padding-md {
7+
@include media(xxs) {
8+
padding: 30px 15px;
9+
}
10+
}
11+
12+
> .grid-block {
13+
overflow: visible;
14+
}
415

516
// anchor image
17+
.spinner-wrapper,
18+
.aha-meter {
19+
height: $input-md;
20+
left: 15px;
21+
position: absolute;
22+
top: 16px;
23+
transition: opacity .15s ease-in-out, transform .15s ease-in-out;
24+
width: $input-md;
25+
26+
&.ng-leave {
27+
opacity: 1;
28+
transform: scale3d(1,1,1);
29+
}
30+
31+
&.ng-leave-active {
32+
opacity: 0;
33+
transform: scale3d(.8,.8,1);
34+
}
35+
36+
&.ng-enter {
37+
opacity: 0;
38+
transform: scale3d(.8,.8,1);
39+
}
40+
41+
&.ng-enter-active {
42+
opacity: 1;
43+
transform: scale3d(1,1,1);
44+
}
45+
}
46+
47+
.spinner-wrapper {
48+
overflow: hidden;
49+
}
50+
651
.aha-meter {
752
background-image: linear-gradient(90deg, $gray-lightest 50%, transparent 50%, transparent), linear-gradient(0deg, $gray-lightest 50%, $gray-lightest 50%, $gray-lightest);
853
border-radius: 50%;
954
height: $input-md;
10-
margin-right: 15px;
1155
padding: $input-border;
12-
position: relative;
1356
width: $input-md;
1457

1558
$step: 1; // step of % for created classes
@@ -27,6 +70,16 @@
2770
background-image: linear-gradient($nextdeg, $green 50%, transparent 50%, transparent), linear-gradient(270deg, $green 50%, $gray-lightest 50%, $gray-lightest);
2871
}
2972
}
73+
74+
&.aha-error.aha-meter-#{$i * $step} {
75+
@if $i < $half {
76+
$nextdeg: 90deg + ($increment * $i);
77+
background-image: linear-gradient(90deg, $gray-lightest 50%, transparent 50%, transparent), linear-gradient($nextdeg, $orange 50%, $gray-lightest 50%, $gray-lightest);
78+
} @else {
79+
$nextdeg: -90deg + ($increment * ($i - $half));
80+
background-image: linear-gradient($nextdeg, $orange 50%, transparent 50%, transparent), linear-gradient(270deg, $orange 50%, $gray-lightest 50%, $gray-lightest);
81+
}
82+
}
3083
}
3184

3285
&.aha-meter-100 .iconnables {
@@ -40,6 +93,68 @@
4093
padding: 6px;
4194
width: 100%;
4295
}
96+
97+
.icons-alert {
98+
color: $orange;
99+
overflow: visible;
100+
padding: 10px 11px 11px;
101+
}
102+
}
103+
104+
.aha-text {
105+
margin-left: $input-md + 15;
106+
min-height: $input-md;
107+
overflow: visible;
108+
position: relative;
109+
}
110+
111+
.p-slide {
112+
position: absolute;
113+
top: 18px;
114+
transition: opacity .15s ease-in-out, transform .3s ease-in-out;
115+
116+
&.ng-enter {
117+
opacity: 0;
118+
transform: translate3d(25%,0,0);
119+
}
120+
121+
&.ng-enter-active {
122+
opacity: 1;
123+
transform: translate3d(0,0,0);
124+
}
125+
126+
&.ng-leave {
127+
opacity: 1;
128+
transform: translate3d(0,0,0);
129+
}
130+
131+
&.ng-leave-active {
132+
opacity: 0;
133+
transform: translate3d(-25%,0,0);
134+
}
135+
136+
&.reverse {
137+
138+
&.ng-enter {
139+
opacity: 0;
140+
transform: translate3d(-25%,0,0);
141+
}
142+
143+
&.ng-enter-active {
144+
opacity: 1;
145+
transform: translate3d(0,0,0);
146+
}
147+
148+
&.ng-leave {
149+
opacity: 1;
150+
transform: translate3d(0,0,0);
151+
}
152+
153+
&.ng-leave-active {
154+
opacity: 0;
155+
transform: translate3d(25%,0,0);
156+
}
157+
}
43158
}
44159

45160
// menu
@@ -50,9 +165,17 @@
50165
margin-left: 30px;
51166
min-width: 30px;
52167

168+
@include media(xxs) {
169+
margin-left: 9px;
170+
}
171+
53172
.iconnables {
54173
height: 100%;
55174
width: 15px;
56175
}
57176
}
58177
}
178+
179+
.aha-tips > .iconnables {
180+
margin-left: 6px;
181+
}

‎client/assets/styles/scss/components/aha-modals.scss‎

Lines changed: 23 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,8 @@
11
.modal-backdrop > .aha-guide {
22
animation: fade .15s ease-in-out;
3-
background: $gray-lighterest;
4-
border: 1px solid $gray-lighter;
5-
border-radius: $input-border-radius-lg;
63
height: 105px;
74
left: 0;
5+
margin: 0 auto;
86
max-width: calc(100vw - 30px);
97
position: absolute;
108
right: 0;
@@ -15,6 +13,10 @@
1513
height: 90px;
1614
}
1715

16+
@include media(xxxs) {
17+
top: 0;
18+
}
19+
1820
&.fixed {
1921
position: fixed;
2022
z-index: $z-modal;
@@ -31,8 +33,26 @@
3133
margin-top: 105px;
3234
}
3335
}
36+
37+
.spinner-wrapper,
38+
.aha-meter {
39+
top: 24px;
40+
}
3441
}
3542

3643
.modal-dialog > .aha-guide {
3744
border-bottom: 1px solid $gray-lighter;
45+
46+
&:only-child {
47+
border-bottom: 0;
48+
}
49+
50+
> .grid-block {
51+
position: relative;
52+
}
53+
54+
.aha-meter {
55+
left: 0;
56+
top: 0;
57+
}
3858
}

‎client/assets/styles/scss/components/aha-popover.scss‎

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
.popover.popover-aha {
2+
left: 75px;
3+
max-width: none;
4+
top: 66px;
5+
width: 450px;
6+
7+
@include media(xxs) {
8+
left: 15px;
9+
right: 15px;
10+
top: 60px;
11+
width: calc(100vw - 30px);
12+
13+
&.right {
14+
margin-left: 0;
15+
}
16+
}
17+
18+
.arrow {
19+
@include media(xxs) {
20+
display: none;
21+
}
22+
}
23+
24+
.popover-content {
25+
@extend %padding-sm;
26+
}
27+
}

‎client/assets/styles/scss/components/aha-sidebar.scss‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,11 @@
1212
width: 390px;
1313
z-index: $z-popover;
1414

15+
@include media(xxxs) {
16+
left: 12px;
17+
width: auto;
18+
}
19+
1520
&.ng-enter {
1621
transform: translate3d(100%,0,0);
1722
}

‎client/assets/styles/scss/components/buttons/buttons-debug.scss‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@
1111

1212
// override
1313
&:last-child {
14-
margin-left: -$input-border;
14+
margin-left: -1px;
1515
}
1616
}
1717

‎client/assets/styles/scss/components/buttons/buttons-group.scss‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -134,21 +134,21 @@
134134
> .btn:active {
135135

136136
&:not(:first-child):not(:last-child) {
137-
border-radius: $input-border-radius-xxs;
137+
border-radius: $input-border-radius;
138138
}
139139

140140
&:first-child:not(:last-child) {
141-
border-bottom-right-radius: $input-border-radius-xxs;
142-
border-top-right-radius: $input-border-radius-xxs;
141+
border-bottom-right-radius: $input-border-radius;
142+
border-top-right-radius: $input-border-radius;
143143

144144
&.btn-xs {
145145
padding-left: 9px;
146146
}
147147
}
148148

149149
&:last-child:not(:first-child) {
150-
border-bottom-left-radius: $input-border-radius-xxs;
151-
border-top-left-radius: $input-border-radius-xxs;
150+
border-bottom-left-radius: $input-border-radius;
151+
border-top-left-radius: $input-border-radius;
152152

153153
&.btn-xs {
154154
padding-right: 9px;

‎client/assets/styles/scss/components/buttons/buttons-toolbar.scss‎

Lines changed: 5 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,20 +1,14 @@
11
// buttons
22
.btn-toolbar {
3-
border: $input-border solid;
3+
border: 1px solid;
44
flex: 0 0 auto;
5-
font-size: 15px;
5+
font-family: $sans-serif; // override monospace fonts inside log header
6+
font-size: 14px;
67
font-weight: $weight-bold;
7-
height: 30px;
8-
line-height: 30px - ($input-border * 2);
8+
height: $input-xs;
9+
line-height: $input-xs - 2px;
910
padding: 0 9px;
1011

11-
.build-log-header & {
12-
font-family: $sans-serif; // override monospace fonts inside log header
13-
font-size: 13px;
14-
height: $input-xs;
15-
line-height: $input-xs - ($input-border * 2);
16-
}
17-
1812
&.purple {
1913
@extend %toolbar-btn-purple;
2014
}

‎client/assets/styles/scss/components/buttons/buttons.scss‎

Lines changed: 8 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,6 @@
33
border: 0;
44
border-radius: $input-border-radius;
55
cursor: pointer;
6-
display: inline-block;
76
font-size: 18px;
87
font-weight: $weight-normal;
98
padding: 0 15px;
@@ -12,6 +11,10 @@
1211
user-select: none;
1312
white-space: nowrap;
1413

14+
&:not(.grid-block) {
15+
display: inline-block;
16+
}
17+
1518
// for <a> elemnts
1619
&:hover,
1720
&:active {
@@ -110,7 +113,6 @@
110113
// only for inline buttons
111114
%btn-xxs,
112115
.btn-xxs {
113-
border-radius: $input-border-radius-xxs;
114116
font-size: 12px;
115117
height: $input-xxs;
116118
line-height: $input-line-height-xxs;
@@ -229,6 +231,10 @@
229231
&.reversed {
230232
letter-spacing: 0;
231233
}
234+
235+
&.btn-xxs {
236+
border-width: 1px;
237+
}
232238
}
233239

234240
.blue,

‎client/assets/styles/scss/components/cards.scss‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -71,10 +71,10 @@
7171

7272
.iconnables {
7373
cursor: pointer;
74-
height: 48px;
75-
margin: 0 auto 15px;
74+
height: 36px;
75+
margin: 0 auto 24px;
7676
pointer-events: auto;
77-
width: 48px;
77+
width: 36px;
7878
}
7979

8080
.h4 {

‎client/assets/styles/scss/components/help.scss‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -18,8 +18,10 @@
1818
border: 0;
1919
color: $gray-light;
2020
left: 0;
21+
overflow: visible;
2122
padding: 0 12px;
2223
position: absolute;
24+
top: 0;
2325

2426
&:hover {
2527
color: lighten($blue,10%);
@@ -38,6 +40,7 @@
3840
max-width: none; // overwrites max-width set in popover.scss
3941
padding-bottom: 26px;
4042
position: absolute;
43+
top: 0;
4144
transition: none;
4245
width: 400px;
4346
z-index: $z-modal-backdrop; // we want these to stay under modals...since they do not get dismissed on modal open

0 commit comments

Comments
 (0)