From 292ac88c961b2762acc6919749132963fba884e3 Mon Sep 17 00:00:00 2001
From: Roxanne Skelly <roxanne@highfidelity.io>
Date: Mon, 25 Feb 2019 11:36:45 -0800
Subject: [PATCH] Update with new standalone-optimized icon
---
.../resources/icons/standalone-optimized.svg | 27 ++++++++
interface/resources/qml/hifi/Card.qml | 28 ++++----
.../hifi/commerce/marketplace/Marketplace.qml | 20 +++---
.../commerce/marketplace/MarketplaceItem.qml | 38 ++++++-----
.../marketplace/MarketplaceListItem.qml | 66 ++++++++++---------
.../hifi/commerce/purchases/PurchasedItem.qml | 18 +++--
6 files changed, 123 insertions(+), 74 deletions(-)
create mode 100644 interface/resources/icons/standalone-optimized.svg
diff --git a/interface/resources/icons/standalone-optimized.svg b/interface/resources/icons/standalone-optimized.svg
new file mode 100644
index 0000000000..f721be9ebb
--- /dev/null
+++ b/interface/resources/icons/standalone-optimized.svg
@@ -0,0 +1,27 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 23.0.2, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
+<svg version="1.1" id="Layer_4" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+ viewBox="0 0 66.7 66" style="enable-background:new 0 0 66.7 66;" xml:space="preserve">
+<style type="text/css">
+ .st0{fill:#00B4EF;}
+</style>
+<path class="st0" d="M66.7,29.5l-7-5.9l1.3-9l-8.9-2l-3.1-8.5l-8.9,2.3l-6.7-6.1l-6.7,6.1l-8.9-2.3l-3.1,8.5l-8.9,2l1.3,9l-7,5.9
+ l5.3,7.4l-3.4,8.4l8.2,4.1l0.9,9l9.2-0.2l5.1,7.5l8-4.4l8,4.4l5.1-7.5l9.2,0.2l0.9-9l8.2-4.1l-3.4-8.4L66.7,29.5z M33.3,58.4
+ C19.3,58.4,8,47,8,33S19.3,7.6,33.3,7.6c14,0,25.4,11.4,25.4,25.4S47.3,58.4,33.3,58.4z M45.5,22.9H21.2c-3,0-5.5,2.3-5.8,5.2h-1.5
+ c-1.1,0-2.1,0.9-2.1,2c0,0,0,0,0,0v5.7c0,1.1,0.9,2.1,2,2.1c0,0,0,0,0,0h1.5c0.1,0.5,0.2,0.9,0.3,1.3l0.1,0.2
+ c0.6,1.5,1.8,2.7,3.3,3.3h0.1c0.3,0.1,0.6,0.2,1,0.2c0.1,0,0.2,0.1,0.3,0.1H27c1.1,0,2.2-0.4,3-1.2c0.9-0.9,2.1-1.4,3.3-1.3
+ c1.2,0,2.4,0.4,3.3,1.3c0.8,0.8,1.9,1.2,3,1.2h5.9c2.9,0,5.4-2.2,5.8-5.1h1.5c1.1,0,2.1-0.9,2.1-2c0,0,0,0,0,0v-5.7
+ c-0.1-1.1-1-1.9-2.1-1.9h-1.4C51,25.2,48.5,22.9,45.5,22.9z M15.3,36.7h-1.4c-0.4,0-0.7-0.3-0.7-0.7c0,0,0,0,0,0v-5.7
+ c0-0.4,0.3-0.7,0.7-0.7h1.4V36.7z M33.3,38.1c-1,0-1.8-0.8-1.8-1.8s0.8-1.8,1.8-1.8s1.8,0.8,1.8,1.8S34.3,38.1,33.3,38.1z
+ M37.2,34.8C37,34.9,36.9,35,36.7,35c-0.3,0-0.6-0.1-0.7-0.4c-0.6-0.9-1.6-1.5-2.7-1.5c-1.1,0-2.1,0.5-2.7,1.5
+ c-0.3,0.4-0.8,0.5-1.2,0.3c-0.4-0.3-0.5-0.8-0.3-1.2c0.9-1.4,2.5-2.2,4.1-2.2c1.7,0,3.2,0.8,4.1,2.3C37.7,34,37.6,34.6,37.2,34.8z
+ M39.8,33.1c-0.1,0.1-0.3,0.1-0.5,0.1c-0.3,0-0.6-0.1-0.7-0.4C37.4,31,35.5,30,33.3,30c-2.1,0-4.1,1.1-5.3,2.9
+ c-0.3,0.4-0.8,0.5-1.2,0.3c-0.4-0.3-0.5-0.8-0.3-1.2c1.5-2.3,4-3.7,6.8-3.7c2.7,0,5.3,1.4,6.8,3.7C40.3,32.3,40.2,32.8,39.8,33.1z
+ M42.5,31.5c-0.1,0.1-0.3,0.1-0.5,0.1c-0.3,0-0.6-0.1-0.7-0.4c-1.8-2.8-4.7-4.4-8-4.4c-3.2,0-6.2,1.6-8,4.4
+ c-0.3,0.4-0.8,0.5-1.2,0.3c-0.4-0.3-0.5-0.8-0.3-1.2c2.1-3.3,5.6-5.2,9.5-5.2c3.9,0,7.4,2,9.5,5.2C43,30.7,42.9,31.3,42.5,31.5z
+ M51.3,29.6h1.4c0.4,0,0.7,0.3,0.7,0.7v5.7c0,0.4-0.3,0.7-0.7,0.7h-1.4V29.6z M30.9,16.9l2.4-1.8l2.4,1.8l-0.9-2.8l2.4-1.8h-3
+ l-0.9-2.8l-0.9,2.8h-3l2.4,1.8L30.9,16.9z M35.8,49.1l-2.4,1.8l-2.4-1.8l0.9,2.8l-2.4,1.8h3l0.9,2.8l0.9-2.8h3l-2.4-1.8L35.8,49.1z
+ M42,17.4l1.3,2.7l0.6-2.9l3-0.4l-2.6-1.5l0.6-2.9l-2.2,2L40,13l1.3,2.7l-2.2,2L42,17.4z M24.7,48.6l-1.3-2.7l-0.6,2.9l-3,0.4
+ l2.6,1.5l-0.6,2.9l2.2-2l2.6,1.5l-1.3-2.7l2.2-2L24.7,48.6z M43.8,48.8l-0.6-2.9L42,48.6l-3-0.4l2.2,2L40,53l2.6-1.5l2.2,2l-0.6-2.9
+ l2.6-1.5L43.8,48.8z M22.8,17.2l0.6,2.9l1.3-2.7l3,0.4l-2.2-2l1.3-2.7l-2.6,1.5l-2.2-2l0.6,2.9l-2.6,1.5L22.8,17.2z"/>
+</svg>
diff --git a/interface/resources/qml/hifi/Card.qml b/interface/resources/qml/hifi/Card.qml
index 9beb108b36..1c0424a691 100644
--- a/interface/resources/qml/hifi/Card.qml
+++ b/interface/resources/qml/hifi/Card.qml
@@ -273,22 +273,28 @@ Item {
}
}
- HiFiGlyphs {
+ Image {
id: standaloneOptomizedBadge
anchors {
right: actionIcon.left
- bottom: parent.bottom;
+ top: actionIcon.top
+ topMargin: 2
+ rightMargin: 3
}
- height: (root.isConcurrency && root.standaloneOptimized) ? 34 : 0
-
- visible: root.isConcurrency && root.standaloneOptimized
-
- text: hifi.glyphs.hmd
- size: 34
- horizontalAlignment: Text.AlignHCenter
- color: messageColor
- }
+ height: root.standaloneOptimized ? 25 : 0
+ width: 25
+
+ visible: root.standaloneOptimized && isConcurrency
+ fillMode: Image.PreserveAspectFit
+ source: "../../icons/standalone-optimized.svg"
+ }
+ ColorOverlay {
+ anchors.fill: standaloneOptomizedBadge
+ source: standaloneOptomizedBadge
+ color: hifi.colors.blueHighlight
+ visible: root.standaloneOptimized && isConcurrency
+ }
StateImage {
id: actionIcon;
diff --git a/interface/resources/qml/hifi/commerce/marketplace/Marketplace.qml b/interface/resources/qml/hifi/commerce/marketplace/Marketplace.qml
index 5f97e64e6c..2206dfcb99 100644
--- a/interface/resources/qml/hifi/commerce/marketplace/Marketplace.qml
+++ b/interface/resources/qml/hifi/commerce/marketplace/Marketplace.qml
@@ -196,16 +196,16 @@ Rectangle {
visible: true
Image {
- id: marketplaceHeaderImage;
- source: "../common/images/marketplaceHeaderImage.png";
- anchors.top: parent.top;
- anchors.topMargin: 2;
- anchors.bottom: parent.bottom;
- anchors.bottomMargin: 0;
- anchors.left: parent.left;
- anchors.leftMargin: 8;
- width: 140;
- fillMode: Image.PreserveAspectFit;
+ id: marketplaceHeaderImage
+ source: "../common/images/marketplaceHeaderImage.png"
+ anchors.top: parent.top
+ anchors.topMargin: 2
+ anchors.bottom: parent.bottom
+ anchors.bottomMargin: 0
+ anchors.left: parent.left
+ anchors.leftMargin: 8
+ width: 140
+ fillMode: Image.PreserveAspectFit
MouseArea {
anchors.fill: parent;
diff --git a/interface/resources/qml/hifi/commerce/marketplace/MarketplaceItem.qml b/interface/resources/qml/hifi/commerce/marketplace/MarketplaceItem.qml
index ecd0c8b422..1579d70500 100644
--- a/interface/resources/qml/hifi/commerce/marketplace/MarketplaceItem.qml
+++ b/interface/resources/qml/hifi/commerce/marketplace/MarketplaceItem.qml
@@ -15,6 +15,7 @@ import Hifi 1.0 as Hifi
import QtQuick 2.9
import QtQuick.Controls 2.2
import stylesUit 1.0
+import QtGraphicalEffects 1.0
import controlsUit 1.0 as HifiControlsUit
import "../../../controls" as HifiControls
import "../common" as HifiCommerceCommon
@@ -248,28 +249,33 @@ Rectangle {
id: badges
anchors {
- left: parent.left
+ right: buyButton.left
top: parent.top
- right: parent.right
+ rightMargin: 10
}
height: childrenRect.height
- HiFiGlyphs {
+ Image {
id: standaloneOptomizedBadge
anchors {
- left: parent.left
- verticalCenter: parent.verticalCenter
+ topMargin: 15
+ right: parent.right
+ top: parent.top
}
- height: root.standaloneOptimized ? 34 : 0
+ height: root.standaloneOptimized ? 50 : 0
+ width: 50
visible: root.standaloneOptimized
-
- text: hifi.glyphs.hmd
- size: 34
- horizontalAlignment: Text.AlignHCenter
+ fillMode: Image.PreserveAspectFit
+ source: "../../../../icons/standalone-optimized.svg"
+ }
+ ColorOverlay {
+ anchors.fill: standaloneOptomizedBadge
+ source: standaloneOptomizedBadge
color: hifi.colors.blueHighlight
- }
+ visible: root.standaloneOptimized
+ }
}
HifiControlsUit.Button {
@@ -277,11 +283,11 @@ Rectangle {
anchors {
right: parent.right
- top: badges.bottom
- left: parent.left
+ top: parent.top
topMargin: 15
}
- height: 50
+ height: 50
+ width: 180
property bool isNFS: availability === "not for sale" // Note: server will say "sold out" or "invalidated" before it says NFS
property bool isMine: creator === Account.username
@@ -301,11 +307,11 @@ Rectangle {
id: creatorItem
anchors {
- top: buyButton.bottom
+ top: parent.top
leftMargin: 15
topMargin: 15
}
- width: parent.width
+ width: paintedWidth
height: childrenRect.height
RalewaySemiBold {
diff --git a/interface/resources/qml/hifi/commerce/marketplace/MarketplaceListItem.qml b/interface/resources/qml/hifi/commerce/marketplace/MarketplaceListItem.qml
index 4fbed690f6..d0632ce8c3 100644
--- a/interface/resources/qml/hifi/commerce/marketplace/MarketplaceListItem.qml
+++ b/interface/resources/qml/hifi/commerce/marketplace/MarketplaceListItem.qml
@@ -240,16 +240,18 @@ Rectangle {
id: creatorText
anchors {
- top: creatorLabel.top;
- left: creatorLabel.right;
- leftMargin: 15;
+ top: creatorLabel.top
+ left: creatorLabel.right
+ leftMargin: 15
+ right: badges.left
}
- width: paintedWidth;
+ width: paintedWidth
- text: root.creator;
- size: 14;
- color: hifi.colors.lightGray;
- verticalAlignment: Text.AlignVCenter;
+ text: root.creator
+ size: 14
+ elide: Text.ElideRight
+ color: hifi.colors.lightGray
+ verticalAlignment: Text.AlignVCenter
}
RalewaySemiBold {
@@ -260,12 +262,12 @@ Rectangle {
left: parent.left
leftMargin: 15
}
- width: paintedWidth;
+ width: paintedWidth
- text: "IN:";
- size: 14;
- color: hifi.colors.lightGrayText;
- verticalAlignment: Text.AlignVCenter;
+ text: "IN:"
+ size: 14
+ color: hifi.colors.lightGrayText
+ verticalAlignment: Text.AlignVCenter
}
RalewaySemiBold {
@@ -275,14 +277,15 @@ Rectangle {
top: categoryLabel.top
left: categoryLabel.right
leftMargin: 15
+ right: badges.left
}
width: paintedWidth
text: root.category
size: 14
- color: hifi.colors.blueHighlight;
- verticalAlignment: Text.AlignVCenter;
-
+ color: hifi.colors.blueHighlight
+ verticalAlignment: Text.AlignVCenter
+ elide: Text.ElideRight
MouseArea {
anchors.fill: parent
@@ -293,30 +296,33 @@ Rectangle {
id: badges
anchors {
- left: parent.left
- top: categoryLabel.bottom
right: buyButton.left
+ top: parent.top
+ topMargin: 10
+ rightMargin: 10
}
- height: childrenRect.height
+ height: 50
- HiFiGlyphs {
+ Image {
id: standaloneOptomizedBadge
anchors {
- left: parent.left
- leftMargin: 15
- verticalCenter: parent.verticalCenter
-
+ right: parent.right
+ top: parent.top
}
- height: 24
+ height: root.standaloneOptimized ? 40 : 0
+ width: 40
visible: root.standaloneOptimized
-
- text: hifi.glyphs.hmd
- size: 24
- horizontalAlignment: Text.AlignHCenter
+ fillMode: Image.PreserveAspectFit
+ source: "../../../../icons/standalone-optimized.svg"
+ }
+ ColorOverlay {
+ anchors.fill: standaloneOptomizedBadge
+ source: standaloneOptomizedBadge
color: hifi.colors.blueHighlight
- }
+ visible: root.standaloneOptimized
+ }
}
HifiControlsUit.Button {
diff --git a/interface/resources/qml/hifi/commerce/purchases/PurchasedItem.qml b/interface/resources/qml/hifi/commerce/purchases/PurchasedItem.qml
index 22792e5727..87bf7afbe4 100644
--- a/interface/resources/qml/hifi/commerce/purchases/PurchasedItem.qml
+++ b/interface/resources/qml/hifi/commerce/purchases/PurchasedItem.qml
@@ -13,6 +13,7 @@
import Hifi 1.0 as Hifi
import QtQuick 2.5
+import QtGraphicalEffects 1.0
import QtQuick.Controls 1.4
import QtQuick.Controls.Styles 1.4
import stylesUit 1.0
@@ -848,8 +849,7 @@ Item {
}
}
}
-
- HiFiGlyphs {
+ Image {
id: standaloneOptomizedBadge
anchors {
@@ -858,14 +858,18 @@ Item {
rightMargin: 15
bottomMargin:12
}
- height: root.standaloneOptimized ? 34 : 0
+ height: root.standaloneOptimized ? 36 : 0
+ width: 36
visible: root.standaloneOptimized
-
- text: hifi.glyphs.hmd
- size: 34
- horizontalAlignment: Text.AlignHCenter
+ fillMode: Image.PreserveAspectFit
+ source: "../../../../icons/standalone-optimized.svg"
+ }
+ ColorOverlay {
+ anchors.fill: standaloneOptomizedBadge
+ source: standaloneOptomizedBadge
color: hifi.colors.blueHighlight
+ visible: root.standaloneOptimized
}
}