ETM-Schurig/powersync-app
Archived
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Add support for gas and CO sensors

Browse Source
This commit is contained in:
Michael Zanetti 2021-08-21 00:51:44 +02:00
parent 888e1fbdbe
commit 971588d147
10 changed files with 368 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
libnymea-app/types/interfaces.cpp
View File

@ -98,9 +98,15 @@ Interfaces::Interfaces(QObject *parent) : QAbstractListModel(parent)
addInterface("closablesensor", tr("Closable sensors"), {"sensor"});
addStateType("closablesensor", "closed", QVariant::Bool, false, tr("Closed"), tr("Opened or closed"));
addInterface("cosensor", tr("CO sensor"), {"sensor"});
addStateType("cosensor", "co2", QVariant::Double, false, tr("CO level"), tr("CO level changed"));
addInterface("co2sensor", tr("CO2 sensor"), {"sensor"});
addStateType("co2sensor", "co2", QVariant::Double, false, tr("CO2 level"), tr("CO2 level changed"));
addInterface("gassensor", tr("Flammable gas sensor"), {"sensor"});
addStateType("gassensor", "co2", QVariant::Double, false, tr("Flammable gas level"), tr("Flammable gas level changed"));
addInterface("power", tr("Powered things"));
addStateType("power", "power", QVariant::Bool, true, tr("Thing is turned on"), tr("A thing is turned on or off"), tr("Turn things on or off"));

2
nymea-app/images.qrc
View File

@ -268,5 +268,7 @@
<file>ui/images/sensors/o2.svg</file>
<file>ui/images/sensors/ph.svg</file>
<file>ui/images/sensors/orp.svg</file>
<file>ui/images/sensors/co.svg</file>
<file>ui/images/sensors/gas.svg</file>
</qresource>
</RCC>

8
nymea-app/ui/Nymea.qml
View File

@ -193,8 +193,12 @@ ApplicationWindow {
return qsTr("Pressure");
case "noisesensor":
return qsTr("Noise level");
case "cosensor":
return qsTr("CO level")
case "co2sensor":
return qsTr("CO2 level")
case "gassensor":
return qsTr("Flammable gas level")
case "inputtrigger":
return qsTr("Incoming Events");
case "outputtrigger":
@ -285,8 +289,12 @@ ApplicationWindow {
return Qt.resolvedUrl("images/sensors/pressure.svg")
case "noisesensor":
return Qt.resolvedUrl("images/sensors/noise.svg");
case "cosensor":
return Qt.resolvedUrl("images/sensors/co.svg")
case "co2sensor":
return Qt.resolvedUrl("images/sensors/co2.svg")
case "gassensor":
return Qt.resolvedUrl("images/sensors/gas.svg")
case "daylightsensor":
return Qt.resolvedUrl("images/sensors/light.svg")
case "presencesensor":

2
nymea-app/ui/StyleBase.qml
View File

@ -74,7 +74,9 @@ Item {
"conductivitysensor": "green",
"pressuresensor": "grey",
"noisesensor": "darkviolet",
"cosensor": "darkgray",
"co2sensor": "turquoise",
"gassensor": "yellow",
"daylightsensor": "gold",
"presencesensor": "darkblue",
"closablesensor": "green",

2
nymea-app/ui/delegates/InterfaceTile.qml
View File

@ -315,7 +315,9 @@ MainPageTile {
ListElement { ifaceName: "closablesensor"; stateName: "closed" }
ListElement { ifaceName: "lightsensor"; stateName: "lightIntensity" }
ListElement { ifaceName: "watersensor"; stateName: "waterDetected" }
ListElement { ifaceName: "cosensor"; stateName: "co" }
ListElement { ifaceName: "co2sensor"; stateName: "co2" }
ListElement { ifaceName: "gassensor"; stateName: "gas" }
ListElement { ifaceName: "conductivity"; stateName: "conductivity" }
ListElement { ifaceName: "noisesensor"; stateName: "noise" }
ListElement { ifaceName: "smartmeterconsumer"; stateName: "totalEnergyConsumed" }

6
nymea-app/ui/delegates/ThingTile.qml
View File

@ -179,9 +179,15 @@ MainPageTile {
if (thing.thingClass.interfaces.indexOf("noisesensor") >= 0) {
tmp.push({iface: "noisesensor", state: "noise"});
}
if (thing.thingClass.interfaces.indexOf("cosensor") >= 0) {
tmp.push({iface: "cosensor", state: "co"});
}
if (thing.thingClass.interfaces.indexOf("co2sensor") >= 0) {
tmp.push({iface: "co2sensor", state: "co2"});
}
if (thing.thingClass.interfaces.indexOf("gassensor") >= 0) {
tmp.push({iface: "gassensor", state: "gas"});
}
if (thing.thingClass.interfaces.indexOf("smartmeterconsumer") >= 0) {
tmp.push({iface: "smartmeterconsumer", state: "totalEnergyConsumed"});
}

2
nymea-app/ui/devicelistpages/SensorsDeviceListPage.qml
View File

@ -79,7 +79,9 @@ ThingsListPageBase {
ListElement { interfaceName: "lightsensor"; stateName: "lightIntensity" }
ListElement { interfaceName: "conductivitysensor"; stateName: "conductivity" }
ListElement { interfaceName: "noisesensor"; stateName: "noise" }
ListElement { interfaceName: "cosensor"; stateName: "co" }
ListElement { interfaceName: "co2sensor"; stateName: "co2" }
ListElement { interfaceName: "gassensor"; stateName: "gas" }
ListElement { interfaceName: "daylightsensor"; stateName: "daylight" }
ListElement { interfaceName: "presencesensor"; stateName: "isPresent" }
ListElement { interfaceName: "closablesensor"; stateName: "closed" }

4
nymea-app/ui/devicepages/SensorDevicePage.qml
View File

@ -56,7 +56,7 @@ ThingPageBase {
Repeater {
model: ListModel {
Component.onCompleted: {
var supportedInterfaces = ["temperaturesensor", "humiditysensor", "pressuresensor", "moisturesensor", "lightsensor", "conductivitysensor", "noisesensor", "co2sensor", "presencesensor", "daylightsensor", "closablesensor", "watersensor", "phsensor", "o2sensor", "orpsensor"]
var supportedInterfaces = ["temperaturesensor", "humiditysensor", "pressuresensor", "moisturesensor", "lightsensor", "conductivitysensor", "noisesensor", "cosensor", "co2sensor", "gassensor", "presencesensor", "daylightsensor", "closablesensor", "watersensor", "phsensor", "o2sensor", "orpsensor"]
for (var i = 0; i < supportedInterfaces.length; i++) {
if (root.thingClass.interfaces.indexOf(supportedInterfaces[i]) >= 0) {
append({name: supportedInterfaces[i]});
@ -85,7 +85,9 @@ ThingPageBase {
"lightsensor": "lightIntensity",
"conductivitysensor": "conductivity",
"noisesensor": "noise",
"cosensor": "co",
"co2sensor": "co2",
"gassensor": "gas",
"presencesensor": "isPresent",
"daylightsensor": "daylight",
"closablesensor": "closed",

154
nymea-app/ui/images/sensors/co.svg Normal file
View File

@ -0,0 +1,154 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
width="90"
height="90"
id="svg6138"
version="1.1"
inkscape:version="0.91+devel r"
viewBox="0 0 90 90.000001"
sodipodi:docname="sync-error.svg">
<defs
id="defs6140" />
<sodipodi:namedview
id="base"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:pageopacity="0.0"
inkscape:pageshadow="2"
inkscape:zoom="2.6077032"
inkscape:cx="-148.24923"
inkscape:cy="56.003297"
inkscape:document-units="px"
inkscape:current-layer="g6253"
showgrid="true"
fit-margin-top="0"
fit-margin-left="0"
fit-margin-right="0"
fit-margin-bottom="0"
inkscape:snap-global="true"
inkscape:snap-bbox="true"
inkscape:bbox-paths="true"
inkscape:snap-bbox-midpoints="true"
inkscape:snap-bbox-edge-midpoints="true"
inkscape:bbox-nodes="true"
inkscape:object-paths="true"
inkscape:snap-intersection-paths="true"
inkscape:object-nodes="true"
inkscape:snap-smooth-nodes="true"
inkscape:snap-midpoints="true"
inkscape:snap-others="true"
inkscape:snap-object-midpoints="true"
inkscape:snap-center="true"
showguides="true"
inkscape:guide-bbox="true">
<inkscape:grid
type="xygrid"
id="grid6700"
empspacing="6" />
<sodipodi:guide
orientation="0,1"
position="62,87"
id="guide4084" />
<sodipodi:guide
orientation="0,1"
position="63,84"
id="guide4086" />
<sodipodi:guide
orientation="0,1"
position="63,81"
id="guide4088" />
<sodipodi:guide
orientation="1,0"
position="3,70"
id="guide4090" />
<sodipodi:guide
orientation="1,0"
position="6,66"
id="guide4092" />
<sodipodi:guide
orientation="1,0"
position="9,59"
id="guide4094" />
<sodipodi:guide
orientation="1,0"
position="87,63"
id="guide4096" />
<sodipodi:guide
orientation="1,0"
position="84,64"
id="guide4098" />
<sodipodi:guide
orientation="1,0"
position="81,55"
id="guide4100" />
<sodipodi:guide
orientation="0,1"
position="60,3"
id="guide4102" />
<sodipodi:guide
orientation="0,1"
position="61,6"
id="guide4104" />
<sodipodi:guide
orientation="0,1"
position="62,9"
id="guide4106" />
</sodipodi:namedview>
<metadata
id="metadata6143">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title></dc:title>
</cc:Work>
</rdf:RDF>
</metadata>
<g
inkscape:label="Layer 1"
inkscape:groupmode="layer"
id="layer1"
transform="translate(-283.57144,-358.79068)">
<g
id="g6253"
inkscape:export-filename="planemode01.png"
inkscape:export-xdpi="90"
inkscape:export-ydpi="90"
transform="matrix(-1,0,0,1,547.57143,-1341.5715)">
<rect
style="fill:none;stroke:none"
id="rect6257"
width="90"
height="90"
x="174"
y="1700.3622" />
<path
style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:15px;line-height:125%;font-family:Ubuntu;-inkscape-font-specification:Ubuntu;text-align:center;letter-spacing:0px;word-spacing:0px;writing-mode:lr-tb;text-anchor:middle;display:inline;fill:#808080;fill-opacity:1;stroke:none;stroke-width:0.99999988"
d="m 221.99999,1732.3622 0,8.5799 c 0,2.5213 -0.0933,4.8561 -0.2793,7.0086 -0.18602,2.1215 -0.43607,4.2591 -0.74609,6.4114 l -3.99805,0 c -0.27903,-2.1523 -0.51126,-4.2899 -0.69726,-6.4114 -0.18602,-2.1217 -0.2793,-4.4565 -0.2793,-7.0086 l 0,-8.5799 6,0 z"
id="path4185"
inkscape:connector-curvature="0" />
<path
inkscape:connector-curvature="0"
style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:15px;line-height:125%;font-family:Ubuntu;-inkscape-font-specification:Ubuntu;text-align:center;letter-spacing:0px;word-spacing:0px;writing-mode:lr-tb;text-anchor:middle;display:inline;fill:#808080;fill-opacity:1;stroke:none;stroke-width:0.99999994"
d="m 218.99999,1758.3622 c 1.10006,0 2.04956,0.3867 2.84961,1.1582 0.76673,0.738 1.15039,1.6912 1.15039,2.8653 0,1.174 -0.38366,2.1311 -1.15039,2.8691 -0.80005,0.738 -1.74955,1.1074 -2.84961,1.1074 -1.13341,0 -2.08291,-0.3694 -2.84961,-1.1074 -0.76673,-0.738 -1.15039,-1.6951 -1.15039,-2.8691 0,-1.1741 0.38366,-2.1273 1.15039,-2.8653 0.7667,-0.7715 1.7162,-1.1582 2.84961,-1.1582 z"
id="path4942" />
<path
style="color:#000000;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:medium;line-height:normal;font-family:sans-serif;font-variant-ligatures:none;font-variant-position:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-alternates:normal;font-feature-settings:normal;text-indent:0;text-align:start;text-decoration:none;text-decoration-line:none;text-decoration-style:solid;text-decoration-color:#000000;letter-spacing:normal;word-spacing:normal;text-transform:none;direction:ltr;block-progression:tb;writing-mode:lr-tb;baseline-shift:baseline;text-anchor:start;white-space:normal;shape-padding:0;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#808080;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:4;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate"
d="m 212.5,1714.3613 c -11.29815,0 -20.5,9.2019 -20.5,20.5 l 0,0.01 0,0.01 c 0.002,0.2497 0.0454,0.4967 0.0566,0.7461 -10.15029,1.2279 -18.0494,9.7961 -18.05664,20.2363 0,11.2982 9.20185,20.5 20.5,20.5 l 49,0 c 11.29815,0 20.5,-9.2018 20.5,-20.5 l 0,-0 c -0.0116,-8.9301 -5.844,-16.696 -14.21094,-19.4063 0.0644,-0.5317 0.21041,-1.0527 0.21094,-1.5898 l 0,-0 c 0,-7.4321 -6.06785,-13.5 -13.5,-13.5 l -0.002,0 -0.002,0 c -2.55665,0 -4.93658,0.9271 -7.07421,2.2754 -3.76777,-5.6712 -10.02107,-9.2653 -16.91993,-9.2754 l -0.002,0 z m -0.002,4 0.002,0 c 6.1355,0.01 11.75025,3.4089 14.59766,8.8418 l 1.18945,2.2676 1.91211,-1.7031 c 1.73553,-1.5457 3.97683,-2.4018 6.30078,-2.4063 5.27039,0 9.5,4.2296 9.5,9.5 -0.001,0.8309 -0.11279,1.6591 -0.33008,2.4629 l -0.54297,2.0117 2.03125,0.461 c 7.51333,1.7082 12.82999,8.3597 12.8418,16.0644 0,7e-4 0,0 0,0 0,6e-4 0,0 0,0 -0.002,9.1346 -7.36493,16.4961 -16.5,16.4961 l -49,0 c -9.13573,0 -16.49893,-7.3625 -16.5,-16.498 l 0,-0 c 0.007,-9.023 7.2045,-16.3348 16.22656,-16.4843 l 2.27539,-0.037 -0.33007,-2.25 c -0.10801,-0.7397 -0.16511,-1.4866 -0.17188,-2.2343 0.003,-9.133 7.36456,-16.4931 16.49805,-16.4942 z"
id="path4154"
inkscape:connector-curvature="0" />
</g>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 7.5 KiB

183
nymea-app/ui/images/sensors/gas.svg Normal file
View File

@ -0,0 +1,183 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
width="96"
height="96"
id="svg4874"
version="1.1"
inkscape:version="1.0.2 (e86c870879, 2021-01-15)"
viewBox="0 0 96 96.000001"
sodipodi:docname="gas.svg">
<defs
id="defs4876" />
<sodipodi:namedview
id="base"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:pageopacity="0.0"
inkscape:pageshadow="2"
inkscape:zoom="2.245269"
inkscape:cx="90.885132"
inkscape:cy="30.463907"
inkscape:document-units="px"
inkscape:current-layer="g4780"
showgrid="true"
showborder="true"
fit-margin-top="0"
fit-margin-left="0"
fit-margin-right="0"
fit-margin-bottom="0"
inkscape:snap-bbox="true"
inkscape:bbox-paths="true"
inkscape:bbox-nodes="true"
inkscape:snap-bbox-edge-midpoints="true"
inkscape:snap-bbox-midpoints="true"
inkscape:object-paths="true"
inkscape:snap-intersection-paths="true"
inkscape:object-nodes="true"
inkscape:snap-smooth-nodes="true"
inkscape:snap-midpoints="true"
inkscape:snap-object-midpoints="true"
inkscape:snap-center="true"
showguides="true"
inkscape:guide-bbox="true"
inkscape:snap-global="true"
inkscape:locked="false"
inkscape:document-rotation="0"
inkscape:window-width="1464"
inkscape:window-height="933"
inkscape:window-x="72"
inkscape:window-y="27"
inkscape:window-maximized="1">
<inkscape:grid
type="xygrid"
id="grid5451"
empspacing="8" />
<sodipodi:guide
orientation="1,0"
position="8,-8.0000001"
id="guide4063"
inkscape:locked="false" />
<sodipodi:guide
orientation="1,0"
position="4,-8.0000001"
id="guide4065"
inkscape:locked="false" />
<sodipodi:guide
orientation="0,1"
position="-8,88.000001"
id="guide4067"
inkscape:locked="false" />
<sodipodi:guide
orientation="0,1"
position="-8,92.000001"
id="guide4069"
inkscape:locked="false" />
<sodipodi:guide
orientation="0,1"
position="104,4"
id="guide4071"
inkscape:locked="false" />
<sodipodi:guide
orientation="0,1"
position="-5,8.0000001"
id="guide4073"
inkscape:locked="false" />
<sodipodi:guide
orientation="1,0"
position="88,-8.0000001"
id="guide4077"
inkscape:locked="false" />
<sodipodi:guide
orientation="0,1"
position="-8,84.000001"
id="guide4074"
inkscape:locked="false" />
<sodipodi:guide
orientation="1,0"
position="12,-8.0000001"
id="guide4076"
inkscape:locked="false" />
<sodipodi:guide
orientation="1,0"
position="84,-8.0000001"
id="guide4080"
inkscape:locked="false" />
<sodipodi:guide
position="48,-8.0000001"
orientation="1,0"
id="guide4170"
inkscape:locked="false" />
<sodipodi:guide
position="-8,48"
orientation="0,1"
id="guide4172"
inkscape:locked="false" />
<sodipodi:guide
position="92,-8.0000001"
orientation="1,0"
id="guide4760"
inkscape:locked="false" />
<sodipodi:guide
position="115,12"
orientation="0,1"
id="guide4269"
inkscape:locked="false" />
</sodipodi:namedview>
<metadata
id="metadata4879">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title></dc:title>
</cc:Work>
</rdf:RDF>
</metadata>
<g
inkscape:label="Layer 1"
inkscape:groupmode="layer"
id="layer1"
transform="translate(67.857146,-78.50504)">
<g
transform="matrix(0,-1,-1,0,373.50506,516.50504)"
id="g4845"
style="display:inline">
<g
inkscape:export-ydpi="90"
inkscape:export-xdpi="90"
inkscape:export-filename="next01.png"
transform="matrix(-0.9996045,0,0,1,575.94296,-611.00001)"
id="g4778"
inkscape:label="Layer 1">
<g
transform="matrix(-1,0,0,1,575.99999,611)"
id="g4780"
style="display:inline">
<rect
style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:none;stroke:none;stroke-width:4;marker:none;enable-background:accumulate"
id="rect4782"
width="96.037987"
height="96"
x="-438.00244"
y="345.36221"
transform="scale(-1,1)" />
<path
style="color:#000000;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:medium;line-height:normal;font-family:sans-serif;text-indent:0;text-align:start;text-decoration:none;text-decoration-line:none;text-decoration-style:solid;text-decoration-color:#000000;letter-spacing:normal;word-spacing:normal;text-transform:none;writing-mode:lr-tb;direction:ltr;baseline-shift:baseline;text-anchor:start;white-space:normal;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#808080;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:35.0587;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate"
d="m 353.8481,375.62826 c 4.51127,-4.50011 10.73477,-7.28703 17.61131,-7.30539 18.52405,1.03935 26.52722,17.03935 58.53988,24.91256 -1.1e-4,0.003 -0.005,0.0108 -0.008,0.0135 -0.002,0.003 -0.0108,0.008 -0.0135,0.0163 l -0.0163,0.0162 c -0.002,0.003 -0.008,0.0108 -0.008,0.0135 -31.96686,8.06729 -41.25206,24.68467 -58.3512,25.11489 -9.16872,0.0244 -17.19864,-4.88762 -21.58349,-12.22706 2.7374,2.44304 6.26672,3.92073 10.11771,3.91046 1.72033,-0.005 3.37088,-0.32156 4.91812,-0.87026 0.15735,-0.0558 0.31961,-0.10129 0.47482,-0.16223 1.31752,-0.42764 11.44887,-9.69851 27.79203,-15.6935 l 0.0934,-0.003 0.005,-0.0108 0.0135,-0.0108 0.008,-0.008 0.008,-0.008 c -0.008,-0.005 -0.019,-0.0135 -0.0301,-0.0217 0.0108,-0.005 0.019,-0.008 0.0303,-0.0135 l -0.008,-0.008 -0.008,-0.008 -0.0108,-0.0135 -0.003,-0.0108 -0.0934,-0.005 c -17.34846,-5.88391 -26.56285,-15.12908 -27.88283,-15.54974 -0.15573,-0.0598 -0.31801,-0.10427 -0.47558,-0.15952 -1.55041,-0.54039 -3.20262,-0.83993 -4.92291,-0.83536 -3.85099,0.0108 -7.36894,1.49781 -10.09199,3.95553 1.08552,-1.84068 2.3961,-3.53054 3.89995,-5.03048 z"
id="path4339"
sodipodi:nodetypes="cccccccccscccccccccccccccccsccc" />
</g>
</g>
</g>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 7.2 KiB