Skip to content

Commit

Permalink
save
Browse files Browse the repository at this point in the history
  • Loading branch information
anthonyrota committed Jan 6, 2021
1 parent 7a79ca6 commit b482de9
Show file tree
Hide file tree
Showing 2 changed files with 82 additions and 19 deletions.
17 changes: 16 additions & 1 deletion www/src/components/DeepCoreNode.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -79,6 +79,20 @@ export function DeepCoreNodeComponent({
case CoreNodeType.BlockQuote: {
return (
<blockquote class="cls-node-blockquote">
<svg
class="cls-node-blockquote__icon"
preserveAspectRatio="xMidYMid meet"
fill="currentColor"
viewBox="0 0 24 24"
stroke="none"
>
<g>
<path
d="M12.2 8.98c.06-.01.12-.03.18-.06.06-.02.12-.05.18-.09l.15-.12c.18-.19.29-.45.29-.71 0-.06-.01-.13-.02-.19a.603.603 0 0 0-.06-.19.757.757 0 0 0-.09-.18c-.03-.05-.08-.1-.12-.15-.28-.27-.72-.37-1.09-.21-.13.05-.23.12-.33.21-.04.05-.09.1-.12.15-.04.06-.07.12-.09.18-.03.06-.05.12-.06.19-.01.06-.02.13-.02.19 0 .26.11.52.29.71.1.09.2.16.33.21.12.05.25.08.38.08.06 0 .13-.01.2-.02M13 16v-4a1 1 0 1 0-2 0v4a1 1 0 1 0 2 0M12 3c-4.962 0-9 4.038-9 9 0 4.963 4.038 9 9 9 4.963 0 9-4.037 9-9 0-4.962-4.037-9-9-9m0 20C5.935 23 1 18.065 1 12S5.935 1 12 1c6.066 0 11 4.935 11 11s-4.934 11-11 11"
fillRule="evenodd"
></path>
</g>
</svg>
{mapChildren(node.children, pagePath, headingRefs)}
</blockquote>
);
Expand Down Expand Up @@ -408,9 +422,10 @@ export function DeepCoreNodeComponent({
if (copyState === CopyState$AllowCopy) {
return;
}
const delay = copyState === CopyState$CopyFail ? 2000 : 1000;
const timeoutHandle = setTimeout(() => {
setCopyState(CopyState$AllowCopy);
}, 1000);
}, delay);
return () => {
clearTimeout(timeoutHandle);
};
Expand Down
84 changes: 66 additions & 18 deletions www/src/index.scss
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,7 @@ $text-primary: 'text-primary';
$text-secondary: 'text-secondary';
$text-primary-accent: 'text-primary-accent';
$accent: 'accent';
$code-color: 'code-color';
$bg0: 'bg0';
$bg1: 'bg1';
$bg2: 'bg2';
Expand All @@ -34,9 +35,10 @@ $themes: (
$text-primary: #000,
$text-secondary: #6a737d,
$text-primary-accent: #333,
$accent: #6b46c1,
$accent: #3884ff,
$code-color: #6b46c1,
$bg0: #fff,
$bg1: #f8f8f8,
$bg1: #f5f7f9,
$bg2: #ddd,
$bg3: #909090,
$light-border: 1px solid #eee,
Expand All @@ -45,7 +47,8 @@ $themes: (
$text-primary: #fff,
$text-secondary: #aaa,
$text-primary-accent: #ccc,
$accent: #9f7aea,
$accent: #3884ff,
$code-color: #9f7aea,
$bg0: #1a202c,
$bg1: #11151c,
$bg2: #212d40,
Expand Down Expand Up @@ -1075,6 +1078,7 @@ button {
}

&__link-container--active &__link {
opacity: 1;
@include themed {
color: t($accent) !important;
}
Expand Down Expand Up @@ -1442,7 +1446,7 @@ button {
margin: 0;
font-size: 85%;
@include themed {
color: t($accent);
color: t($code-color);
}
white-space: pre-wrap;
overflow-wrap: break-word;
Expand All @@ -1457,11 +1461,28 @@ button {
}
}

&-code-span &-link {
@include themed {
color: t($code-color);
}
&:focus,
&:hover {
@include themed {
color: rgba(t($code-color), $hover-opacity);
}
}
}

&-code-block {
padding: $spacing * 2/3;
border-radius: 0.3em;
line-height: 24px;

@include theme($light) {
// Override inline style.
background-color: t($bg1) !important;
}

&__line-number,
&__copy-button {
display: none;
Expand Down Expand Up @@ -1695,15 +1716,7 @@ button {
&-heading-4 + &-unordered-list,
&-heading-4 + &-paragraph,
&-heading-4 + &-code-block,
&-heading-4 + &-table,
&-collapsible-section__summary + &-unordered-list,
&-collapsible-section__summary + &-blockquote,
&-collapsible-section__summary + &-collapsible-section,
&-collapsible-section__summary + &-ordered-list,
&-collapsible-section__summary + &-unordered-list,
&-collapsible-section__summary + &-paragraph,
&-collapsible-section__summary + &-code-block,
&-collapsible-section__summary + &-table {
&-heading-4 + &-table {
margin-top: $spacing;
}

Expand Down Expand Up @@ -1875,16 +1888,51 @@ button {
display: list-item;
}

&-collapsible-section__summary + &-unordered-list,
&-collapsible-section__summary + &-blockquote,
&-collapsible-section__summary + &-collapsible-section,
&-collapsible-section__summary + &-ordered-list,
&-collapsible-section__summary + &-unordered-list,
&-collapsible-section__summary + &-paragraph,
&-collapsible-section__summary + &-code-block,
&-collapsible-section__summary + &-table {
margin-top: $spacing/2;
}

&-blockquote {
$line-height: 1.7;
line-height: $line-height;
@include themed {
border-left: 6px solid t($accent);
}
padding: $spacing / 3 $spacing;
padding-left: $spacing * 1.5;
border-left: 4px solid t($accent);
background-color: t($bg1);
}
$padding: $spacing * 1.2;
$icon-size: $spacing * 1.5;
$icon-padding-left: $padding * 3/4;
$icon-padding-right: $padding * 2/3;
padding: $padding;
padding-left: $icon-padding-left + $icon-padding-right + $icon-size;
margin-left: -30px;
margin-right: -30px;
position: relative;

> :first-child {
&__icon {
width: $icon-size;
height: $icon-size;
position: absolute;
top: calc(
#{$padding} + (#{$line-height} * 1em - #{$icon-size}) / 2
);
left: $icon-padding-left;
display: inline-block;
vertical-align: middle;
@include themed {
fill: t($accent);
}
}

// First child is the icon.
> :nth-child(2) {
&.cls-temp-focus-span + * {
margin-top: 0;
}
Expand Down

1 comment on commit b482de9

@vercel
Copy link

@vercel vercel bot commented on b482de9 Jan 6, 2021

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Please sign in to comment.