Project

General

Profile

« Previous | Next » 

Revision 57592

initial commit

View differences:

modules/open-science-observatory-ui/trunk/src/app/shared/reusablecomponents/cookie-law/cookie-law.service.ts
1
/**
2
 * angular2-cookie-law
3
 *
4
 * Copyright 2016-2017, @andreasonny83, All rights reserved.
5
 *
6
 * @author: @andreasonny83 <andreasonny83@gmail.com>
7
 */
8

  
9
import { Injectable } from '@angular/core';
10

  
11
@Injectable()
12
export class CookieLawService {
13

  
14

  
15
  seen(): boolean {
16
    return this.cookieExists('cookieLawSeen');
17
  }
18

  
19
  storeCookie(): void {
20
    return this.setCookie('cookieLawSeen');
21
  }
22

  
23
  /**
24
   * try to read a saved cookie
25
   *
26
   * @param  {string} name [the cookie name]
27
   *
28
   * @return {string}      [the cookie's value]
29
   */
30
  private cookieExists(name: string): boolean {
31
    if (typeof document !== 'undefined') {
32
      let ca: Array<string> = document.cookie.split(';');
33
      let caLen: number = ca.length;
34
      let cookieName = name + '=';
35
      let c: string;
36

  
37
      for (let i: number = 0; i < caLen; i += 1) {
38
        c = ca[i].replace(/^\s\+/g, '');
39
        if (c.indexOf(cookieName) !== -1) {
40
          return true;
41
        }
42
      }
43
  }
44
    return false;
45
  }
46

  
47
  /**
48
   * store a new cookie in the browser
49
   *
50
   * @param {string} name [the name for the cookie]
51
   */
52
  private setCookie(name: string): void {
53
    if (typeof document !== 'undefined') {
54
      let d:Date = new Date();
55
      d.setTime(d.getTime() + 3*30 * 24 * 60 * 60 * 1000); // in 3 months
56
      let expires:string = `expires=${d.toUTCString()}`;
57

  
58
      document.cookie = encodeURIComponent(name) + '=true; path=/;  expires='+expires+';';
59
    }
60
  }
61
}
0 62

  
modules/open-science-observatory-ui/trunk/src/app/app.module.ts
1
import { BrowserModule } from '@angular/platform-browser';
2
import { NgModule } from '@angular/core';
3

  
4
import { AppRoutingModule } from './app-routing.module';
5
import { AppComponent } from './app.component';
6
import { ReusableComponentsModule } from './shared/reusablecomponents/reusable-components.module';
7
import { HomeComponent } from './pages/home/home.component';
8
import { DataService } from './services/data.service';
9
import { CountriesTableComponent } from './pages/home/countries-table.component';
10
import { DataViewComponent } from './pages/home/data-view.component';
11
import { HighchartsChartModule } from 'highcharts-angular';
12
import { CountriesMapOverviewComponent } from './pages/home/countries-map-overview.component';
13

  
14
@NgModule({
15
  declarations: [
16
    AppComponent,
17
    HomeComponent,
18
    CountriesTableComponent,
19
    DataViewComponent,
20
    CountriesMapOverviewComponent
21
  ],
22
  imports: [
23
    BrowserModule,
24
    AppRoutingModule,
25
    ReusableComponentsModule,
26
    HighchartsChartModule
27
  ],
28
  providers: [
29
    DataService
30
  ],
31
  bootstrap: [AppComponent]
32
})
33
export class AppModule { }
modules/open-science-observatory-ui/trunk/src/app/app.component.ts
1
import { Component } from '@angular/core';
2
import {Router} from '@angular/router';
3

  
4
@Component({
5
  selector: 'app-root',
6
  templateUrl: './app.component.html',
7
  styleUrls: ['./app.component.css']
8
})
9
export class AppComponent {
10
  title = 'open-science-observatory-ui';
11

  
12
  constructor(private router: Router) {
13
  }
14

  
15
  isEmbedRoute() {
16
    // console.log('Is embed route? Route is: ' + this.router.url);
17
    return (this.router.url === '/overview-map-embed');
18
  }
19

  
20
}
modules/open-science-observatory-ui/trunk/src/app/domain/page-content.ts
1
/**
2
 * Created by stefania on 7/17/17.
3
 */
4

  
5
export class PageContent {
6

  
7
  content: PositionContents;
8

  
9
  route: string;
10
  _id: string;
11
  name: string;
12
}
13

  
14
export interface PositionContents {
15

  
16
  top: Content[];
17
  right: Content[];
18
  bottom: Content[];
19
  left: Content[];
20
}
21

  
22
export interface Content {
23

  
24
  _id: string;
25
  page: Page | string;
26
  placement: string;
27
  order: number;
28
  content: string;
29
  isActive: boolean;
30
}
31

  
32
export interface Page {
33
  _id: string;
34
  route: string;
35
  name: string;
36
}
37

  
0 38

  
modules/open-science-observatory-ui/trunk/src/assets/less/md/_md_list.less
1
/* list */
2
.md-list {
3
    .reset_list;
4
    .border-box;
5
    .uk-nestable-list > li,
6
    > li {
7
        min-height: 48px;
8
        padding: 8px 4px;
9
        box-sizing: border-box;
10
        border-bottom: 1px solid @border_color;
11
        position: relative;
12
        > .md-list-content {
13
            overflow: hidden;
14
            > span {
15
                display: block;
16
            }
17
            .md-list-heading {
18
                margin: 0;
19
                font-weight: 500;
20
                display: block;
21
                overflow: hidden;
22
                padding-bottom: 1px;
23
            }
24
            .md-list-menu {
25
                float: right;
26
                .md-list-menu-toggle {
27
                    display: block;
28
                    font-size: 18px;
29
                    color: rgba(0,0,0,.8);
30
                    width: 28px;
31
                    height: 28px;
32
                    line-height: 28px;
33
                    border-radius: 14px;
34
                    text-align: center;
35
                }
36
            }
37
            .uk-badge {
38
                float: right;
39
                color: @white !important;
40
            }
41
            .md-list-action {
42
                float: right;
43
                margin-left: 8px;
44
                margin-top: 2px;
45
                display: none;
46
            }
47
            .md-list-action-placeholder {
48
                float: right;
49
                margin-left: 8px;
50
                display: none;
51
                width: 32px;
52
                height: 32px;
53
            }
54
        }
55
        .md-list-action-dropdown {
56
            position: absolute;
57
            right: 16px;
58
            top: 10px;
59
            display: none;
60
        }
61
        > a.md-list-content {
62
            display: block;
63
            color: @text_primary_color;
64
        }
65
        &:last-child {
66
            border-bottom: none;
67
        }
68
        &.md-list-item-active {
69
            color: @accent_color;
70
            background: @background_color_default_hex;
71
        }
72
        &.md-list-item-disabled {
73
            > .md-list-content {
74
                color: @muted_color;
75
                span {
76
                    color: @muted_color !important;
77
                }
78
            }
79
        }
80
        &.heading_list {
81
            min-height: 32px;
82
            padding: 32px 8px 16px;
83
            border-bottom: none;
84
            background: transparent !important;
85
            text-transform: uppercase;
86
        }
87
        .uk-touch &,
88
        &:hover {
89
            > .md-list-addon-element {
90
                .uk-nestable-handle {
91
                    display: block;
92
                }
93
            }
94
            > .md-list-content {
95
                .md-list-action,
96
                .md-list-action-placeholder {
97
                    display: block;
98
                }
99
            }
100
            .md-list-action-dropdown {
101
                display: block;
102
            }
103
        }
104
    }
105
    .uk-nestable-list > li {
106
        margin-left: 64px;
107
    }
108
    &-addon {
109
        > li {
110
            margin-left: 64px;
111
            position: relative;
112
            &:last-child {
113
                .md-list-addon-element {
114
                    border-bottom: none;
115
                    bottom: 0;
116
                }
117
            }
118
            &:first-child {
119
                .md-list-addon-element {
120
                    top: 0;
121
                }
122
            }
123
            &.md-list-item-active {
124
                .md-list-addon-element {
125
                    &,
126
                    .material-icons {
127
                        color: @accent_color;
128
                    }
129
                }
130
            }
131
        }
132
        &-element {
133
            position: absolute;
134
            left: -64px;
135
            top: -1px;
136
            bottom: -1px;
137
            width: 64px;
138
            text-align: center;
139
            padding: 8px 0;
140
            display: block;
141
            .element-status {
142
                position: absolute;
143
                right: 12px;
144
                top: 10px;
145
                width: 12px;
146
                height: 12px;
147
                border-radius: 50%;
148
                background: @muted_color;
149
                border: 1px solid @white;
150
                &-danger {
151
                    background: @danger_color;
152
                }
153
                &-success {
154
                    background: @success_color;
155
                }
156
                &-warning {
157
                    background: @warning_color;
158
                }
159
            }
160
            > .md-list-addon-avatar {
161
                margin-top: 2px;
162
            }
163
            > .md-list-addon-icon {
164
                font-size: 28px;
165
                margin-top: 4px;
166
                color: @text_secondary_color;
167
            }
168
            > .material-icons {
169
                margin-top: 6px;
170
            }
171
            .iradio_md,
172
            .icheckbox_md {
173
                margin-top: 10px;
174
            }
175
            .uk-nestable-handle {
176
                position: absolute;
177
                left: -2px;
178
                top: 12px;
179
                display: none;
180
            }
181
        }
182
    }
183
    &-interactive {
184
        li {
185
            cursor: pointer;
186
        }
187
    }
188
    &-bg {
189
        background: @white;
190
    }
191
    &-separated {
192
        li {
193
            background: @white;
194
            padding: 8px;
195
            + li {
196
                border-top: none;
197
                margin-top: 8px;
198
            }
199
        }
200
    }
201
    &-bg-no-sep {
202
        background: @white;
203
        padding: 8px;
204
        li > .md-list-content {
205
            padding: 0 4px;
206
        }
207
    }
208
    &-outside {
209
        > li {
210
            padding: 0;
211
            > .md-list-content {
212
                padding: 8px 16px;
213
                display: block;
214
                color: @text_primary_color;
215
            }
216
            &.md-list-item-active,
217
            &:hover:not(.heading_list) {
218
                background: @background_color_default;
219
            }
220
            &.heading_list {
221
                padding: 32px 16px 16px;
222
            }
223
        }
224
        &.md-list-addon {
225
            li {
226
                margin-left: 0;
227
                .md-list-addon-element {
228
                    position: relative;
229
                    top: auto;
230
                    left: auto;
231
                    float: left;
232
                }
233
                .md-list-content {
234
                    padding-left: 0;
235
                }
236
            }
237
        }
238
    }
239
    /*&-outside-wrapper {
240
        overflow: hidden;
241
    }*/
242
    .uk-nestable-list {
243
        padding-left: 0;
244
        .uk-nestable-item {
245
            padding-right: 0;
246
        }
247
    }
248
    .uk-nestable-item + .uk-nestable-item {
249
        margin-top: 0;
250
    }
251
    &-right {
252
        &.md-list-addon {
253
            > li {
254
                margin-left: 0;
255
                margin-right: 64px;
256
                .md-list-addon-element {
257
                    left: auto;
258
                    right: -64px;
259
                }
260
            }
261
        }
262
    }
263
    &-borderless {
264
        > li {
265
            border-bottom: none;
266
        }
267
    }
268
}
269

  
270
.uk-touch {
271
    .md-list-addon-element {
272
        .uk-nestable-handle {
273
            display: block !important;
274
        }
275
    }
276
    .md-list-content {
277
        .md-list-action,
278
        .md-list-action-placeholder {
279
            display: block !important;
280
        }
281
    }
282
    .md-list-action-dropdown {
283
        display: block !important;
284
    }
285
}
0 286

  
modules/open-science-observatory-ui/trunk/src/assets/less/md/_md_variables_mixins.less
1
// shadows
2
.boxShadowHelper(@level: 1){
3
    & when (@level = 0) {
4
        box-shadow: none !important;
5
    }
6
    & when (@level = 1) {
7
        box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
8
    }
9
    & when (@level = 2) {
10
        box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
11
    }
12
    & when (@level = 3) {
13
        box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);
14
    }
15
    & when (@level = 4) {
16
        box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22);
17
    }
18
    & when (@level = 5) {
19
        box-shadow: 0 19px 38px rgba(0,0,0,0.30), 0 15px 12px rgba(0,0,0,0.22);
20
    }
21
}
22

  
23
.md-box-shadow-left() {
24
    box-shadow: -2px 2px 5px rgba(0,0,0,.26);
25
}
26
.md-box-shadow-right() {
27
    box-shadow: 2px 2px 5px rgba(0,0,0,.26);
28
}
29
.md-box-shadow-medium-right() {
30
    box-shadow: 4px 0 8px rgba(0,0,0,.26);
31
}
32

  
33
/* bg colors */
34
.md-bg-cyan {
35
    background-color: @md-color-cyan-600 !important;
36
    color: @white;
37
}
38
.md-bg-light-green {
39
    background-color: @md-color-light-green-600 !important;
40
    color: @white;
41
}
42
.md-bg-grey {
43
    background-color: @md-color-grey-700 !important;
44
    color: @white;
45
}
46
.md-bg-red {
47
    background-color: @md-color-red-700 !important;
48
    color: @white;
49
}
50
.md-bg-light-blue {
51
    background-color: @md-color-light-blue-700 !important;
52
    color: @white;
53
}
54
.md-bg-teal {
55
    background-color: @md-color-teal-600 !important;
56
    color: @white;
57
}
58
.md-bg-purple {
59
    background-color: @md-color-purple-600 !important;
60
    color: @white;
61
}
0 62

  
modules/open-science-observatory-ui/trunk/src/assets/less/md/_md_icons.less
1
// Material Design Icons
2
// http://google.github.io/material-design-icons/
3
@material_icons_directory:   '../icons/material-design-icons/';
4

  
5
@font-face {
6
    font-family: 'Material Icons';
7
    font-style: normal;
8
    font-weight: 400;
9
    src: url("@{material_icons_directory}MaterialIcons-Regular.eot"); /* For IE6-8 */
10
    src: local('Material Icons'),
11
    local('MaterialIcons-Regular'),
12
    url("@{material_icons_directory}MaterialIcons-Regular.woff2") format('woff2'),
13
    url("@{material_icons_directory}MaterialIcons-Regular.woff") format('woff'),
14
    url("@{material_icons_directory}MaterialIcons-Regular.ttf") format('truetype');
15
}
16
.material-icons {
17
    font-family: 'Material Icons';
18
    font-weight: normal;
19
    font-style: normal;
20
    font-size: 18px;  /* Preferred icon size */
21
    display: inline-block;
22
    width: 1em;
23
    height: 1em;
24
    line-height: 1;
25
    text-transform: none;
26
    letter-spacing: normal;
27
    /* Support for all WebKit browsers. */
28
    -webkit-font-smoothing: antialiased;
29
    /* Support for Safari and Chrome. */
30
    text-rendering: optimizeLegibility;
31
    /* Support for Firefox. */
32
    -moz-osx-font-smoothing: grayscale;
33
    /* Support for IE. */
34
    font-feature-settings: 'liga';
35
    vertical-align: -4px;
36
    color: rgba(0, 0, 0, 0.54);
37
    &.md-inactive {
38
        color: rgba(0, 0, 0, 0.26);
39
    }
40
    &.md-24 {
41
        font-size: 24px;
42
        vertical-align: -8px;
43
    }
44
    &.md-36 {
45
        font-size: 36px;
46
        vertical-align: -16px;
47
    }
48
    &.md-48 {
49
        font-size: 48px;
50
        vertical-align: -24px;
51
    }
52
    &.md-light {
53
        color: rgba(255, 255, 255, 1);
54
        &.md-inactive {
55
            color: rgba(255, 255, 255, 0.3);
56
        }
57
    }
58
}
0 59

  
modules/open-science-observatory-ui/trunk/src/assets/less/md/_md_panels.less
1
/* panels */
2
.md-panel-full {
3
    .border-box();
4
    position: relative;
5
    overflow: hidden;
6
    min-height: 100%;
7
    > .uk-grid {
8
        height: 100%;
9
        [class*=uk-width] {
10
            height: 100%;
11
        }
12
    }
13
    .md-panel-full-aside {
14
        margin: 16px 16px 32px;
15
        padding: 16px;
16
        &.md-panel-full-aside-bg {
17
            background: @white;
18
        }
19
    }
20
    .md-panel-full-content {
21
        background: @white;
22
        padding: 25px 25px 90px;
23
        width: inherit;
24
        min-width: 100%;
25
        min-height: 100%;
26
        > .md-panel-full-content-inner {
27
            position: relative;
28
            z-index: 10;
29
        }
30
        &:before {
31
            width: inherit;
32
            content: '';
33
            position: absolute;
34
            background: @white;
35
            display: block;
36
            right: 0;
37
            top: 0;
38
            bottom: 0;
39
            .md-box-shadow-left();
40
            z-index: 5;
41
        }
42
        .md-panel-full-content-header {
43
            margin-bottom: 24px;
44
            .md-panel-full-content-menu {
45
                float: right;
46
            }
47
        }
48
    }
49
}
0 50

  
modules/open-science-observatory-ui/trunk/src/assets/less/md/_md_top_bar.less
1
/* top bar */
2
.md-top-bar {
3
    .md-top-bar-checkbox {
4
        padding-top: 10px;
5
    }
6
    .md-top-bar-icons {
7
        margin-top: 5px;
8
    }
9
    .md-top-bar-icons,
10
    .md-top-bar-checkbox {
11
        display: inline-block;
12
    }
13
    .md-btn-group {
14
        margin-top: 4px;
15
    }
16
    .md-top-bar-actions-left {
17
        float: left;
18
        padding-left: 16px;
19
        .md-btn-group {
20
            margin-left: 8px;
21
        }
22
    }
23
    .md-top-bar-actions-right {
24
        float: right;
25
        padding-right: 16px;
26
        .md-btn-group {
27
            margin-right: 8px;
28
        }
29
    }
30
    .md-btn-small {
31
        padding: 2px 12px;
32
    }
33
}
0 34

  
modules/open-science-observatory-ui/trunk/src/assets/less/md/_md_buttons.less
1
/* buttons */
2

  
3
@fab_large_size:            64px;
4
@fab_small_size:            48px;
5
@fab_transition_delay:      50ms;
6

  
7
.md-btn {
8
    background: @white;
9
    border: none;
10
    border-radius: 2px;
11
    .boxShadowHelper(1);
12
    min-height: 31px;
13
    min-width: 70px;
14
    padding: 2px 16px;
15
    text-align: center;
16
    text-shadow: none;
17
    text-transform: uppercase;
18
    transition: all 280ms @md_easing;
19
    color: @text_primary_color;
20
    box-sizing: border-box;
21
    cursor: pointer;
22
    -webkit-appearance: none;
23
    display: inline-block;
24
    vertical-align: middle;
25
    .md_font(500, 14px, 31px) !important;
26
    &:hover,
27
    &:focus,
28
    &:active,
29
    .uk-button-dropdown.uk-open > & {
30
        background: @white;
31
        outline: none;
32
        text-decoration: none;
33
        color: @text_primary_color;
34
        .boxShadowHelper(2);
35
    }
36
    &:active,
37
    .uk-button-dropdown.uk-open > & {
38
        .boxShadowHelper(3);
39
    }
40
    &-flat {
41
        .boxShadowHelper(0);
42
        background: none;
43
        &:hover,
44
        &:focus {
45
            background: @hover_btn;
46
        }
47
        &:active {
48
            background: @active_btn;
49
        }
50
        &-danger {
51
            &,
52
            &:hover,
53
            &:focus,
54
            &:active {
55
                color: @danger_color;
56
            }
57
            &:hover,
58
            &:focus,
59
            &:active {
60
                background: lighten(@danger_color,40%);
61
            }
62
        }
63
        &-primary {
64
            &,
65
            &:hover,
66
            &:focus,
67
            &:active {
68
                color: @primary_color_dark;
69
            }
70
            &:hover,
71
            &:focus,
72
            &:active {
73
                background: lighten(@primary_color,40%);
74
            }
75
        }
76
        &-success {
77
            &,
78
            &:hover,
79
            &:focus,
80
            &:active {
81
                color: @success_color;
82
            }
83
            &:hover,
84
            &:focus,
85
            &:active {
86
                background: lighten(@success_color,40%);
87
            }
88
        }
89
        &-warning {
90
            &,
91
            &:hover,
92
            &:focus,
93
            &:active {
94
                color: @warning_color;
95
            }
96
            &:hover,
97
            &:focus,
98
            &:active {
99
                background: lighten(@warning_color,40%);
100
            }
101
        }
102
        &.disabled {
103
            background: none !important;
104
        }
105
    }
106
    &-danger {
107
        &,
108
        &:hover,
109
        &:focus,
110
        &:active {
111
            background: @danger_color;
112
        }
113
    }
114
    &-primary {
115
        &,
116
        &:hover,
117
        &:focus,
118
        &:active {
119
            background: @primary_color;
120
        }
121
    }
122
    &-success {
123
        &,
124
        &:hover,
125
        &:focus,
126
        &:active {
127
            background: @success_color;
128
        }
129
    }
130
    &-warning {
131
        &,
132
        &:hover,
133
        &:focus,
134
        &:active {
135
            background: @warning_color;
136
        }
137
    }
138
    &-danger,
139
    &-primary,
140
    &-success,
141
    &-warning {
142
        &,
143
        &:hover,
144
        &:focus,
145
        &:active,
146
        > i {
147
            color: @white;
148
        }
149
    }
150
    &.disabled {
151
        &,
152
        &:hover,
153
        &:focus,
154
        &:active {
155
            color: #a8a8a8;
156
            background: #eaeaea;
157
            box-shadow: none !important;
158
            cursor: default;
159
            pointer-events: none;
160
        }
161
    }
162
    > i {
163
        &.material-icons {
164
            margin-top: 5px;
165
            font-size: 18px;
166
        }
167
    }
168
    &-mini {
169
        line-height: 21px !important;
170
        min-width: 12px;
171
        font-size: 10px !important;
172
        min-height: 24px;
173
    }
174
    &-small {
175
        line-height: 27px !important;
176
        min-width: 14px;
177
        font-size: 11px !important;
178
    }
179
    &-large {
180
        line-height: 42px !important;
181
        font-size: 16px !important;
182
    }
183
    &::-moz-focus-inner {
184
        border: 0;
185
        padding: 0;
186
    }
187
    + .md-btn {
188
        margin-left: 8px;
189
    }
190
    &-block {
191
        width: 100%;
192
        & + & {
193
            margin-left: 0;
194
            margin-top: 12px;
195
        }
196
    }
197
    + .md-btn-group {
198
        margin-left: 16px;
199
    }
200
    &-facebook {
201
        background: #3b5998 !important;
202
    }
203
    &-twitter {
204
        background: #00aced !important;
205
    }
206
    &-gplus {
207
        background: #dd4b39 !important;
208
    }
209
    &-facebook,
210
    &-twitter,
211
    &-gplus {
212
        &,
213
        > i {
214
            color: @white !important;
215
        }
216
    }
217
    &-icon {
218
        &:extend(.md-btn-icon-default);
219
        > i {
220
            &:extend(.md-btn-icon-default > i);
221
            &.no_margin {
222
                margin-right: 0 !important;
223
                margin-left: 0 !important;
224
            }
225
        }
226
        &.md-btn-large {
227
            &:extend(.md-btn-icon-large);
228
            > i {
229
                &:extend(.md-btn-icon-large > i);
230
            }
231
        }
232
        &.md-btn-small {
233
            &:extend(.md-btn-icon-small);
234
            > i {
235
                &:extend(.md-btn-icon-small > i);
236
            }
237
        }
238
        &.md-btn-mini {
239
            &:extend(.md-btn-icon-mini);
240
            > i {
241
                &:extend(.md-btn-icon-mini > i);
242
            }
243
        }
244
    }
245
}
246
.md-btn-icon-large {
247
    min-width: 72px;
248
    > i {
249
        font-size: 24px;
250
        margin-right: 12px;
251
        vertical-align: -3px;
252
    }
253
}
254
.md-btn-icon-default {
255
    min-width: 64px;
256
    > i {
257
        font-size: 18px;
258
        margin-right: 8px;
259
        vertical-align: -2px;
260
    }
261
}
262
.md-btn-icon-small {
263
    min-width: 48px;
264
    > i {
265
        font-size: 16px;
266
        margin-right: 6px;
267
        vertical-align: -2px;
268
    }
269
}
270
.md-btn-icon-mini {
271
    min-width: 36px;
272
    > i {
273
        font-size: 16px;
274
        margin-right: 4px;
275
        vertical-align: -2px;
276
    }
277
}
278

  
279
.md-fab {
280
    box-sizing: border-box;
281
    width: @fab_large_size;
282
    height: @fab_large_size;
283
    border-radius: 50%;
284
    background: @white;
285
    color: @text_secondary_color;
286
    display: block;
287
    .boxShadowHelper(1);
288
    transition: box-shadow 280ms @md_easing;
289
    border: none;
290
    position: relative;
291
    text-align: center;
292
    cursor: pointer;
293
    &:hover,
294
    &:focus,
295
    &:active {
296
        .boxShadowHelper(3);
297
    }
298
    > i {
299
        font-size: 36px;
300
        line-height: @fab_large_size;
301
        height: inherit;
302
        width: inherit;
303
        position: absolute;
304
        left: 0;
305
        top: 0;
306
        color: @text_secondary_color;
307
    }
308
    &.md-fab-accent {
309
        background: @accent_color;
310
        > i {
311
            color: @white;
312
        }
313
    }
314
    &.md-fab-success {
315
        background: @success_color;
316
        > i {
317
            color: @white;
318
        }
319
    }
320
    &.md-fab-danger {
321
        background: @danger_color;
322
        > i {
323
            color: @white;
324
        }
325
    }
326
    &.md-fab-primary {
327
        background: @primary_color;
328
        > i {
329
            color: @white;
330
        }
331
    }
332
    &.md-fab-warning {
333
        background: @warning_color;
334
        > i {
335
            color: @white;
336
        }
337
    }
338
    &.md-fab-small {
339
        width: @fab_small_size;
340
        height: @fab_small_size;
341
        border-radius: 50%;
342
        > i {
343
            line-height: @fab_small_size;
344
            height: inherit;
345
            width: inherit;
346
            font-size: 24px;
347
        }
348
    }
349
    &-speed-dial {
350
        .md-fab-action-close {
351
            display: none;
352
        }
353
    }
354
}
355
.md-fab-wrapper {
356
    position: fixed;
357
    bottom: 24px;
358
    right: 24px;
359
    z-index: 1004;
360
    transition: margin 280ms @md_easing;
361
    @media @screen_medium_max {
362
        bottom: 20px;
363
        right: 20px;
364
    }
365
    > .md-fab + .md-fab {
366
        margin-top: 16px;
367
    }
368
    &.md-fab-in-card {
369
        position: absolute;
370
    }
371
}
372

  
373
.md-fab-speed-dial {
374
    .md-fab-wrapper-small {
375
        position: absolute;
376
        bottom: @fab_large_size + 16px;
377
        right: 8px;
378
        min-height: @fab_small_size;
379
        width: @fab_small_size;
380
        z-index: -1;
381
        .md-fab-small {
382
            transform: scale(0);
383
            opacity: 0;
384
            position: absolute;
385
            right: 0;
386
            &:nth-child(1) {
387
                transition: box-shadow 280ms @md_easing,transform 100ms @md_easing @fab_transition_delay,opacity 100ms @md_easing @fab_transition_delay;
388
            }
389
            .generate-fab-child(@n, @i: 2) when (@i =< @n) {
390
                // small buttons position
391
                &:nth-last-child(@{i}) {
392
                    bottom: (@fab_small_size * (@i - 1) ) + (16px * (@i - 1) );
393
                }
394
                // transition for small buttons (on hide)
395
                &:nth-child(@{i}) {
396
                    transition: box-shadow 280ms @md_easing,transform 100ms @md_easing ( @fab_transition_delay * @i ),opacity 100ms @md_easing ( @fab_transition_delay * @i );
397
                }
398
                .generate-fab-child(@n, (@i + 1));
399
            }
400
            .generate-fab-child(8);
401
        }
402
    }
403
    &.md-fab-active {
404
        .md-fab-small {
405
            transform: scale(1);
406
            opacity: 1;
407
            z-index: 10;
408

  
409
            // transition for small buttons (on show)
410
            &:nth-last-child(1) {
411
                transition: box-shadow 280ms @md_easing,transform 100ms @md_easing @fab_transition_delay,opacity 100ms @md_easing @fab_transition_delay;
412
            }
413
            .generate-fab-child-active(@n, @i: 2) when (@i =< @n) {
414
                &:nth-last-child(@{i}) {
415
                    transition: box-shadow 280ms @md_easing,transform 100ms @md_easing ( @fab_transition_delay * @i ),opacity 100ms @md_easing ( @fab_transition_delay * @i );
416
                }
417
                .generate-fab-child-active(@n, (@i + 1));
418
            }
419
            .generate-fab-child-active(8);
420
        }
421
    }
422
}
423

  
424
.md-fab-toolbar {
425
    transition: all 280ms @md_easing;
426
    cursor: default;
427
    > i {
428
        cursor: pointer;
429
    }
430
    &-actions {
431
        visibility: hidden;
432
        white-space: nowrap;
433
        padding: 0 16px;
434
        overflow: hidden;
435
        box-sizing: border-box;
436
        > a,
437
        > button {
438
            display: block;
439
            float: left;
440
            opacity: 0;
441
            margin: 0 0 0 16px;
442
            height: @fab_large_size;
443
            width: 48px;
444
            box-sizing: border-box;
445
            transition: opacity 280ms @md_easing;
446
            background: none;
447
            border: none;
448
            outline: none;
449
            cursor: pointer;
450
            &:first-child {
451
                margin-left: 0;
452
            }
453
        }
454
        .material-icons {
455
            font-size: 36px;
456
            line-height: @fab_large_size;
457
        }
458
    }
459
    &.md-fab-animated {
460
        .boxShadowHelper(1);
461
        border-radius: 4px;
462
        > i {
463
            display: none;
464
        }
465
    }
466
    &.md-fab-active {
467
        .md-fab-toolbar-actions {
468
            visibility: visible;
469
            > a,
470
            > button {
471
                opacity: 1;
472
            }
473
        }
474
    }
475
    &.md-fab-small {
476
        .md-fab-toolbar-actions {
477
            > a,
478
            > button {
479
                height: @fab_small_size;
480
                width: 36px;
481
                padding: 0;
482
                margin: 0 0 0 8px;
483
                &:first-child {
484
                    margin-left: 0;
485
                }
486
            }
487
            .material-icons {
488
                font-size: 24px;
489
                line-height: @fab_small_size;
490
                height: inherit;
491
            }
492
        }
493
    }
494
}
495

  
496
.md-fab-sheet {
497
    transition: all 280ms @md_easing;
498
    cursor: default;
499
    > i {
500
        cursor: pointer;
501
    }
502
    &-actions {
503
        visibility: hidden;
504
        white-space: nowrap;
505
        overflow: hidden;
506
        box-sizing: border-box;
507
        padding: 4px 0;
508
        > a {
509
            display: block;
510
            opacity: 0;
511
            padding: 4px 16px;
512
            box-sizing: border-box;
513
            .md_font(400, 16px, 32px);
514
            text-align: left;
515
            &,
516
            &:hover {
517
                color: @text_primary_color;
518
            }
519
        }
520
        .material-icons {
521
            font-size: 24px;
522
            margin-right: 8px;
523
            vertical-align: -6px;
524
        }
525
    }
526
    &.md-fab-animated {
527
        .boxShadowHelper(1);
528
        border-radius: 4px;
529
        > i {
530
            display: none;
531
        }
532
    }
533
    &.md-fab-active {
534
        .md-fab-sheet-actions {
535
            visibility: visible;
536
            > a {
537
                opacity: 1;
538
            }
539
        }
540
    }
541
}
542

  
543
.sidebar_secondary_active {
544
    .md-fab-wrapper {
545
        margin-right: @sidebar_secondary_width - 16;
546
        @media @screen_medium_max {
547
            margin-right: @sidebar_secondary_width;
548
        }
549
    }
550
}
551

  
552
.md-toggle-group {
553
    .md-toggle-button {
554
        border-width: 0 0 2px;
555
        border-style: solid;
556
        border-color: transparent;
557
        background: none;
558
        line-height: 30px;
559
        min-width: 42px;
560
        text-align: center;
561
        padding: 0 8px;
562
        vertical-align: middle;
563
        cursor: pointer;
564
        &.md-toggle-active {
565
            border-bottom-color: #212121;
566
        }
567
    }
568
    &.md-toggle-group-small {
569
        .md-toggle-button {
570
            font-size: 11px;
571
            line-height: 24px;
572
            min-width: 16px;
573
            padding: 0 6px;
574
        }
575
    }
576
}
577

  
578
.md-btn-group {
579
    display: inline-block;
580
    vertical-align: top;
581
    position: relative;
582
    font-size: 0;
583
    white-space: nowrap;
584
    .md-btn {
585
        vertical-align: top;
586
        margin-left: 0 !important;
587
        &:first-child {
588
            border-top-right-radius: 0;
589
            border-bottom-right-radius: 0;
590
        }
591
        &:not(:first-child):not(:last-child) {
592
            border-radius: 0;
593
        }
594
        &:last-child {
595
            border-top-left-radius: 0;
596
            border-bottom-left-radius: 0;
597
        }
598
    }
599
}
0 600

  
modules/open-science-observatory-ui/trunk/angular.json
1
{
2
  "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
3
  "version": 1,
4
  "newProjectRoot": "projects",
5
  "projects": {
6
    "open-science-observatory-ui": {
7
      "root": "",
8
      "sourceRoot": "src",
9
      "projectType": "application",
10
      "prefix": "app",
11
      "schematics": {},
12
      "architect": {
13
        "build": {
14
          "builder": "@angular-devkit/build-angular:browser",
15
          "options": {
16
            "outputPath": "dist/open-science-observatory-ui",
17
            "index": "src/index.html",
18
            "main": "src/main.ts",
19
            "polyfills": "src/polyfills.ts",
20
            "tsConfig": "src/tsconfig.app.json",
21
            "assets": [
22
              "src/favicon.ico",
23
              "src/assets"
24
            ],
25
            "styles": [
26
              "src/styles.css",
27
              "node_modules/font-awesome/css/font-awesome.css"
28
            ],
29
            "scripts": [
30
              "node_modules/jquery/dist/jquery.min.js",
31
              "node_modules/uikit/dist/js/uikit.min.js",
32
              "node_modules/uikit/dist/js/uikit-icons.min.js"
33
            ]
34
          },
35
          "configurations": {
36
            "production": {
37
              "fileReplacements": [
38
                {
39
                  "replace": "src/environments/environment.ts",
40
                  "with": "src/environments/environment.prod.ts"
41
                }
42
              ],
43
              "optimization": true,
44
              "outputHashing": "all",
45
              "sourceMap": false,
46
              "extractCss": true,
47
              "namedChunks": false,
48
              "aot": true,
49
              "extractLicenses": true,
50
              "vendorChunk": false,
51
              "buildOptimizer": true,
52
              "budgets": [
53
                {
54
                  "type": "initial",
55
                  "maximumWarning": "2mb",
56
                  "maximumError": "5mb"
57
                }
58
              ]
59
            }
60
          }
61
        },
62
        "serve": {
63
          "builder": "@angular-devkit/build-angular:dev-server",
64
          "options": {
65
            "browserTarget": "open-science-observatory-ui:build"
66
          },
67
          "configurations": {
68
            "production": {
69
              "browserTarget": "open-science-observatory-ui:build:production"
70
            }
71
          }
72
        },
73
        "extract-i18n": {
74
          "builder": "@angular-devkit/build-angular:extract-i18n",
75
          "options": {
76
            "browserTarget": "open-science-observatory-ui:build"
77
          }
78
        },
79
        "test": {
80
          "builder": "@angular-devkit/build-angular:karma",
81
          "options": {
82
            "main": "src/test.ts",
83
            "polyfills": "src/polyfills.ts",
84
            "tsConfig": "src/tsconfig.spec.json",
85
            "karmaConfig": "src/karma.conf.js",
86
            "styles": [
87
              "src/styles.css"
88
            ],
89
            "scripts": [],
90
            "assets": [
91
              "src/favicon.ico",
92
              "src/assets"
93
            ]
94
          }
95
        },
96
        "lint": {
97
          "builder": "@angular-devkit/build-angular:tslint",
98
          "options": {
99
            "tsConfig": [
100
              "src/tsconfig.app.json",
101
              "src/tsconfig.spec.json"
102
            ],
103
            "exclude": [
104
              "**/node_modules/**"
105
            ]
106
          }
107
        }
108
      }
109
    },
110
    "open-science-observatory-ui-e2e": {
111
      "root": "e2e/",
112
      "projectType": "application",
113
      "prefix": "",
114
      "architect": {
115
        "e2e": {
116
          "builder": "@angular-devkit/build-angular:protractor",
117
          "options": {
118
            "protractorConfig": "e2e/protractor.conf.js",
119
            "devServerTarget": "open-science-observatory-ui:serve"
120
          },
121
          "configurations": {
122
            "production": {
123
              "devServerTarget": "open-science-observatory-ui:serve:production"
124
            }
125
          }
126
        },
127
        "lint": {
128
          "builder": "@angular-devkit/build-angular:tslint",
129
          "options": {
130
            "tsConfig": "e2e/tsconfig.e2e.json",
131
            "exclude": [
132
              "**/node_modules/**"
133
            ]
134
          }
135
        }
136
      }
137
    }
138
  },
139
  "defaultProject": "open-science-observatory-ui"
140
}
... This diff was truncated because it exceeds the maximum size that can be displayed.

Also available in: Unified diff