jekyll-theme-centos 0.5.10 → 0.6.2

Sign up to get free protection for your applications and to get access to all the features.
Files changed (114) hide show
  1. checksums.yaml +4 -4
  2. data/_includes/download/header.html +2 -2
  3. data/_includes/home/news-and-events.html +1 -1
  4. data/_includes/home/planet.html +10 -1
  5. data/_includes/navbar.html +1 -1
  6. data/_includes/page/code-header.html +7 -1
  7. data/_includes/post-nav-explorer.html +4 -4
  8. data/_includes/top.html +1 -1
  9. data/_layouts/home.html +0 -13
  10. data/_sass/centos/_fonts.scss +1 -0
  11. data/_sass/centos/_footer.scss +3 -4
  12. data/_sass/centos/_header.scss +6 -6
  13. data/_sass/centos/_highlighter.scss +167 -356
  14. data/_sass/centos/_main.scss +7 -7
  15. data/_sass/centos/_nav.scss +8 -1
  16. data/_sass/centos/_toc.scss +1 -1
  17. data/_sass/centos/_variables.scss +42 -59
  18. data/_sass/centos/centos.scss +3 -11
  19. data/_sass/centos/fonts/_montserrat.scss +0 -3
  20. data/_sass/centos/fonts/_overpass.scss +43 -0
  21. data/_sass/centos/mixins/_code-header.scss +49 -29
  22. data/_sass/centos/mixins/_content.scss +8 -3
  23. data/_sass/centos/mixins/_link-list.scss +1 -1
  24. data/assets/fonts/{Montserrat/Montserrat-Black.woff → Montserrat-Black.woff} +0 -0
  25. data/assets/fonts/{Montserrat/Montserrat-Black.woff2 → Montserrat-Black.woff2} +0 -0
  26. data/assets/fonts/{Montserrat/Montserrat-BlackItalic.woff → Montserrat-BlackItalic.woff} +0 -0
  27. data/assets/fonts/{Montserrat/Montserrat-BlackItalic.woff2 → Montserrat-BlackItalic.woff2} +0 -0
  28. data/assets/fonts/{Montserrat/Montserrat-Bold.woff → Montserrat-Bold.woff} +0 -0
  29. data/assets/fonts/{Montserrat/Montserrat-Bold.woff2 → Montserrat-Bold.woff2} +0 -0
  30. data/assets/fonts/{Montserrat/Montserrat-BoldItalic.woff → Montserrat-BoldItalic.woff} +0 -0
  31. data/assets/fonts/{Montserrat/Montserrat-BoldItalic.woff2 → Montserrat-BoldItalic.woff2} +0 -0
  32. data/assets/fonts/{Montserrat/Montserrat-ExtraBold.woff → Montserrat-ExtraBold.woff} +0 -0
  33. data/assets/fonts/{Montserrat/Montserrat-ExtraBold.woff2 → Montserrat-ExtraBold.woff2} +0 -0
  34. data/assets/fonts/{Montserrat/Montserrat-ExtraBoldItalic.woff → Montserrat-ExtraBoldItalic.woff} +0 -0
  35. data/assets/fonts/{Montserrat/Montserrat-ExtraBoldItalic.woff2 → Montserrat-ExtraBoldItalic.woff2} +0 -0
  36. data/assets/fonts/{Montserrat/Montserrat-ExtraLight.woff → Montserrat-ExtraLight.woff} +0 -0
  37. data/assets/fonts/{Montserrat/Montserrat-ExtraLight.woff2 → Montserrat-ExtraLight.woff2} +0 -0
  38. data/assets/fonts/{Montserrat/Montserrat-ExtraLightItalic.woff → Montserrat-ExtraLightItalic.woff} +0 -0
  39. data/assets/fonts/{Montserrat/Montserrat-ExtraLightItalic.woff2 → Montserrat-ExtraLightItalic.woff2} +0 -0
  40. data/assets/fonts/{Montserrat/Montserrat-Italic.woff → Montserrat-Italic.woff} +0 -0
  41. data/assets/fonts/{Montserrat/Montserrat-Italic.woff2 → Montserrat-Italic.woff2} +0 -0
  42. data/assets/fonts/{Montserrat/Montserrat-Light.woff → Montserrat-Light.woff} +0 -0
  43. data/assets/fonts/{Montserrat/Montserrat-Light.woff2 → Montserrat-Light.woff2} +0 -0
  44. data/assets/fonts/{Montserrat/Montserrat-LightItalic.woff → Montserrat-LightItalic.woff} +0 -0
  45. data/assets/fonts/{Montserrat/Montserrat-LightItalic.woff2 → Montserrat-LightItalic.woff2} +0 -0
  46. data/assets/fonts/{Montserrat/Montserrat-Medium.woff → Montserrat-Medium.woff} +0 -0
  47. data/assets/fonts/{Montserrat/Montserrat-Medium.woff2 → Montserrat-Medium.woff2} +0 -0
  48. data/assets/fonts/{Montserrat/Montserrat-MediumItalic.woff → Montserrat-MediumItalic.woff} +0 -0
  49. data/assets/fonts/{Montserrat/Montserrat-MediumItalic.woff2 → Montserrat-MediumItalic.woff2} +0 -0
  50. data/assets/fonts/{Montserrat/Montserrat-Regular.woff → Montserrat-Regular.woff} +0 -0
  51. data/assets/fonts/{Montserrat/Montserrat-Regular.woff2 → Montserrat-Regular.woff2} +0 -0
  52. data/assets/fonts/{Montserrat/Montserrat-SemiBold.woff → Montserrat-SemiBold.woff} +0 -0
  53. data/assets/fonts/{Montserrat/Montserrat-SemiBold.woff2 → Montserrat-SemiBold.woff2} +0 -0
  54. data/assets/fonts/{Montserrat/Montserrat-SemiBoldItalic.woff → Montserrat-SemiBoldItalic.woff} +0 -0
  55. data/assets/fonts/{Montserrat/Montserrat-SemiBoldItalic.woff2 → Montserrat-SemiBoldItalic.woff2} +0 -0
  56. data/assets/fonts/{Montserrat/Montserrat-Thin.woff → Montserrat-Thin.woff} +0 -0
  57. data/assets/fonts/{Montserrat/Montserrat-Thin.woff2 → Montserrat-Thin.woff2} +0 -0
  58. data/assets/fonts/{Montserrat/Montserrat-ThinItalic.woff → Montserrat-ThinItalic.woff} +0 -0
  59. data/assets/fonts/{Montserrat/Montserrat-ThinItalic.woff2 → Montserrat-ThinItalic.woff2} +0 -0
  60. data/assets/fonts/{Montserrat/MontserratAlternates-Black.woff → MontserratAlternates-Black.woff} +0 -0
  61. data/assets/fonts/{Montserrat/MontserratAlternates-Black.woff2 → MontserratAlternates-Black.woff2} +0 -0
  62. data/assets/fonts/{Montserrat/MontserratAlternates-BlackItalic.woff → MontserratAlternates-BlackItalic.woff} +0 -0
  63. data/assets/fonts/{Montserrat/MontserratAlternates-BlackItalic.woff2 → MontserratAlternates-BlackItalic.woff2} +0 -0
  64. data/assets/fonts/{Montserrat/MontserratAlternates-Bold.woff → MontserratAlternates-Bold.woff} +0 -0
  65. data/assets/fonts/{Montserrat/MontserratAlternates-Bold.woff2 → MontserratAlternates-Bold.woff2} +0 -0
  66. data/assets/fonts/{Montserrat/MontserratAlternates-BoldItalic.woff → MontserratAlternates-BoldItalic.woff} +0 -0
  67. data/assets/fonts/{Montserrat/MontserratAlternates-BoldItalic.woff2 → MontserratAlternates-BoldItalic.woff2} +0 -0
  68. data/assets/fonts/{Montserrat/MontserratAlternates-ExtraBold.woff → MontserratAlternates-ExtraBold.woff} +0 -0
  69. data/assets/fonts/{Montserrat/MontserratAlternates-ExtraBold.woff2 → MontserratAlternates-ExtraBold.woff2} +0 -0
  70. data/assets/fonts/{Montserrat/MontserratAlternates-ExtraBoldItalic.woff → MontserratAlternates-ExtraBoldItalic.woff} +0 -0
  71. data/assets/fonts/{Montserrat/MontserratAlternates-ExtraBoldItalic.woff2 → MontserratAlternates-ExtraBoldItalic.woff2} +0 -0
  72. data/assets/fonts/{Montserrat/MontserratAlternates-ExtraLight.woff → MontserratAlternates-ExtraLight.woff} +0 -0
  73. data/assets/fonts/{Montserrat/MontserratAlternates-ExtraLight.woff2 → MontserratAlternates-ExtraLight.woff2} +0 -0
  74. data/assets/fonts/{Montserrat/MontserratAlternates-ExtraLightItalic.woff → MontserratAlternates-ExtraLightItalic.woff} +0 -0
  75. data/assets/fonts/{Montserrat/MontserratAlternates-ExtraLightItalic.woff2 → MontserratAlternates-ExtraLightItalic.woff2} +0 -0
  76. data/assets/fonts/{Montserrat/MontserratAlternates-Italic.woff → MontserratAlternates-Italic.woff} +0 -0
  77. data/assets/fonts/{Montserrat/MontserratAlternates-Italic.woff2 → MontserratAlternates-Italic.woff2} +0 -0
  78. data/assets/fonts/{Montserrat/MontserratAlternates-Light.woff → MontserratAlternates-Light.woff} +0 -0
  79. data/assets/fonts/{Montserrat/MontserratAlternates-Light.woff2 → MontserratAlternates-Light.woff2} +0 -0
  80. data/assets/fonts/{Montserrat/MontserratAlternates-LightItalic.woff → MontserratAlternates-LightItalic.woff} +0 -0
  81. data/assets/fonts/{Montserrat/MontserratAlternates-LightItalic.woff2 → MontserratAlternates-LightItalic.woff2} +0 -0
  82. data/assets/fonts/{Montserrat/MontserratAlternates-Medium.woff → MontserratAlternates-Medium.woff} +0 -0
  83. data/assets/fonts/{Montserrat/MontserratAlternates-Medium.woff2 → MontserratAlternates-Medium.woff2} +0 -0
  84. data/assets/fonts/{Montserrat/MontserratAlternates-MediumItalic.woff → MontserratAlternates-MediumItalic.woff} +0 -0
  85. data/assets/fonts/{Montserrat/MontserratAlternates-MediumItalic.woff2 → MontserratAlternates-MediumItalic.woff2} +0 -0
  86. data/assets/fonts/{Montserrat/MontserratAlternates-Regular.woff → MontserratAlternates-Regular.woff} +0 -0
  87. data/assets/fonts/{Montserrat/MontserratAlternates-Regular.woff2 → MontserratAlternates-Regular.woff2} +0 -0
  88. data/assets/fonts/{Montserrat/MontserratAlternates-SemiBold.woff → MontserratAlternates-SemiBold.woff} +0 -0
  89. data/assets/fonts/{Montserrat/MontserratAlternates-SemiBold.woff2 → MontserratAlternates-SemiBold.woff2} +0 -0
  90. data/assets/fonts/{Montserrat/MontserratAlternates-SemiBoldItalic.woff → MontserratAlternates-SemiBoldItalic.woff} +0 -0
  91. data/assets/fonts/{Montserrat/MontserratAlternates-SemiBoldItalic.woff2 → MontserratAlternates-SemiBoldItalic.woff2} +0 -0
  92. data/assets/fonts/{Montserrat/MontserratAlternates-Thin.woff → MontserratAlternates-Thin.woff} +0 -0
  93. data/assets/fonts/{Montserrat/MontserratAlternates-Thin.woff2 → MontserratAlternates-Thin.woff2} +0 -0
  94. data/assets/fonts/{Montserrat/MontserratAlternates-ThinItalic.woff → MontserratAlternates-ThinItalic.woff} +0 -0
  95. data/assets/fonts/{Montserrat/MontserratAlternates-ThinItalic.woff2 → MontserratAlternates-ThinItalic.woff2} +0 -0
  96. data/assets/fonts/overpass-mono-bold.eot +0 -0
  97. data/assets/fonts/overpass-mono-bold.ttf +0 -0
  98. data/assets/fonts/overpass-mono-bold.woff +0 -0
  99. data/assets/fonts/overpass-mono-bold.woff2 +0 -0
  100. data/assets/fonts/overpass-mono-light.eot +0 -0
  101. data/assets/fonts/overpass-mono-light.ttf +0 -0
  102. data/assets/fonts/overpass-mono-light.woff +0 -0
  103. data/assets/fonts/overpass-mono-light.woff2 +0 -0
  104. data/assets/fonts/overpass-mono-regular.eot +0 -0
  105. data/assets/fonts/overpass-mono-regular.ttf +0 -0
  106. data/assets/fonts/overpass-mono-regular.woff +0 -0
  107. data/assets/fonts/overpass-mono-regular.woff2 +0 -0
  108. data/assets/fonts/overpass-mono-semibold.eot +0 -0
  109. data/assets/fonts/overpass-mono-semibold.ttf +0 -0
  110. data/assets/fonts/overpass-mono-semibold.woff +0 -0
  111. data/assets/fonts/overpass-mono-semibold.woff2 +0 -0
  112. metadata +91 -76
  113. data/assets/fonts/Montserrat/Montserrat.css +0 -327
  114. data/assets/fonts/Montserrat/README.MD +0 -35
@@ -27,6 +27,7 @@
27
27
  }
28
28
  }
29
29
  &__planet, &__news-and-events {
30
+ a { font-weight: bold; }
30
31
  @include link-list;
31
32
  }
32
33
  }
@@ -177,16 +178,15 @@
177
178
  border: none;
178
179
  padding: 15px;
179
180
  text-align: left;
180
- &__image {
181
- img {
182
- width: auto;
183
- height: 50px;
184
- }
181
+ img {
182
+ width: auto;
183
+ height: 50px;
185
184
  }
186
185
  &__body {
187
- &__title {
186
+ &_title {
187
+ display: none;
188
188
  }
189
- &__description {
189
+ &_description {
190
190
  }
191
191
  }
192
192
  }
@@ -1,6 +1,13 @@
1
1
  .navbar {
2
2
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
3
3
  &-dark {
4
- background: $black;
4
+ background: $dark;
5
+ }
6
+ &-brand {
7
+ .manifestation {
8
+ color: white;
9
+ font-size: small;
10
+ padding-left: 5px;
11
+ }
5
12
  }
6
13
  }
@@ -20,7 +20,7 @@
20
20
  list-style: none;
21
21
  &:before {
22
22
  @extend .fas;
23
- color: $secondary;
23
+ color: $primary;
24
24
  margin-right: 5px;
25
25
  content: fa-content($fa-var-angle-right);
26
26
  }
@@ -1,47 +1,30 @@
1
- // Variables
2
- //
3
- // Variables should follow the `$component-state-property-size` formula for
4
- // consistent naming. Ex: $nav-link-disabled-color and $modal-content-box-shadow-xs.
5
- //
6
-
7
- //
8
1
  /* ----------------------------------------------------------------------
9
- * Color system
2
+ * Fontawesome
10
3
  * ---------------------------------------------------------------------- */
11
- $white: #fff;
12
- $black: #000;
13
- $dark: #343a40;
4
+ @import "fontawesome/fontawesome";
5
+ @import "fontawesome/solid";
6
+ @import "fontawesome/brands";
14
7
 
15
8
  /* ----------------------------------------------------------------------
16
- * Nord Identity
17
- * ---------------------------------------------------------------------- */
18
- $nord-color-0: #2e3440;
19
- $nord-color-1: #3b4252;
20
- $nord-color-2: #434c5e;
21
- $nord-color-3: #4c566a;
22
- $nord-color-4: #d8dee9;
23
- $nord-color-5: #e5e9f0;
24
- $nord-color-6: #eceff4;
25
- $nord-color-7: #8fbcbb;
26
- $nord-color-8: #88c0d0;
27
- $nord-color-9: #81a1c1;
28
- $nord-color-10: #5e81ac;
29
- $nord-color-11: #bf616a;
30
- $nord-color-12: #d08770;
31
- $nord-color-13: #ebcb8b;
32
- $nord-color-14: #a3be8c;
33
- $nord-color-15: #b48ead;
34
- /* ----------------------------------------------------------------------
35
- * CentOS Identity
9
+ * CentOS Theme
36
10
  * ---------------------------------------------------------------------- */
37
- $color-0: #9ccd2a;
38
- $color-1: #efa724;
39
- $color-2: #a14f8c;
40
- $color-3: #262577;
11
+ $centos-color-0: #9ccd2a;
12
+ $centos-color-1: #efa724;
13
+ $centos-color-2: #a14f8c;
14
+ $centos-color-3: #262577;
15
+ $centos-img-logo: "/assets/img/logo.png";
16
+ $centos-img-motif: "/assets/img/motif.png";
41
17
 
42
- $logo-image: "/assets/img/logo.png";
43
- $background-image: "/assets/img/motif.png";
18
+ /* Color system - based in the artistic motif palette and the number of
19
+ * occurrence each color has in the image.
20
+ */
21
+ $white: #fff;
22
+ $primary: #6226a9;
23
+ $secondary: #0f1c4c;
24
+ $dark: #05112b;
44
25
 
26
+ /* Header
27
+ */
45
28
  $home-header-padding-top: 202px;
46
29
  $home-header-padding-bottom: 150px;
47
30
  $page-header-padding-top: 152px;
@@ -49,40 +32,40 @@ $page-header-padding-bottom: 100px;
49
32
  $heading-margin-top: 1rem;
50
33
  $scroll-margin-top: $heading-margin-top * 2.6;
51
34
 
52
- // Body
53
- //
54
- // Settings for the `<body>` element.
55
-
35
+ /* Body - settings for `<body>` element.
36
+ */
56
37
  $body-bg: #f0f0f0;
57
- $body-color: #212529;
58
-
59
- // Paragraphs
60
- //
61
- // Style p element.
38
+ $body-color: $dark;
62
39
 
40
+ /* Paragraphs
41
+ */
63
42
  $paragraph-margin-bottom: 1.8rem;
64
43
 
65
- // Typography
66
- //
67
- // Font, line-height, and color for body text, headings, and more.
68
-
44
+ /* Typography - Font, line-height, and color for body text, headings, and more.
45
+ */
46
+ $font-family-path: "/assets/fonts";
69
47
  $font-family-sans-serif: Montserrat;
70
48
  $line-height-base: 1.75;
71
49
  $headings-line-height: $line-height-base - 0.3;
72
50
  $headings-font-weight: 700;
73
51
 
74
- //
75
- // Dropdown menu container and contents.
76
- //
77
- $dropdown-bg: $black;
52
+ /* Dropdown menu container and contents.
53
+ */
54
+ $dropdown-bg: $dark;
78
55
  $dropdown-link-color: $white;
79
56
  $dropdown-link-hover-color: $white;
80
- $dropdown-link-hover-bg: rgba($white, .2);
57
+ $dropdown-link-hover-bg: rgba($primary, .2);
81
58
 
82
- // Breadcrumbs
59
+ /* Breadcrumbs
60
+ */
83
61
  $breadcrumb-bg: transparent;
84
62
  $breadcrumb-padding-x: 0;
85
63
 
86
- //
87
- //$component-active-color: $white;
88
- //#$component-active-bg: $dark;
64
+ /* Tables
65
+ */
66
+ $table-dark-bg: $dark;
67
+
68
+ /* ----------------------------------------------------------------------
69
+ * Bootstrap
70
+ * ---------------------------------------------------------------------- */
71
+ @import "bootstrap/bootstrap";
@@ -1,18 +1,10 @@
1
1
  /*!
2
- * CentOS Theme
3
- * Copyright 2020 Alain Reguera Delgado <areguera@centosproject.org>
4
- * Licensed under MIT
2
+ * jekyll-theme-centos v0.6.2 (https://gitlab.com/areguera/jekyll-theme-centos/)
3
+ * Copyright 2020-2021 Alain Reguera Delgado
4
+ * Licensed under MIT (https://gitlab.com/areguera/jekyll-theme-centos/-/blob/master/LICENSE)
5
5
  */
6
-
7
- @import "fontawesome/fontawesome";
8
- @import "fontawesome/solid";
9
- @import "fontawesome/brands";
10
-
11
6
  @import "_variables";
12
7
  @import "_fonts";
13
-
14
- @import "bootstrap/bootstrap";
15
-
16
8
  @import "_mixins";
17
9
  @import "_datatable";
18
10
  @import "_highlighter";
@@ -1,7 +1,4 @@
1
- /** =================== MONTSERRAT =================== **/
2
1
  /** Montserrat Thin **/
3
- $font-family-path: "../fonts/Montserrat";
4
-
5
2
  @font-face {
6
3
  font-family: "Montserrat";
7
4
  font-weight: 100;
@@ -0,0 +1,43 @@
1
+ @font-face {
2
+ font-family: 'overpass-mono';
3
+ src: url('#{$font-family-path}/overpass-mono-light.eot');
4
+ src: url('#{$font-family-path}/overpass-mono-light.eot?#iefix') format('embedded-opentype'),
5
+ url('#{$font-family-path}/overpass-mono-light.woff2') format('woff2'),
6
+ url('#{$font-family-path}/overpass-mono-light.woff') format('woff'),
7
+ url('#{$font-family-path}/overpass-mono-light.ttf') format('truetype');
8
+ font-weight: 300;
9
+ font-style: normal;
10
+ }
11
+
12
+ @font-face {
13
+ font-family: 'overpass-mono';
14
+ src: url('#{$font-family-path}/overpass-mono-regular.eot');
15
+ src: url('#{$font-family-path}/overpass-mono-regular.eot?#iefix') format('embedded-opentype'),
16
+ url('#{$font-family-path}/overpass-mono-regular.woff2') format('woff2'),
17
+ url('#{$font-family-path}/overpass-mono-regular.woff') format('woff'),
18
+ url('#{$font-family-path}/overpass-mono-regular.ttf') format('truetype');
19
+ font-weight: 400;
20
+ font-style: normal;
21
+ }
22
+
23
+ @font-face {
24
+ font-family: 'overpass-mono';
25
+ src: url('#{$font-family-path}/overpass-mono-semibold.eot');
26
+ src: url('#{$font-family-path}/overpass-mono-semibold.eot?#iefix') format('embedded-opentype'),
27
+ url('#{$font-family-path}/overpass-mono-semibold.woff2') format('woff2'),
28
+ url('#{$font-family-path}/overpass-mono-semibold.woff') format('woff'),
29
+ url('#{$font-family-path}/overpass-mono-semibold.ttf') format('truetype');
30
+ font-weight: 500;
31
+ font-style: normal;
32
+ }
33
+
34
+ @font-face {
35
+ font-family: 'overpass-mono';
36
+ src: url('#{$font-family-path}/overpass-mono-bold.eot');
37
+ src: url('#{$font-family-path}/overpass-mono-bold.eot?#iefix') format('embedded-opentype'),
38
+ url('#{$font-family-path}/overpass-mono-bold.woff2') format('woff2'),
39
+ url('#{$font-family-path}/overpass-mono-bold.woff') format('woff'),
40
+ url('#{$font-family-path}/overpass-mono-bold.ttf') format('truetype');
41
+ font-weight: 600;
42
+ font-style: normal;
43
+ }
@@ -1,40 +1,60 @@
1
+ /* code-header
2
+ */
1
3
  @mixin code-header {
2
4
 
3
5
  .code-header {
6
+ @extend .bg-light;
4
7
  display: flex;
5
- justify-content: flex-end;
6
- background: $black;
7
- }
8
-
9
- .copy-code-button {
10
- @extend .btn, .btn-dark, .shadow-none;
11
- border-radius: 0px;
12
- display: grid;
13
- grid-auto-flow: column;
8
+ justify-content: space-between;
14
9
  align-items: center;
15
- grid-column-gap: 4px;
16
- border: none;
17
- cursor: pointer;
18
- background-color: $black;
19
- font-size: small;
10
+ padding-left: 10px;
11
+ font-size: small;
20
12
 
21
- &:before {
22
- @extend .fas;
23
- content: fa-content($fa-var-clipboard);
24
- }
25
- &:after {
26
- content: "Copy";
27
- display: block;
13
+ &--description {
14
+ &-code {
15
+ &:before { @extend .fas; content: fa-content($fa-var-code); padding-right: 5px; }
16
+ }
17
+ &-python {
18
+ &:before { @extend .fab; content: fa-content($fa-var-python); padding-right: 5px; }
19
+ }
20
+ &-terminal {
21
+ &:before { @extend .fas; content: fa-content($fa-var-terminal); padding-right: 5px; }
22
+ }
23
+ &-key {
24
+ &:before { @extend .fas; content: fa-content($fa-var-key); padding-right: 5px; }
25
+ }
28
26
  }
29
27
 
30
- // This class will be toggled via JavaScript
31
- &.copied {
32
- &:before {
33
- @extend .fas;
34
- content: fa-content($fa-var-clipboard-check);
35
- }
36
- &:after {
37
- content: "Copied!";
28
+ &--button {
29
+ .copy-code-button {
30
+ @extend .btn, .btn-light, .shadow-none, .btn-sm;
31
+ border-radius: 0px;
32
+ display: grid;
33
+ grid-auto-flow: column;
34
+ align-items: center;
35
+ grid-column-gap: 4px;
36
+ border: none;
37
+ cursor: pointer;
38
+ font-size: small;
39
+
40
+ &:before {
41
+ @extend .fas;
42
+ content: fa-content($fa-var-clipboard);
43
+ }
44
+ &:after {
45
+ content: "Copy";
46
+ }
47
+
48
+ // This class will be toggled via JavaScript
49
+ &.copied {
50
+ &:before {
51
+ @extend .fas;
52
+ content: fa-content($fa-var-clipboard-check);
53
+ }
54
+ &:after {
55
+ content: "Copied!";
56
+ }
57
+ }
38
58
  }
39
59
  }
40
60
  }
@@ -3,7 +3,7 @@
3
3
  background: #fff;
4
4
  padding: 2.75rem;
5
5
  margin-top: -120px;
6
- min-height: 430px;
6
+ min-height: 490px;
7
7
  box-shadow: 0px -2px 3px 0px rgba(50, 50, 50, 0.25);
8
8
 
9
9
  h1, h2, h3, h4, h5, h6 {
@@ -16,7 +16,7 @@
16
16
 
17
17
  h2 {
18
18
  margin-top: $scroll-margin-top;
19
- border-bottom: 3px solid $body-color;
19
+ border-bottom: 3px solid $dark;
20
20
  }
21
21
 
22
22
  img {
@@ -25,8 +25,13 @@
25
25
  }
26
26
 
27
27
  pre {
28
+ font-family: "overpass-mono";
28
29
  @extend .highlight, .pre-scrollable;
29
- padding: 1rem;
30
+ padding: 5px 10px;
31
+ }
32
+
33
+ code {
34
+ font-family: "overpass-mono";
30
35
  }
31
36
 
32
37
  table {
@@ -7,9 +7,9 @@
7
7
  margin-left: 1em;
8
8
  &:before {
9
9
  @extend .fas;
10
- color: $secondary;
11
10
  margin-right: 0.5em;
12
11
  margin-left: -1em;
12
+ color: $primary;
13
13
  content: fa-content($fa-var-angle-right);
14
14
  }
15
15
  }