taletype 0.1.1

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.
@@ -0,0 +1,39 @@
1
+ .catalogue {
2
+ &-item {
3
+ border-bottom: 1px solid $grey-2;
4
+ color: $default-color;
5
+ display: block;
6
+ padding: 2rem 0;
7
+
8
+ &:hover .catalogue-line,
9
+ &:focus .catalogue-line {
10
+ width: 5rem;
11
+ }
12
+
13
+ &:last-child {
14
+ border: 0;
15
+ }
16
+ }
17
+
18
+ &-time {
19
+ color: $default-tint;
20
+ font-family: $serif-secondary;
21
+ letter-spacing: .5px;
22
+ }
23
+
24
+ &-title {
25
+ color: $default-shade;
26
+ display: block;
27
+ font-family: $sans-serif;
28
+ font-size: 1.5rem;
29
+ font-weight: 700;
30
+ margin: .5rem 0;
31
+ }
32
+
33
+ &-line {
34
+ @include transition(all .3s ease-out);
35
+ border-top: .2rem solid $default-shade;
36
+ display: block;
37
+ width: 2rem;
38
+ }
39
+ }
@@ -0,0 +1,46 @@
1
+ pre,
2
+ code {
3
+ font-family: $monospaced;
4
+ }
5
+
6
+ code {
7
+ background-color: $grey-3;
8
+ border-radius: 3px;
9
+ color: $code-color;
10
+ font-size: 85%;
11
+ padding: .25em .5em;
12
+ }
13
+
14
+ pre {
15
+ margin: 0 0 1rem;
16
+ }
17
+
18
+ pre code {
19
+ background-color: transparent;
20
+ color: inherit;
21
+ font-size: 100%;
22
+ padding: 0;
23
+ }
24
+
25
+ .highlight {
26
+ background-color: $grey-3;
27
+ border-radius: 3px;
28
+ line-height: 1.4;
29
+ margin: 0 0 1rem;
30
+ padding: 1rem;
31
+
32
+ pre {
33
+ margin-bottom: 0;
34
+ overflow-x: auto;
35
+ }
36
+
37
+ .lineno {
38
+ color: $default-tint;
39
+ display: inline-block; // Ensures the null space also isn't selectable
40
+ padding: 0 .75rem 0 .25rem;
41
+ // Make sure numbers aren't selectable
42
+ -webkit-user-select: none;
43
+ -moz-user-select: none;
44
+ user-select: none;
45
+ }
46
+ }
@@ -0,0 +1,92 @@
1
+ .container {
2
+ margin: 0 auto;
3
+ max-width: 800px;
4
+ width: 80%;
5
+ }
6
+
7
+ main,
8
+ footer,
9
+ .nav-container {
10
+ display: block;
11
+ margin: 0 auto;
12
+ max-width: 800px;
13
+ width: 80%;
14
+ }
15
+
16
+ .nav {
17
+ box-shadow: 0 2px 2px -2px $shadow-color;
18
+ overflow: auto;
19
+
20
+ &-container {
21
+ margin: 1rem auto;
22
+ position: relative;
23
+ text-align: center;
24
+ }
25
+
26
+ &-title {
27
+ @include transition(all .2s ease-out);
28
+ color: $default-color;
29
+ display: inline-block;
30
+ margin: 0;
31
+ padding-right: .2rem;
32
+
33
+ &:hover,
34
+ &:focus {
35
+ opacity: .6;
36
+ }
37
+ }
38
+
39
+ ul {
40
+ list-style-type: none;
41
+ margin: 1rem 0 0;
42
+ padding: 0;
43
+ text-align: center;
44
+ }
45
+
46
+ li {
47
+ @include transition(all .2s ease-out);
48
+ color: $default-color;
49
+ display: inline-block;
50
+ opacity: .6;
51
+ padding: 0 2rem 0 0;
52
+
53
+ &:last-child {
54
+ padding-right: 0;
55
+ }
56
+
57
+ &:hover,
58
+ &:focus {
59
+ opacity: 1;
60
+ }
61
+ }
62
+
63
+ a {
64
+ color: $default-color;
65
+ font-family: $sans-serif;
66
+ }
67
+ }
68
+
69
+ @media (min-width: 600px) {
70
+ .nav {
71
+ &-container {
72
+ text-align: left;
73
+ }
74
+
75
+ ul {
76
+ bottom: 0;
77
+ position: absolute;
78
+ right: 0;
79
+ }
80
+ }
81
+ }
82
+
83
+ footer {
84
+ font-family: $serif-secondary;
85
+ padding: 2rem 0;
86
+ text-align: center;
87
+
88
+ span {
89
+ color: $default-color;
90
+ font-size: .8rem;
91
+ }
92
+ }
@@ -0,0 +1,44 @@
1
+ .pagination {
2
+ border-top: .5px solid $grey-2;
3
+ font-family: $serif-secondary;
4
+ padding-top: 2rem;
5
+ position: relative;
6
+ text-align: center;
7
+
8
+ span {
9
+ color: $default-shade;
10
+ font-size: 1.1rem;
11
+ }
12
+
13
+ .top {
14
+ @include transition(all .3s ease-out);
15
+ color: $default-color;
16
+ font-family: $sans-serif;
17
+ font-size: 1.1rem;
18
+ opacity: .6;
19
+
20
+ &:hover {
21
+ opacity: 1;
22
+ }
23
+ }
24
+
25
+ .arrow {
26
+ @include transition(all .3s ease-out);
27
+ color: $default-color;
28
+ position: absolute;
29
+
30
+ &:hover,
31
+ &:focus {
32
+ opacity: .6;
33
+ text-decoration: none;
34
+ }
35
+ }
36
+
37
+ .left {
38
+ left: 0;
39
+ }
40
+
41
+ .right {
42
+ right: 0;
43
+ }
44
+ }
@@ -0,0 +1,98 @@
1
+ .post {
2
+ padding: 3rem 0;
3
+ font-size: 18px;
4
+ line-height: 20px;
5
+ // @media (min-width: 600px) {
6
+ // font-size: 19px;
7
+ // }
8
+
9
+ &-info {
10
+ color: $default-tint;
11
+ font-family: $serif-secondary;
12
+ letter-spacing: 0.5px;
13
+ text-align: center;
14
+ margin-bottom: 25px;
15
+
16
+ span {
17
+ font-style: italic;
18
+ }
19
+ }
20
+
21
+ &-title {
22
+ color: $default-shade;
23
+ font-family: $sans-serif;
24
+ font-size: 2rem;
25
+ margin: 1rem 0;
26
+ text-align: center;
27
+ }
28
+
29
+ &-line {
30
+ border-top: 0.4rem solid $default-shade;
31
+ display: block;
32
+ margin: 0 auto 3rem;
33
+ width: 5rem;
34
+ }
35
+
36
+ p {
37
+ margin: 0 0 1rem;
38
+ text-align: justify;
39
+ }
40
+
41
+ a:hover {
42
+ text-decoration: underline;
43
+ }
44
+
45
+ img {
46
+ margin: 0 auto 0.5rem;
47
+ }
48
+
49
+ img + em {
50
+ color: $default-tint;
51
+ display: block;
52
+ font-family: $sans-serif;
53
+ font-size: 0.9rem;
54
+ font-style: normal;
55
+ text-align: center;
56
+ }
57
+
58
+ // CSS for making emoji inline
59
+ img.emoji {
60
+ display: inline-block;
61
+ left: 0;
62
+ transform: none;
63
+ width: 1rem;
64
+ height: 1rem;
65
+ vertical-align: text-top;
66
+ padding: 0;
67
+ margin: 0;
68
+ }
69
+
70
+ .footnotes {
71
+ margin-top: 30px;
72
+ font-size: 14px;
73
+ }
74
+ }
75
+
76
+ .tags {
77
+ a {
78
+ display: inline-block;
79
+ padding: quarter($base-spacing-unit) $base-spacing-unit;
80
+ margin: 0 $base-spacing-unit quarter($base-spacing-unit) 0;
81
+
82
+ font-size: $font-size-small;
83
+ font-family: $font-base;
84
+ line-height: $line-height-medium;
85
+
86
+ background-color: $bg-color-gray;
87
+ transition: $global-transition;
88
+
89
+ @include attention() {
90
+ text-decoration: none;
91
+ background-color: $bg-color-gray;
92
+ }
93
+ }
94
+
95
+ @include mq($until: tablet) {
96
+ margin-bottom: $line-height-medium - half(quarter($line-height-medium));
97
+ }
98
+ }
@@ -0,0 +1,65 @@
1
+ .highlight .hll { background-color: #ffc; }
2
+ .highlight .c { color: #999; } /* Comment */
3
+ .highlight .err { color: #a00; background-color: #faa } /* Error */
4
+ .highlight .k { color: #069; } /* Keyword */
5
+ .highlight .o { color: #555 } /* Operator */
6
+ .highlight .cm { color: #09f; font-style: italic } /* Comment.Multiline */
7
+ .highlight .cp { color: #099 } /* Comment.Preproc */
8
+ .highlight .c1 { color: #999; } /* Comment.Single */
9
+ .highlight .cs { color: #999; } /* Comment.Special */
10
+ .highlight .gd { background-color: #fcc; border: 1px solid #c00 } /* Generic.Deleted */
11
+ .highlight .ge { font-style: italic } /* Generic.Emph */
12
+ .highlight .gr { color: #f00 } /* Generic.Error */
13
+ .highlight .gh { color: #030; } /* Generic.Heading */
14
+ .highlight .gi { background-color: #cfc; border: 1px solid #0c0 } /* Generic.Inserted */
15
+ .highlight .go { color: #aaa } /* Generic.Output */
16
+ .highlight .gp { color: #009; } /* Generic.Prompt */
17
+ .highlight .gs { } /* Generic.Strong */
18
+ .highlight .gu { color: #030; } /* Generic.Subheading */
19
+ .highlight .gt { color: #9c6 } /* Generic.Traceback */
20
+ .highlight .kc { color: #069; } /* Keyword.Constant */
21
+ .highlight .kd { color: #069; } /* Keyword.Declaration */
22
+ .highlight .kn { color: #069; } /* Keyword.Namespace */
23
+ .highlight .kp { color: #069 } /* Keyword.Pseudo */
24
+ .highlight .kr { color: #069; } /* Keyword.Reserved */
25
+ .highlight .kt { color: #078; } /* Keyword.Type */
26
+ .highlight .m { color: #f60 } /* Literal.Number */
27
+ .highlight .s { color: #d44950 } /* Literal.String */
28
+ .highlight .na { color: #4f9fcf } /* Name.Attribute */
29
+ .highlight .nb { color: #366 } /* Name.Builtin */
30
+ .highlight .nc { color: #0a8; } /* Name.Class */
31
+ .highlight .no { color: #360 } /* Name.Constant */
32
+ .highlight .nd { color: #99f } /* Name.Decorator */
33
+ .highlight .ni { color: #999; } /* Name.Entity */
34
+ .highlight .ne { color: #c00; } /* Name.Exception */
35
+ .highlight .nf { color: #c0f } /* Name.Function */
36
+ .highlight .nl { color: #99f } /* Name.Label */
37
+ .highlight .nn { color: #0cf; } /* Name.Namespace */
38
+ .highlight .nt { color: #2f6f9f; } /* Name.Tag */
39
+ .highlight .nv { color: #033 } /* Name.Variable */
40
+ .highlight .ow { color: #000; } /* Operator.Word */
41
+ .highlight .w { color: #bbb } /* Text.Whitespace */
42
+ .highlight .mf { color: #f60 } /* Literal.Number.Float */
43
+ .highlight .mh { color: #f60 } /* Literal.Number.Hex */
44
+ .highlight .mi { color: #f60 } /* Literal.Number.Integer */
45
+ .highlight .mo { color: #f60 } /* Literal.Number.Oct */
46
+ .highlight .sb { color: #c30 } /* Literal.String.Backtick */
47
+ .highlight .sc { color: #c30 } /* Literal.String.Char */
48
+ .highlight .sd { color: #c30; font-style: italic } /* Literal.String.Doc */
49
+ .highlight .s2 { color: #c30 } /* Literal.String.Double */
50
+ .highlight .se { color: #c30; } /* Literal.String.Escape */
51
+ .highlight .sh { color: #c30 } /* Literal.String.Heredoc */
52
+ .highlight .si { color: #a00 } /* Literal.String.Interpol */
53
+ .highlight .sx { color: #c30 } /* Literal.String.Other */
54
+ .highlight .sr { color: #3aa } /* Literal.String.Regex */
55
+ .highlight .s1 { color: #c30 } /* Literal.String.Single */
56
+ .highlight .ss { color: #fc3 } /* Literal.String.Symbol */
57
+ .highlight .bp { color: #366 } /* Name.Builtin.Pseudo */
58
+ .highlight .vc { color: #033 } /* Name.Variable.Class */
59
+ .highlight .vg { color: #033 } /* Name.Variable.Global */
60
+ .highlight .vi { color: #033 } /* Name.Variable.Instance */
61
+ .highlight .il { color: #f60 } /* Literal.Number.Integer.Long */
62
+
63
+ .css .o,
64
+ .css .o + .nt,
65
+ .css .nt + .nt { color: #999; }
@@ -0,0 +1,29 @@
1
+ // Colors
2
+ $default-color: #555;
3
+ $default-shade: #353535;
4
+ $default-tint: #aaa;
5
+ $grey-1: #979797;
6
+ $grey-2: #e5e5e5;
7
+ $grey-3: #f9f9f9;
8
+ $white: #fff;
9
+ $blue: #4a9ae1;
10
+ $shadow-color: rgba(0, 0, 0, .2);
11
+ $code-color: #bf616a;
12
+
13
+ // Fonts
14
+ $serif-primary: '-apple-system', 'BlinkMacSystemFont', 'Segoe UI', 'Helvetica', 'Microsoft YaHei', 'Times New Roman', Times, serif;
15
+ $serif-secondary: Palatino, 'Palatino LT STD', 'Palatino Linotype', 'Book Antiqua', 'Georgia', serif;
16
+ $sans-serif: 'Helvetica Neue', 'Segoe UI', Helvetica, Arial, sans-serif;
17
+ $monospaced: Menlo, Monaco, monospace;
18
+
19
+ @mixin box-sizing($type: border-box) {
20
+ -webkit-box-sizing: $type;
21
+ -moz-box-sizing: $type;
22
+ box-sizing: $type;
23
+ }
24
+
25
+ @mixin transition($args...) {
26
+ -webkit-transition: $args;
27
+ -moz-transition: $args;
28
+ transition: $args;
29
+ }
@@ -0,0 +1,9 @@
1
+ // *----------------------------------*\
2
+ // Type
3
+ // *----------------------------------*/
4
+
5
+ @import 'mq';
6
+ @import 'mixins';
7
+ @import 'functions';
8
+
9
+ @import 'variables';
@@ -0,0 +1,19 @@
1
+ // *----------------------------------*\
2
+ // Tools > Functions
3
+ // *----------------------------------*/
4
+
5
+ @function half($n) {
6
+ @return round($n / 2);
7
+ }
8
+
9
+ @function quarter($n) {
10
+ @return round($n / 4);
11
+ }
12
+
13
+ @function double($n) {
14
+ @return round($n * 2);
15
+ }
16
+
17
+ @function quadruple($n) {
18
+ @return round($n * 4);
19
+ }