donghyeon.kang/document-haness
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

refactor: 문서 개선 중

Browse Source
This commit is contained in:
donghyeon-ka
2026-09-21 14:30:55 +09:00
parent c93cdea150
commit 805a18f486
1497 changed files with 525837 additions and 59152 deletions
Download Patch File Download Diff File Expand all files Collapse all files
docs/keycloak-session-store/final/assets/a1-transport-vs-discovery/a1-transport-vs-discovery.alt.md
+7 -7
View File
@@ -10,13 +10,13 @@
## Elements and evidence
- **keycloak-0** (service): 로그아웃을 처리한 노드. Evidence: L183–L189.
- **TCP 7800** (channel): 무효화 통지가 지나는 길. NetworkPolicy 로 막았다. Evidence: L191–L196.
- **keycloak-1** (service): 통지를 못 받아 세션이 죽은 것을 모른다. Evidence: L183–L189.
- **PostgreSQL** (datastore): 세션이 여기 있어 7800 과 무관하다. Evidence: L186–L190.
- **keycloak-0** (service): 로그아웃을 처리한 노드. Evidence: L485–L489.
- **TCP 7800** (channel): 무효화 통지가 지나는 길. NetworkPolicy 로 막았다. Evidence: L491–L495.
- **keycloak-1** (service): 통지를 못 받아 세션이 죽은 것을 모른다. Evidence: L485–L489.
- **PostgreSQL** (datastore): 세션이 여기 있어 7800 과 무관하다. Evidence: L487–L490.
## Relationships
- **keycloak-0 → TCP 7800:** 무효화 통지. Evidence: L186–L190.
- **keycloak-1 → PostgreSQL:** 세션 SELECT. Evidence: L186–L189.
- **TCP 7800 → keycloak-1:** 차단. Evidence: L186–L190.
- **keycloak-0 → TCP 7800:** 무효화 통지. Evidence: L487–L490.
- **keycloak-1 → PostgreSQL:** 세션 SELECT. Evidence: L487–L489.
- **TCP 7800 → keycloak-1:** 차단. Evidence: L487–L490.
docs/keycloak-session-store/final/assets/a1-transport-vs-discovery/a1-transport-vs-discovery.drawio
+12 -12
View File
@@ -1,35 +1,35 @@
<?xml version="1.0" encoding="UTF-8"?>
<mxfile host="app.diagrams.net" modified="2026-07-23T00:00:00.000Z" agent="techviz-harness" version="24.7.17" type="device">
<diagram id="a1-transport-vs-discovery" name="발견과 전송은 다른 경로다">
<mxGraphModel dx="680" dy="696" grid="1" gridSize="10" guides="1" tooltips="1" connect="1" arrows="1" fold="1" page="1" pageScale="1" pageWidth="827" pageHeight="1169" math="0" shadow="0">
<mxGraphModel dx="680" dy="1218" grid="1" gridSize="10" guides="1" tooltips="1" connect="1" arrows="1" fold="1" page="1" pageScale="1" pageWidth="827" pageHeight="1218" math="0" shadow="0">
<root>
<mxCell id="0"/>
<mxCell id="1" parent="0"/>
<mxCell id="n_k0" value="keycloak-0" tooltip="로그아웃을 처리한 노드. | Evidence: L183-L189" style="whiteSpace=wrap;html=1;rounded=1;strokeWidth=2;fontSize=14;fontStyle=1;fillColor=#ffffff;strokeColor=#2d4357;verticalAlign=middle;strokeColor=#2563eb;strokeWidth=2;" vertex="1" parent="1">
<mxGeometry x="82.0" y="60.0" width="150.0" height="64.0" as="geometry"/>
<mxCell id="n_k0" value="keycloak-0" tooltip="로그아웃을 처리한 노드. | Evidence: L485-L489" style="whiteSpace=wrap;html=1;rounded=1;strokeWidth=2;fontSize=14;fontStyle=1;fillColor=#ffffff;strokeColor=#2d4357;verticalAlign=middle;strokeColor=#2563eb;strokeWidth=2;" vertex="1" parent="1">
<mxGeometry x="38.5" y="145.0" width="150.0" height="64.0" as="geometry"/>
</mxCell>
<mxCell id="n_transport" value="TCP 7800&lt;br/&gt;허용 포트 8080 · 9000" tooltip="무효화 통지가 지나는 길. NetworkPolicy 로 막았다. | Evidence: L191-L196" style="whiteSpace=wrap;html=1;rounded=1;strokeWidth=2;fontSize=14;fontStyle=1;fillColor=#ffffff;strokeColor=#2d4357;verticalAlign=middle;strokeColor=#d97706;fillColor=#fffdf5;" vertex="1" parent="1">
<mxGeometry x="80.5" y="220.0" width="153.0" height="71.0" as="geometry"/>
<mxCell id="n_transport" value="TCP 7800&lt;br/&gt;허용 포트 8080 · 9000" tooltip="무효화 통지가 지나는 길. NetworkPolicy 로 막았다. | Evidence: L491-L495" style="whiteSpace=wrap;html=1;rounded=1;strokeWidth=2;fontSize=14;fontStyle=1;fillColor=#ffffff;strokeColor=#2d4357;verticalAlign=middle;strokeColor=#d97706;fillColor=#fffdf5;" vertex="1" parent="1">
<mxGeometry x="35.0" y="455.0" width="153.0" height="71.0" as="geometry"/>
</mxCell>
<mxCell id="n_k1" value="keycloak-1&lt;br/&gt;refresh 200 (기대 400)" tooltip="통지를 못 받아 세션이 죽은 것을 모른다. | Evidence: L183-L189" style="whiteSpace=wrap;html=1;rounded=1;strokeWidth=2;fontSize=14;fontStyle=1;fillColor=#ffffff;strokeColor=#2d4357;verticalAlign=middle;strokeColor=#2563eb;strokeWidth=2;" vertex="1" parent="1">
<mxGeometry x="70.0" y="387.0" width="174.0" height="71.0" as="geometry"/>
<mxCell id="n_k1" value="keycloak-1&lt;br/&gt;refresh 200 (기대 400)" tooltip="통지를 못 받아 세션이 죽은 것을 모른다. | Evidence: L485-L489" style="whiteSpace=wrap;html=1;rounded=1;strokeWidth=2;fontSize=14;fontStyle=1;fillColor=#ffffff;strokeColor=#2d4357;verticalAlign=middle;strokeColor=#2563eb;strokeWidth=2;" vertex="1" parent="1">
<mxGeometry x="35.0" y="768.0" width="174.0" height="71.0" as="geometry"/>
</mxCell>
<mxCell id="n_db" value="PostgreSQL&lt;br/&gt;교차 노드 refresh 200" tooltip="세션이 여기 있어 7800 과 무관하다. | Evidence: L186-L190" style="whiteSpace=wrap;html=1;rounded=1;strokeWidth=2;fontSize=14;fontStyle=1;fillColor=#ffffff;strokeColor=#2d4357;verticalAlign=middle;shape=cylinder3;boundedLbl=1;backgroundOutline=1;fillColor=#eef6fb;strokeColor=#2563eb;strokeWidth=2;" vertex="1" parent="1">
<mxGeometry x="80.5" y="554.0" width="153.0" height="97.0" as="geometry"/>
<mxCell id="n_db" value="PostgreSQL&lt;br/&gt;교차 노드 refresh 200" tooltip="세션이 여기 있어 7800 과 무관하다. | Evidence: L487-L490" style="whiteSpace=wrap;html=1;rounded=1;strokeWidth=2;fontSize=14;fontStyle=1;fillColor=#ffffff;strokeColor=#2d4357;verticalAlign=middle;shape=cylinder3;boundedLbl=1;backgroundOutline=1;fillColor=#eef6fb;strokeColor=#2563eb;strokeWidth=2;" vertex="1" parent="1">
<mxGeometry x="35.0" y="1102.0" width="153.0" height="71.0" as="geometry"/>
</mxCell>
<mxCell id="e_k0-t" value="무효화 통지" style="edgeStyle=orthogonalEdgeStyle;rounded=0;orthogonalLoop=1;jettySize=auto;html=1;strokeWidth=2;endArrow=block;endFill=1;" edge="1" parent="1" source="n_k0" target="n_transport">
<mxGeometry relative="1" as="geometry">
<mxPoint x="181.0" y="172.0" as="offset"/>
<mxPoint x="112.5" y="304.0" as="offset"/>
</mxGeometry>
</mxCell>
<mxCell id="e_k1-db" value="세션 SELECT" style="edgeStyle=orthogonalEdgeStyle;rounded=0;orthogonalLoop=1;jettySize=auto;html=1;strokeWidth=2;endArrow=block;endFill=1;" edge="1" parent="1" source="n_k1" target="n_db">
<mxGeometry relative="1" as="geometry">
<mxPoint x="181.0" y="506.0" as="offset"/>
<mxPoint x="116.8" y="942.5" as="offset"/>
</mxGeometry>
</mxCell>
<mxCell id="e_t-k1" value="차단" style="edgeStyle=orthogonalEdgeStyle;rounded=0;orthogonalLoop=1;jettySize=auto;html=1;strokeWidth=2;endArrow=block;endFill=1;" edge="1" parent="1" source="n_transport" target="n_k1">
<mxGeometry relative="1" as="geometry">
<mxPoint x="181.0" y="339.0" as="offset"/>
<mxPoint x="116.8" y="619.0" as="offset"/>
</mxGeometry>
</mxCell>
</root>
docs/keycloak-session-store/final/assets/a1-transport-vs-discovery/a1-transport-vs-discovery.excalidraw
+51 -51
View File
@@ -6,10 +6,10 @@
{
"id": "edge-k0-t",
"type": "arrow",
"x": 157.0,
"y": 124.0,
"width": 0.0,
"height": 96.0,
"x": 111.5,
"y": 209.0,
"width": 2.0,
"height": 246.0,
"angle": 0,
"strokeColor": "#1e1e1e",
"backgroundColor": "transparent",
@@ -32,20 +32,20 @@
"locked": false,
"points": [
[
0.0,
2.0,
0.0
],
[
0.0,
48.0
2.0,
123.0
],
[
0.0,
48.0
123.0
],
[
0.0,
96.0
246.0
]
],
"lastCommittedPoint": null,
@@ -66,8 +66,8 @@
{
"id": "edge-label-k0-t",
"type": "text",
"x": 136.0,
"y": 160.0,
"x": 67.5,
"y": 292.0,
"width": 90,
"height": 24,
"angle": 0,
@@ -105,10 +105,10 @@
{
"id": "edge-k1-db",
"type": "arrow",
"x": 157.0,
"y": 458.0,
"width": 0.0,
"height": 96.0,
"x": 111.5,
"y": 839.0,
"width": 10.5,
"height": 263.0,
"angle": 0,
"strokeColor": "#1e1e1e",
"backgroundColor": "transparent",
@@ -131,20 +131,20 @@
"locked": false,
"points": [
[
0.0,
10.5,
0.0
],
[
0.0,
48.0
10.5,
131.5
],
[
0.0,
48.0
131.5
],
[
0.0,
96.0
263.0
]
],
"lastCommittedPoint": null,
@@ -165,8 +165,8 @@
{
"id": "edge-label-k1-db",
"type": "text",
"x": 136.0,
"y": 494.0,
"x": 71.75,
"y": 930.5,
"width": 90,
"height": 24,
"angle": 0,
@@ -204,10 +204,10 @@
{
"id": "edge-t-k1",
"type": "arrow",
"x": 157.0,
"y": 291.0,
"width": 0.0,
"height": 96.0,
"x": 111.5,
"y": 526.0,
"width": 10.5,
"height": 242.0,
"angle": 0,
"strokeColor": "#1e1e1e",
"backgroundColor": "transparent",
@@ -235,15 +235,15 @@
],
[
0.0,
48.0
121.0
],
[
0.0,
48.0
10.5,
121.0
],
[
0.0,
96.0
10.5,
242.0
]
],
"lastCommittedPoint": null,
@@ -264,8 +264,8 @@
{
"id": "edge-label-t-k1",
"type": "text",
"x": 136.0,
"y": 327.0,
"x": 71.75,
"y": 607.0,
"width": 90,
"height": 24,
"angle": 0,
@@ -303,8 +303,8 @@
{
"id": "node-k0",
"type": "rectangle",
"x": 82.0,
"y": 60.0,
"x": 38.5,
"y": 145.0,
"width": 150.0,
"height": 64.0,
"angle": 0,
@@ -333,8 +333,8 @@
{
"id": "node-label-k0",
"type": "text",
"x": 92.0,
"y": 70.0,
"x": 48.5,
"y": 155.0,
"width": 130.0,
"height": 44.0,
"angle": 0,
@@ -372,8 +372,8 @@
{
"id": "node-transport",
"type": "rectangle",
"x": 80.5,
"y": 220.0,
"x": 35.0,
"y": 455.0,
"width": 153.0,
"height": 71.0,
"angle": 0,
@@ -402,8 +402,8 @@
{
"id": "node-label-transport",
"type": "text",
"x": 90.5,
"y": 230.0,
"x": 45.0,
"y": 465.0,
"width": 133.0,
"height": 51.0,
"angle": 0,
@@ -441,8 +441,8 @@
{
"id": "node-k1",
"type": "rectangle",
"x": 70.0,
"y": 387.0,
"x": 35.0,
"y": 768.0,
"width": 174.0,
"height": 71.0,
"angle": 0,
@@ -471,8 +471,8 @@
{
"id": "node-label-k1",
"type": "text",
"x": 80.0,
"y": 397.0,
"x": 45.0,
"y": 778.0,
"width": 154.0,
"height": 51.0,
"angle": 0,
@@ -510,10 +510,10 @@
{
"id": "node-db",
"type": "rectangle",
"x": 80.5,
"y": 554.0,
"x": 35.0,
"y": 1102.0,
"width": 153.0,
"height": 97.0,
"height": 71.0,
"angle": 0,
"strokeColor": "#1e1e1e",
"backgroundColor": "#e7f5ff",
@@ -540,10 +540,10 @@
{
"id": "node-label-db",
"type": "text",
"x": 90.5,
"y": 564.0,
"x": 45.0,
"y": 1112.0,
"width": 133.0,
"height": 77.0,
"height": 51.0,
"angle": 0,
"strokeColor": "#1e1e1e",
"backgroundColor": "transparent",
docs/keycloak-session-store/final/assets/a1-transport-vs-discovery/a1-transport-vs-discovery.manifest.json
+4 -4
View File
@@ -2,14 +2,14 @@
"harness_version": "0.2.0",
"spec_id": "a1-transport-vs-discovery",
"spec_version": "1.1",
"spec_sha256": "f54cae81276a31a8b73961148cadf3ae5cd256bdc38a9c002997fce63c243ebf",
"spec_sha256": "c62dd7f9d01772578e1cbfa1eef70d63eae4a68555e0fc4c71bcab862eff2c2a",
"source_context": {
"document": "docs/keycloak-session-store/final/document.md",
"document_sha256": "1d44cba1905544d92f1d26ae36a8deb64a3db3914d6b488fd30d6ae7f8cfbabe",
"document_sha256": "28aef96a2bbb94fbb10ade26a71238fee62a5a4d9fa6e7749ae98cfd0a65e560",
"anchor": {
"kind": "heading",
"value": "A-1 · JGroups 전송(TCP 7800) 차단",
"line": 185
"line": 485
}
},
"outputs": [
@@ -21,7 +21,7 @@
"a1-transport-vs-discovery.excalidraw",
"a1-transport-vs-discovery.alt.md"
],
"lint_issue_count": 0,
"lint_issue_count": 1,
"assumption_count": 0,
"assumptions_allowed": false,
"composition_profile": "component-flow",
docs/keycloak-session-store/final/assets/a1-transport-vs-discovery/a1-transport-vs-discovery.svg
+26 -26
View File
@@ -1,8 +1,8 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg xmlns="http://www.w3.org/2000/svg" width="680" height="696" viewBox="0 0 680 696" role="img" aria-labelledby="diagram-title diagram-description">
<svg xmlns="http://www.w3.org/2000/svg" width="680" height="1218" viewBox="0 0 680 1218" role="img" aria-labelledby="diagram-title diagram-description">
<title id="diagram-title">발견과 전송은 다른 경로다</title>
<desc id="diagram-description">노드가 서로를 찾는 경로와 실제로 이야기하는 경로가 다르다. 발견은 PostgreSQL 의 JGROUPS_PING 테이블을 쓰고 전송은 TCP 7800 을 쓴다. 7800 만 막으면 둘 다 데이터베이스에 등록된 채로 남아 서로 존재한다고 믿지만 메시지는 오가지 않는다. 세션은 데이터베이스에 있으므로 교차 노드 refresh 는 200 을 유지하고, 로그아웃 무효화 통지는 7800 을 타므로 400 이어야 할 것이 200 이 된다.</desc>
<metadata>{&quot;techviz&quot;:{&quot;spec_version&quot;:&quot;1.1&quot;,&quot;id&quot;:&quot;a1-transport-vs-discovery&quot;,&quot;profile&quot;:&quot;component-flow&quot;},&quot;source_context&quot;:{&quot;document&quot;:&quot;docs/keycloak-session-store/final/document.md&quot;,&quot;document_sha256&quot;:&quot;1d44cba1905544d92f1d26ae36a8deb64a3db3914d6b488fd30d6ae7f8cfbabe&quot;,&quot;anchor&quot;:{&quot;kind&quot;:&quot;heading&quot;,&quot;value&quot;:&quot;A-1 · JGroups 전송(TCP 7800) 차단&quot;,&quot;line&quot;:185}},&quot;evidence_policy&quot;:&quot;Each factual element cites source lines or is marked assumption.&quot;,&quot;diagram_only&quot;:true}</metadata>
<metadata>{&quot;techviz&quot;:{&quot;spec_version&quot;:&quot;1.1&quot;,&quot;id&quot;:&quot;a1-transport-vs-discovery&quot;,&quot;profile&quot;:&quot;component-flow&quot;},&quot;source_context&quot;:{&quot;document&quot;:&quot;docs/keycloak-session-store/final/document.md&quot;,&quot;document_sha256&quot;:&quot;28aef96a2bbb94fbb10ade26a71238fee62a5a4d9fa6e7749ae98cfd0a65e560&quot;,&quot;anchor&quot;:{&quot;kind&quot;:&quot;heading&quot;,&quot;value&quot;:&quot;A-1 · JGroups 전송(TCP 7800) 차단&quot;,&quot;line&quot;:485}},&quot;evidence_policy&quot;:&quot;Each factual element cites source lines or is marked assumption.&quot;,&quot;diagram_only&quot;:true}</metadata>
<defs>
<marker id="arrow" viewBox="0 0 10 10" refX="9" refY="5" markerWidth="7" markerHeight="7" orient="auto-start-reverse">
<path d="M 0 0 L 10 5 L 0 10 z" />
@@ -49,36 +49,36 @@
.timeline-detail { font-size: 11px; fill: #4b5563; text-anchor: middle; }
</style>
</defs>
<rect class="canvas" width="680" height="696" />
<polyline class="edge kind-request style-solid emphasis-normal" points="157.0,124.0 157.0,172.0 157.0,172.0 157.0,220.0" data-evidence="186-190" />
<rect class="edge-label-bg" x="151.9" y="158.0" width="58.2" height="22" rx="3" />
<text class="edge-label" x="181.0" y="173.0">무효화 통지</text>
<polyline class="edge kind-read style-solid emphasis-normal" points="157.0,458.0 157.0,506.0 157.0,506.0 157.0,554.0" data-evidence="186-189" />
<rect class="edge-label-bg" x="141.8" y="492.0" width="78.3" height="22" rx="3" />
<text class="edge-label" x="181.0" y="507.0">세션 SELECT</text>
<polyline class="edge kind-blocked style-solid emphasis-normal" points="157.0,291.0 157.0,339.0 157.0,339.0 157.0,387.0" data-evidence="186-190" />
<rect class="edge-label-bg" x="159.0" y="325.0" width="44.0" height="22" rx="3" />
<text class="edge-label" x="181.0" y="340.0">차단</text>
<rect class="canvas" width="680" height="1218" />
<polyline class="edge kind-request style-solid emphasis-normal" points="113.5,209.0 113.5,332.0 111.5,332.0 111.5,455.0" data-evidence="487-490" />
<rect class="edge-label-bg" x="83.4" y="290.0" width="58.2" height="22" rx="3" />
<text class="edge-label" x="112.5" y="305.0">무효화 통지</text>
<polyline class="edge kind-read style-solid emphasis-normal" points="122.0,839.0 122.0,970.5 111.5,970.5 111.5,1102.0" data-evidence="487-489" />
<rect class="edge-label-bg" x="77.6" y="928.5" width="78.3" height="22" rx="3" />
<text class="edge-label" x="116.8" y="943.5">세션 SELECT</text>
<polyline class="edge kind-blocked style-solid emphasis-normal" points="111.5,526.0 111.5,647.0 122.0,647.0 122.0,768.0" data-evidence="487-490" />
<rect class="edge-label-bg" x="94.8" y="605.0" width="44.0" height="22" rx="3" />
<text class="edge-label" x="116.8" y="620.0">차단</text>
<g id="node-k0">
<rect class="node-shape kind-service emphasis-primary role-source" data-evidence="183-189" x="82.0" y="60.0" width="150.0" height="64.0" rx="7" />
<text class="node-label" x="157.0" y="90.0">keycloak-0</text>
<rect class="node-shape kind-service emphasis-primary role-source" data-evidence="485-489" x="38.5" y="145.0" width="150.0" height="64.0" rx="7" />
<text class="node-label" x="113.5" y="175.0">keycloak-0</text>
</g>
<g id="node-transport">
<rect class="node-shape kind-channel emphasis-warning role-control" data-evidence="191-196" x="80.5" y="220.0" width="153.0" height="71.0" rx="7" />
<text class="node-label" x="157.0" y="247.0">TCP 7800</text>
<line class="node-detail-divider" x1="94.5" y1="268.0" x2="219.5" y2="268.0" />
<text class="node-detail" x="96.5" y="285.0">허용 포트 8080 · 9000</text>
<rect class="node-shape kind-channel emphasis-warning role-control" data-evidence="491-495" x="35.0" y="455.0" width="153.0" height="71.0" rx="7" />
<text class="node-label" x="111.5" y="482.0">TCP 7800</text>
<line class="node-detail-divider" x1="49.0" y1="503.0" x2="174.0" y2="503.0" />
<text class="node-detail" x="51.0" y="520.0">허용 포트 8080 · 9000</text>
</g>
<g id="node-k1">
<rect class="node-shape kind-service emphasis-primary role-target" data-evidence="183-189" x="70.0" y="387.0" width="174.0" height="71.0" rx="7" />
<text class="node-label" x="157.0" y="414.0">keycloak-1</text>
<line class="node-detail-divider" x1="84.0" y1="435.0" x2="230.0" y2="435.0" />
<text class="node-detail" x="86.0" y="452.0">refresh 200 (기대 400)</text>
<rect class="node-shape kind-service emphasis-primary role-target" data-evidence="485-489" x="35.0" y="768.0" width="174.0" height="71.0" rx="7" />
<text class="node-label" x="122.0" y="795.0">keycloak-1</text>
<line class="node-detail-divider" x1="49.0" y1="816.0" x2="195.0" y2="816.0" />
<text class="node-detail" x="51.0" y="833.0">refresh 200 (기대 400)</text>
</g>
<g id="node-db">
<rect class="node-shape kind-datastore emphasis-primary role-store" data-evidence="186-190" x="80.5" y="567.0" width="153.0" height="71.0" /><ellipse class="node-shape kind-datastore emphasis-primary role-store" cx="157.0" cy="567.0" rx="76.5" ry="13.0" /><path class="storage-bottom" d="M 80.5 638.0 A 76.5 13.0 0 0 0 233.5 638.0" />
<text class="node-label" x="157.0" y="594.0">PostgreSQL</text>
<line class="node-detail-divider" x1="94.5" y1="615.0" x2="219.5" y2="615.0" />
<text class="node-detail" x="96.5" y="632.0">교차 노드 refresh 200</text>
<rect class="node-shape kind-datastore emphasis-primary role-store" data-evidence="487-490" x="35.0" y="1113.8" width="153.0" height="47.3" /><ellipse class="node-shape kind-datastore emphasis-primary role-store" cx="111.5" cy="1113.8" rx="76.5" ry="11.8" /><path class="storage-bottom" d="M 35.0 1161.2 A 76.5 11.8 0 0 0 188.0 1161.2" />
<text class="node-label" x="111.5" y="1129.0">PostgreSQL</text>
<line class="node-detail-divider" x1="49.0" y1="1150.0" x2="174.0" y2="1150.0" />
<text class="node-detail" x="51.0" y="1167.0">교차 노드 refresh 200</text>
</g>
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 7.0 KiB

After

Width:  |  Height:  |  Size: 7.0 KiB