-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy paththeme-flatly.scss
93 lines (77 loc) · 2.65 KB
/
theme-flatly.scss
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
/*-- scss:defaults --*/
// Base document colors
$code-color: #dc582a;
$callout-repro-color: #660066 !default;
//$repro-background-color: shift-color($repro-border-color-left, -70%);
$main-bg-color: #fdfcfc;
$custom-callout-bg-color: shift-color($main-bg-color, 2.5%);
$icon: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-twitter" viewBox="0 0 16 16"> <path d="M5.026 15c6.038 0 9.341-5.003 9.341-9.334 0-.14 0-.282-.006-.422A6.685 6.685 0 0 0 16 3.542a6.658 6.658 0 0 1-1.889.518 3.301 3.301 0 0 0 1.447-1.817 6.533 6.533 0 0 1-2.087.793A3.286 3.286 0 0 0 7.875 6.03a9.325 9.325 0 0 1-6.767-3.429 3.289 3.289 0 0 0 1.018 4.382A3.323 3.323 0 0 1 .64 6.575v.045a3.288 3.288 0 0 0 2.632 3.218 3.203 3.203 0 0 1-.865.115 3.23 3.23 0 0 1-.614-.057 3.283 3.283 0 0 0 3.067 2.277A6.588 6.588 0 0 1 .78 13.58a6.32 6.32 0 0 1-.78-.045A9.344 9.344 0 0 0 5.026 15z"/></svg>') !default;
body {
background-color: $main-bg-color;
}
// Custom callouts:
/// General callout settings
.callout.callout-style-default .callout-body {
font-size: var(--bs-body-font-size);
font-weight: 400;
//background-color: $custom-callout-bg-color; // very ugly unfortunately!
}
.callout.callout-style-default>div.callout-header {
font-weight: 600;
font-size: 1rem;
padding-bottom: 0.2em;
}
.callout.callout-style-default:not(.no-icon) div.callout-caption-container {
margin-top: 1px;
}
//// Reproducibility
.repro {
margin-top: 1px;
margin-bottom: 1em;
border-radius: .25rem;
border-left: solid $callout-repro-color .3rem;
border-right: solid .25px $callout-repro-color;
border-top: solid .25px $callout-repro-color;
border-bottom: solid .25px $callout-repro-color;
border-left-color: $callout-repro-color !important;
}
.repro-icon {
height: 0.9rem;
width: 0.9rem;
display: inline-block;
content: "";
background-repeat: no-repeat;
background-size: 0.9rem 0.9rem;
margin-top: .5rem;
padding-right: 1.25rem;
background-image: url('images/copy-solid.svg');
color: $callout-repro-color;
}
.repro-header {
margin-bottom: 0.5em;
border-bottom: none;
font-weight: 600;
opacity: 85%;
font-size: 1rem;
padding-left: 0.5rem;
padding-right: 0.5rem;
padding-bottom: 0.2rem;
display: flex;
background-color: shift-color($callout-repro-color, -85%);
color: shift-color($callout-repro-color, 50%);
height: 2em;
overflow: hidden;
}
.repro-header p {
padding-top: 0.2em;
}
.repro-body {
font-size: var(--bs-body-font-size);
font-weight: 400;
padding-left: 0.5em;
padding-right: 0.5em;
}
.repro-body > :last-child {
padding-bottom: 0.5rem;
margin-bottom: 0;
}