jekyll-sleek 0.1.0
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.
- checksums.yaml +7 -0
- data/LICENSE.txt +21 -0
- data/README.md +51 -0
- data/_includes/critical.css +0 -0
- data/_includes/disqus.html +18 -0
- data/_includes/footer.html +23 -0
- data/_includes/form.html +21 -0
- data/_includes/ga.html +9 -0
- data/_includes/head.html +10 -0
- data/_includes/header.html +22 -0
- data/_layouts/default.html +46 -0
- data/_layouts/page.html +32 -0
- data/_layouts/post.html +55 -0
- data/_sass/abstracts/_mixins.scss +18 -0
- data/_sass/abstracts/_variables.scss +34 -0
- data/_sass/base/_base.scss +40 -0
- data/_sass/base/_helpers.scss +22 -0
- data/_sass/base/_typography.scss +123 -0
- data/_sass/components/_btn.scss +100 -0
- data/_sass/components/_card.scss +38 -0
- data/_sass/components/_form.scss +92 -0
- data/_sass/components/_syntax.scss +60 -0
- data/_sass/components/_table.scss +21 -0
- data/_sass/components/_top.scss +30 -0
- data/_sass/layout/_footer.scss +31 -0
- data/_sass/layout/_grid.scss +23 -0
- data/_sass/layout/_nav.scss +93 -0
- data/_sass/main.scss +38 -0
- data/_sass/pages/_page.scss +89 -0
- data/_sass/pages/_post.scss +14 -0
- data/_sass/vendor/_normalize.scss +1 -0
- data/_sass/vendor/_susy.scss +5 -0
- data/assets/css/main.css +3 -0
- data/assets/img/bigg.jpg +0 -0
- data/assets/img/icons/icon-github.svg +1 -0
- data/assets/img/icons/icon-instagram.svg +1 -0
- data/assets/img/icons/icon-twitter.svg +1 -0
- data/assets/img/shane-rounce-205187.jpg +0 -0
- data/assets/js/bundle.js +1 -0
- metadata +152 -0
|
@@ -0,0 +1,123 @@
|
|
|
1
|
+
// General
|
|
2
|
+
body {
|
|
3
|
+
background-color: $bg-color;
|
|
4
|
+
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI",Roboto,"Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
|
|
5
|
+
font-size: 1rem;
|
|
6
|
+
line-height: 1.5;
|
|
7
|
+
color: $text-color;
|
|
8
|
+
-webkit-font-smoothing: antialiased;
|
|
9
|
+
-webkit-text-size-adjust: 100%;
|
|
10
|
+
}
|
|
11
|
+
|
|
12
|
+
::selection {
|
|
13
|
+
color: $bg-color;
|
|
14
|
+
background-color: #414141;
|
|
15
|
+
}
|
|
16
|
+
|
|
17
|
+
// Reboot
|
|
18
|
+
p {
|
|
19
|
+
margin-top: 0;
|
|
20
|
+
margin-bottom: 1.25rem;
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
// Typography
|
|
24
|
+
h1,
|
|
25
|
+
h2,
|
|
26
|
+
h3,
|
|
27
|
+
h4,
|
|
28
|
+
h5,
|
|
29
|
+
h6 {
|
|
30
|
+
color: $heading-color;
|
|
31
|
+
margin-top: 0;
|
|
32
|
+
margin-bottom: .5rem;
|
|
33
|
+
}
|
|
34
|
+
|
|
35
|
+
//reset link
|
|
36
|
+
a {
|
|
37
|
+
color: $link-color;
|
|
38
|
+
text-decoration: none;
|
|
39
|
+
transition: color .2s linear;
|
|
40
|
+
|
|
41
|
+
&:active,
|
|
42
|
+
&:focus {
|
|
43
|
+
outline: 0;
|
|
44
|
+
}
|
|
45
|
+
|
|
46
|
+
&:hover,
|
|
47
|
+
&:focus {
|
|
48
|
+
color: $primary-light;
|
|
49
|
+
}
|
|
50
|
+
}
|
|
51
|
+
|
|
52
|
+
a.link {
|
|
53
|
+
position: relative;
|
|
54
|
+
display: inline-block;
|
|
55
|
+
color: $link-color;
|
|
56
|
+
transition: color 0.2s linear;
|
|
57
|
+
|
|
58
|
+
&:after {
|
|
59
|
+
content: "";
|
|
60
|
+
display: block;
|
|
61
|
+
position: absolute;
|
|
62
|
+
left: 0;
|
|
63
|
+
bottom: 0px;
|
|
64
|
+
height: 1px;
|
|
65
|
+
width: 0;
|
|
66
|
+
background: $link-color;
|
|
67
|
+
transition: all 0.2 ease-in-out;
|
|
68
|
+
}
|
|
69
|
+
&:hover {
|
|
70
|
+
color: darken($link-color, 20%);
|
|
71
|
+
}
|
|
72
|
+
&:hover:after, :active:after, :focus:after {
|
|
73
|
+
width: 100%;
|
|
74
|
+
color: darken($link-color, 20%);
|
|
75
|
+
transition: all .35s cubic-bezier(.694,.048,.335,1);
|
|
76
|
+
}
|
|
77
|
+
}
|
|
78
|
+
|
|
79
|
+
em {
|
|
80
|
+
font-style: italic;
|
|
81
|
+
}
|
|
82
|
+
|
|
83
|
+
abbr[title] {
|
|
84
|
+
text-decoration: none;
|
|
85
|
+
}
|
|
86
|
+
|
|
87
|
+
mark {
|
|
88
|
+
background: #ff0;
|
|
89
|
+
color: $heading-color;
|
|
90
|
+
}
|
|
91
|
+
|
|
92
|
+
code {
|
|
93
|
+
padding: 2px 4px;
|
|
94
|
+
font-family: Consolas, "Liberation Mono", Menlo, Courier, monospace;
|
|
95
|
+
font-size: 0.9rem;
|
|
96
|
+
color: $code-text-color;
|
|
97
|
+
background-color: $code-bg-color;
|
|
98
|
+
border-radius: 0.3rem;
|
|
99
|
+
}
|
|
100
|
+
|
|
101
|
+
pre {
|
|
102
|
+
padding: 0.8rem;
|
|
103
|
+
margin-top: 0;
|
|
104
|
+
margin-bottom: 1rem;
|
|
105
|
+
overflow-x: auto;
|
|
106
|
+
font: 1rem Consolas, "Liberation Mono", Menlo, Courier, monospace;
|
|
107
|
+
color: $code-text-color;
|
|
108
|
+
word-wrap: normal;
|
|
109
|
+
background-color: $code-bg-color;
|
|
110
|
+
border: solid 1px $border-color;
|
|
111
|
+
border-radius: 0.3rem;
|
|
112
|
+
|
|
113
|
+
> code {
|
|
114
|
+
padding: 0;
|
|
115
|
+
margin: 0;
|
|
116
|
+
font-size: 0.9rem;
|
|
117
|
+
color: $code-text-color;
|
|
118
|
+
word-break: normal;
|
|
119
|
+
white-space: pre;
|
|
120
|
+
background: transparent;
|
|
121
|
+
border: 0;
|
|
122
|
+
}
|
|
123
|
+
}
|
|
@@ -0,0 +1,100 @@
|
|
|
1
|
+
.btn + .btn {
|
|
2
|
+
margin-top: 2em;
|
|
3
|
+
@include breakpoint(350px) {
|
|
4
|
+
margin-top: 0;
|
|
5
|
+
margin-left: 2em;
|
|
6
|
+
}
|
|
7
|
+
}
|
|
8
|
+
|
|
9
|
+
.btn, button, input[type="submit"],input[type="reset"],input[type="button"] {
|
|
10
|
+
position: relative;
|
|
11
|
+
display: inline-block;
|
|
12
|
+
padding: 18px 30px;
|
|
13
|
+
font-size: 11px;
|
|
14
|
+
font-family: inherit;
|
|
15
|
+
line-height: 1.5;
|
|
16
|
+
letter-spacing: 0.2em;
|
|
17
|
+
text-decoration: none;
|
|
18
|
+
text-transform: uppercase;
|
|
19
|
+
white-space: nowrap;
|
|
20
|
+
cursor: pointer;
|
|
21
|
+
color: $bg-color;
|
|
22
|
+
background-color: $button-dark;
|
|
23
|
+
text-align: center;
|
|
24
|
+
border: none;
|
|
25
|
+
border-radius: 0px;
|
|
26
|
+
transition: all 0.45s cubic-bezier(0.25, 1, 0.33, 1);
|
|
27
|
+
&:after {
|
|
28
|
+
display: none;
|
|
29
|
+
}
|
|
30
|
+
&:hover, :focus, :active {
|
|
31
|
+
color: $bg-color;
|
|
32
|
+
background-color: lighten($button-dark, 14%);
|
|
33
|
+
outline: 0;
|
|
34
|
+
}
|
|
35
|
+
}
|
|
36
|
+
.btn-lg {
|
|
37
|
+
padding: 20px 48px;
|
|
38
|
+
padding: 2rem 4.8rem;
|
|
39
|
+
position: relative;
|
|
40
|
+
}
|
|
41
|
+
|
|
42
|
+
.btn-primary {
|
|
43
|
+
background-color: $primary!important;
|
|
44
|
+
color: $bg-color!important;
|
|
45
|
+
&:hover, :focus, :active {
|
|
46
|
+
color: $bg-color;
|
|
47
|
+
background-color: $primary-light;
|
|
48
|
+
outline: 0;
|
|
49
|
+
}
|
|
50
|
+
}
|
|
51
|
+
|
|
52
|
+
.pill {
|
|
53
|
+
position: relative;
|
|
54
|
+
display: inline-block;
|
|
55
|
+
padding: 15px 42px;
|
|
56
|
+
font-size: 11px;
|
|
57
|
+
letter-spacing: 0.2em;
|
|
58
|
+
text-decoration: none;
|
|
59
|
+
text-transform: capitalize;
|
|
60
|
+
color: $bg-color;
|
|
61
|
+
background-color: $button-dark;
|
|
62
|
+
border-radius: 300px;
|
|
63
|
+
line-height: 1.5;
|
|
64
|
+
text-align: center;
|
|
65
|
+
border: none;
|
|
66
|
+
transition: all 0.45s cubic-bezier(0.25, 1, 0.33, 1);
|
|
67
|
+
&:after {
|
|
68
|
+
display: none;
|
|
69
|
+
}
|
|
70
|
+
&:hover, :focus, :active {
|
|
71
|
+
color: $bg-color;
|
|
72
|
+
background-color: $dark-light;
|
|
73
|
+
}
|
|
74
|
+
&:focus {
|
|
75
|
+
outline: none;
|
|
76
|
+
}
|
|
77
|
+
}
|
|
78
|
+
.pill-lg {
|
|
79
|
+
padding: 20px 48px;
|
|
80
|
+
padding: 2rem 4.8rem;
|
|
81
|
+
position: relative;
|
|
82
|
+
}
|
|
83
|
+
.btn-wrap {
|
|
84
|
+
text-align: center;
|
|
85
|
+
@include breakpoint($md) {
|
|
86
|
+
text-align: left;
|
|
87
|
+
}
|
|
88
|
+
}
|
|
89
|
+
.btn-center {
|
|
90
|
+
text-align: center;
|
|
91
|
+
}
|
|
92
|
+
|
|
93
|
+
button:disabled {
|
|
94
|
+
cursor: not-allowed;
|
|
95
|
+
opacity: .65;
|
|
96
|
+
transition: background-color .2s ease;
|
|
97
|
+
&:hover, :focus {
|
|
98
|
+
background-color: $button-dark;
|
|
99
|
+
}
|
|
100
|
+
}
|
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
.post-card {
|
|
2
|
+
display: block;
|
|
3
|
+
width: 100%;
|
|
4
|
+
min-height: 250px;
|
|
5
|
+
border-radius: 4px;
|
|
6
|
+
overflow: hidden;
|
|
7
|
+
background-color: $bg-color;
|
|
8
|
+
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
|
|
9
|
+
margin-bottom: 5.26316%;
|
|
10
|
+
|
|
11
|
+
@include breakpoint($md) {
|
|
12
|
+
width: 48.4375%;
|
|
13
|
+
margin-right: 3.125%;
|
|
14
|
+
|
|
15
|
+
&:last-of-type,
|
|
16
|
+
&:nth-child(2n+2) {
|
|
17
|
+
margin-right: 0;
|
|
18
|
+
}
|
|
19
|
+
}
|
|
20
|
+
|
|
21
|
+
@include breakpoint($xl) {
|
|
22
|
+
width: 31.25%;
|
|
23
|
+
margin-right: 3.125%;
|
|
24
|
+
|
|
25
|
+
&:nth-child(2n+2) {
|
|
26
|
+
margin-right: 3.125%;
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
&:last-of-type,
|
|
30
|
+
&:nth-child(3n+3) {
|
|
31
|
+
margin-right: 0;
|
|
32
|
+
}
|
|
33
|
+
}
|
|
34
|
+
}
|
|
35
|
+
|
|
36
|
+
.post-card--inner {
|
|
37
|
+
padding: 1.875rem 1.25rem;
|
|
38
|
+
}
|
|
@@ -0,0 +1,92 @@
|
|
|
1
|
+
input,
|
|
2
|
+
textarea {
|
|
3
|
+
display: inline-block;
|
|
4
|
+
padding: 5px 0;
|
|
5
|
+
width: 100%;
|
|
6
|
+
border: 0;
|
|
7
|
+
border-bottom: 2px solid $border;
|
|
8
|
+
outline: none;
|
|
9
|
+
font-family: $font-stack;
|
|
10
|
+
background: transparent;
|
|
11
|
+
|
|
12
|
+
&:focus {
|
|
13
|
+
border-color: $primary;
|
|
14
|
+
transition: border-color .25s;
|
|
15
|
+
}
|
|
16
|
+
}
|
|
17
|
+
|
|
18
|
+
.form__input {
|
|
19
|
+
position: relative;
|
|
20
|
+
display: inline-block;
|
|
21
|
+
width: 100%;
|
|
22
|
+
margin-bottom: 35px;
|
|
23
|
+
|
|
24
|
+
&::before {
|
|
25
|
+
content: "";
|
|
26
|
+
position: absolute;
|
|
27
|
+
bottom: 0;
|
|
28
|
+
left: 0;
|
|
29
|
+
width: 0;
|
|
30
|
+
height: 2px;
|
|
31
|
+
background: $primary;
|
|
32
|
+
z-index: 5;
|
|
33
|
+
transition: width .45s cubic-bezier(.694, .048, .335, 1);
|
|
34
|
+
transition-delay: .1s;
|
|
35
|
+
}
|
|
36
|
+
|
|
37
|
+
&::after {
|
|
38
|
+
content: "";
|
|
39
|
+
position: absolute;
|
|
40
|
+
bottom: 0;
|
|
41
|
+
left: 0;
|
|
42
|
+
width: 0;
|
|
43
|
+
height: 2px;
|
|
44
|
+
background: $secondary;
|
|
45
|
+
z-index: 4;
|
|
46
|
+
transition: width .45s cubic-bezier(.694, .048, .335, 1);
|
|
47
|
+
}
|
|
48
|
+
|
|
49
|
+
&:hover::after,
|
|
50
|
+
:focus:after,
|
|
51
|
+
:active:after {
|
|
52
|
+
width: 100%;
|
|
53
|
+
}
|
|
54
|
+
|
|
55
|
+
&:hover::before,
|
|
56
|
+
:focus::before,
|
|
57
|
+
:active::after {
|
|
58
|
+
width: 100%;
|
|
59
|
+
}
|
|
60
|
+
|
|
61
|
+
&.error {
|
|
62
|
+
&:hover::after,
|
|
63
|
+
:focus::after,
|
|
64
|
+
:active::after {
|
|
65
|
+
width: 0%;
|
|
66
|
+
}
|
|
67
|
+
|
|
68
|
+
&:hover::before,
|
|
69
|
+
:focus::before,
|
|
70
|
+
:active::after {
|
|
71
|
+
width: 0%;
|
|
72
|
+
}
|
|
73
|
+
}
|
|
74
|
+
}
|
|
75
|
+
|
|
76
|
+
.error {
|
|
77
|
+
input {
|
|
78
|
+
border-bottom-color: $error;
|
|
79
|
+
}
|
|
80
|
+
|
|
81
|
+
textarea {
|
|
82
|
+
border-bottom-color: $error;
|
|
83
|
+
}
|
|
84
|
+
}
|
|
85
|
+
|
|
86
|
+
.error-data {
|
|
87
|
+
color: $error;
|
|
88
|
+
font-size: 14px;
|
|
89
|
+
position: absolute;
|
|
90
|
+
left: 0;
|
|
91
|
+
bottom: -21px;
|
|
92
|
+
}
|
|
@@ -0,0 +1,60 @@
|
|
|
1
|
+
.highlight { background: #ffffff; }
|
|
2
|
+
.highlight .c { color: #999988; font-style: italic } /* Comment */
|
|
3
|
+
.highlight .err { color: #a61717; background-color: #e3d2d2 } /* Error */
|
|
4
|
+
.highlight .k { font-weight: bold } /* Keyword */
|
|
5
|
+
.highlight .o { font-weight: bold } /* Operator */
|
|
6
|
+
.highlight .cm { color: #999988; font-style: italic } /* Comment.Multiline */
|
|
7
|
+
.highlight .cp { color: #999999; font-weight: bold } /* Comment.Preproc */
|
|
8
|
+
.highlight .c1 { color: #999988; font-style: italic } /* Comment.Single */
|
|
9
|
+
.highlight .cs { color: #999999; font-weight: bold; font-style: italic } /* Comment.Special */
|
|
10
|
+
.highlight .gd { color: #000000; background-color: #ffdddd } /* Generic.Deleted */
|
|
11
|
+
.highlight .gd .x { color: #000000; background-color: #ffaaaa } /* Generic.Deleted.Specific */
|
|
12
|
+
.highlight .ge { font-style: italic } /* Generic.Emph */
|
|
13
|
+
.highlight .gr { color: #aa0000 } /* Generic.Error */
|
|
14
|
+
.highlight .gh { color: #999999 } /* Generic.Heading */
|
|
15
|
+
.highlight .gi { color: #000000; background-color: #ddffdd } /* Generic.Inserted */
|
|
16
|
+
.highlight .gi .x { color: #000000; background-color: #aaffaa } /* Generic.Inserted.Specific */
|
|
17
|
+
.highlight .go { color: #888888 } /* Generic.Output */
|
|
18
|
+
.highlight .gp { color: #555555 } /* Generic.Prompt */
|
|
19
|
+
.highlight .gs { font-weight: bold } /* Generic.Strong */
|
|
20
|
+
.highlight .gu { color: #aaaaaa } /* Generic.Subheading */
|
|
21
|
+
.highlight .gt { color: #aa0000 } /* Generic.Traceback */
|
|
22
|
+
.highlight .kc { font-weight: bold } /* Keyword.Constant */
|
|
23
|
+
.highlight .kd { font-weight: bold } /* Keyword.Declaration */
|
|
24
|
+
.highlight .kp { font-weight: bold } /* Keyword.Pseudo */
|
|
25
|
+
.highlight .kr { font-weight: bold } /* Keyword.Reserved */
|
|
26
|
+
.highlight .kt { color: #445588; font-weight: bold } /* Keyword.Type */
|
|
27
|
+
.highlight .m { color: #009999 } /* Literal.Number */
|
|
28
|
+
.highlight .s { color: #d14 } /* Literal.String */
|
|
29
|
+
.highlight .na { color: #008080 } /* Name.Attribute */
|
|
30
|
+
.highlight .nb { color: #0086B3 } /* Name.Builtin */
|
|
31
|
+
.highlight .nc { color: #445588; font-weight: bold } /* Name.Class */
|
|
32
|
+
.highlight .no { color: #008080 } /* Name.Constant */
|
|
33
|
+
.highlight .ni { color: #800080 } /* Name.Entity */
|
|
34
|
+
.highlight .ne { color: #990000; font-weight: bold } /* Name.Exception */
|
|
35
|
+
.highlight .nf { color: #990000; font-weight: bold } /* Name.Function */
|
|
36
|
+
.highlight .nn { color: #555555 } /* Name.Namespace */
|
|
37
|
+
.highlight .nt { color: #000080 } /* Name.Tag */
|
|
38
|
+
.highlight .nv { color: #008080 } /* Name.Variable */
|
|
39
|
+
.highlight .ow { font-weight: bold } /* Operator.Word */
|
|
40
|
+
.highlight .w { color: #bbbbbb } /* Text.Whitespace */
|
|
41
|
+
.highlight .mf { color: #009999 } /* Literal.Number.Float */
|
|
42
|
+
.highlight .mh { color: #009999 } /* Literal.Number.Hex */
|
|
43
|
+
.highlight .mi { color: #009999 } /* Literal.Number.Integer */
|
|
44
|
+
.highlight .mo { color: #009999 } /* Literal.Number.Oct */
|
|
45
|
+
.highlight .sb { color: #d14 } /* Literal.String.Backtick */
|
|
46
|
+
.highlight .sc { color: #d14 } /* Literal.String.Char */
|
|
47
|
+
.highlight .sd { color: #d14 } /* Literal.String.Doc */
|
|
48
|
+
.highlight .s2 { color: #d14 } /* Literal.String.Double */
|
|
49
|
+
.highlight .se { color: #d14 } /* Literal.String.Escape */
|
|
50
|
+
.highlight .sh { color: #d14 } /* Literal.String.Heredoc */
|
|
51
|
+
.highlight .si { color: #d14 } /* Literal.String.Interpol */
|
|
52
|
+
.highlight .sx { color: #d14 } /* Literal.String.Other */
|
|
53
|
+
.highlight .sr { color: #009926 } /* Literal.String.Regex */
|
|
54
|
+
.highlight .s1 { color: #d14 } /* Literal.String.Single */
|
|
55
|
+
.highlight .ss { color: #990073 } /* Literal.String.Symbol */
|
|
56
|
+
.highlight .bp { color: #999999 } /* Name.Builtin.Pseudo */
|
|
57
|
+
.highlight .vc { color: #008080 } /* Name.Variable.Class */
|
|
58
|
+
.highlight .vg { color: #008080 } /* Name.Variable.Global */
|
|
59
|
+
.highlight .vi { color: #008080 } /* Name.Variable.Instance */
|
|
60
|
+
.highlight .il { color: #009999 } /* Literal.Number.Integer.Long */
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
table {
|
|
2
|
+
display: table;
|
|
3
|
+
width: 100%;
|
|
4
|
+
overflow-x: auto;
|
|
5
|
+
margin-bottom: 1.25rem;
|
|
6
|
+
border-collapse: collapse;
|
|
7
|
+
border-spacing: 0;
|
|
8
|
+
border: 1px solid #e0e0e0;
|
|
9
|
+
border-radius: 4px;
|
|
10
|
+
font-size: 14.5px;
|
|
11
|
+
|
|
12
|
+
th {
|
|
13
|
+
background-color: #f5f5f5;
|
|
14
|
+
}
|
|
15
|
+
|
|
16
|
+
th,
|
|
17
|
+
td {
|
|
18
|
+
padding: 6px 13px;
|
|
19
|
+
border: 1px solid #dfe2e5;
|
|
20
|
+
}
|
|
21
|
+
}
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
.to-top {
|
|
2
|
+
position: fixed;
|
|
3
|
+
display: block;
|
|
4
|
+
text-align: center;
|
|
5
|
+
right: 15px;
|
|
6
|
+
bottom: 0;
|
|
7
|
+
cursor: pointer;
|
|
8
|
+
height: 35px;
|
|
9
|
+
width: 35px;
|
|
10
|
+
background-color: rgba(103, 103, 103, 0.65);
|
|
11
|
+
z-index: 2;
|
|
12
|
+
transform: translate3d(0, 60px, 0);
|
|
13
|
+
transition: all 0.3s ease;
|
|
14
|
+
|
|
15
|
+
@include breakpoint($md) {
|
|
16
|
+
right: 1.8em;
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
&.js-show {
|
|
20
|
+
transform: translate3d(0, -15px, 0);
|
|
21
|
+
|
|
22
|
+
@include breakpoint($md) {
|
|
23
|
+
transform: translate3d(0, -28px, 0);
|
|
24
|
+
}
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
&:hover {
|
|
28
|
+
background-color: rgba(103, 103, 103, 0.80);
|
|
29
|
+
}
|
|
30
|
+
}
|