From 151c1c6a1d06cc07a4feff87be38af9471d6f51b Mon Sep 17 00:00:00 2001
From: Alif <alive4ever@live.com>
Date: Sun, 19 Mar 2017 02:05:11 +0700
Subject: [PATCH 2/2] skins/Archlinux: make use of mobile.css

Modify arch.css and SkinArchLinux.css to make use of mobile.css for
small screen size (less than 790px).
---
 skins/ArchLinux/SkinArchLinux.php | 2 ++
 skins/ArchLinux/arch.css          | 8 ++++++++
 2 files changed, 10 insertions(+)

diff --git a/skins/ArchLinux/SkinArchLinux.php b/skins/ArchLinux/SkinArchLinux.php
index 4be24176..ab7d37da 100644
--- a/skins/ArchLinux/SkinArchLinux.php
+++ b/skins/ArchLinux/SkinArchLinux.php
@@ -47,6 +47,8 @@ class SkinArchLinux extends SkinTemplate {
 		) );
 
 		// TODO: Migrate all of these
+		$out->addMeta( 'viewport', 'width=device-width, initial-scale=1.0' );
+		$out->addStyle( $this->stylename . '/mobile.css', 'only screen and (max-width:790px)' );
 		$out->addStyle( $this->stylename . '/IE60Fixes.css', 'screen', 'IE 6' );
 		$out->addStyle( $this->stylename . '/IE70Fixes.css', 'screen', 'IE 7' );
 	}
diff --git a/skins/ArchLinux/arch.css b/skins/ArchLinux/arch.css
index c8abb749..88ab417b 100644
--- a/skins/ArchLinux/arch.css
+++ b/skins/ArchLinux/arch.css
@@ -47,6 +47,7 @@ ul,
 #bodyContent table {
     border-collapse: collapse;
     padding: 2px;
+    word-break: break-all;
 }
 #bodyContent td {
     padding: 2px;
@@ -176,3 +177,10 @@ div#footer {
 #archnavbar ul li.anb-selected a {
     color: white !important;
 }
+
+span:target { animation: section-fade 1s 1; }
+
+@keyframes section-fade {
+	0% { background: #f39800; }
+	100% { background: #FFF; }
+}
-- 
2.12.0