github-docs 0.0.17 → 0.0.18

Sign up to get free protection for your applications and to get access to all the features.
@@ -0,0 +1,79 @@
1
+ // Base color variations
2
+ $orange-invert: findColorInvert($orange) !default;
3
+ $yellow-invert: findColorInvert($yellow) !default;
4
+ $green-invert: findColorInvert($green) !default;
5
+ $turquoise-invert: findColorInvert($turquoise) !default;
6
+ $cyan-invert: findColorInvert($cyan) !default;
7
+ $blue-invert: findColorInvert($blue) !default;
8
+ $purple-invert: findColorInvert($purple) !default;
9
+ $red-invert: findColorInvert($red) !default;
10
+
11
+ // App color variations
12
+ $primary-invert: findColorInvert($primary) !default;
13
+ $primary-light: findLightColor($primary) !default;
14
+ $primary-dark: findDarkColor($primary) !default;
15
+ $secondary-invert: findColorInvert($secondary) !default;
16
+ $secondary-light: findLightColor($secondary) !default;
17
+ $secondary-dark: findDarkColor($secondary) !default;
18
+ $success-invert: findColorInvert($success) !default;
19
+ $success-light: findLightColor($success) !default;
20
+ $success-dark: findDarkColor($success) !default;
21
+ $info-invert: findColorInvert($info) !default;
22
+ $info-light: findLightColor($info) !default;
23
+ $info-dark: findDarkColor($info) !default;
24
+ $warning-invert: findColorInvert($warning) !default;
25
+ $warning-light: findLightColor($warning) !default;
26
+ $warning-dark: findDarkColor($warning) !default;
27
+ $danger-invert: findColorInvert($danger) !default;
28
+ $danger-light: findLightColor($danger) !default;
29
+ $danger-dark: findDarkColor($danger) !default;
30
+ $text-invert: findColorInvert($text) !default;
31
+ $text-light-invert: findColorInvert($text-light) !default;
32
+ $text-lighter-invert: findColorInvert($text-lighter) !default;
33
+ $text-strong-invert: findColorInvert($text-strong) !default;
34
+ $link-invert: findColorInvert($link) !default;
35
+ $link--hover-invert: findColorInvert($link--hover) !default;
36
+ $link--focus-invert: findColorInvert($link--focus) !default;
37
+
38
+ // Lists and maps
39
+ $custom-gradients: ("grad1": (160deg, $primary, darken($primary, 10%), darken($primary, 15%))) !default;
40
+ $custom-colors: (/* E.g. "COLOR_NAME": (#000, #fff), ... */) !default;
41
+ $forms: (/* E.g. ("input-background": #000), ... */) !default;
42
+
43
+ // Convert gradients into colors.
44
+ @each $name, $gradient in $custom-gradients {
45
+ // $gradient is a non-bracketed list which is confusing when debugging
46
+ $value: getColorVariations([getFirstColor($gradient), $gradient]);
47
+ $custom-colors: map-merge($custom-colors, ($name: $value));
48
+ }
49
+
50
+ $app-colors: mergeColorMaps((
51
+ "white": ($white, $black, null, null, null),
52
+ "black": ($black, $white, null, null, null),
53
+ "primary": ($primary, $primary-invert, $primary-light, $primary-dark, null),
54
+ "secondary": ($secondary, $secondary-invert, $secondary-light, $secondary-dark, null),
55
+ "info": ($info, $info-invert, $info-light, $info-dark, null),
56
+ "success": ($success, $success-invert, $success-light, $success-dark, null),
57
+ "warning": ($warning, $warning-invert, $warning-light, $warning-dark, null),
58
+ "danger": ($danger, $danger-invert, $danger-light, $danger-dark, null),
59
+ "text": ($text, $text-invert, null, null, null),
60
+ "light": ($text-light, $text-light-invert, null, null, null),
61
+ "lighter": ($text-lighter, $text-lighter-invert, null, null, null),
62
+ "strong": ($text-strong, $text-strong-invert, null, null, null),
63
+ "link": ($link, $link-invert, null, null, null),
64
+ "link--hover": ($link--hover, $link--hover-invert, null, null, null),
65
+ "link--focus": ($link--focus, $link--focus-invert, null, null, null),
66
+ ), $custom-colors) !default;
67
+
68
+ $shades: (
69
+ "black-light": $black-light,
70
+ "black-lighter": $black-lighter,
71
+ "black-lightest": $black-lightest,
72
+ "grey": $grey,
73
+ "grey-light": $grey-light,
74
+ "grey-lighter": $grey-lighter,
75
+ "grey-lightest": $grey-lightest,
76
+ "white-dark": $white-dark,
77
+ "white-darker": $white-darker,
78
+ "white-darkest": $white-darkest
79
+ ) !default;
@@ -0,0 +1,48 @@
1
+ @import "functions.scss";
2
+
3
+ // Base colors
4
+ $black: hsl(0, 0%, 0%) !default;
5
+ $black-light: hsl(0, 0%, 7%) !default;
6
+ $black-lighter: hsl(0, 0%, 13%) !default;
7
+ $black-lightest: hsl(0, 0%, 17%) !default;
8
+
9
+ $grey: hsl(0, 0%, 27%) !default;
10
+ $grey-light: hsl(0, 0%, 47%) !default;
11
+ $grey-lighter: hsl(0, 0%, 73%) !default;
12
+ $grey-lightest: hsl(0, 0%, 91%) !default;
13
+
14
+ $white-darkest: hsl(0, 0%, 94%) !default;
15
+ $white-darker: hsl(0, 0%, 96%) !default;
16
+ $white-dark: hsl(0, 0%, 98%) !default;
17
+ $white: hsl(0, 0%, 100%) !default;
18
+
19
+ $orange: hsl(14, 100%, 53%) !default;
20
+ $yellow: hsl(48, 100%, 67%) !default;
21
+ $green: hsl(141, 53%, 53%) !default;
22
+ $turquoise: hsl(171, 100%, 41%) !default;
23
+ $cyan: hsl(204, 71%, 53%) !default;
24
+ $blue: hsl(217, 71%, 53%) !default;
25
+ $violet: hsl(259, 100%, 67%) !default;
26
+ $purple: hsl(271, 100%, 71%) !default;
27
+ $red: hsl(348, 86%, 61%) !default;
28
+
29
+ // App colors
30
+ $primary: $violet !default;
31
+ $secondary: $blue !default;
32
+ $success: $green !default;
33
+ $info: $blue !default;
34
+ $warning: $yellow !default;
35
+ $danger: $red !default;
36
+ $text: $black-light !default;
37
+ $text-light: $grey !default;
38
+ $text-lighter: $grey-light !default;
39
+ $text-strong: $black !default;
40
+ $link: $black-light !default;
41
+ $link--hover: $blue !default;
42
+ $link--focus: $blue !default;
43
+
44
+ // Breakpoints
45
+ $breakpoint-lg: 1023px !default; /*desktop*/
46
+ $breakpoint-md: 768px !default; /*tablet*/
47
+ $breakpoint-sm: 590px !default; /*mobile*/
48
+ $breakpoint-xs: 589px !default; /*mobile*/
data/_sass/main.scss ADDED
@@ -0,0 +1,256 @@
1
+ $sidebar-width: 250px;
2
+ $sidebar-bg: #f8f8fb; //rgba(#f5f5fa, 0.7);
3
+ $sidebar-heading-height: 80px;
4
+ $menu-color: #483973;
5
+
6
+ /* --- Main -------------------------- */
7
+
8
+ .docs {
9
+ max-width: 1400px;
10
+ margin: 0 auto;
11
+ }
12
+ .main {
13
+ display: block;
14
+ margin-left: $sidebar-width;
15
+ }
16
+ .main-body {
17
+ display: block;
18
+ max-width: 910px;
19
+ margin: 0 auto;
20
+ padding: 40px;
21
+ padding-top: 50px;
22
+ padding-bottom: 60px;
23
+ }
24
+ .main-edit-pencil {
25
+ float: right;
26
+ display: block;
27
+ margin-top: 24px !important;
28
+ padding: 10px;
29
+ line-height: 0em;
30
+ border-radius: 6px;
31
+ color: #6a737d;
32
+ background: transparent;
33
+ transition: .2s cubic-bezier(.3,0,.5,1);
34
+ transition-property: color,background-color,border-color;
35
+ svg {
36
+ fill: #6a737d;
37
+ }
38
+ &:hover,
39
+ &:focus,
40
+ &:active {
41
+ background-color: #F3F4F6;
42
+ border-color: #1b1f2326;
43
+ transition-duration: .1s;
44
+ }
45
+ }
46
+ .markdown-body {
47
+ > .main-edit-pencil + * {
48
+ margin-top: 0 !important;
49
+ }
50
+ }
51
+ .main-heading {
52
+ display: block;
53
+ }
54
+ @media (max-width: 800px) {
55
+ .main {
56
+ margin-left: 0;
57
+ }
58
+ }
59
+
60
+ /* --- Sidebar ----------------------- */
61
+
62
+ .sidebar {
63
+ position: fixed;
64
+ top: 0;
65
+ width: $sidebar-width;
66
+ height: 100vh;
67
+ background: $sidebar-bg;
68
+ border-right: 1px solid darken($sidebar-bg, 3%);
69
+ z-index: 2;
70
+ }
71
+ .sidebar:after {
72
+ content: "";
73
+ position: absolute;
74
+ top: 0;
75
+ left: -10000px;
76
+ right: 100%;
77
+ bottom: 0;
78
+ background: $sidebar-bg;
79
+ }
80
+ .sidebar-heading {
81
+ height: $sidebar-heading-height;
82
+ display: flex;
83
+ align-items: center;
84
+ justify-content: space-between;
85
+ border-bottom: 1px solid #eee;
86
+ font-family: 'Roboto', sans-serif;
87
+ font-size: 1.5em;
88
+ font-weight: 900;
89
+ letter-spacing: -0.5px;
90
+ }
91
+ .sidebar-heading a {
92
+ color: #232035;
93
+ text-decoration: none;
94
+ }
95
+ .sidebar-heading button {
96
+ flex: 0;
97
+ padding: 9px 25px;
98
+ font-size: 14px;
99
+ font-weight: 600;
100
+ line-height: 1.5em;
101
+ color: #fff;
102
+ background-color: #483973;
103
+ border-radius: 3px;
104
+ border: 0;
105
+ box-shadow: 0 4px 6px rgba(50,50,93,0.11), 0 1px 3px rgba(0,0,0,0.08);
106
+ transition: box-shadow 0.2s ease;
107
+ cursor: pointer;
108
+ }
109
+ .sidebar-heading button:hover {
110
+ box-shadow: 0 4px 6px rgba(50,50,93,0.3), 0 1px 3px rgba(0,0,0,0.3);
111
+ }
112
+ .sidebar-close,
113
+ .sidebar-heading,
114
+ .navigation-list-link {
115
+ padding-left: 30px;
116
+ padding-right: 30px;
117
+ }
118
+ .sidebar-nav {
119
+ position: relative;
120
+ z-index: 11;
121
+ padding: 0px 1px;
122
+ }
123
+
124
+ /* sidebar heading mobile */
125
+
126
+ .sidebar-heading-mobile {
127
+ border-bottom: 1px solid #eee;
128
+ }
129
+ .sidebar-close {
130
+ display: flex;
131
+ align-items: center;
132
+ height: $sidebar-heading-height - 10px;
133
+ cursor: pointer;
134
+ padding: 0 25px;
135
+ }
136
+ .sidebar-close img {
137
+ width: 22px;
138
+ margin-left: -2px;
139
+ }
140
+ @media (max-width: 800px) {
141
+ .sidebar {
142
+ position: static;
143
+ top: auto;
144
+ width: 100%;
145
+ height: auto;
146
+ background: none;
147
+ }
148
+ .sidebar-nav {
149
+ position: fixed;
150
+ left: -$sidebar-width;
151
+ top: 0;
152
+ width: $sidebar-width;
153
+ height: 100vh;
154
+ background: $sidebar-bg;
155
+ border-right: 1px solid darken($sidebar-bg, 3%);
156
+ box-shadow: rgba(0, 0, 0, 0.14) 0px 0px 4px, rgba(0, 0, 0, 0.28) 0px 4px 8px;
157
+ transition: transform 400ms cubic-bezier(0.4, 0, 0, 1);
158
+ transform: translate(0, 0);
159
+ }
160
+ .sidebar-heading,
161
+ .sidebar-close,
162
+ .navigation-list-link {
163
+ padding-left: 40px;
164
+ padding-right: 40px;
165
+ }
166
+ .sidebar-overlay {
167
+ position: fixed;
168
+ top: 0;
169
+ left: 0;
170
+ right: 100%;
171
+ bottom: 0;
172
+ z-index: 0;
173
+ opacity: 0;
174
+ background-color: rgba(24, 48, 85, 0.3);
175
+ transition: opacity 250ms ease-in-out, right 0s 250ms;
176
+ }
177
+ .nav-open .sidebar-nav {
178
+ transform: translate($sidebar-width, 0);
179
+ }
180
+ .nav-open .sidebar-overlay {
181
+ transition: opacity 250ms ease-in-out;
182
+ right: 0;
183
+ opacity: 1;
184
+ }
185
+ }
186
+ @media (min-width: 801px) {
187
+ .mobile-only {
188
+ display: none;
189
+ }
190
+ .sidebar-overlay {
191
+ display: none;
192
+ }
193
+ }
194
+
195
+ /* --- Navigation -------------------- */
196
+
197
+ .navigation-list {
198
+ padding: 20px 0;
199
+ display: block;
200
+ list-style: none;
201
+ }
202
+ .navigation-list-link {
203
+ position: relative;
204
+ display: block;
205
+ padding-top: 5px;
206
+ padding-bottom: 5px;
207
+ color: $menu-color;
208
+ font-size: 1.1em;
209
+ text-decoration: none !important;
210
+ }
211
+ .navigation-list-link.active,
212
+ .navigation-list-link:hover {
213
+ text-decoration: none !important;
214
+ color: darken($menu-color, 40%);
215
+ }
216
+ .navigation-list-link:before {
217
+ content: "";
218
+ position: absolute;
219
+ display: block;
220
+ top: 50%;
221
+ left: 0;
222
+ height: 18px;
223
+ width: 4px;
224
+ margin-top: -9px;
225
+ background-color: transparent;
226
+ border-radius: 3px;
227
+ transform: translateX(-3px);
228
+ transition: all 0.2s ease;
229
+ }
230
+ .navigation-list-link.active:before,
231
+ .navigation-list-link:hover:before {
232
+ background-color: $menu-color;
233
+ transform: translateX(0);
234
+ }
235
+
236
+ /* submenu */
237
+
238
+ .navigation-list ul {
239
+ padding-left: 0;
240
+ display: block;
241
+ list-style: none;
242
+ }
243
+ .navigation-list ul .navigation-list-link {
244
+ padding-left: 50px;
245
+ }
246
+
247
+ /* aux navigation */
248
+
249
+ .navigation-list-aux {
250
+ padding: 0 0 20px;
251
+ display: block;
252
+ list-style: none;
253
+ }
254
+ .navigation-list-aux .navigation-list-link:before {
255
+ display: none;
256
+ }
@@ -0,0 +1,25 @@
1
+ .markdown-body {
2
+ .csv-data {
3
+ td,
4
+ th {
5
+ padding: 5px;
6
+ overflow: hidden;
7
+ font-size: $markdown-font-size-small;
8
+ line-height: 1em;
9
+ text-align: left;
10
+ white-space: nowrap;
11
+ }
12
+ .blob-num {
13
+ padding: 10px $markdown-spacer-2 9px;
14
+ text-align: right;
15
+ background: #fff;
16
+ border: 0;
17
+ }
18
+ tr { border-top: 0; }
19
+ th {
20
+ font-weight: $markdown-font-weight-bold;
21
+ background: $gray-100;
22
+ border-top: 0;
23
+ }
24
+ }
25
+ }
@@ -0,0 +1,49 @@
1
+ .markdown-body {
2
+ // Inline code snippets
3
+ code,
4
+ tt {
5
+ font-family: "SFMono-Regular",Consolas,"Liberation Mono",Menlo,Courier,monospace;
6
+ // font-size: 85%;
7
+ padding: 0.2em 0.4em;
8
+ margin: 0;
9
+ background-color: rgba(#000, 0.05);
10
+ border-radius: 4px;
11
+ br { display: none; }
12
+ }
13
+ // Code blocks
14
+ pre {
15
+ padding: $markdown-spacer-3;
16
+ overflow: auto;
17
+ font-size: 85%;
18
+ line-height: 1.4;
19
+ background-color: $gray-100;
20
+ border-radius: 6px;
21
+ word-wrap: normal;
22
+ // Code tags within code blocks
23
+ > code {
24
+ padding: 0;
25
+ margin: 0;
26
+ font-size: 100%;
27
+ word-break: normal;
28
+ white-space: pre;
29
+ background: transparent;
30
+ border: 0;
31
+ }
32
+ code,
33
+ tt {
34
+ display: inline;
35
+ max-width: auto;
36
+ padding: 0;
37
+ margin: 0;
38
+ overflow: visible;
39
+ line-height: inherit;
40
+ word-wrap: normal;
41
+ background-color: transparent;
42
+ border: 0;
43
+ }
44
+ }
45
+ .highlight pre {
46
+ margin-bottom: 0;
47
+ word-break: normal;
48
+ }
49
+ }