From 6444e726716c65744a3d74d8e64831512ecf8bb4 Mon Sep 17 00:00:00 2001
From: Marcel Werk <burntime@woltlab.com>
Date: Tue, 29 Nov 2016 18:21:31 +0100
Subject: [PATCH] Overhauled cookie policy notice

---
 com.woltlab.wcf/templates/footer.tpl       | 25 +++++++++-------
 wcfsetup/install/files/style/ui/alert.scss | 35 +++++++++++++++++++++-
 wcfsetup/install/lang/de.xml               |  3 +-
 wcfsetup/install/lang/en.xml               |  3 +-
 4 files changed, 53 insertions(+), 13 deletions(-)

diff --git a/com.woltlab.wcf/templates/footer.tpl b/com.woltlab.wcf/templates/footer.tpl
index 96e051433b..c8d8956f11 100644
--- a/com.woltlab.wcf/templates/footer.tpl
+++ b/com.woltlab.wcf/templates/footer.tpl
@@ -103,21 +103,26 @@
 
 <div class="pageFooterStickyNotice">
 	{if MODULE_COOKIE_POLICY_PAGE && $__wcf->session->isFirstVisit() && !$__wcf->user->userID}
-		<p class="info cookiePolicyNotice">
-			{lang}wcf.page.cookiePolicy.info{/lang}
-			<span class="icon icon24 fa-times jsTooltip jsOnly pointer cookiePolicyNoticeDismiss" title="{lang}wcf.global.button.close{/lang}"></span>
-			<script data-relocate="true">
-				elBySel('.cookiePolicyNoticeDismiss').addEventListener(WCF_CLICK_EVENT, function() {
-					elRemove(elBySel('.cookiePolicyNotice'));
-				});
-			</script>
-		</p>
+		<div class="info cookiePolicyNotice">
+			<div class="layoutBoundary">
+				<span class="cookiePolicyNoticeText">{lang}wcf.page.cookiePolicy.info{/lang}</span>
+				<a href="{page}com.woltlab.wcf.CookiePolicy{/page}" class="button buttonPrimary small cookiePolicyNoticeMoreInformation">{lang}wcf.page.cookiePolicy.info.moreInformation{/lang}</a>
+				<a href="#" class="button small jsOnly cookiePolicyNoticeDismiss">{lang}wcf.global.button.close{/lang}</a>
+				<script data-relocate="true">
+					elBySel('.cookiePolicyNoticeDismiss').addEventListener(WCF_CLICK_EVENT, function() {
+						elRemove(elBySel('.cookiePolicyNotice'));
+					});
+				</script>
+			</div>
+		</div>
 	{/if}
 	
 	{event name='pageFooterStickyNotice'}
 	
 	<noscript>
-		<p class="error javascriptDisabledWarning">{lang}wcf.page.javascriptDisabled{/lang}</p>
+		<div class="layoutBoundary">
+			<span class="javascriptDisabledWarningText">{lang}wcf.page.javascriptDisabled{/lang}</span>
+		</div>
 	</noscript>
 </div>
 
diff --git a/wcfsetup/install/files/style/ui/alert.scss b/wcfsetup/install/files/style/ui/alert.scss
index 2095948de9..f597ccbc78 100644
--- a/wcfsetup/install/files/style/ui/alert.scss
+++ b/wcfsetup/install/files/style/ui/alert.scss
@@ -75,7 +75,6 @@
 	left: 0;
 	right: 0;
 	position: fixed;
-	text-align: center;
 	
 	.error,
 	.info,
@@ -85,6 +84,40 @@
 		border-top-width: 1px;
 		border-top-style: solid;
 		margin-top: 0;
+		padding: 10px 0;
+		
+		@include screen-sm-down {
+			@include wcfFontSmall;
+		}
+	}
+	
+	.cookiePolicyNotice {
+		.layoutBoundary {
+			display: flex;
+			align-items: center;
+			
+			@include screen-sm-down {
+				flex-wrap: wrap;
+			}
+		}
+		
+		.cookiePolicyNoticeText {
+			flex: 1 1 auto;
+			
+			@include screen-sm-down {
+				flex-basis: 100%;
+				margin-bottom: 5px;
+			}
+		}
+		
+		.cookiePolicyNoticeMoreInformation,
+		.cookiePolicyNoticeDismiss {
+			flex: 0 0 auto;
+		}
+		
+		.cookiePolicyNoticeDismiss {
+			margin-left: 5px;
+		}
 	}
 }
 
diff --git a/wcfsetup/install/lang/de.xml b/wcfsetup/install/lang/de.xml
index ab0660daf1..1991340d22 100644
--- a/wcfsetup/install/lang/de.xml
+++ b/wcfsetup/install/lang/de.xml
@@ -2832,7 +2832,8 @@ Fehler sind beispielsweise:
 		<item name="wcf.page.pagePosition"><![CDATA[Seite {#$pageNo} von {#$pages}]]></item>
 		<item name="wcf.page.javascriptDisabled"><![CDATA[In {if LANGUAGE_USE_INFORMAL_VARIANT}deinem{else}Ihrem{/if} Webbrowser ist JavaScript deaktiviert. Um alle Funktionen dieser Website nutzen zu können, muss JavaScript aktiviert sein.]]></item>
 		<item name="wcf.page.requestedPage"><![CDATA[Aufgerufene Seite]]></item>
-		<item name="wcf.page.cookiePolicy.info"><![CDATA[Diese Seite verwendet Cookies. Durch die Nutzung unserer Seite {if LANGUAGE_USE_INFORMAL_VARIANT}erklärst du dich{else}erklären Sie sich{/if} damit einverstanden, dass wir Cookies setzen. <a href="{page}com.woltlab.wcf.CookiePolicy{/page}">Weitere Informationen</a>]]></item>
+		<item name="wcf.page.cookiePolicy.info"><![CDATA[Diese Seite verwendet Cookies. Durch die Nutzung unserer Seite {if LANGUAGE_USE_INFORMAL_VARIANT}erklärst du dich{else}erklären Sie sich{/if} damit einverstanden, dass wir Cookies setzen.]]></item>
+		<item name="wcf.page.cookiePolicy.info.moreInformation"><![CDATA[Weitere Informationen]]></item>
 		<item name="wcf.page.copyright"><![CDATA[<a href="https://www.woltlab.com/de/" rel="nofollow"{if EXTERNAL_LINK_TARGET_BLANK} target="_blank"{/if}>Community-Software: <strong>WoltLab Suite&trade;{if SHOW_VERSION_NUMBER} {@WCF_VERSION}{/if}</strong></a>]]></item>
 		<item name="wcf.page.onlineLocation.com.woltlab.wcf.Article"><![CDATA[Artikel <a href="{$article->getLink()}">{$article->getTitle()}</a>]]></item>
 		<item name="wcf.page.onlineLocation.com.woltlab.wcf.CategoryArticleList"><![CDATA[Artikel-Kategogie <a href="{$category->getLink()}">{$category->getTitle()}</a>]]></item>
diff --git a/wcfsetup/install/lang/en.xml b/wcfsetup/install/lang/en.xml
index 5235c3edb2..d361890f78 100644
--- a/wcfsetup/install/lang/en.xml
+++ b/wcfsetup/install/lang/en.xml
@@ -2787,7 +2787,8 @@ Errors are:
 		<item name="wcf.page.pagePosition"><![CDATA[Page {#$pageNo} of {#$pages}]]></item>
 		<item name="wcf.page.javascriptDisabled"><![CDATA[Your browser has JavaScript disabled. If you would like to use all features of this site, it is mandatory to enable JavaScript.]]></item>
 		<item name="wcf.page.requestedPage"><![CDATA[Requested Page]]></item>
-		<item name="wcf.page.cookiePolicy.info"><![CDATA[This site uses cookies. By continuing to browse this site, you are agreeing to our use of cookies. <a href="{page}com.woltlab.wcf.CookiePolicy{/page}">More details</a>]]></item>
+		<item name="wcf.page.cookiePolicy.info"><![CDATA[This site uses cookies. By continuing to browse this site, you are agreeing to our use of cookies.]]></item>
+		<item name="wcf.page.cookiePolicy.info.moreInformation"><![CDATA[More Details]]></item>
 		<item name="wcf.page.copyright"><![CDATA[<a href="https://www.woltlab.com" rel="nofollow"{if EXTERNAL_LINK_TARGET_BLANK} target="_blank"{/if}>Powered by <strong>WoltLab Suite&trade;{if SHOW_VERSION_NUMBER} {@WCF_VERSION}{/if}</strong></a>]]></item>
 		<item name="wcf.page.onlineLocation.com.woltlab.wcf.Article"><![CDATA[Article <a href="{$article->getLink()}">{$article->getTitle()}</a>]]></item>
 		<item name="wcf.page.onlineLocation.com.woltlab.wcf.CategoryArticleList"><![CDATA[Article category <a href="{$category->getLink()}">{$category->getTitle()}</a>]]></item>
-- 
2.20.1