From cae6efafca25826c3995ea28f06724255515475b Mon Sep 17 00:00:00 2001
From: Paul Oslund <poslund@wikia-inc.com>
Date: Mon, 26 Oct 2015 22:25:17 +0000
Subject: [PATCH] VE-1997: Add chevron to pi-collapse header

---
 styles/PortableInfobox.scss          | 25 +++++++++++++++++++++++++
 styles/PortableInfoboxVariables.scss |  2 ++
 2 files changed, 27 insertions(+)

diff --git a/styles/PortableInfobox.scss b/styles/PortableInfobox.scss
index 02ac8b3..9b4cc12 100644
--- a/styles/PortableInfobox.scss
+++ b/styles/PortableInfobox.scss
@@ -1,4 +1,5 @@
 @import 'skins/shared/color';
+@import 'skins/shared/mixins/chevron';
 @import 'skins/shared/mixins/flexbox';
 @import 'extensions/wikia/PortableInfobox/styles/PortableInfoboxVariables';
 
@@ -150,7 +151,31 @@
 
 // **********  Collapsible groups  ********** //
 
+.pi-collapse {
+	.pi-header {
+		@include right-chevron($infobox-chevron-size, 2px, 'up', $color-text);
+		padding-right: $infobox-item-margin * 3 + $infobox-chevron-size;
+		position: relative;
+
+		&:after {
+			display: block;
+			margin-top: -($infobox-chevron-size / 2) + 2;
+			position: absolute;
+			right: $infobox-item-margin * 2;
+			top: 50%;
+		}
+	}
+}
+
 .pi-collapse-closed {
+	border-bottom: none;
+
+	.pi-header::after {
+		margin-top: -($infobox-chevron-size / 2);
+		-webkit-transform: rotate(135deg);
+		transform: rotate(135deg);
+	}
+
 	> *:nth-child(n+2) {
 		display: none;
 	}
diff --git a/styles/PortableInfoboxVariables.scss b/styles/PortableInfoboxVariables.scss
index d0271b2..3adbaaf 100644
--- a/styles/PortableInfoboxVariables.scss
+++ b/styles/PortableInfoboxVariables.scss
@@ -8,6 +8,8 @@ $infobox-item-margin: 5px;
 $infobox-margin: 15px;
 $infobox-width: 270px;
 
+$infobox-chevron-size: 10px;
+
 $infobox-debug-error-msg-bg: black;
 $infobox-debug-error-msg-color: white;
 $infobox-debug-line-number-width: 50px;