bedrock_sass 0.1.6 → 0.1.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (12) hide show
  1. checksums.yaml +4 -4
  2. data/assets/bedrock/js/bedrock.js +43396 -43193
  3. data/assets/bedrock/scss/_bedrock-components.scss +2 -0
  4. data/assets/bedrock/scss/_bedrock-settings.scss +2 -2
  5. data/assets/bedrock/scss/components/dropzone-upload.scss +4 -0
  6. data/assets/bedrock/scss/components/media-reveal.scss +88 -0
  7. data/assets/bedrock/scss/components/off-canvas-menu.scss +3 -0
  8. data/assets/bedrock/scss/components/page-content.scss +18 -8
  9. data/assets/bedrock/scss/components/seo-analysis.scss +7 -1
  10. data/assets/bedrock/scss/components/shortcode-reveal.scss +31 -14
  11. data/lib/bedrock_sass/version.rb +1 -1
  12. metadata +3 -2
data/assets/bedrock/scss/_bedrock-components.scss CHANGED
@@ -16,6 +16,7 @@
16
16
  @import 'components/file-input';
17
17
  @import 'components/seo-analysis';
18
18
  @import 'components/shortcode-reveal';
19
+ @import 'components/media-reveal';
19
20
 
20
21
  @include bedrock-global-styles;
21
22
  @include bedrock-prototype-classes;
@@ -35,3 +36,4 @@
35
36
  @include bedrock-file-input;
36
37
  @include bedrock-seo-analysis;
37
38
  @include bedrock-shortcode-reveal;
39
+ @include bedrock-media-reveal;
data/assets/bedrock/scss/_bedrock-settings.scss CHANGED
@@ -58,8 +58,8 @@ $no-content-color: $medium-gray;
58
58
  // ---------
59
59
 
60
60
  $page-content-sidebar-sizes: (
61
- small: 340px,
62
- xlarge: 360px
61
+ large: 340px,
62
+ xxlarge: 360px
63
63
  );
64
64
 
65
65
 
data/assets/bedrock/scss/components/dropzone-upload.scss CHANGED
@@ -156,4 +156,8 @@ $dropzone-upload-active-border-color: $primary-color !default;
156
156
  .dropzone {
157
157
  @include dropzone-upload;
158
158
  }
159
+
160
+ .dz-hidden-input {
161
+ overflow: hidden;
162
+ }
159
163
  }
data/assets/bedrock/scss/components/media-reveal.scss ADDED
@@ -0,0 +1,88 @@
1
+ $media-reveal-alt-color: $dark-gray !default;
2
+ $media-reveal-alt-background: darken($reveal-background, 5) !default;
3
+
4
+ // Media Reveal Mixins
5
+
6
+ @mixin media-reveal {
7
+ .media-reveal {
8
+ z-index: 99999;
9
+
10
+ &.full {
11
+
12
+ .panel-content {
13
+ position: relative;
14
+ overflow: hidden;
15
+ }
16
+
17
+ .media-columns {
18
+ position: absolute;
19
+ top: 0;
20
+ left: 0;
21
+ width: 100%;
22
+ overflow: hidden;
23
+ }
24
+
25
+ .media-menu,
26
+ .media-content {
27
+ overflow-y: auto;
28
+ height: 100%;
29
+ }
30
+ }
31
+ }
32
+
33
+ .media-columns {
34
+ @include xy-grid;
35
+ height: 100%;
36
+ }
37
+
38
+ .media-menu {
39
+ @include xy-cell(shrink, false);
40
+ background: $media-reveal-alt-background;
41
+ min-height: 100%;
42
+ min-width: 12rem;
43
+ border-color: smart-scale($media-reveal-alt-background, 5%);
44
+ border-style: solid;
45
+ border-width: 0 1px 0 0;
46
+
47
+ .menu {
48
+ background: none;
49
+ border: 0;
50
+
51
+ li {
52
+
53
+ &:not(:last-child) {
54
+ border: 1px solid smart-scale($media-reveal-alt-background, 5%);
55
+ border-width: 0 0 1px;
56
+ }
57
+
58
+ &.is-active, &.active {
59
+
60
+ a {
61
+ background: smart-scale($media-reveal-alt-background, 5%);
62
+ color: $media-reveal-alt-color;
63
+ }
64
+ }
65
+ }
66
+
67
+ a {
68
+ color: $media-reveal-alt-color;
69
+ padding: $global-padding;
70
+ background: none;
71
+ outline: none;
72
+ }
73
+ }
74
+ }
75
+
76
+ .media-content {
77
+ @include xy-cell(auto, false);
78
+ padding: $global-padding;
79
+ min-height: 100%;
80
+ }
81
+ }
82
+
83
+
84
+ // Media Reveal Component
85
+
86
+ @mixin bedrock-media-reveal {
87
+ @include media-reveal;
88
+ }
data/assets/bedrock/scss/components/off-canvas-menu.scss CHANGED
@@ -13,6 +13,9 @@ $offcanvas-menu-submenu-background: darken($offcanvas-menu-background, 3) !defau
13
13
  @mixin off-canvas-menu-content {
14
14
  @include xy-cell(auto, false);
15
15
  @extend .#{$maincontent-class};
16
+ max-width: 100%;
17
+ overflow-x: auto;
18
+ min-width: 240px;
16
19
 
17
20
  @include breakpoint(large) {
18
21
  margin: 0;
data/assets/bedrock/scss/components/page-content.scss CHANGED
@@ -1,7 +1,4 @@
1
- $page-content-sidebar-sizes: (
2
- small: 340px,
3
- xlarge: 360px
4
- ) !default;
1
+ $page-content-sidebar-sizes: (large: 340px, xxlarge: 360px) !default;
5
2
 
6
3
  // Page Content Mixins
7
4
 
@@ -17,6 +14,7 @@ $page-content-sidebar-sizes: (
17
14
  @mixin page-content {
18
15
  @include xy-grid;
19
16
  min-height: 100vh;
17
+ flex-flow: row nowrap;
20
18
 
21
19
  @each $name, $size in $grid-column-gutter {
22
20
  @include breakpoint($name) {
@@ -25,18 +23,24 @@ $page-content-sidebar-sizes: (
25
23
  }
26
24
  }
27
25
 
28
- @include breakpoint(xlarge) {
29
- flex-flow: row nowrap;
26
+ @include breakpoint(large down) {
27
+ flex-flow: row wrap;
30
28
  }
31
29
 
32
30
  > .content {
33
31
  @include xy-cell(auto, false);
34
32
  @include page-content-gutter;
33
+ overflow-x: auto;
34
+ min-width: 240px;
35
+
36
+ @include breakpoint(large down) {
37
+ width: 100%;
38
+ }
35
39
  }
36
40
 
37
41
  > .sidebar {
38
- @include xy-cell(shrink, false);
39
42
  @include page-content-gutter;
43
+ @include xy-cell(shrink, false);
40
44
 
41
45
  @each $name, $size in $page-content-sidebar-sizes {
42
46
  @include breakpoint($name) {
@@ -44,8 +48,14 @@ $page-content-sidebar-sizes: (
44
48
  }
45
49
  }
46
50
 
47
- @include breakpoint(xlarge down) {
51
+ @include breakpoint(large down) {
48
52
  width: 100%;
53
+ display: flex;
54
+ flex-direction: column;
55
+
56
+ > .button:first-child {
57
+ order: 99 * 99;
58
+ }
49
59
  }
50
60
  }
51
61
  }
data/assets/bedrock/scss/components/seo-analysis.scss CHANGED
@@ -22,8 +22,13 @@ $seo-analysis-border: 1px solid smart-scale($seo-analysis-background, $seo-analy
22
22
 
23
23
  .snippet-editor__view {
24
24
  margin: 0;
25
- width: 40rem;
25
+ width: auto;
26
26
  max-width: 100%;
27
+ flex-basis: 40em;
28
+
29
+ .snippet_container {
30
+ width: 100%;
31
+ }
27
32
 
28
33
  .snippet_container__url {
29
34
 
@@ -64,6 +69,7 @@ $seo-analysis-border: 1px solid smart-scale($seo-analysis-background, $seo-analy
64
69
  .seo-preview-score {
65
70
  text-align: center;
66
71
  color: $medium-gray;
72
+ padding-left: $global-padding * 2;
67
73
 
68
74
  .score {
69
75
  display: block;
data/assets/bedrock/scss/components/shortcode-reveal.scss CHANGED
@@ -6,20 +6,26 @@ $shortcode-reveal-alt-background: darken($reveal-background, 5) !default;
6
6
  @mixin shortcode-reveal {
7
7
  .shortcode-reveal {
8
8
 
9
- .panel-content {
10
- position: relative;
11
- overflow: hidden;
9
+ &.full {
10
+
11
+ .panel-content {
12
+ position: relative;
13
+ overflow: hidden;
14
+ }
15
+
16
+ .shortcode-columns {
17
+ position: absolute;
18
+ top: 0;
19
+ left: 0;
20
+ width: 100%;
21
+ overflow-y: auto;
22
+ }
12
23
  }
13
24
  }
14
25
 
15
26
  .shortcode-columns {
16
27
  @include xy-grid;
17
- position: absolute;
18
- top: 0;
19
- left: 0;
20
- width: 100%;
21
28
  height: 100%;
22
- overflow-y: auto;
23
29
  }
24
30
 
25
31
  .shortcode-menu {
@@ -31,17 +37,28 @@ $shortcode-reveal-alt-background: darken($reveal-background, 5) !default;
31
37
  border-style: solid;
32
38
  border-width: 0 1px 0 0;
33
39
 
34
- .menu {
40
+ li {
35
41
 
36
- li:not(:last-child) {
37
- border-bottom: 1px solid smart-scale($shortcode-reveal-alt-background, 5%);
42
+ &:not(:last-child) {
43
+ border: 1px solid smart-scale($media-reveal-alt-background, 5%);
44
+ border-width: 0 0 1px;
38
45
  }
39
46
 
40
- a {
41
- color: $shortcode-reveal-alt-color;
42
- padding: $global-padding;
47
+ &.is-active, &.active {
48
+
49
+ a {
50
+ background: smart-scale($media-reveal-alt-background, 5%);
51
+ color: $media-reveal-alt-color;
52
+ }
43
53
  }
44
54
  }
55
+
56
+ a {
57
+ color: $media-reveal-alt-color;
58
+ padding: $global-padding;
59
+ background: none;
60
+ outline: none;
61
+ }
45
62
  }
46
63
 
47
64
  .shortcode-form {
data/lib/bedrock_sass/version.rb CHANGED
@@ -1,3 +1,3 @@
1
1
  module BedrockSass
2
- VERSION = '0.1.6'
2
+ VERSION = '0.1.7'
3
3
  end
metadata CHANGED
@@ -1,14 +1,14 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: bedrock_sass
3
3
  version: !ruby/object:Gem::Version
4
- version: 0.1.6
4
+ version: 0.1.7
5
5
  platform: ruby
6
6
  authors:
7
7
  - Jonian Guveli
8
8
  autorequire:
9
9
  bindir: exe
10
10
  cert_chain: []
11
- date: 2017-12-20 00:00:00.000000000 Z
11
+ date: 2017-12-22 00:00:00.000000000 Z
12
12
  dependencies:
13
13
  - !ruby/object:Gem::Dependency
14
14
  name: sass
@@ -419,6 +419,7 @@ files:
419
419
  - assets/bedrock/scss/components/inline-edit-box.scss
420
420
  - assets/bedrock/scss/components/login-box.scss
421
421
  - assets/bedrock/scss/components/logo-bar.scss
422
+ - assets/bedrock/scss/components/media-reveal.scss
422
423
  - assets/bedrock/scss/components/no-content.scss
423
424
  - assets/bedrock/scss/components/off-canvas-menu.scss
424
425
  - assets/bedrock/scss/components/page-content.scss