1 | .markdown-body .embed {
|
2 | $B: '.embed';
|
3 | & {
|
4 | padding: 15px;
|
5 | color: var(--md-code-text, inherit);
|
6 | border-radius: var(--md-code-radius, var(--markdown-radius, 3px));
|
7 | border-radius: 3px;
|
8 | background: transparent;
|
9 | box-shadow: inset 0 0 0 1px rgba(black, .15);
|
10 | transition: .3s ease;
|
11 | &:hover {
|
12 | background: var(--md-code-background, #f6f8fa);
|
13 | box-shadow: inset 0 0 0 1px rgba(black, .1);
|
14 | }
|
15 | @at-root .markdown-body > #{$B}_hasImg:nth-of-type(odd) {
|
16 | margin-right: 30px;
|
17 | padding-right: 0;
|
18 | #{$B}-link { flex-direction: row-reverse }
|
19 | #{$B}-img {
|
20 | margin-left: .88em;
|
21 | margin-right: -30px;
|
22 | box-shadow: -.3em .3em .9em -.3em rgba(black, .15);
|
23 | }
|
24 | }
|
25 | @at-root .markdown-body > #{$B}_hasImg:nth-of-type(even) {
|
26 | margin-left: 30px;
|
27 | padding-left: 0;
|
28 | #{$B}-img { margin-left: -30px }
|
29 | }
|
30 | }
|
31 | &:empty {
|
32 | display: none;
|
33 | }
|
34 |
|
35 | &-media {
|
36 | display: flex;
|
37 | justify-content: center;
|
38 | >:only-child {
|
39 | flex: 1;
|
40 | margin: -15px;
|
41 | border-radius: 0 !important;
|
42 | }
|
43 | }
|
44 |
|
45 | &-link {
|
46 | display: flex;
|
47 | align-items: center;
|
48 | color: var(--markdown-text, #333);
|
49 | text-decoration: none !important;
|
50 | }
|
51 |
|
52 | &-body {
|
53 | flex: 1;
|
54 | line-height: 1.3;
|
55 | &, #{$B}-title {
|
56 | font-size: 1.15em;
|
57 | overflow: hidden;
|
58 | white-space: nowrap;
|
59 | text-overflow: ellipsis;
|
60 | }
|
61 | #{$B}-provider {
|
62 | display: block;
|
63 | text-decoration-color: transparent !important;
|
64 | opacity: .88;
|
65 | }
|
66 | &-url {
|
67 | opacity: .75;
|
68 | }
|
69 | }
|
70 |
|
71 | &-provider {
|
72 | font-size: 0.8em;
|
73 | line-height: 1.6;
|
74 |
|
75 | code:only-child {
|
76 | display: block;
|
77 | width: 100%;
|
78 | font-size: 1.15em;
|
79 | overflow: hidden;
|
80 | white-space: nowrap;
|
81 | text-overflow: ellipsis;
|
82 | background: transparent;
|
83 | margin: 0;
|
84 | padding: 0;
|
85 | font-size: inherit !important;
|
86 | }
|
87 | transition: .2 ease;
|
88 | code {
|
89 | opacity: 0.8;
|
90 | }
|
91 | }
|
92 |
|
93 | &-img {
|
94 | width: 5em;
|
95 | max-width: 5em;
|
96 | margin: 0 .88em 0 0;
|
97 | padding: 4px;
|
98 | background: white;
|
99 | border: 1px solid rgba(black, .15);
|
100 | border-radius: 3px;
|
101 | transition: inherit;
|
102 | box-shadow: .3em .3em .9em -.3em rgba(black, .15);
|
103 | }
|
104 | &:not(:hover) #{$B}-img {
|
105 | box-shadow: 0 .25em 1em -.5em rgba(black, .133);
|
106 | }
|
107 | &:hover #{$B}-img {
|
108 | border: 1px solid rgba(black, .2);
|
109 | }
|
110 |
|
111 | &-favicon {
|
112 | width: 12px !important;
|
113 | height: 12px !important;
|
114 | margin-top: 4px;
|
115 | margin-right: 6px;
|
116 | margin-bottom: 12px;
|
117 | }
|
118 | } |
\ | No newline at end of file |