active_frontend 9.0.1 → 9.1.0

Sign up to get free protection for your applications and to get access to all the features.
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA1:
3
- metadata.gz: 5e80837105b26e194a38e1948c033fee88ef67ec
4
- data.tar.gz: 997707d37ada39f0051d008dd8d81a96af4d0678
3
+ metadata.gz: a8221bf26788b952840f0715397c855ec0e92ca9
4
+ data.tar.gz: d08d666dae82ae7e551e510d597d0400d93afb34
5
5
  SHA512:
6
- metadata.gz: c04320f46d2c0a087f5c7ee1d60ad080eadbec193fa84c6a5f7d2bb988125f16aa01b8c6a9e9ddb955b4773f94dc08697203ab0b2c83de727f14f8ddaa7a90ea
7
- data.tar.gz: ca65a5a3168d639b9df33d713617dc33fbcc46f3c5e8e5a909984134bb055540f71e4a9949fc793d98f315d7e63427c9738ddbcf7084134ee731ca08f049e151
6
+ metadata.gz: 2f7fcedc6dec72ccb62e5d8fdfb19ee2db2649bb19c645955da7fee90fd1e95d941235e2fa2da4419cfa797ed2de262368925ce484a05358d5403a32f406d78c
7
+ data.tar.gz: 98fb8da1a59eebf77a17f95176dc65fb23413a670ae8d93a8c3b3979090cb59f41e3754886d1462a6a1a28c00e0d32fac03b8600924fdb1c545b4e63bc8db575
data/README.md CHANGED
@@ -66,6 +66,7 @@ Add the CSS files you want to include:
66
66
  *= require swoggle.css
67
67
  *= require table.css
68
68
  *= require timepicker.css
69
+ *= require toolbar.css
69
70
  *= require tooltip.css
70
71
  *= require popover.css (place after tooltip)
71
72
  *= require transition.css
@@ -1,3 +1,3 @@
1
1
  module ActiveFrontend
2
- VERSION = "9.0.1"
2
+ VERSION = "9.1.0"
3
3
  end
@@ -7,11 +7,12 @@
7
7
  /* # Canvas
8
8
  ================================================== */
9
9
  .canvas {
10
- height: 100%;
11
10
  min-height: 100%;
11
+ height: 100%;
12
12
  }
13
13
  .canvas-content,
14
- .canvas-sidebar {
14
+ .canvas-sidebar,
15
+ .canvas-toolbar {
15
16
  box-sizing: border-box;
16
17
  display: block;
17
18
  float: left;
@@ -29,24 +30,38 @@
29
30
  max-width: calc(100% - 280px);
30
31
  width: calc(100% - 280px);
31
32
  }
33
+ .canvas-content.canvas-content-with-toolbar {
34
+ max-width: calc(100% - 55px);
35
+ width: calc(100% - 55px);
36
+ }
37
+ .canvas-content.canvas-content-with-sidebar-and-toolbar {
38
+ max-width: calc(100% - 335px);
39
+ width: calc(100% - 335px);
40
+ }
32
41
  .canvas-with-header > .canvas-content,
33
- .canvas-with-header > .canvas-sidebar { margin-top: 65px; }
42
+ .canvas-with-header > .canvas-sidebar,
43
+ .canvas-with-header > .canvas-toolbar { margin-top: 65px; }
34
44
  .canvas-with-footer > .canvas-content { padding-bottom: 90px; }
35
45
  .canvas-sidebar {
36
46
  max-width: 280px;
37
47
  width: 280px;
38
48
  }
39
- .canvas-with-header .sidebar {
40
- height: calc(100% - 60px);
41
- max-height: calc(100% - 60px);
49
+ .canvas-toolbar {
50
+ max-width: 55px;
51
+ width: 55px;
52
+ }
53
+ .canvas-with-header .sidebar,
54
+ .canvas-with-header .toolbar {
55
+ max-height: calc(100% - 65px);
56
+ height: calc(100% - 65px);
42
57
  }
43
58
 
44
59
  /* # Alternate
45
60
  ================================================== */
46
61
  .canvas-app.canvas-with-header > .canvas-sidebar { margin-top: 0; }
47
62
  .canvas-app.canvas-with-header .sidebar {
48
- height: 100%;
49
63
  max-height: 100%;
64
+ height: 100%;
50
65
  }
51
66
 
52
67
  /* # Media Queries
@@ -56,6 +71,10 @@
56
71
  max-width: calc(100% - 250px);
57
72
  width: calc(100% - 250px);
58
73
  }
74
+ .canvas-content.canvas-content-with-sidebar-and-toolbar {
75
+ max-width: calc(100% - 305px);
76
+ width: calc(100% - 305px);
77
+ }
59
78
  .canvas-sidebar {
60
79
  max-width: 250px;
61
80
  width: 250px;
@@ -66,6 +85,10 @@
66
85
  max-width: calc(100% - 220px);
67
86
  width: calc(100% - 220px);
68
87
  }
88
+ .canvas-content.canvas-content-with-sidebar-and-toolbar {
89
+ max-width: calc(100% - 275px);
90
+ width: calc(100% - 275px);
91
+ }
69
92
  .canvas-sidebar {
70
93
  max-width: 220px;
71
94
  width: 220px;
@@ -76,12 +99,33 @@
76
99
  max-width: 100%;
77
100
  width: 100%;
78
101
  }
102
+ .canvas-content.canvas-content-with-toolbar,
103
+ .canvas-content.canvas-content-with-sidebar-and-toolbar {
104
+ max-width: calc(100% - 55px);
105
+ width: calc(100% - 55px);
106
+ }
79
107
  .canvas-sidebar { display: none; }
80
108
  }
81
109
  @media only screen and (max-width: 767px) {
82
- .canvas-with-header > .canvas-content {
83
- margin-top: 50px;
84
- padding-bottom: 50px;
110
+ .canvas-content.canvas-content-with-toolbar,
111
+ .canvas-content.canvas-content-with-sidebar-and-toolbar {
112
+ max-width: calc(100% - 45px);
113
+ width: calc(100% - 45px);
85
114
  }
115
+ .canvas-toolbar {
116
+ max-width: 45px;
117
+ width: 45px;
118
+ }
119
+ .canvas-with-header > .canvas-content,
120
+ .canvas-with-header > .canvas-toolbar { margin-top: 50px; }
121
+ .canvas-with-header > .canvas-content { padding-bottom: 50px; }
86
122
  .canvas-with-footer > .canvas-content { padding-bottom: 80px; }
123
+ .canvas-with-header .toolbar {
124
+ max-height: calc(100% - 50px);
125
+ height: calc(100% - 50px);
126
+ }
127
+ .canvas-toolbar-with-navbar .toolbar {
128
+ max-height: calc(100% - 99px);
129
+ height: calc(100% - 99px);
130
+ }
87
131
  }
@@ -89,6 +89,15 @@
89
89
  color: $color-black-light;
90
90
  text-decoration: none;
91
91
  }
92
+ .header-nav > li.lined > a {
93
+ border-radius: 0 !important;
94
+ border-bottom: 3px solid transparent;
95
+ padding-bottom: 24px;
96
+ }
97
+ .header-nav > li.lined > a:hover,
98
+ .header-nav > li.lined > a.active,
99
+ .header-nav > li.lined > a:active,
100
+ .header-nav > li.lined > a:focus { border-color: $color-primary; }
92
101
  .header-nav-alt > li > a { padding: 10px 0 9px 0; }
93
102
  .header-toolchain > li > a {
94
103
  font-size: 26px;
@@ -69,6 +69,7 @@
69
69
  width: 100%;
70
70
  }
71
71
  .timepicker-widget > table td > a:hover,
72
+ .timepicker-widget > table td > a.active,
72
73
  .timepicker-widget > table td > a:active,
73
74
  .timepicker-widget > table td > a:focus {
74
75
  color: $color-primary;
@@ -0,0 +1,80 @@
1
+ /* Table of Contents
2
+ ==================================================
3
+ # Toolbar
4
+ # Colors
5
+ # Media Queries */
6
+
7
+ /* # Toolbar
8
+ ================================================== */
9
+ .toolbar {
10
+ background: $color-white;
11
+ border-right: 1px solid $color-haze;
12
+ box-sizing: border-box;
13
+ height: 100%;
14
+ min-width: 55px;
15
+ -webkit-overflow-scrolling: touch;
16
+ overflow-scrolling: touch;
17
+ overflow-x: hidden;
18
+ overflow-y: auto;
19
+ position: fixed;
20
+ width: 55px;
21
+ }
22
+ .toolbar-alt {
23
+ border-left: 1px solid $color-haze;
24
+ border-right: 0;
25
+ }
26
+ .toolbar > a {
27
+ background: transparent;
28
+ box-sizing: border-box;
29
+ color: $color-black-light;
30
+ display: block;
31
+ font-size: 21px;
32
+ height: 55px;
33
+ line-height: 60px;
34
+ text-align: center;
35
+ width: 55px;
36
+ }
37
+ .toolbar > a:hover,
38
+ .toolbar > a.active,
39
+ .toolbar > a:active
40
+ .toolbar > a:focus {
41
+ background: $color-primary;
42
+ color: $color-white;
43
+ }
44
+
45
+ /* # Colors
46
+ ================================================== */
47
+ .toolbar-dark,
48
+ .toolbar-dark.toolbar-alt {
49
+ background: $color-black;
50
+ border-color: $color-black-dark;
51
+ }
52
+ .toolbar-dark > a { color: $color-gray; }
53
+ .toolbar-light,
54
+ .toolbar-light.toolbar-alt {
55
+ background: $color-haze-light;
56
+ border-color: $color-haze-dark;
57
+ }
58
+
59
+ /* # Media Queries
60
+ ================================================== */
61
+ @media only screen and (max-width: 767px) {
62
+ .toolbar {
63
+ min-width: 45px;
64
+ width: 45px;
65
+ }
66
+ .toolbar > a {
67
+ height: 45px;
68
+ line-height: 49px;
69
+ width: 45px;
70
+ }
71
+ }
72
+ @media
73
+ only screen and (-webkit-min-device-pixel-ratio: 2),
74
+ only screen and ( min--moz-device-pixel-ratio: 2),
75
+ only screen and ( -o-min-device-pixel-ratio: 2/1),
76
+ only screen and ( min-device-pixel-ratio: 2),
77
+ only screen and ( min-resolution: 192dpi),
78
+ only screen and ( min-resolution: 2dppx) {
79
+ .toolbar { border-width: 0.5px; }
80
+ }
@@ -55,6 +55,7 @@ $color-primary: $color-blue;
55
55
  @import 'swoggle';
56
56
  @import 'table';
57
57
  @import 'timepicker';
58
+ @import 'toolbar';
58
59
  @import 'tooltip';
59
60
  @import 'transition';
60
61
  @import 'trunk';
metadata CHANGED
@@ -1,14 +1,14 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: active_frontend
3
3
  version: !ruby/object:Gem::Version
4
- version: 9.0.1
4
+ version: 9.1.0
5
5
  platform: ruby
6
6
  authors:
7
7
  - Juan Gomez
8
8
  autorequire:
9
9
  bindir: exe
10
10
  cert_chain: []
11
- date: 2015-08-06 00:00:00.000000000 Z
11
+ date: 2015-08-07 00:00:00.000000000 Z
12
12
  dependencies:
13
13
  - !ruby/object:Gem::Dependency
14
14
  name: bundler
@@ -150,6 +150,7 @@ files:
150
150
  - vendor/assets/stylesheets/_swoggle.scss
151
151
  - vendor/assets/stylesheets/_table.scss
152
152
  - vendor/assets/stylesheets/_timepicker.scss
153
+ - vendor/assets/stylesheets/_toolbar.scss
153
154
  - vendor/assets/stylesheets/_tooltip.scss
154
155
  - vendor/assets/stylesheets/_transition.scss
155
156
  - vendor/assets/stylesheets/_trunk.scss