loredarchives/LoredMarkdown
Archived
1
0
Fork 0
Code Issues Pull Requests Activity

feat(banners-lib): ✨ horizontal banner layouts

Browse Source 
Created the basic layout SVG file in Inkscape. The exported
SVG needs to have specific ids for each element, so it can
be edited programically later.
This commit is contained in:
Guz013
2023-11-28 10:47:20 -03:00
parent 24fa8bbeaa
commit c5c036d4da
2 changed files with 456 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

273
packages/banners/static/design.inkscape.svg Normal file
View File

@@ -0,0 +1,273 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
width="297mm"
height="210mm"
viewBox="0 0 297 210"
version="1.1"
id="svg1"
xml:space="preserve"
sodipodi:docname="design.inkscape.svg"
inkscape:version="1.3.1 (91b66b0783, 2023-11-16, custom)"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:xlink="http://www.w3.org/1999/xlink"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg"><sodipodi:namedview
id="namedview1"
pagecolor="#505050"
bordercolor="#eeeeee"
borderopacity="1"
inkscape:showpageshadow="0"
inkscape:pageopacity="0"
inkscape:pagecheckerboard="0"
inkscape:deskcolor="#505050"
inkscape:document-units="mm"
inkscape:zoom="1.557211"
inkscape:cx="208.06429"
inkscape:cy="105.63758"
inkscape:window-width="2540"
inkscape:window-height="1023"
inkscape:window-x="0"
inkscape:window-y="0"
inkscape:window-maximized="1"
inkscape:current-layer="layer1" /><defs
id="defs1"><linearGradient
id="linearGradient55"
inkscape:collect="always"
inkscape:label="background-gradient"><stop
style="stop-color:#ffffff;stop-opacity:1;"
offset="0.30320638"
id="stop54" /><stop
style="stop-color:#ffffff;stop-opacity:0;"
offset="1"
id="stop55" /></linearGradient><clipPath
clipPathUnits="userSpaceOnUse"
id="clipPath25"><rect
style="fill:#ff0000;stroke:none;stroke-width:3;stroke-linecap:square;stroke-linejoin:miter;paint-order:stroke markers fill;stop-color:#000000"
id="rect25-8"
width="78"
height="45.033199"
x="763.61322"
y="452.82422" /></clipPath><clipPath
clipPathUnits="userSpaceOnUse"
id="clipPath47"><path
id="path47"
style="stroke-width:0.1;stroke-linecap:square;paint-order:markers fill stroke;stop-color:#000000"
d="m 438.25066,553.76374 859.87054,0 v 201.39554 l -859.87054,0 z"
sodipodi:nodetypes="ccccc" /></clipPath><clipPath
clipPathUnits="userSpaceOnUse"
id="clipPath33"><rect
style="fill:#000000;stroke:#000000;stroke-width:0;stroke-linejoin:bevel;paint-order:stroke markers fill;stop-color:#000000"
id="rect5-4"
width="20"
height="200"
x="530"
y="595" /></clipPath><clipPath
clipPathUnits="userSpaceOnUse"
id="clipPath23"><path
id="path23"
style="stroke-width:0.1;stroke-linecap:square;paint-order:markers fill stroke;stop-color:#000000"
d="m -880.82767,-187.29769 h 1640.84 v 73.28155 h -1640.84 z" /></clipPath><clipPath
clipPathUnits="userSpaceOnUse"
id="clipPath52"><path
id="path52"
style="stroke-width:0.1;stroke-linecap:square;paint-order:markers fill stroke;stop-color:#000000"
d="m -880.82767,-187.29769 h 1640.84 v 73.28155 h -1640.84 z" /></clipPath><clipPath
clipPathUnits="userSpaceOnUse"
id="clipPath5"><path
id="path5"
style="stroke-width:0.1;stroke-linecap:square;paint-order:markers fill stroke;stop-color:#000000"
d="m 438.25066,553.76374 859.87054,0 v 201.39554 l -859.87054,0 z"
sodipodi:nodetypes="ccccc" /></clipPath><linearGradient
id="linearGradient14"
inkscape:collect="always"
inkscape:label="background-image-mask-gradiend"><stop
style="stop-color:#000000;stop-opacity:1;"
offset="0.30320638"
id="stop14" /><stop
style="stop-color:#ffffff;stop-opacity:1;"
offset="1"
id="stop15" /></linearGradient><inkscape:path-effect
effect="fillet_chamfer"
id="path-effect4"
is_visible="true"
lpeversion="1"
nodesatellites_param="F,0,0,1,0,0,0,1 @ F,0,0,1,0,0,0,1 @ F,0,0,1,0,0,0,1 @ F,0,0,1,0,0,0,1 @ F,0,0,1,0,0,0,1 @ F,0,0,1,0,0,0,1 @ F,0,0,1,0,0,0,1 @ F,0,0,1,0,0,0,1"
radius="0"
unit="px"
method="auto"
mode="F"
chamfer_steps="1"
flexible="false"
use_knot_distance="true"
apply_no_radius="true"
apply_with_radius="true"
only_selected="false"
hide_knots="false" /><inkscape:path-effect
effect="fillet_chamfer"
id="path-effect3"
is_visible="true"
lpeversion="1"
nodesatellites_param="F,0,0,1,0,0,0,1 @ F,0,0,1,0,0,0,1 @ F,0,0,1,0,0,0,1 @ F,0,0,1,0,0,0,1 @ F,0,0,1,0,0,0,1 @ F,0,0,1,0,0,0,1 @ F,0,0,1,0,0,0,1 @ F,0,0,1,0,0,0,1"
radius="0"
unit="px"
method="auto"
mode="F"
chamfer_steps="1"
flexible="false"
use_knot_distance="true"
apply_no_radius="true"
apply_with_radius="true"
only_selected="false"
hide_knots="false" /><inkscape:path-effect
effect="fillet_chamfer"
id="path-effect1"
is_visible="true"
lpeversion="1"
nodesatellites_param="F,0,0,1,0,0,0,1 @ F,0,0,1,0,0,0,1 @ F,0,0,1,0,0,0,1 @ F,0,0,1,0,0,0,1 @ F,0,0,1,0,0,0,1 @ F,0,0,1,0,0,0,1 @ F,0,0,1,0,0,0,1 @ F,0,0,1,0,0,0,1"
radius="0"
unit="px"
method="auto"
mode="F"
chamfer_steps="1"
flexible="false"
use_knot_distance="true"
apply_no_radius="true"
apply_with_radius="true"
only_selected="false"
hide_knots="false" /><linearGradient
inkscape:collect="always"
xlink:href="#linearGradient82-2"
id="linearGradient5"
x1="18.784613"
y1="57.455349"
x2="159.75043"
y2="57.455349"
gradientUnits="userSpaceOnUse"
gradientTransform="translate(0.91790776,-15.256989)" /><linearGradient
id="linearGradient82-2"
inkscape:label="color-stripe-gradient"><stop
style="stop-color:#ff0000;stop-opacity:1;"
offset="0"
id="stop104" /><stop
style="stop-color:#ffff00;stop-opacity:1;"
offset="0.18269952"
id="stop105" /><stop
style="stop-color:#00ff00;stop-opacity:1;"
offset="0.39030838"
id="stop106" /><stop
style="stop-color:#00ffff;stop-opacity:1;"
offset="0.59760052"
id="stop107" /><stop
style="stop-color:#0000ff;stop-opacity:1;"
offset="0.79487675"
id="stop108" /><stop
style="stop-color:#ff00ff;stop-opacity:1;"
offset="1"
id="stop109" /></linearGradient><clipPath
clipPathUnits="userSpaceOnUse"
id="clipPath107-6"><path
d="M 0,1674.565 H 2453.522 V 0 H 0 Z"
transform="translate(-1479.7665,-631.83924)"
id="path107-1" /></clipPath><linearGradient
inkscape:collect="always"
xlink:href="#linearGradient55"
id="linearGradient15"
x1="12.732515"
y1="45.720142"
x2="165.80252"
y2="15.906352"
gradientUnits="userSpaceOnUse"
gradientTransform="matrix(1,0,0,0.78569196,0.91790394,-0.86860867)" /><mask
maskUnits="userSpaceOnUse"
id="mask2"><path
id="path2"
style="display:inline;opacity:1;fill:url(#linearGradient3);stroke-width:0.303146;paint-order:fill markers stroke"
inkscape:label="mask"
d="M 16.447515,24.244587 H 162.08752 c 2.05812,0 3.71501,1.65689 3.71501,3.715001 v 23.139473 c 0,2.058112 -1.65689,3.715002 -3.71501,3.715002 H 16.447515 c -2.05811,0 -3.715,-1.65689 -3.715,-3.715002 V 27.959588 c 0,-2.058111 1.65689,-3.715001 3.715,-3.715001 z" /></mask><linearGradient
inkscape:collect="always"
xlink:href="#linearGradient14"
id="linearGradient3"
gradientUnits="userSpaceOnUse"
gradientTransform="matrix(1,0,0,0.78569196,-1e-8,11.747095)"
x1="12.732515"
y1="45.720142"
x2="165.80252"
y2="15.906352" /></defs><g
inkscape:label="layouts"
inkscape:groupmode="layer"
id="layer1"><g
id="horizontal"
inkscape:label="horizontal"
inkscape:export-filename="horizontal.svg"
inkscape:export-xdpi="96"
inkscape:export-ydpi="96"><path
id="color-stripe"
style="opacity:1;fill:url(#linearGradient5);stroke-width:0.0784105;paint-order:fill markers stroke"
inkscape:label="color-stripe"
d="M 21.190374,41.087963 H 159.18047 c 0.82427,0 1.48786,0.495237 1.48786,1.110397 0,0.61516 -0.66359,1.110397 -1.48786,1.110397 H 21.190374 c -0.824271,0 -1.487854,-0.495237 -1.487854,-1.110397 0,-0.61516 0.663583,-1.110397 1.487854,-1.110397 z" /><g
id="background"
inkscape:label="background"><path
id="fallback"
style="display:inline;opacity:1;fill:#ffffff;stroke-width:0.302511;paint-order:fill markers stroke"
inkscape:label="fallback"
d="M 17.416924,11.667379 H 162.95393 c 2.05665,0 3.71237,1.652718 3.71237,3.705644 v 23.081198 c 0,2.052926 -1.65572,3.705643 -3.71237,3.705643 H 17.416924 c -2.056654,0 -3.712372,-1.652717 -3.712372,-3.705643 V 15.373023 c 0,-2.052926 1.655718,-3.705644 3.712372,-3.705644 z" /><g
id="image"
inkscape:label="image"><image
width="134.7771"
height="89.851387"
preserveAspectRatio="none"
xlink:href="../../../../../Downloads/alexandre-debieve-FO7JIlwjOtU-unsplash.jpg"
id="embed"
x="60.238495"
y="-3.5220199"
inkscape:label="embed"
mask="url(#mask2)"
transform="translate(0.91790394,-12.615704)"
style="image-rendering:optimizeSpeed"
inkscape:svg-dpi="1"
inkscape:export-filename="horizontal.svg"
inkscape:export-xdpi="96"
inkscape:export-ydpi="96" /></g><path
id="gradient"
style="display:inline;opacity:1;fill:url(#linearGradient15);stroke-width:0.303146;paint-order:fill markers stroke"
inkscape:label="gradient"
d="M 17.365419,11.628884 H 163.00543 c 2.05811,0 3.715,1.65689 3.715,3.715 v 23.139475 c 0,2.05811 -1.65689,3.715 -3.715,3.715 H 17.365419 c -2.05811,0 -3.715,-1.65689 -3.715,-3.715 V 15.343884 c 0,-2.05811 1.65689,-3.715 3.715,-3.715 z" /><path
id="solid-color"
style="display:none;opacity:1;fill:#ffffff;stroke-width:0.303146;paint-order:fill markers stroke"
inkscape:label="solid-color"
d="M 17.365414,11.590389 H 163.00542 c 2.05811,0 3.715,1.65689 3.715,3.715 v 23.139475 c 0,2.05811 -1.65689,3.715 -3.715,3.715 H 17.365414 c -2.05811,0 -3.715,-1.65689 -3.715,-3.715 V 15.305389 c 0,-2.05811 1.65689,-3.715 3.715,-3.715 z" /></g><g
id="content"
inkscape:label="content"
transform="translate(0.91790394,-12.615704)"><text
xml:space="preserve"
style="font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;font-size:3.4638px;font-family:'Cal Sans';-inkscape-font-specification:'Cal Sans, Semi-Bold';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;opacity:1;fill:#000000;fill-opacity:1;stroke-width:0.133036;paint-order:fill markers stroke"
x="38.497089"
y="43.932247"
id="subtitle"
inkscape:label="subtitle"><tspan
sodipodi:role="line"
id="tspan4"
style="font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;font-size:3.4638px;font-family:'Cal Sans';-inkscape-font-specification:'Cal Sans, Semi-Bold';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;fill:#000000;fill-opacity:1;stroke-width:0.133036"
x="38.497089"
y="43.932247">Subtitle placeholder</tspan></text><text
xml:space="preserve"
style="font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;font-size:5.05275px;font-family:'Cal Sans';-inkscape-font-specification:'Cal Sans, Semi-Bold';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;opacity:1;fill:#000000;fill-opacity:1;stroke-width:0.194064;paint-order:fill markers stroke"
x="38.455933"
y="38.518772"
id="title"
inkscape:label="title"><tspan
sodipodi:role="line"
id="tspan3"
style="font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;font-size:5.05275px;font-family:'Cal Sans';-inkscape-font-specification:'Cal Sans, Semi-Bold';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;fill:#000000;fill-opacity:1;stroke-width:0.194064"
x="38.455933"
y="38.518772">Title placeholder</tspan></text><g
id="icon"
inkscape:label="icon"><path
fill="currentColor"
d="m 25.227101,34.205286 c -0.235876,0.06157 -0.387336,0.148721 -0.505541,0.264214 -0.166159,0.16342 -0.274563,0.392234 -0.333944,0.82424 -0.06095,0.445075 -0.06219,1.034514 -0.06219,1.879454 v 4.66868 a 2.2727811,2.2727811 0 0 1 0.70765,-0.323048 1.7922937,1.7922937 0 0 1 0.193956,-0.03922 v -7.274315 z m 0.901602,7.238362 h 6.913129 V 37.17374 c 0,-0.845486 -10e-4,-1.434925 -0.06219,-1.88 -0.05929,-0.432006 -0.167805,-0.660808 -0.333943,-0.82424 -0.166777,-0.162884 -0.399875,-0.269115 -0.841133,-0.326862 -0.454332,-0.05992 -1.055759,-0.061 -1.918675,-0.061 h -2.404613 c -0.545855,0 -0.987134,0 -1.352664,0.01585 z m 0.751773,0.883071 h -0.662432 c -0.588352,0 -0.793735,0.0036 -0.95172,0.04521 a 1.3423135,1.3423135 0 0 0 -0.924479,0.837858 c 0.0083,0.208103 0.02347,0.391689 0.04572,0.555118 0.05929,0.432006 0.167806,0.660808 0.333945,0.82424 0.166776,0.162884 0.399853,0.269115 0.841132,0.326862 0.454333,0.05992 1.055759,0.061 1.918675,0.061 h 2.404613 c 0.862917,0 1.464878,-10e-4 1.918676,-0.06047 0.441258,-0.0583 0.674973,-0.164512 0.841132,-0.327408 0.166159,-0.163419 0.274564,-0.392233 0.333945,-0.824235 0.05003,-0.362818 0.05992,-0.822603 0.06157,-1.438194 h -3.756205 v 1.638125 c 0,0.162349 0,0.243512 -0.05724,0.276199 -0.05724,0.03269 -0.135068,-0.0039 -0.290912,-0.07627 L 28.19057,43.817203 c -0.05334,-0.02452 -0.07948,-0.0365 -0.107886,-0.0365 -0.02842,0 -0.05456,0.01194 -0.107885,0.0365 l -0.746338,0.347566 c -0.156276,0.07245 -0.234249,0.108958 -0.291447,0.07626 -0.05662,-0.03268 -0.05662,-0.114397 -0.05662,-0.276199 z"
id="icon-svg"
style="stroke-width:0.544769"
inkscape:label="icon-svg" /></g></g></g></g></svg>
Side by Side

After

Width:  |  Height:  |  Size: 14 KiB

183
packages/banners/static/horizontal.svg Normal file
View File

@@ -0,0 +1,183 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
width="153.07001mm"
height="31.679874mm"
viewBox="0 0 153.07001 31.679874"
version="1.1"
id="svg1"
xml:space="preserve"
sodipodi:docname="design.inkscape.svg"
inkscape:version="1.3.1 (91b66b0783, 2023-11-16, custom)"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:xlink="http://www.w3.org/1999/xlink"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg"><sodipodi:namedview
id="namedview1"
pagecolor="#505050"
bordercolor="#eeeeee"
borderopacity="1"
inkscape:showpageshadow="0"
inkscape:pageopacity="0"
inkscape:pagecheckerboard="0"
inkscape:deskcolor="#505050"
inkscape:document-units="mm"
inkscape:zoom="1.557211"
inkscape:cx="208.06429"
inkscape:cy="105.63758"
inkscape:window-width="2540"
inkscape:window-height="1023"
inkscape:window-x="0"
inkscape:window-y="0"
inkscape:window-maximized="1"
inkscape:current-layer="layer1" /><defs
id="defs1"><linearGradient
id="linearGradient55"
inkscape:collect="always"
inkscape:label="background-gradient"><stop
style="stop-color:#ffffff;stop-opacity:1;"
offset="0.30320638"
id="stop54" /><stop
style="stop-color:#ffffff;stop-opacity:0;"
offset="1"
id="stop55" /></linearGradient><linearGradient
id="linearGradient14"
inkscape:collect="always"
inkscape:label="background-image-mask-gradiend"><stop
style="stop-color:#000000;stop-opacity:1;"
offset="0.30320638"
id="stop14" /><stop
style="stop-color:#ffffff;stop-opacity:1;"
offset="1"
id="stop15" /></linearGradient><linearGradient
inkscape:collect="always"
xlink:href="#linearGradient82-2"
id="linearGradient5"
x1="18.784613"
y1="57.455349"
x2="159.75043"
y2="57.455349"
gradientUnits="userSpaceOnUse"
gradientTransform="translate(0.91790776,-15.256989)" /><linearGradient
id="linearGradient82-2"
inkscape:label="color-stripe-gradient"><stop
style="stop-color:#ff0000;stop-opacity:1;"
offset="0"
id="stop104" /><stop
style="stop-color:#ffff00;stop-opacity:1;"
offset="0.18269952"
id="stop105" /><stop
style="stop-color:#00ff00;stop-opacity:1;"
offset="0.39030838"
id="stop106" /><stop
style="stop-color:#00ffff;stop-opacity:1;"
offset="0.59760052"
id="stop107" /><stop
style="stop-color:#0000ff;stop-opacity:1;"
offset="0.79487675"
id="stop108" /><stop
style="stop-color:#ff00ff;stop-opacity:1;"
offset="1"
id="stop109" /></linearGradient><linearGradient
inkscape:collect="always"
xlink:href="#linearGradient55"
id="linearGradient15"
x1="12.732515"
y1="45.720142"
x2="165.80252"
y2="15.906352"
gradientUnits="userSpaceOnUse"
gradientTransform="matrix(1,0,0,0.78569196,0.91790394,-0.86860867)" /><mask
maskUnits="userSpaceOnUse"
id="mask2"><path
id="path2"
style="display:inline;opacity:1;fill:url(#linearGradient3);stroke-width:0.303146;paint-order:fill markers stroke"
inkscape:label="mask"
d="M 16.447515,24.244587 H 162.08752 c 2.05812,0 3.71501,1.65689 3.71501,3.715001 v 23.139473 c 0,2.058112 -1.65689,3.715002 -3.71501,3.715002 H 16.447515 c -2.05811,0 -3.715,-1.65689 -3.715,-3.715002 V 27.959588 c 0,-2.058111 1.65689,-3.715001 3.715,-3.715001 z" /></mask><linearGradient
inkscape:collect="always"
xlink:href="#linearGradient14"
id="linearGradient3"
gradientUnits="userSpaceOnUse"
gradientTransform="matrix(1,0,0,0.78569196,-1e-8,11.747095)"
x1="12.732515"
y1="45.720142"
x2="165.80252"
y2="15.906352" /></defs><g
inkscape:label="layouts"
inkscape:groupmode="layer"
id="layer1"
transform="translate(-13.65042,-11.628884)"><g
id="horizontal"
inkscape:label="horizontal"
inkscape:export-filename="horizontal.svg"
inkscape:export-xdpi="96"
inkscape:export-ydpi="96"><path
id="color-stripe"
style="opacity:1;fill:url(#linearGradient5);stroke-width:0.0784105;paint-order:fill markers stroke"
inkscape:label="color-stripe"
d="M 21.190374,41.087963 H 159.18047 c 0.82427,0 1.48786,0.495237 1.48786,1.110397 0,0.61516 -0.66359,1.110397 -1.48786,1.110397 H 21.190374 c -0.824271,0 -1.487854,-0.495237 -1.487854,-1.110397 0,-0.61516 0.663583,-1.110397 1.487854,-1.110397 z" /><g
id="background"
inkscape:label="background"><path
id="fallback"
style="display:inline;opacity:1;fill:#ffffff;stroke-width:0.302511;paint-order:fill markers stroke"
inkscape:label="fallback"
d="M 17.416924,11.667379 H 162.95393 c 2.05665,0 3.71237,1.652718 3.71237,3.705644 v 23.081198 c 0,2.052926 -1.65572,3.705643 -3.71237,3.705643 H 17.416924 c -2.056654,0 -3.712372,-1.652717 -3.712372,-3.705643 V 15.373023 c 0,-2.052926 1.655718,-3.705644 3.712372,-3.705644 z" /><g
id="image"
inkscape:label="image"><image
width="134.7771"
height="89.851387"
preserveAspectRatio="none"
xlink:href="../../../../../Downloads/alexandre-debieve-FO7JIlwjOtU-unsplash.jpg"
id="embed"
x="60.238495"
y="-3.5220199"
inkscape:label="embed"
mask="url(#mask2)"
transform="translate(0.91790394,-12.615704)"
style="image-rendering:optimizeSpeed"
inkscape:svg-dpi="1"
inkscape:export-filename="horizontal.svg"
inkscape:export-xdpi="96"
inkscape:export-ydpi="96" /></g><path
id="gradient"
style="display:inline;opacity:1;fill:url(#linearGradient15);stroke-width:0.303146;paint-order:fill markers stroke"
inkscape:label="gradient"
d="M 17.365419,11.628884 H 163.00543 c 2.05811,0 3.715,1.65689 3.715,3.715 v 23.139475 c 0,2.05811 -1.65689,3.715 -3.715,3.715 H 17.365419 c -2.05811,0 -3.715,-1.65689 -3.715,-3.715 V 15.343884 c 0,-2.05811 1.65689,-3.715 3.715,-3.715 z" /><path
id="solid-color"
style="display:none;opacity:1;fill:#ffffff;stroke-width:0.303146;paint-order:fill markers stroke"
inkscape:label="solid-color"
d="M 17.365414,11.590389 H 163.00542 c 2.05811,0 3.715,1.65689 3.715,3.715 v 23.139475 c 0,2.05811 -1.65689,3.715 -3.715,3.715 H 17.365414 c -2.05811,0 -3.715,-1.65689 -3.715,-3.715 V 15.305389 c 0,-2.05811 1.65689,-3.715 3.715,-3.715 z" /></g><g
id="content"
inkscape:label="content"
transform="translate(0.91790394,-12.615704)"><text
xml:space="preserve"
style="font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;font-size:3.4638px;font-family:'Cal Sans';-inkscape-font-specification:'Cal Sans, Semi-Bold';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;opacity:1;fill:#000000;fill-opacity:1;stroke-width:0.133036;paint-order:fill markers stroke"
x="38.497089"
y="43.932247"
id="subtitle"
inkscape:label="subtitle"><tspan
sodipodi:role="line"
id="tspan4"
style="font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;font-size:3.4638px;font-family:'Cal Sans';-inkscape-font-specification:'Cal Sans, Semi-Bold';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;fill:#000000;fill-opacity:1;stroke-width:0.133036"
x="38.497089"
y="43.932247">Subtitle placeholder</tspan></text><text
xml:space="preserve"
style="font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;font-size:5.05275px;font-family:'Cal Sans';-inkscape-font-specification:'Cal Sans, Semi-Bold';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;opacity:1;fill:#000000;fill-opacity:1;stroke-width:0.194064;paint-order:fill markers stroke"
x="38.455933"
y="38.518772"
id="title"
inkscape:label="title"><tspan
sodipodi:role="line"
id="tspan3"
style="font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;font-size:5.05275px;font-family:'Cal Sans';-inkscape-font-specification:'Cal Sans, Semi-Bold';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-east-asian:normal;fill:#000000;fill-opacity:1;stroke-width:0.194064"
x="38.455933"
y="38.518772">Title placeholder</tspan></text><g
id="icon"
inkscape:label="icon"><path
fill="currentColor"
d="m 25.227101,34.205286 c -0.235876,0.06157 -0.387336,0.148721 -0.505541,0.264214 -0.166159,0.16342 -0.274563,0.392234 -0.333944,0.82424 -0.06095,0.445075 -0.06219,1.034514 -0.06219,1.879454 v 4.66868 a 2.2727811,2.2727811 0 0 1 0.70765,-0.323048 1.7922937,1.7922937 0 0 1 0.193956,-0.03922 v -7.274315 z m 0.901602,7.238362 h 6.913129 V 37.17374 c 0,-0.845486 -10e-4,-1.434925 -0.06219,-1.88 -0.05929,-0.432006 -0.167805,-0.660808 -0.333943,-0.82424 -0.166777,-0.162884 -0.399875,-0.269115 -0.841133,-0.326862 -0.454332,-0.05992 -1.055759,-0.061 -1.918675,-0.061 h -2.404613 c -0.545855,0 -0.987134,0 -1.352664,0.01585 z m 0.751773,0.883071 h -0.662432 c -0.588352,0 -0.793735,0.0036 -0.95172,0.04521 a 1.3423135,1.3423135 0 0 0 -0.924479,0.837858 c 0.0083,0.208103 0.02347,0.391689 0.04572,0.555118 0.05929,0.432006 0.167806,0.660808 0.333945,0.82424 0.166776,0.162884 0.399853,0.269115 0.841132,0.326862 0.454333,0.05992 1.055759,0.061 1.918675,0.061 h 2.404613 c 0.862917,0 1.464878,-10e-4 1.918676,-0.06047 0.441258,-0.0583 0.674973,-0.164512 0.841132,-0.327408 0.166159,-0.163419 0.274564,-0.392233 0.333945,-0.824235 0.05003,-0.362818 0.05992,-0.822603 0.06157,-1.438194 h -3.756205 v 1.638125 c 0,0.162349 0,0.243512 -0.05724,0.276199 -0.05724,0.03269 -0.135068,-0.0039 -0.290912,-0.07627 L 28.19057,43.817203 c -0.05334,-0.02452 -0.07948,-0.0365 -0.107886,-0.0365 -0.02842,0 -0.05456,0.01194 -0.107885,0.0365 l -0.746338,0.347566 c -0.156276,0.07245 -0.234249,0.108958 -0.291447,0.07626 -0.05662,-0.03268 -0.05662,-0.114397 -0.05662,-0.276199 z"
id="icon-svg"
style="stroke-width:0.544769"
inkscape:label="icon-svg" /></g></g></g></g></svg>
Side by Side

After

Width:  |  Height:  |  Size: 11 KiB