# HG changeset patch
# User Aleksej Bobylev <al.bobylev@gmail.com>
# Date 1337255535 -10800
# Node ID 42367a53cf50f0a3959d983ef674621fec9643cf
# Parent  3e9acc16f7282786486abe612ac0eaa39a325b35
add visual sections to pages

diff -r 3e9acc16f728 -r 42367a53cf50 index.cgi
--- a/index.cgi	Thu May 17 14:02:41 2012 +0300
+++ b/index.cgi	Thu May 17 14:52:15 2012 +0300
@@ -41,13 +41,14 @@
 		break
 	done
 }
+
+
 # OK status in table
 ok_status_t() {
 	echo "	<td>[<span class='diff-add'> OK </span>]</td></tr>"
 }
 
 
-
 #
 # Things to do before displaying the page
 #
@@ -119,6 +120,7 @@
 			echo '</pre>'
 		fi ;;
 
+
 	*\ terminal\ *|*\ cmd\ *)
 		# Cmdline terminal.
 		commands='cat du help ls ping pwd who wget'
@@ -126,6 +128,7 @@
 		TITLE=$(gettext 'TazPanel - Terminal')
 		xhtml_header
 		cat << EOT
+<section>
 <form method="get" action="$SCRIPT_NAME">
 	<div class="box">
 		root@$(hostname):~# <input autofocus type="text" name="cmd" style="width: 80%;" />
@@ -157,7 +160,10 @@
 				eval_gettext 'Unknown command: $cmd' && echo
 			eval_gettext 'Commands: $commands' ;;
 	esac
-	echo '</pre>' ;;
+	echo '</pre></section>'
+	;;
+
+
 	*\ top\ *)
 		TITLE=$(gettext 'TazPanel - Process activity')
 		xhtml_header
@@ -184,6 +190,7 @@
 			-e s"#PID.*\([^']\)#<span class='top'>\0</span>#"g
 		echo '</pre>' ;;
 
+
 	*\ debug\ *)
 		TITLE=$(gettext 'TazPanel - Debug')
 		xhtml_header
@@ -194,6 +201,7 @@
 EOT
 		;;
 
+
 	*\ report\ *)
 		TITLE=$(gettext 'TazPanel - System report')
 		[ -d /var/cache/slitaz ] || mkdir -p /var/cache/slitaz
@@ -319,6 +327,8 @@
 	<a href="http://bugs.slitaz.org/">bugs.slitaz.org</a></p>
 EOT
 		;;
+
+
 	*)
 		#
 		# Default xHTML content
@@ -341,6 +351,7 @@
 		<img src="$IMAGES/text.png" />$(gettext 'Create a report')</a>
 </div>
 
+<section>
 <h3>$(gettext 'Summary')</h3>
 <div id="summary">
 <table>
@@ -363,10 +374,14 @@
 </table>
 <!-- Close summary -->
 </div>
+</section>
 
+<section>
 <h4>$(gettext 'Network status')</h4>
 $(list_network_interfaces)
+</section>
 
+<section>
 <h4>$(gettext 'Filesystem usage statistics')</h4>
 EOT
 		# Disk stats (management is done as hardware.cgi)
@@ -396,15 +411,14 @@
 		cat << EOT
 </tbody>
 </table>
-EOT
+</section>
 
-
-		cat << EOT
+<section>
 <h3>$(gettext 'Panel Activity')</h3>
 <pre id="panel-activity">
 $(cat $LOG_FILE | tail -n 8 | sort -r | syntax_highlighter activity)
 </pre>
-
+</section>
 EOT
 		;;
 esac
diff -r 3e9acc16f728 -r 42367a53cf50 installer.cgi
--- a/installer.cgi	Thu May 17 14:02:41 2012 +0300
+++ b/installer.cgi	Thu May 17 14:52:15 2012 +0300
@@ -151,7 +151,7 @@
 select_install()
 {
 	cat <<EOT
-<div class="box">
+<section>
 	<h4>$(gettext 'Install')</h4>
 
 <p>$(gettext "Install SliTaz on a partition of your hard disk drive. If you \
@@ -162,25 +162,27 @@
 <p>$(gettext "Before installation, you may need to create or resize partitions \
 on your hard disk drive in order to make space for SliTaz GNU/Linux. You can \
 graphically manage your partitions with Gparted")</p>
-</div>
-<p><a class="button" href="$SCRIPT_NAME?page=partitioning">$(gettext "Install \
+
+<a class="button" href="$SCRIPT_NAME?page=partitioning">$(gettext "Install \
 SliTaz")</a>
+</section>
 EOT
 }
 
 select_upgrade()
 {
 	cat <<EOT
-<div class="box">
+<section>
 	<h4>$(gettext 'Upgrade')</h4>
 
 <p>$(gettext "Upgrade an already installed SliTaz system on your hard disk \
 drive. Your /home /etc /var/www directories will be kept, all other \
 directories will be removed. Any additional packages added to your old Slitaz \
 system will be updated as long you have an active internet connection.")</p>
-</div>
-<p><a class="button" href="$SCRIPT_NAME?page=upgrade">$(gettext "Upgrade \
-SliTaz")</a></p>
+
+<a class="button" href="$SCRIPT_NAME?page=upgrade">$(gettext "Upgrade \
+SliTaz")</a>
+</section>
 EOT
 }
 
diff -r 3e9acc16f728 -r 42367a53cf50 network.cgi
--- a/network.cgi	Thu May 17 14:02:41 2012 +0300
+++ b/network.cgi	Thu May 17 14:52:15 2012 +0300
@@ -147,6 +147,7 @@
 <p>$(gettext "Here you can configure a wired connection using DHCP to \
 automatically get a random IP or configure a static/fixed IP")</p>
 
+<section>
 <h3>$(gettext 'Configuration')</h3>
 <form method="get" action="$SCRIPT_NAME">
 	<input type="hidden" name="eth" />
@@ -184,7 +185,9 @@
 		<input type="submit" name="dhcp" value="$(gettext 'Activate (DHCP)')">
 		<input type="submit" name="disable" value="$(gettext 'Disable')">
 </form>
+</section>
 
+<section>
 <h3>$(gettext 'Configuration file')</h3>
 
 <p>$(gettext "These values are the ethernet settings in the main \
@@ -194,6 +197,7 @@
 </pre>
 <a class="button" href="index.cgi?file=/etc/network.conf&action=edit">
 	<img src="$IMAGES/edit.png" />$(gettext 'Manual Edit')</a>
+</section>
 EOT
 		;;
 	*\ wifi\ *)
@@ -237,6 +241,7 @@
 			WIFI_KEY_TYPE="$(GET keytype)"
 		fi
 	cat << EOT
+<section>
 <h3>$(gettext 'Connection')</h3>
 <form method="get" action="$SCRIPT_NAME">
 	<input type="hidden" name="connect-wifi" />
@@ -262,7 +267,9 @@
 	$(table_end)
 		<input type="submit" name="wifi" value="$(gettext 'Configure')" />
 </form>
+</section>
 
+<section>
 <h3>$(gettext 'Configuration file')</h3>
 
 <p>$(gettext "These values are the wifi settings in the main /etc/network.conf \
@@ -272,10 +279,13 @@
 
 <a class="button" href="index.cgi?file=/etc/network.conf&action=edit">
 	<img src="$IMAGES/edit.png" />$(gettext 'Manual Edit')</a>
+</section>
 
+<section>
 <h3>$(gettext 'Output of iwconfig')</h3>
 
 <pre>$(iwconfig)</pre>
+</section>
 EOT
 		;;
 	*)
@@ -287,6 +297,7 @@
 
 <p>$(gettext 'Manage network connections and services')</p>
 
+<section>
 <div id="actions">
 	<div class="float-left">
 		<a class="button" href="$SCRIPT_NAME?start">
@@ -305,44 +316,58 @@
 </div>
 
 $(list_network_interfaces)
+</section>
 
+<section>
 <h3 id="hosts">$(gettext 'Hosts')</h3>
 
 <pre>$(cat /etc/hosts)</pre>
 
 <a class="button" href="index.cgi?file=/etc/hosts&action=edit">
 	<img src="$IMAGES/edit.png" />$(gettext 'Edit hosts')</a>
+</section>
 
+<section>
 <h3>$(gettext 'Hostname')</h3>
 
 <form method="get" name="$SCRIPT_NAME">
 	<input type="text" name="hostname" value="$hostname" />
 	<input type="submit" value="$(gettext 'Change hostname')" />
 </form>
+</section>
 
-
+<section>
 <h3 id="ifconfig">$(gettext 'Output of ifconfig')</h3>
 
 <pre>$(ifconfig)</pre>
+</section>
 
+<section>
 <h3 id="routing">$(gettext 'Routing table')</h3>
 
 <pre>$(route -n)</pre>
+</section>
 
+<section>
 <h3 id="dns">$(gettext 'Domain name resolution')</h3>
 
 <pre>$(cat /etc/resolv.conf)</pre>
+</section>
 
+<section>
 <h3 id="arp">$(gettext 'ARP table')</h3>
 
 <pre>$(arp)</pre>
+</section>
 
+<section>
 <h3 id="connections">$(gettext 'IP Connections')</h3>
 
 <pre>
 $(netstat -anp 2> /dev/null | sed -e '/UNIX domain sockets/,$d' \
 -e 's#\([0-9]*\)/#<a href="boot.cgi?daemons=pid=\1">\1</a>/#')
 </pre>
+</section>
 EOT
 		;;
 esac
diff -r 3e9acc16f728 -r 42367a53cf50 settings.cgi
--- a/settings.cgi	Thu May 17 14:02:41 2012 +0300
+++ b/settings.cgi	Thu May 17 14:52:15 2012 +0300
@@ -146,6 +146,7 @@
 </p>
 </form>
 
+<section>
 <h4>$(gettext 'Add a new user')</h4>
 
 <form method="get" action="$SCRIPT_NAME">
@@ -159,14 +160,19 @@
 			<input type="submit" value="$(gettext 'Create user')" /></td></tr>
 	</table>
 </form>
+</section>
 
+<section>
 <h4>$(gettext 'Current user sessions')</h4>
 
 <pre>$(who)</pre>
+</section>
 
+<section>
 <h4>$(gettext 'Last user sessions')</h4>
 
 <pre>$(last)</pre>
+</section>
 EOT
 		;;
 	*)
@@ -183,6 +189,7 @@
 		<img src="$IMAGES/users.png" />$(gettext 'Manage users')</a>
 </div>
 
+<section>
 <h3>$(gettext 'System time')</h3>
 
 <table>
@@ -192,11 +199,13 @@
 </table>
 <a class="button" href="$SCRIPT_NAME?rdate">$(gettext 'Sync online')</a>
 <a class="button" href="$SCRIPT_NAME?hwclock">$(gettext 'Set hardware clock')</a>
+</section>
 EOT
 		#
 		# Locale settings
 		#
 		cat << EOT
+<section>
 <h3 id="locale">$(gettext 'System language')</h3>
 <p>
 EOT
@@ -224,7 +233,9 @@
 	</select>
 	<input type="submit" value="$(gettext 'Activate')" />
 </form>
+</section>
 
+<section>
 <h3 id="keymap">$(gettext 'Console keymap')</h3>
 <p>
 EOT
@@ -270,7 +281,9 @@
 	</select>
 	<input type="submit" value="$(gettext 'Activate')" />
 </form>
+</section>
 
+<section>
 <h2>$(gettext 'Panel configuration')</h2>
 
 <form method="get" action="$SCRIPT_NAME">
@@ -300,6 +313,7 @@
 	$(gettext 'TazPanel provides a debuging mode and page:')
 	<a href="/index.cgi?debug">debug</a>
 </p>
+</section>
 EOT
 	;;
 esac
diff -r 3e9acc16f728 -r 42367a53cf50 styles/default/style.css
--- a/styles/default/style.css	Thu May 17 14:02:41 2012 +0300
+++ b/styles/default/style.css	Thu May 17 14:52:15 2012 +0300
@@ -144,6 +144,7 @@
 #sidebar h4 { margin: 0 0 2px 12px; }
 #sidebar ul { list-style-type: none; padding: 0; }
 
+
 /* Content */
 
 #content { margin: 20px; }
@@ -221,6 +222,7 @@
 	float: right;
 }
 
+
 /* Table */
 
 table {
@@ -344,9 +346,9 @@
 /* Round corner */
 
 #loading, table, pre, input[type=submit], .debug, .box,
-.button, div.scroll, .outbox {
-	/*-moz-border-radius: 4px;
-	-webkit-border-radius: 4px; */
+.button, div.scroll, .outbox, section {
+	-moz-border-radius: 4px;
+	-webkit-border-radius: 4px;
 	border-radius: 4px;
 }
 
@@ -399,3 +401,17 @@
 	-ms-transition: all 0.3s ease-in-out;
 	transition: all 0.3s ease-in-out;
 }
+
+section {
+	margin: 20pt -0.7em;
+	padding: 0.7em;
+	background-color: #fdfdfd;
+	border: 1px solid #ddd;
+	border-radius: 1em;
+	/*box-shadow: 0 0 3pt 2pt #eee;*/
+}
+section h4 {
+	margin: 0 0 0.5em 0;
+}
+section h3 {
+	margin: 0 0 0.5em 0;