From: Luzifr <szekely@woltlab.com>
Date: Thu, 19 Jan 2012 19:34:44 +0000 (+0100)
Subject: Z-index & like-widget
X-Git-Tag: 2.0.0_Beta_1~1410
X-Git-Url: https://git.stricted.de/?a=commitdiff_plain;h=e11e68dbc399c1abdadea60b1a221ee22b20ab55;p=GitHub%2FWoltLab%2FWCF.git

Z-index & like-widget

Please change the like-widget in posts so that it generates the code
that i will commit in "threadPostList.tpl"!
---

diff --git a/wcfsetup/install/files/acp/style/wcf.css b/wcfsetup/install/files/acp/style/wcf.css
index 5a38bda8e7..e3f070164e 100644
--- a/wcfsetup/install/files/acp/style/wcf.css
+++ b/wcfsetup/install/files/acp/style/wcf.css
@@ -188,7 +188,7 @@ nav.topMenu {
 	top: 0;
 	right: 0;
 	left: 0;	
-	z-index: 500;
+	z-index: 300;
 	
 	-webkit-box-shadow: 0 3px 7px rgba(0, 0, 0, .3);
 	-moz-box-shadow: 0 3px 7px rgba(0, 0, 0, .3);
@@ -661,7 +661,7 @@ nav.topMenu {
 	background-image: -o-linear-gradient(#fff, #e7f2fd);
 	background-image: linear-gradient(#fff, #e7f2fd);
 	
-	z-index: 100;
+	z-index: 10;
 }
 
 /* ToDo: Special */
@@ -876,7 +876,7 @@ section.content:after {
 }	
 
 section.content .content {
-	border: 1px solid #ccc;
+	/* Test: border: 1px solid #ccc;*/
 	background-color: rgba(0, 0, 0, .01);
 	padding: 13px 23px 23px;
 }
@@ -2725,7 +2725,7 @@ input[type='button'],
 	height: 0;
 	top: -4px;
 	right: -15px;
-	z-index: 100;
+	z-index: 10;
 }
 
 .breadcrumbs > ul > li > .pointer > span {
@@ -2784,7 +2784,7 @@ input[type='button'],
 	color: rgba(102, 102, 102, 1);
 	background-color: #f9f9f9;
 	position: relative;
-	z-index: 90;
+	z-index: 20;
 }
 
 .breadcrumbs > ul > li:hover > .pointer > span {
@@ -3113,7 +3113,7 @@ tr .columnURL {
 .pageNavigation ul li.children > a {
 	margin-right: -30px;
 	position: relative;
-	z-index: 100;
+	z-index: 10;
 }
 
 .pageNavigation ul li.children input {
@@ -3523,7 +3523,7 @@ div#ajaxExceptionStacktrace {
 	background-color: rgba(0, 0, 0, .7);
 	padding: 5px 10px 7px;
 	max-width: 300px;
-	z-index: 900;
+	z-index: 800;
 	
 	-webkit-box-shadow: 0 3px 7px rgba(0, 0, 0, .3);
 	-moz-box-shadow: 0 3px 7px rgba(0, 0, 0, .3);
@@ -3604,7 +3604,8 @@ input[type='button'],
 .badgeButton,
 .pageNavigation ul li:not(.children),
 .clipboardEditor > ul > li,
-.preInput .dropdownCaption {
+.preInput .dropdownCaption,
+.likeWidget > ul > li a {
 	text-decoration: none;
 	text-shadow: 0 1px 0 rgba(255, 255, 255, 1);
 	color: rgba(153, 153, 153, 1);
@@ -3655,7 +3656,8 @@ input[type='button'].default:hover,
 .badgeButton:hover,
 .pageNavigation ul li:not(.disabled):not(.children):hover,
 .clipboardEditor > ul > li:hover,
-.preInput:hover .dropdownCaption {
+.preInput:hover .dropdownCaption,
+.likeWidget > ul > li a:hover {
 	color: rgba(102, 102, 102, 1);
 	border-width: 1px;
 	border-style: solid;
@@ -3697,7 +3699,9 @@ input[type='button'].default:active,
 .badgeButton:active,
 .pageNavigation ul li:not(.disabled):not(.children):focus,
 .clipboardEditor > ul > li:active,
-.preInput .dropdownCaption:active {
+.preInput .dropdownCaption:active,
+.likeWidget > ul > li a:active,
+.likeWidget > ul > li.active a {
 	color: #333;
 	border-width: 1px;
 	border-style: solid;
@@ -4007,7 +4011,8 @@ button[disabled='disabled'],
 input[disabled='disabled'],
 input[type='button'][disabled='disabled'],
 .smallButtons > li.disabled > a,
-.largeButtons > li.disabled > a {
+.largeButtons > li.disabled > a,
+.likeWidget > ul > li.disabled a {
 	color: rgba(153, 153, 153, 1);
 	cursor: default;
 	border-width: 1px;
@@ -4310,4 +4315,114 @@ input[type='button'][disabled='disabled'],
 	font-size: 110%;
 }
 
+
+
+
+
+
+
+/* ############## ToDo: Like Widget ############## */
+
+/*  @see theadPostList.tpl */
+
+/* -- -- -- -- Widget -- -- -- -- -- */
+
+/* Globals */
+
+.likeWidget {
+	margin: 3px 15px;
+	float: right;
+}
+
+/* Buttons */
+
+.likeWidget > ul > li {
+	text-align: right;
+	margin-top: 3px;
+	display: inline-block;
+}
+
+.likeWidget > ul > li > a {
+	padding: 3px 5px;
+}
+
+.likeWidget > ul > li:first-child {
+	margin-right: -5px;
+}
+
+.likeWidget > ul > li:first-child a {
+	border-radius: 7px 0 0 7px;
+}
+
+.likeWidget > ul > li:nth-child(2) a {
+	border-radius: 0 7px 7px 0;
+}
+
+.likeWidget > ul > li > a > .badge {
+	font-size: 75%;
+	color: rgba(255, 255, 255, 1);
+	background-color: rgba(0, 0, 0, .7);
+	margin-left: -1px;
+	margin-right: 0;
+	padding: 1px 3px;
+}
+
+/* Cummulative Likes Display */
+
+.likeWidget > .display {
+	border-width: 1px;
+	border-style: solid;
+	border-color: rgba(255, 255, 255, .7);
+	display: inline;
+	position: relative;
+	top: -42px;
+	right: -13%;
+}
+
+.likeWidget > .display > .displayText {
+	font-size: 75%;
+	color: rgba(255, 255, 255, 1);
+	border-radius: 3px;
+	background-color: rgba(0, 0, 0, .7);
+	padding: 2px 5px;
+}
+
+/* -- -- -- -- Like Widget Pointer -- -- -- -- -- */
+
+.likeWidget > .display > .pointer {	
+	border-width: 7px 7px 0 7px;
+	border-style: solid;
+	border-color: rgba(255, 255, 255, .7) transparent;
+	display: inline-block !important;
+	width: 0;
+	position: absolute;
+	bottom: -8px !important;
+	right: 10%;
+}
+
+.likeWidget > .display > .pointer span {	
+	border-width: 5px 5px 0 5px;
+	border-style: solid;
+	border-color: rgba(0, 0, 0, .7) transparent;
+	display: inline-block;
+	width: 0;
+	position: absolute;
+	bottom: 2px;
+	left: -5px;
+}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
 /* -- -- -- -- -- EOF -- -- -- -- -- */