From 61ac9d005045c560b324c1c954d1fee711270c37 Mon Sep 17 00:00:00 2001
From: Ryan Huffman <ryanhuffman@gmail.com>
Date: Wed, 2 Jan 2019 16:47:09 -0800
Subject: [PATCH] Update various styling in Avatar Packager

---
 .../hifi/avatarPackager/AvatarPackagerApp.qml | 59 ++++++++++++++-----
 .../avatarPackager/AvatarPackagerHeader.qml   | 35 ++++-------
 .../hifi/avatarPackager/AvatarProjectCard.qml | 13 +++-
 3 files changed, 69 insertions(+), 38 deletions(-)

diff --git a/interface/resources/qml/hifi/avatarPackager/AvatarPackagerApp.qml b/interface/resources/qml/hifi/avatarPackager/AvatarPackagerApp.qml
index 2b21b4d938..0a678dafee 100644
--- a/interface/resources/qml/hifi/avatarPackager/AvatarPackagerApp.qml
+++ b/interface/resources/qml/hifi/avatarPackager/AvatarPackagerApp.qml
@@ -146,6 +146,8 @@ Item {
         }
 
         AvatarPackagerHeader {
+            z: 100
+
             id: avatarPackagerHeader
             colorScheme: root.colorScheme
             onBackButtonClicked: {
@@ -260,22 +262,49 @@ Item {
                     }
                 }
 
-                Column {
-                    visible: AvatarPackagerCore.recentProjects.length > 0
-                    anchors {
-                        fill: parent
-                        topMargin: 18
-                        leftMargin: 16
-                        rightMargin: 16
-                    }
-                    spacing: 10
+                Item {
+                    anchors.fill: parent
 
-                    Repeater {
-                        model: AvatarPackagerCore.recentProjects
-                        AvatarProjectCard {
-                            title: modelData.name
-                            path: modelData.projectPath
-                            onOpen: avatarPackager.openProject(modelData.path)
+                    visible: AvatarPackagerCore.recentProjects.length > 0
+
+                    RalewayRegular {
+                        id: recentProjectsText
+
+                        color: 'white'
+
+                        visible: AvatarPackagerCore.currentAvatarProject !== null
+
+                        anchors.top: parent.top
+                        anchors.left: parent.left
+                        anchors.topMargin: 16
+                        anchors.leftMargin: 16
+
+                        size: 20
+
+                        text: "Recent Projects"
+
+                        onLinkActivated: fileListPopup.open()
+                    }
+
+                    Column {
+                        anchors {
+                            left: parent.left
+                            right: parent.right
+                            bottom: parent.bottom
+                            top: recentProjectsText.bottom
+                            topMargin: 16
+                            leftMargin: 16
+                            rightMargin: 16
+                        }
+                        spacing: 10
+
+                        Repeater {
+                            model: AvatarPackagerCore.recentProjects
+                            AvatarProjectCard {
+                                title: modelData.name
+                                path: modelData.projectPath
+                                onOpen: avatarPackager.openProject(modelData.path)
+                            }
                         }
                     }
                 }
diff --git a/interface/resources/qml/hifi/avatarPackager/AvatarPackagerHeader.qml b/interface/resources/qml/hifi/avatarPackager/AvatarPackagerHeader.qml
index 7037aa9d92..d0b06ea15f 100644
--- a/interface/resources/qml/hifi/avatarPackager/AvatarPackagerHeader.qml
+++ b/interface/resources/qml/hifi/avatarPackager/AvatarPackagerHeader.qml
@@ -2,8 +2,9 @@ import QtQuick 2.6
 
 import "../../controlsUit" 1.0 as HifiControls
 import "../../stylesUit" 1.0
+import "../avatarapp" 1.0
 
-Rectangle {
+ShadowRectangle {
     id: root 
 
     width: parent.width
@@ -24,30 +25,21 @@ Rectangle {
     signal backButtonClicked
     signal docsButtonClicked
 
-    RalewaySemiBold {
+    RalewayButton {
         id: back
+
         visible: backButtonEnabled && backButtonVisible
+
         size: 28
         anchors.top: parent.top
         anchors.bottom: parent.bottom
         anchors.left: parent.left
         anchors.leftMargin: 16
         anchors.verticalCenter: back.verticalCenter
+
         text: "◀"
-        color: textColor
-        MouseArea {
-            anchors.fill: parent
-            onClicked: root.backButtonClicked()
-            hoverEnabled: true
-            onEntered: { state = "hovering" }
-            onExited: { state = "" }
-            states: [
-                State {
-                    name: "hovering"
-                    PropertyChanges { target: back; color: hoverTextColor }
-                }
-            ]
-        }
+
+        onClicked: root.backButtonClicked()
     }
     Item {
         id: titleArea
@@ -124,7 +116,7 @@ Rectangle {
         }
     }
 
-    RalewaySemiBold {
+    RalewayButton {
         id: docs
         visible: false
         size: 28
@@ -133,13 +125,12 @@ Rectangle {
         anchors.right: parent.right
         anchors.rightMargin: 16
         anchors.verticalCenter: docs.verticalCenter
+
         text: qsTr("Docs")
         color: "white"
-        MouseArea {
-            anchors.fill: parent
-            onClicked: {
-                docsButtonClicked();
-            }
+
+        onClicked: {
+            docsButtonClicked();
         }
     }
 }
diff --git a/interface/resources/qml/hifi/avatarPackager/AvatarProjectCard.qml b/interface/resources/qml/hifi/avatarPackager/AvatarProjectCard.qml
index 5496711d44..a758d3936a 100644
--- a/interface/resources/qml/hifi/avatarPackager/AvatarProjectCard.qml
+++ b/interface/resources/qml/hifi/avatarPackager/AvatarProjectCard.qml
@@ -1,4 +1,5 @@
 import QtQuick 2.0
+import QtGraphicalEffects 1.0
 
 import "../../controlsUit" 1.0 as HifiControls
 import "../../stylesUit" 1.0
@@ -63,7 +64,7 @@ Item {
                 rightMargin: 16
             }
             text: "<title missing>"
-            size: 16
+            size: 24
         }
 
         RalewayRegular {
@@ -88,4 +89,14 @@ Item {
             onClicked: open()
         }
     }
+
+    DropShadow {
+        id: shadow
+        anchors.fill: background
+        radius: 4
+        horizontalOffset: 0
+        verticalOffset: 4
+        color: Qt.rgba(0, 0, 0, 0.25)
+        source: background
+    }
 }