status-im
/
status-desktop
mirror of https://github.com/status-im/status-desktop.git
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

feat: add new svg icons and show the right one

This commit is contained in:
Jonathan Rainville 2020-05-08 14:06:47 -04:00
parent dc56578f8e
commit 09c3f679bc
12 changed files with 72 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
img/compass.svg Normal file
View File

@ -0,0 +1,4 @@
<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M6.84181 7.47427L5.25291 12.241C5.14867 12.5537 5.44617 12.8512 5.75887 12.7469L10.5256 11.158C10.8242 11.0585 11.0585 10.8242 11.158 10.5256L12.7469 5.75887C12.8512 5.44617 12.5537 5.14867 12.241 5.25291L7.47427 6.84181C7.17566 6.94135 6.94135 7.17566 6.84181 7.47427Z" fill="#939BA1"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M18 9C18 13.9706 13.9706 18 9 18C4.02944 18 0 13.9706 0 9C0 4.02944 4.02944 0 9 0C13.9706 0 18 4.02944 18 9ZM16 9C16 12.866 12.866 16 9 16C5.13401 16 2 12.866 2 9C2 5.13401 5.13401 2 9 2C12.866 2 16 5.13401 16 9Z" fill="#939BA1"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 680 B

4
img/compassActive.svg Normal file
View File

@ -0,0 +1,4 @@
<svg width="18" height="18" viewBox="0 0 18 18" fill="#4360DF" xmlns="http://www.w3.org/2000/svg">
<path d="M6.84181 7.47427L5.25291 12.241C5.14867 12.5537 5.44617 12.8512 5.75887 12.7469L10.5256 11.158C10.8242 11.0585 11.0585 10.8242 11.158 10.5256L12.7469 5.75887C12.8512 5.44617 12.5537 5.14867 12.241 5.25291L7.47427 6.84181C7.17566 6.94135 6.94135 7.17566 6.84181 7.47427Z" />
<path fill-rule="evenodd" clip-rule="evenodd" d="M18 9C18 13.9706 13.9706 18 9 18C4.02944 18 0 13.9706 0 9C0 4.02944 4.02944 0 9 0C13.9706 0 18 4.02944 18 9ZM16 9C16 12.866 12.866 16 9 16C5.13401 16 2 12.866 2 9C2 5.13401 5.13401 2 9 2C12.866 2 16 5.13401 16 9Z" />
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 655 B

BIN
img/message.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 630 B

5
img/message.svg Normal file
View File

@ -0,0 +1,5 @@
<svg width="18" height="18" viewBox="0 0 18 18" fill="#939BA1" xmlns="http://www.w3.org/2000/svg">
<path d="M6.25 8.5C7.07837 8.5 7.75 7.82837 7.75 7C7.75 6.17163 7.07837 5.5 6.25 5.5C5.42163 5.5 4.75 6.17163 4.75 7C4.75 7.82837 5.42163 8.5 6.25 8.5Z"/>
<path d="M11.75 8.5C12.5784 8.5 13.25 7.82837 13.25 7C13.25 6.17163 12.5784 5.5 11.75 5.5C10.9216 5.5 10.25 6.17163 10.25 7C10.25 7.82837 10.9216 8.5 11.75 8.5Z"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M6 0C2.68628 0 0 2.68628 0 6V16.5C0 16.8923 0.229492 17.2485 0.58667 17.4106C0.944092 17.5728 1.36328 17.511 1.65845 17.2526L4.52734 14.7423C5.07422 14.2638 5.77637 14 6.50293 14H13C15.7615 14 18 11.7615 18 9V5C18 2.23853 15.7615 0 13 0H6ZM2 6C2 3.79089 3.79077 2 6 2H13C14.6567 2 16 3.34314 16 5V9C16 10.6569 14.6567 12 13 12H6.50293C5.29175 12 4.12183 12.4396 3.21045 13.2371L2 14.2963V6Z" />
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 869 B

5
img/messageActive.svg Normal file
View File

@ -0,0 +1,5 @@
<svg width="18" height="18" viewBox="0 0 18 18" fill="#4360DF" xmlns="http://www.w3.org/2000/svg">
<path d="M6.25 8.5C7.07837 8.5 7.75 7.82837 7.75 7C7.75 6.17163 7.07837 5.5 6.25 5.5C5.42163 5.5 4.75 6.17163 4.75 7C4.75 7.82837 5.42163 8.5 6.25 8.5Z"/>
<path d="M11.75 8.5C12.5784 8.5 13.25 7.82837 13.25 7C13.25 6.17163 12.5784 5.5 11.75 5.5C10.9216 5.5 10.25 6.17163 10.25 7C10.25 7.82837 10.9216 8.5 11.75 8.5Z"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M6 0C2.68628 0 0 2.68628 0 6V16.5C0 16.8923 0.229492 17.2485 0.58667 17.4106C0.944092 17.5728 1.36328 17.511 1.65845 17.2526L4.52734 14.7423C5.07422 14.2638 5.77637 14 6.50293 14H13C15.7615 14 18 11.7615 18 9V5C18 2.23853 15.7615 0 13 0H6ZM2 6C2 3.79089 3.79077 2 6 2H13C14.6567 2 16 3.34314 16 5V9C16 10.6569 14.6567 12 13 12H6.50293C5.29175 12 4.12183 12.4396 3.21045 13.2371L2 14.2963V6Z" fill="#4360DF"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 883 B

BIN
img/profile.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 621 B

3
img/profile.svg Normal file
View File

@ -0,0 +1,3 @@
<svg width="14" height="19" viewBox="0 0 14 19" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M7 2C5.34315 2 4 3.34315 4 5C4 6.65685 5.34315 8 7 8C8.65685 8 10 6.65685 10 5C10 3.34315 8.65685 2 7 2ZM2 5C2 2.23858 4.23858 0 7 0C9.76142 0 12 2.23858 12 5C12 7.76142 9.76142 10 7 10C4.23858 10 2 7.76142 2 5ZM4 14C2.89543 14 2 14.8954 2 16V18C2 18.5523 1.55228 19 1 19C0.447715 19 0 18.5523 0 18V16C0 13.7909 1.79086 12 4 12H10C12.2091 12 14 13.7909 14 16V18C14 18.5523 13.5523 19 13 19C12.4477 19 12 18.5523 12 18V16C12 14.8954 11.1046 14 10 14H4Z" fill="#939BA1"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 622 B

3
img/profileActive.svg Normal file
View File

@ -0,0 +1,3 @@
<svg width="14" height="19" viewBox="0 0 14 19" fill="#4360DF" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M7 2C5.34315 2 4 3.34315 4 5C4 6.65685 5.34315 8 7 8C8.65685 8 10 6.65685 10 5C10 3.34315 8.65685 2 7 2ZM2 5C2 2.23858 4.23858 0 7 0C9.76142 0 12 2.23858 12 5C12 7.76142 9.76142 10 7 10C4.23858 10 2 7.76142 2 5ZM4 14C2.89543 14 2 14.8954 2 16V18C2 18.5523 1.55228 19 1 19C0.447715 19 0 18.5523 0 18V16C0 13.7909 1.79086 12 4 12H10C12.2091 12 14 13.7909 14 16V18C14 18.5523 13.5523 19 13 19C12.4477 19 12 18.5523 12 18V16C12 14.8954 11.1046 14 10 14H4Z" />
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 611 B

BIN
img/wallet.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 393 B

3
img/wallet.svg Normal file
View File

@ -0,0 +1,3 @@
<svg width="18" height="16" viewBox="0 0 18 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M3.00684 0C1.34741 0 0 1.34229 0 3.00244V12.9976C0 14.651 1.34839 16 3.00684 16H14.9932C16.6526 16 18 14.6577 18 12.9976V3.00244C18 1.349 16.6516 0 14.9932 0H3.00684ZM2 12.9976V6H16V12.9976C16 13.5511 15.55 14 14.9932 14H3.00684C2.45068 14 2 13.5442 2 12.9976ZM16 4H2V3.00244C2 2.44885 2.44995 2 3.00684 2H14.9932C15.5493 2 16 2.45581 16 3.00244V4ZM13 8C12.4438 8 12 8.4519 12 9.0094V10.9906C12 11.5566 12.4478 12 13 12C13.5562 12 14 11.5481 14 10.9906V9.0094C14 8.44336 13.5522 8 13 8Z" fill="#939BA1"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 657 B

3
img/walletActive.svg Normal file
View File

@ -0,0 +1,3 @@
<svg width="18" height="16" viewBox="0 0 18 16" fill="#4360DF" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M3.00684 0C1.34741 0 0 1.34229 0 3.00244V12.9976C0 14.651 1.34839 16 3.00684 16H14.9932C16.6526 16 18 14.6577 18 12.9976V3.00244C18 1.349 16.6516 0 14.9932 0H3.00684ZM2 12.9976V6H16V12.9976C16 13.5511 15.55 14 14.9932 14H3.00684C2.45068 14 2 13.5442 2 12.9976ZM16 4H2V3.00244C2 2.44885 2.44995 2 3.00684 2H14.9932C15.5493 2 16 2.45581 16 3.00244V4ZM13 8C12.4438 8 12 8.4519 12 9.0094V10.9906C12 11.5566 12.4478 12 13 12C13.5562 12 14 11.5481 14 10.9906V9.0094C14 8.44336 13.5522 8 13 8Z" />
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 646 B

60
main.qml
View File

@ -21,6 +21,7 @@ ApplicationWindow {
id: tabBar
width: 50
height: width *2 + spacing
currentIndex: 0
topPadding: 57
rightPadding: 19
leftPadding: 19
@ -31,67 +32,89 @@ ApplicationWindow {
anchors.topMargin: 5
spacing: 5
Layout.fillWidth: true
Layout.minimumWidth: 85
Layout.preferredWidth: 85
Layout.maximumWidth: 85
Layout.minimumWidth: 80
Layout.preferredWidth: 80
Layout.maximumWidth: 80
Layout.minimumHeight: 0
TabButton {
id: firstBtn
width: 50
height: 50
x: 0
width: 40
height: 40
text: ""
padding: 0
transformOrigin: Item.Center
anchors.horizontalCenter: parent.horizontalCenter
background: Rectangle {
color: "#ECEFFC"
opacity: parent.checked ? 1 : 0
radius: 50
}
Image {
id: image
anchors.fill: parent
anchors.verticalCenter: parent.verticalCenter
anchors.horizontalCenter: parent.horizontalCenter
fillMode: Image.PreserveAspectFit
source: "img/message.png"
source: parent.checked ? "img/messageActive.svg" : "img/message.svg"
}
}
TabButton {
id: secondBtn
width: 50
height: 50
width: 40
height: 40
text: ""
anchors.topMargin: 80
anchors.topMargin: 50
anchors.horizontalCenter: parent.horizontalCenter
anchors.top: firstBtn.top
background: Rectangle {
color: "#ECEFFC"
opacity: parent.checked ? 1 : 0
radius: 50
}
Image {
id: image1
anchors.fill: parent
anchors.verticalCenter: parent.verticalCenter
anchors.horizontalCenter: parent.horizontalCenter
fillMode: Image.PreserveAspectFit
source: "img/wallet.png"
source: parent.checked ? "img/walletActive.svg" : "img/wallet.svg"
}
}
TabButton {
id: thirdBtn
width: 50
height: 50
width: 40
height: 40
text: ""
anchors.topMargin: 80
anchors.topMargin: 50
anchors.horizontalCenter: parent.horizontalCenter
anchors.top: secondBtn.top
background: Rectangle {
color: "#ECEFFC"
opacity: parent.checked ? 1 : 0
radius: 50
}
Image {
id: image2
anchors.fill: parent
anchors.verticalCenter: parent.verticalCenter
anchors.horizontalCenter: parent.horizontalCenter
fillMode: Image.PreserveAspectFit
source: "img/profile.png"
source: parent.checked ? "img/profileActive.svg" : "img/profile.svg"
}
}
}
StackLayout {
width: parent.width
Layout.fillWidth: true
currentIndex: tabBar.currentIndex
SplitView {
id: splitView
x: 9
y: 0
Layout.fillHeight: true
@ -119,6 +142,7 @@ ApplicationWindow {
height: parent.height
ColumnLayout {
anchors.rightMargin: 0
anchors.fill: parent
RowLayout {
@ -160,6 +184,6 @@ ApplicationWindow {
/*##^##
Designer {
D{i:4;anchors_height:40;anchors_width:40}D{i:6;anchors_height:40;anchors_width:40}
D{i:0;formeditorZoom:1.5}D{i:8;anchors_height:40;anchors_width:40}
}
##^##*/