Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

docs(PPDSC-2289): Text block documentation #363

Merged
merged 11 commits into from
Sep 9, 2022
Merged
Show file tree
Hide file tree
Changes from 7 commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -5,32 +5,32 @@ import {Svg} from '../svg';

export const TextBlockIllustration: React.FC = () => (
<Svg
width="1344"
height="759"
viewBox="0 0 1344 759"
width="1490"
height="838"
viewBox="0 0 1490 838"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<Rect width="1344" height="759" fill="illustrationBackground020" />
<Rect width="1490" height="838" fill="illustrationBackground020" />
<Rect
x="355.368"
y="169.062"
x="429"
y="208"
width="632.935"
height="421.957"
rx="20"
fill="illustrationPalette050"
fill="illustrationPalette040"
/>
<Path
fillRule="evenodd"
clipRule="evenodd"
d="M564.856 491.56C565.926 491.56 566.878 490.879 567.223 489.866L579.875 452.72C580.22 451.707 581.171 451.026 582.242 451.026H664.786C665.856 451.026 666.808 451.707 667.153 452.72L679.805 489.866C680.15 490.879 681.102 491.56 682.172 491.56H736.309C738.045 491.56 739.252 489.835 738.659 488.205L657.583 265.374C656.864 263.398 654.986 262.083 652.884 262.083H594.801C592.699 262.083 590.821 263.398 590.102 265.374L509.026 488.205C508.433 489.835 509.64 491.56 511.376 491.56H564.856ZM651.4 404.351C651.958 405.975 650.752 407.665 649.036 407.665H598.636C596.923 407.665 595.718 405.982 596.269 404.36L621.323 330.691C622.09 328.435 625.279 328.429 626.055 330.682L651.4 404.351Z"
d="M638.488 530.499C639.558 530.499 640.509 529.817 640.854 528.804L653.506 491.658C653.852 490.645 654.803 489.964 655.873 489.964H738.418C739.488 489.964 740.44 490.645 740.785 491.658L753.437 528.804C753.782 529.817 754.733 530.499 755.803 530.499H809.941C811.677 530.499 812.884 528.774 812.291 527.143L731.215 304.312C730.496 302.337 728.618 301.022 726.515 301.022H668.433C666.331 301.022 664.453 302.337 663.734 304.312L582.658 527.143C582.064 528.774 583.272 530.499 585.007 530.499H638.488ZM725.032 443.29C725.59 444.913 724.384 446.604 722.667 446.604H672.268C670.555 446.604 669.349 444.92 669.901 443.298L694.955 369.629C695.722 367.373 698.911 367.367 699.686 369.621L725.032 443.29Z"
fill="illustrationPalette010"
/>
<Path
fillRule="evenodd"
clipRule="evenodd"
d="M747.494 495.024C757.614 495.024 766.49 493.021 774.123 489.014C781.756 485.007 787.716 479.748 792.004 473.237V490.52C792.004 491.901 793.124 493.021 794.505 493.021H833.5C834.881 493.021 836 491.901 836 490.52V355.78C836 354.399 834.881 353.28 833.5 353.28H794.505C793.124 353.28 792.004 354.399 792.004 355.78V373.064C787.888 366.553 782.013 361.294 774.38 357.287C766.748 353.28 757.871 351.276 747.751 351.276C735.916 351.276 725.196 354.198 715.591 360.041C705.985 365.885 698.395 374.233 692.821 385.085C687.246 395.937 684.459 408.542 684.459 422.9C684.459 437.258 687.246 449.905 692.821 460.84C698.395 471.776 705.985 480.207 715.591 486.134C725.196 492.061 735.83 495.024 747.494 495.024ZM760.23 458.478C751.575 458.478 744.236 455.278 738.212 448.878C732.188 442.478 729.176 433.817 729.176 422.894C729.176 411.972 732.188 403.396 738.212 397.166C744.236 390.937 751.575 387.822 760.23 387.822C768.884 387.822 776.223 390.98 782.247 397.294C788.271 403.609 791.283 412.228 791.283 423.15C791.283 434.073 788.271 442.692 782.247 449.006C776.223 455.321 768.884 458.478 760.23 458.478Z"
d="M865.949 512.175V511.132L865.375 512.003C861.119 518.465 855.201 523.69 847.61 527.675C840.029 531.655 831.204 533.65 821.126 533.65C809.518 533.65 798.941 530.701 789.386 524.806C779.834 518.912 772.282 510.526 766.731 499.637C761.182 488.752 758.403 476.155 758.403 461.838C758.403 447.521 761.182 434.966 766.731 424.166C772.281 413.36 779.833 405.058 789.385 399.247C798.938 393.435 809.602 390.527 821.383 390.527C831.461 390.527 840.286 392.522 847.867 396.502C855.457 400.486 861.288 405.71 865.372 412.169L865.949 413.081V412.002V394.718C865.949 393.51 866.928 392.531 868.137 392.531H907.132C908.34 392.531 909.32 393.51 909.32 394.718V529.459C909.32 530.667 908.34 531.646 907.132 531.646H868.137C866.928 531.646 865.949 530.667 865.949 529.459V512.175ZM811.616 488.031C817.698 494.492 825.119 497.729 833.861 497.729C842.602 497.729 850.023 494.536 856.105 488.16C862.198 481.774 865.227 473.07 865.227 462.088C865.227 451.107 862.198 442.403 856.105 436.017C850.023 429.641 842.602 426.448 833.861 426.448C825.122 426.448 817.702 429.597 811.619 435.887C805.525 442.189 802.495 450.851 802.495 461.832C802.495 472.814 805.525 481.559 811.616 488.031Z"
fill="illustrationPalette030"
stroke="#87A4FC"
stroke-width="0.625088"
/>
</Svg>
);
Expand Down
421 changes: 421 additions & 0 deletions site/components/illustrations/components/text-block/anatomy.tsx

Large diffs are not rendered by default.

Original file line number Diff line number Diff line change
@@ -0,0 +1,48 @@
import React from 'react';
import {getSSRId} from 'newskit';
import {Svg} from '../../../svg';
import {Path} from '../../../path';
import {Rect} from '../../../rect';

export const DropCap: React.FC = () => {
const clip0 = getSSRId();

return (
<Svg
width="1490"
height="839"
viewBox="0 0 1490 839"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<g clipPath={`url(#${clip0})`}>
<Path
d="M0 3.99952C0 1.79038 1.79086 -0.000488281 4 -0.000488281H1486.72C1488.93 -0.000488281 1490.72 1.79037 1490.72 3.99951V834.003C1490.72 836.212 1488.93 838.003 1486.72 838.003H4.00002C1.79088 838.003 0 836.212 0 834.003V3.99952Z"
fill="illustrationBackground020"
/>
<Path
d="M369.777 399.36H266.984L250.506 448.01H180.277L279.931 172.589H357.614L457.268 448.01H386.255L369.777 399.36ZM352.514 347.572L318.38 246.741L284.639 347.572H352.514Z"
fill="illustrationHighlight010"
/>
<Path
fillRule="evenodd"
clipRule="evenodd"
d="M536.168 187.262C524.477 187.262 515 196.743 515 208.437C515 220.132 524.477 229.612 536.168 229.612H1868.48C1880.17 229.612 1889.64 220.132 1889.64 208.437C1889.64 196.743 1880.17 187.262 1868.48 187.262H536.168ZM536.171 297.373C524.48 297.373 515.003 306.853 515.003 318.548C515.003 330.242 524.48 339.723 536.171 339.723H1508.61C1520.31 339.723 1529.78 330.242 1529.78 318.548C1529.78 306.853 1520.31 297.373 1508.61 297.373H536.171ZM206.171 517.594C194.48 517.594 185.003 527.074 185.003 538.769C185.003 550.463 194.48 559.944 206.171 559.944H1868.48C1880.17 559.944 1889.65 550.463 1889.65 538.769C1889.65 527.074 1880.17 517.594 1868.48 517.594H206.171ZM536.171 407.483C524.48 407.483 515.003 416.963 515.003 428.658C515.003 440.353 524.48 449.833 536.171 449.833H1868.48C1880.17 449.833 1889.65 440.353 1889.65 428.658C1889.65 416.963 1880.17 407.483 1868.48 407.483H536.171ZM175.003 648.879C175.003 637.184 184.48 627.704 196.171 627.704H1868.48C1880.17 627.704 1889.65 637.184 1889.65 648.879C1889.65 660.574 1880.17 670.054 1868.48 670.054H196.171C184.48 670.054 175.003 660.574 175.003 648.879Z"
fill="illustrationPalette030"
/>
</g>
<defs>
<clipPath id={clip0}>
<Rect
width="1490"
height="838.004"
fill="white"
transform="translate(0 0.0102539)"
/>
</clipPath>
</defs>
</Svg>
);
};

export default DropCap;
Loading