minimal-jekyll-theme 0.1.1 → 0.1.2

Sign up to get free protection for your applications and to get access to all the features.
Files changed (88) hide show
  1. checksums.yaml +4 -4
  2. data/CHANGELOG.md +1 -0
  3. data/LICENSE.txt +5 -0
  4. data/README.md +54 -0
  5. data/_includes/author_bio.html +39 -0
  6. data/_includes/category_tag_list.html +20 -0
  7. data/_includes/disqus_comments.html +17 -0
  8. data/_includes/figure +12 -0
  9. data/_includes/footer.html +20 -0
  10. data/_includes/head.html +46 -0
  11. data/_includes/header.html +38 -0
  12. data/_includes/navigation.html +26 -0
  13. data/_includes/newsletter.html +19 -0
  14. data/_includes/post_meta.html +49 -0
  15. data/_includes/read_time.html +18 -0
  16. data/_includes/share_icons.html +30 -0
  17. data/_includes/sidebar.html +17 -0
  18. data/_includes/video +3 -0
  19. data/_layouts/default.html +17 -0
  20. data/_layouts/home.html +40 -0
  21. data/_layouts/page.html +25 -0
  22. data/_layouts/post.html +50 -0
  23. data/_sass/_custom.scss +137 -0
  24. data/_sass/_tachyons.scss +94 -0
  25. data/_sass/_variables.scss +38 -0
  26. data/_sass/scss/_aspect-ratios.scss +142 -0
  27. data/_sass/scss/_background-position.scss +133 -0
  28. data/_sass/scss/_background-size.scss +41 -0
  29. data/_sass/scss/_border-colors.scss +93 -0
  30. data/_sass/scss/_border-radius.scss +134 -0
  31. data/_sass/scss/_border-style.scss +55 -0
  32. data/_sass/scss/_border-widths.scss +81 -0
  33. data/_sass/scss/_borders.scss +65 -0
  34. data/_sass/scss/_box-shadow.scss +48 -0
  35. data/_sass/scss/_box-sizing.scss +50 -0
  36. data/_sass/scss/_clears.scss +47 -0
  37. data/_sass/scss/_code.scss +18 -0
  38. data/_sass/scss/_colors.scss +84 -0
  39. data/_sass/scss/_coordinates.scss +153 -0
  40. data/_sass/scss/_debug-children.scss +21 -0
  41. data/_sass/scss/_debug-grid.scss +33 -0
  42. data/_sass/scss/_debug.scss +127 -0
  43. data/_sass/scss/_debug_children.scss +18 -0
  44. data/_sass/scss/_display.scss +111 -0
  45. data/_sass/scss/_flexbox.scss +229 -0
  46. data/_sass/scss/_floats.scss +56 -0
  47. data/_sass/scss/_font-family.scss +107 -0
  48. data/_sass/scss/_font-style.scss +36 -0
  49. data/_sass/scss/_font-weight.scss +87 -0
  50. data/_sass/scss/_forms.scss +23 -0
  51. data/_sass/scss/_gradients.scss +29 -0
  52. data/_sass/scss/_heights.scss +131 -0
  53. data/_sass/scss/_hovers.scss +166 -0
  54. data/_sass/scss/_images.scss +18 -0
  55. data/_sass/scss/_letter-spacing.scss +40 -0
  56. data/_sass/scss/_line-height.scss +41 -0
  57. data/_sass/scss/_links.scss +34 -0
  58. data/_sass/scss/_lists.scss +15 -0
  59. data/_sass/scss/_max-widths.scss +105 -0
  60. data/_sass/scss/_media-queries.scss +43 -0
  61. data/_sass/scss/_module-template.scss +29 -0
  62. data/_sass/scss/_negative-margins.scss +206 -0
  63. data/_sass/scss/_nested.scss +64 -0
  64. data/_sass/scss/_normalize.scss +434 -0
  65. data/_sass/scss/_opacity.scss +27 -0
  66. data/_sass/scss/_outlines.scss +39 -0
  67. data/_sass/scss/_overflow.scss +82 -0
  68. data/_sass/scss/_position.scss +44 -0
  69. data/_sass/scss/_rotations.scss +50 -0
  70. data/_sass/scss/_skins-pseudo.scss +243 -0
  71. data/_sass/scss/_skins.scss +143 -0
  72. data/_sass/scss/_spacing.scss +956 -0
  73. data/_sass/scss/_styles.scss +15 -0
  74. data/_sass/scss/_tables.scss +42 -0
  75. data/_sass/scss/_text-align.scss +49 -0
  76. data/_sass/scss/_text-decoration.scss +42 -0
  77. data/_sass/scss/_text-transform.scss +53 -0
  78. data/_sass/scss/_type-scale.scss +102 -0
  79. data/_sass/scss/_typography.scss +129 -0
  80. data/_sass/scss/_utilities.scss +48 -0
  81. data/_sass/scss/_vertical-align.scss +43 -0
  82. data/_sass/scss/_visibility.scss +58 -0
  83. data/_sass/scss/_white-space.scss +41 -0
  84. data/_sass/scss/_widths.scss +150 -0
  85. data/_sass/scss/_word-break.scss +43 -0
  86. data/_sass/scss/_z-index.scss +60 -0
  87. data/assets/css/minimal.scss +20 -0
  88. metadata +91 -5
data/_includes/video ADDED
@@ -0,0 +1,3 @@
1
+ <div class="aspect-ratio aspect-ratio--16x9 w-100 mb4">
2
+ <iframe class="aspect-ratio--object" src="{{ include.src }}" frameborder="0" allowfullscreen></iframe>
3
+ </div>
data/_layouts/default.html ADDED
@@ -0,0 +1,17 @@
1
+ <!DOCTYPE html>
2
+ <html>
3
+ {% include head.html %}
4
+ <body class="black-80 {% if page.class or layout.class %}{{ page.class | default: layout.class | join: ' ' | prepend: ' ' }}{% endif %}">
5
+
6
+ {% if page.header != false %}
7
+ {% include header.html %}
8
+ {% endif%}
9
+
10
+ {{ content }}
11
+
12
+ {% if page.footer != false %}
13
+ {% include footer.html %}
14
+ {% endif%}
15
+
16
+ </body>
17
+ </html>
data/_layouts/home.html ADDED
@@ -0,0 +1,40 @@
1
+ ---
2
+ layout: default
3
+ ---
4
+
5
+ <article class="flex justify-center mt3">
6
+
7
+ <div class="mw7 w-100 pa3 pa4-m">
8
+ <h3 class="f5 f4-ns fw3 mb0 pb2 bb b--light-gray">{{ site.data.theme.text.latest_articles | capitalize | default: "Latest writings" }}</h3>
9
+
10
+ {% for post in site.posts limit: site.data.theme.text.post_limit %}
11
+ <div class="post pt3 pb3 bb b--light-gray">
12
+ <div class="f5 fw3 light-silver lh-copy">
13
+ {% if post.last_modified_at %}
14
+ <span>{{ site.data.theme.text.updated }} {{ post.last_modified_at | date: site.date_format }}</span>
15
+ {% else %}
16
+ <span>{{ post.date | date: site.date_format }}</span>
17
+ {% endif %}
18
+ <span class="ttl">&middot;
19
+ {% include read_time.html %}
20
+ </span>
21
+ </div>
22
+
23
+ <a class="link black" href="{{ post.url | relative_url }}">
24
+ <h3 class="f3 f2-ns fw6 lh-title mt0 mb0">{{ post.title | escape }}</h3>
25
+ <div class="f5 f4-ns fw3 lh-copy">
26
+ {% if post.summary %}
27
+ {{ post.summary }}
28
+ {% else %}
29
+ {{ post.excerpt }}
30
+ {% endif %}
31
+ </div>
32
+ </a>
33
+ <a class="f6 fw3 link light-silver lh-copy mb0" href="{{ post.url | relative_url }}">{{ site.data.theme.text.read_more | capitalize }}</a>
34
+ </div>
35
+ {% endfor %}
36
+
37
+ <p class="f5 f4-ns fw3 mb0 mt4"><a class="link black" href="{{ site.data.theme.text.full_archive_url | relative_url }}">{{ site.data.theme.text.full_archive | capitalize }}</a></p>
38
+ </div>
39
+
40
+ </article>
data/_layouts/page.html ADDED
@@ -0,0 +1,25 @@
1
+ ---
2
+ layout: default
3
+ ---
4
+
5
+ <main class="mw8 center flex flex-column flex-row-l justify-center">
6
+ <article class="mw7 {% if page.sidebar %}center-l{% else %}center{% endif %} w-100 w-75-l">
7
+ {% unless page.header.layout == 'hero' %}
8
+ <header class="ph3 ph4-m">
9
+ <h1 class="f2 fw6 lh-title mb1">{{ page.title }}</h1>
10
+ {% if page.subtitle %}
11
+ <h2 class="f3 fw3 lh-title light-silver mv2">{{ page.subtitle }}</h2>
12
+ {% endif %}
13
+ </header>
14
+ {% endunless %}
15
+
16
+ <div class="ph3 ph4-m f5 f4-ns fw3 lh-copy mb0">
17
+ {{ content }}
18
+ </div>
19
+ </article>
20
+
21
+ {% if page.sidebar %}
22
+ {% include sidebar.html %}
23
+ {% endif %}
24
+
25
+ </main>
data/_layouts/post.html ADDED
@@ -0,0 +1,50 @@
1
+ ---
2
+ layout: default
3
+ ---
4
+
5
+ <main>
6
+ <article class="flex flex-column items-center">
7
+
8
+ <header class="mw7 w-100 ph3 ph4-m">
9
+ {% if site.data.theme.post_meta %}
10
+ {% include post_meta.html %}
11
+ {% endif %}
12
+
13
+ {% unless page.header.layout == 'hero' %}
14
+ <h1 class="f2 fw6 lh-title mb1">{{ page.title }}</h1>
15
+ {% if page.subtitle %}
16
+ <h2 class="f3 fw3 lh-title light-silver mv2">{{ page.subtitle }}</h2>
17
+ {% endif %}
18
+ {% endunless %}
19
+ </header>
20
+
21
+
22
+ <div class="mw7 w-100 ph3 ph4-m f5 f4-ns fw3 lh-copy mb0">
23
+ {{ content }}
24
+ </div>
25
+
26
+ <div class="mw7 w-100 ph3 ph4-m lh-copy">
27
+ {% if site.data.theme.category_tag_list %}
28
+ {% include category_tag_list.html %}
29
+ {% endif %}
30
+
31
+ {% if site.data.theme.share_icons %}
32
+ {% include share_icons.html %}
33
+ {% endif %}
34
+
35
+ {% if site.data.theme.author_bio %}
36
+ {% include author_bio.html %}
37
+ {% endif %}
38
+
39
+ {% if page.cta %}
40
+ {% include cta/{{page.cta}}.html %}
41
+ {% endif %}
42
+
43
+ {% if site.data.theme.disqus.shortname %}
44
+ {% include disqus_comments.html %}
45
+ {% endif %}
46
+ </div>
47
+
48
+ </article>
49
+ </main>
50
+
data/_sass/_custom.scss ADDED
@@ -0,0 +1,137 @@
1
+ /*
2
+
3
+ CUSTOM CSS
4
+
5
+ */
6
+
7
+ // Set default font
8
+ html {
9
+ font-family: $font-family;
10
+ }
11
+
12
+ // Removes nav margin on last menu link
13
+ nav a:last-child {
14
+ margin-right: 0;
15
+ }
16
+
17
+ // Full width
18
+ .full {
19
+ width: 100vw;
20
+ position: relative;
21
+ left: 50%;
22
+ right: 50%;
23
+ margin-left: -50vw;
24
+ margin-right: -50vw;
25
+ }
26
+
27
+ // Link color
28
+ a {
29
+ color: $link;
30
+ }
31
+
32
+ // Header caption link
33
+ span a {
34
+ color: $figcaption-color;
35
+ }
36
+
37
+ // Horizontal rules
38
+ hr {
39
+ height: 1px;
40
+ width: 100%;
41
+ border: 0;
42
+ border-top: $light-gray 1px solid;
43
+ padding: 0;
44
+ }
45
+
46
+ // Definition list
47
+ dt {
48
+ margin-top: 1em;
49
+ font-weight: bold;
50
+ }
51
+
52
+ dd {
53
+ margin-left: 1em;
54
+ }
55
+
56
+ // Abbreviation
57
+ abbr[title] {
58
+ text-decoration: none;
59
+ cursor: help;
60
+ border-bottom: 1px dotted $black;
61
+ }
62
+
63
+ // Bold text
64
+ b,
65
+ strong {
66
+ font-weight: 600;
67
+ }
68
+
69
+ // Mark tag
70
+ mark {
71
+ background-color: $mark-color;
72
+ }
73
+
74
+ // Image captions
75
+ figcaption {
76
+ color: $figcaption-color;
77
+ font-size: 0.8em;
78
+ font-weight: 300;
79
+ }
80
+
81
+ // Tables
82
+ table {
83
+ border-collapse: collapse;
84
+ border-spacing: 0;
85
+ }
86
+
87
+ table thead {
88
+ background-color: $table-header;
89
+ }
90
+
91
+ table, th, td {
92
+ padding: 0.4em;
93
+ border: 1px solid $table-border;
94
+ }
95
+
96
+ // Blockquotes
97
+ blockquote {
98
+ font-size: 1.4rem;
99
+ line-height: 1.5;
100
+ color: $blockquote-color;
101
+ border-left: $blockquote-border-left solid $blockquote-border;
102
+ padding-left: 1.2rem;
103
+ margin: 3rem 0 3rem 0;
104
+ font-style: italic;
105
+ }
106
+ blockquote cite {
107
+ font-size: .875rem;
108
+ text-transform: uppercase;
109
+ letter-spacing: .1em;
110
+ font-style: normal;
111
+ }
112
+
113
+ // Codeblocks
114
+ code {
115
+ font-family: $code-font-family;
116
+ color: $black-80;
117
+ padding: .25rem .25rem;
118
+ background-color: $code-background-color;
119
+ }
120
+
121
+ pre {
122
+ display: block;
123
+ overflow-x: auto;
124
+ margin: 2rem 0 2rem 0;
125
+ padding: .50rem 1rem;
126
+ background-color: $code-background-color;
127
+ }
128
+
129
+ pre > code {
130
+ padding: 0;
131
+ }
132
+
133
+ // Remove Tachyons 40px left/right margins on codeblocks
134
+ figure { margin: 1em 0; }
135
+
136
+ // Remove Tachyons default body margin
137
+ body { margin: 0; }
data/_sass/_tachyons.scss ADDED
@@ -0,0 +1,94 @@
1
+ // ! TACHYONS v4.6.1 | http://tachyons.io
2
+
3
+ //
4
+ //
5
+ // ________ ______
6
+ // ___ __/_____ _________ /______ ______________________
7
+ // __ / _ __ `/ ___/_ __ \_ / / / __ \_ __ \_ ___/
8
+ // _ / / /_/ // /__ _ / / / /_/ // /_/ / / / /(__ )
9
+ // /_/ \__,_/ \___/ /_/ /_/_\__, / \____//_/ /_//____/
10
+ // /____/
11
+ //
12
+ // TABLE OF CONTENTS
13
+ //
14
+ // 1. External Library Includes
15
+ // - Normalize.css | http://normalize.css.github.io
16
+ // 2. Tachyons Modules
17
+ // 3. Variables
18
+ // - Media Queries
19
+ // - Colors
20
+ // 4. Debugging
21
+ // - Debug all
22
+ // - Debug children
23
+ //
24
+ //
25
+
26
+
27
+ // External Library Includes
28
+ @import 'scss/normalize';
29
+
30
+
31
+ // Variables
32
+ // Importing here will allow you to override any variables in the modules
33
+ @import 'scss/colors';
34
+ @import 'scss/media-queries';
35
+
36
+ // Debugging
37
+ @import 'scss/debug-children';
38
+ @import 'scss/debug-grid';
39
+
40
+ // Uncomment out the line below to help debug layout issues
41
+ // @import 'scss/debug';
42
+
43
+ // Modules
44
+ @import 'scss/box-sizing';
45
+ @import 'scss/aspect-ratios';
46
+ @import 'scss/images';
47
+ @import 'scss/background-size';
48
+ @import 'scss/background-position';
49
+ @import 'scss/outlines';
50
+ @import 'scss/borders';
51
+ @import 'scss/border-colors';
52
+ @import 'scss/border-radius';
53
+ @import 'scss/border-style';
54
+ @import 'scss/border-widths';
55
+ @import 'scss/box-shadow';
56
+ @import 'scss/code';
57
+ @import 'scss/coordinates';
58
+ @import 'scss/clears';
59
+ @import 'scss/display';
60
+ @import 'scss/flexbox';
61
+ @import 'scss/floats';
62
+ @import 'scss/font-family';
63
+ @import 'scss/font-style';
64
+ @import 'scss/font-weight';
65
+ @import 'scss/forms';
66
+ @import 'scss/heights';
67
+ @import 'scss/letter-spacing';
68
+ @import 'scss/line-height';
69
+ @import 'scss/links';
70
+ @import 'scss/lists';
71
+ @import 'scss/max-widths';
72
+ @import 'scss/widths';
73
+ @import 'scss/overflow';
74
+ @import 'scss/position';
75
+ @import 'scss/opacity';
76
+ @import 'scss/rotations';
77
+ @import 'scss/skins';
78
+ @import 'scss/skins-pseudo';
79
+ @import 'scss/spacing';
80
+ @import 'scss/negative-margins';
81
+ @import 'scss/tables';
82
+ @import 'scss/text-decoration';
83
+ @import 'scss/text-align';
84
+ @import 'scss/text-transform';
85
+ @import 'scss/type-scale';
86
+ @import 'scss/typography';
87
+ @import 'scss/utilities';
88
+ @import 'scss/visibility';
89
+ @import 'scss/white-space';
90
+ @import 'scss/vertical-align';
91
+ @import 'scss/hovers';
92
+ @import 'scss/z-index';
93
+ @import 'scss/nested';
94
+ @import 'scss/styles';
data/_sass/_variables.scss ADDED
@@ -0,0 +1,38 @@
1
+ /*
2
+
3
+ THEME VARIABLES
4
+
5
+ */
6
+
7
+ // Links
8
+ $link: $black;
9
+
10
+ // Fonts
11
+ $font-family: -apple-system, BlinkMacSystemFont,
12
+ 'avenir next', avenir,
13
+ 'helvetica neue', helvetica,
14
+ ubuntu,
15
+ roboto, noto,
16
+ 'segoe ui', arial,
17
+ sans-serif;
18
+
19
+
20
+ $code-font-family: monospace;
21
+
22
+ // Codeblocks
23
+ $code-background-color: $light-gray;
24
+
25
+ // Blockquotes
26
+ $blockquote-border: $black;
27
+ $blockquote-color: $black;
28
+ $blockquote-border-left: 3px;
29
+
30
+ // Tables
31
+ $table-border: $black;
32
+ $table-header: $white;
33
+
34
+ // Highlighted text
35
+ $mark-color: $lightest-blue;
36
+
37
+ // Image captions
38
+ $figcaption-color: $light-silver;
data/_sass/scss/_aspect-ratios.scss ADDED
@@ -0,0 +1,142 @@
1
+
2
+ // Converted Variables
3
+
4
+
5
+ // Custom Media Query Variables
6
+
7
+
8
+ /*
9
+
10
+ ASPECT RATIOS
11
+
12
+ */
13
+
14
+ /* This is for fluid media that is embedded from third party sites like youtube, vimeo etc.
15
+ * Wrap the outer element in aspect-ratio and then extend it with the desired ratio i.e
16
+ * Make sure there are no height and width attributes on the embedded media.
17
+ * Adapted from: https://github.com/suitcss/components-flex-embed
18
+ *
19
+ * Example:
20
+ *
21
+ * <div class="aspect-ratio aspect-ratio--16x9">
22
+ * <iframe class="aspect-ratio--object"></iframe>
23
+ * </div>
24
+ *
25
+ * */
26
+
27
+ .aspect-ratio {
28
+ height: 0;
29
+ position: relative;
30
+ }
31
+
32
+ .aspect-ratio--16x9 { padding-bottom: 56.25%; }
33
+ .aspect-ratio--9x16 { padding-bottom: 177.77%; }
34
+
35
+ .aspect-ratio--4x3 { padding-bottom: 75%; }
36
+ .aspect-ratio--3x4 { padding-bottom: 133.33%; }
37
+
38
+ .aspect-ratio--6x4 { padding-bottom: 66.6%; }
39
+ .aspect-ratio--4x6 { padding-bottom: 150%; }
40
+
41
+ .aspect-ratio--8x5 { padding-bottom: 62.5%; }
42
+ .aspect-ratio--5x8 { padding-bottom: 160%; }
43
+
44
+ .aspect-ratio--7x5 { padding-bottom: 71.42%; }
45
+ .aspect-ratio--5x7 { padding-bottom: 140%; }
46
+
47
+ .aspect-ratio--1x1 { padding-bottom: 100%; }
48
+
49
+ .aspect-ratio--object {
50
+ position: absolute;
51
+ top: 0;
52
+ right: 0;
53
+ bottom: 0;
54
+ left: 0;
55
+ width: 100%;
56
+ height: 100%;
57
+ z-index: 100;
58
+ }
59
+
60
+ @media #{$breakpoint-not-small}{
61
+ .aspect-ratio-ns {
62
+ height: 0;
63
+ position: relative;
64
+ }
65
+ .aspect-ratio--16x9-ns { padding-bottom: 56.25%; }
66
+ .aspect-ratio--9x16-ns { padding-bottom: 177.77%; }
67
+ .aspect-ratio--4x3-ns { padding-bottom: 75%; }
68
+ .aspect-ratio--3x4-ns { padding-bottom: 133.33%; }
69
+ .aspect-ratio--6x4-ns { padding-bottom: 66.6%; }
70
+ .aspect-ratio--4x6-ns { padding-bottom: 150%; }
71
+ .aspect-ratio--8x5-ns { padding-bottom: 62.5%; }
72
+ .aspect-ratio--5x8-ns { padding-bottom: 160%; }
73
+ .aspect-ratio--7x5-ns { padding-bottom: 71.42%; }
74
+ .aspect-ratio--5x7-ns { padding-bottom: 140%; }
75
+ .aspect-ratio--1x1-ns { padding-bottom: 100%; }
76
+ .aspect-ratio--object-ns {
77
+ position: absolute;
78
+ top: 0;
79
+ right: 0;
80
+ bottom: 0;
81
+ left: 0;
82
+ width: 100%;
83
+ height: 100%;
84
+ z-index: 100;
85
+ }
86
+ }
87
+
88
+ @media #{$breakpoint-medium}{
89
+ .aspect-ratio-m {
90
+ height: 0;
91
+ position: relative;
92
+ }
93
+ .aspect-ratio--16x9-m { padding-bottom: 56.25%; }
94
+ .aspect-ratio--9x16-m { padding-bottom: 177.77%; }
95
+ .aspect-ratio--4x3-m { padding-bottom: 75%; }
96
+ .aspect-ratio--3x4-m { padding-bottom: 133.33%; }
97
+ .aspect-ratio--6x4-m { padding-bottom: 66.6%; }
98
+ .aspect-ratio--4x6-m { padding-bottom: 150%; }
99
+ .aspect-ratio--8x5-m { padding-bottom: 62.5%; }
100
+ .aspect-ratio--5x8-m { padding-bottom: 160%; }
101
+ .aspect-ratio--7x5-m { padding-bottom: 71.42%; }
102
+ .aspect-ratio--5x7-m { padding-bottom: 140%; }
103
+ .aspect-ratio--1x1-m { padding-bottom: 100%; }
104
+ .aspect-ratio--object-m {
105
+ position: absolute;
106
+ top: 0;
107
+ right: 0;
108
+ bottom: 0;
109
+ left: 0;
110
+ width: 100%;
111
+ height: 100%;
112
+ z-index: 100;
113
+ }
114
+ }
115
+
116
+ @media #{$breakpoint-large}{
117
+ .aspect-ratio-l {
118
+ height: 0;
119
+ position: relative;
120
+ }
121
+ .aspect-ratio--16x9-l { padding-bottom: 56.25%; }
122
+ .aspect-ratio--9x16-l { padding-bottom: 177.77%; }
123
+ .aspect-ratio--4x3-l { padding-bottom: 75%; }
124
+ .aspect-ratio--3x4-l { padding-bottom: 133.33%; }
125
+ .aspect-ratio--6x4-l { padding-bottom: 66.6%; }
126
+ .aspect-ratio--4x6-l { padding-bottom: 150%; }
127
+ .aspect-ratio--8x5-l { padding-bottom: 62.5%; }
128
+ .aspect-ratio--5x8-l { padding-bottom: 160%; }
129
+ .aspect-ratio--7x5-l { padding-bottom: 71.42%; }
130
+ .aspect-ratio--5x7-l { padding-bottom: 140%; }
131
+ .aspect-ratio--1x1-l { padding-bottom: 100%; }
132
+ .aspect-ratio--object-l {
133
+ position: absolute;
134
+ top: 0;
135
+ right: 0;
136
+ bottom: 0;
137
+ left: 0;
138
+ width: 100%;
139
+ height: 100%;
140
+ z-index: 100;
141
+ }
142
+ }