Merge pull request #5140 from owncloud/settings-beautify

more elegant style for Personal and Admin settings

6 files changed, 34 insertions, 28 deletions

diff --git a/apps/files/templates/admin.php b/apps/files/templates/admin.php
index e1ca6afc4ad..697fc52526a 100644
--- a/apps/files/templates/admin.php
+++ b/apps/files/templates/admin.php
@@ -2,7 +2,7 @@
 
 <form name="filesForm" action='#' method='post'>
 	<fieldset class="personalblock">
-		<legend><strong><?php p($l->t('File handling')); ?></strong></legend>
+		<h2><?php p($l->t('File handling')); ?></h2>
 		<?php if($_['uploadChangable']):?>
 			<label for="maxUploadSize"><?php p($l->t( 'Maximum upload size' )); ?> </label>
 			<input name='maxUploadSize' id="maxUploadSize" value='<?php p($_['uploadMaxFilesize']) ?>'/>
diff --git a/apps/files_external/templates/settings.php b/apps/files_external/templates/settings.php
index b3c08e21225..028a384cf34 100644
--- a/apps/files_external/templates/settings.php
+++ b/apps/files_external/templates/settings.php
@@ -1,6 +1,6 @@
 <form id="files_external">
 	<fieldset class="personalblock">
-	<legend><strong><?php p($l->t('External Storage')); ?></strong></legend>
+	<h2><?php p($l->t('External Storage')); ?></h2>
 		<?php if (isset($_['dependencies']) and ($_['dependencies']<>'')) print_unescaped(''.$_['dependencies'].''); ?>
 		<table id="externalStorage" data-admin='<?php print_unescaped(json_encode($_['isAdminPage'])); ?>'>
 			<thead>
@@ -138,7 +138,7 @@
 	  enctype="multipart/form-data"
 	  action="<?php p(OCP\Util::linkTo('files_external', 'ajax/addRootCertificate.php')); ?>">
 <fieldset class="personalblock">
-		<legend><strong><?php p($l->t('SSL root certificates'));?></strong></legend>
+		<h2><?php p($l->t('SSL root certificates'));?></h2>
 		<table id="sslCertificate" data-admin='<?php print_unescaped(json_encode($_['isAdminPage'])); ?>'>
 			<tbody width="100%">
 			<?php foreach ($_['certs'] as $rootCert): ?>
diff --git a/apps/user_webdavauth/templates/settings.php b/apps/user_webdavauth/templates/settings.php
index 70c10057c20..ad1701add8c 100755
--- a/apps/user_webdavauth/templates/settings.php
+++ b/apps/user_webdavauth/templates/settings.php
@@ -1,6 +1,6 @@
 <form id="webdavauth" action="#" method="post">
 	<fieldset class="personalblock">
-		<legend><strong><?php p($l->t('WebDAV Authentication'));?></strong></legend>
+		<h2><?php p($l->t('WebDAV Authentication'));?></h2>
 		<p><label for="webdav_url"><?php p($l->t('Address: '));?><input type="url" placeholder="https://example.com/webdav" id="webdav_url" name="webdav_url" value="<?php p($_['webdav_url']); ?>"></label>
 		 <input type="hidden" name="requesttoken" value="<?php p($_['requesttoken']) ?>" id="requesttoken">
 		<input type="submit" value="Save" />
diff --git a/core/css/styles.css b/core/css/styles.css
index 505e4dc03e8..6406bcd7e63 100644
--- a/core/css/styles.css
+++ b/core/css/styles.css
@@ -77,7 +77,10 @@ textarea:hover, textarea:focus, textarea:active {
 }
 input[type="checkbox"] { margin:0; padding:0; height:auto; width:auto; }
 input[type="checkbox"]:hover+label, input[type="checkbox"]:focus+label { color:#111 !important; }
-#quota { cursor:default; }
+#quota {
+	cursor: default;
+	margin: 30px;
+}
 
 
 /* SCROLLING */
@@ -667,12 +670,15 @@ tr .action { width:16px; height:16px; }
 tr:hover .action:hover, .selectedActions a:hover, .header-action:hover { -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter:alpha(opacity=100); opacity:1; }
 tbody tr:hover, tr:active { background-color:#f8f8f8; }
 
+#body-settings h2 {
+	font-size: 20px;
+	font-weight: normal;
+	margin-bottom: 7px;
+}
 #body-settings .personalblock, #body-settings .helpblock {
-	padding: .5em 1em;
-	margin: 1em;
-	background-color: rgb(240,240,240);
+	padding: 30px;
 	color: #555;
-	border-radius: 3px;
+	border-top: 1px solid #ddd;
 }
 #body-settings .personalblock#quota { position:relative; padding:0; }
 #body-settings #controls+.helpblock { position:relative; margin-top:3em; }
diff --git a/settings/templates/admin.php b/settings/templates/admin.php
index 72e93e78dac..6450cd62d95 100644
--- a/settings/templates/admin.php
+++ b/settings/templates/admin.php
@@ -12,7 +12,7 @@ $levels = array('Debug', 'Info', 'Warning', 'Error', 'Fatal');
 if (!$_['htaccessworking']) {
 	?>
 <fieldset class="personalblock">
-	<legend><strong><?php p($l->t('Security Warning'));?></strong></legend>
+	<h2><?php p($l->t('Security Warning'));?></h2>
 
 	<span class="securitywarning">
 		<?php p($l->t('Your data directory and your files are probably accessible from the internet. The .htaccess file is not working. We strongly suggest that you configure your webserver in a way that the data directory is no longer accessible or you move the data directory outside the webserver document root.')); ?>
@@ -26,7 +26,7 @@ if (!$_['htaccessworking']) {
 if (!$_['isWebDavWorking']) {
 	?>
 <fieldset class="personalblock">
-	<legend><strong><?php p($l->t('Setup Warning'));?></strong></legend>
+	<h2><?php p($l->t('Setup Warning'));?></h2>
 
 	<span class="securitywarning">
 		<?php p($l->t('Your web server is not yet properly setup to allow files synchronization because the WebDAV interface seems to be broken.')); ?>
@@ -41,7 +41,7 @@ if (!$_['isWebDavWorking']) {
 if (!$_['has_fileinfo']) {
 	?>
 <fieldset class="personalblock">
-	<legend><strong><?php p($l->t('Module \'fileinfo\' missing'));?></strong></legend>
+	<h2><?php p($l->t('Module \'fileinfo\' missing'));?></h2>
 
 		<span class="connectionwarning">
 		<?php p($l->t('The PHP module \'fileinfo\' is missing. We strongly recommend to enable this module to get best results with mime-type detection.')); ?>
@@ -55,7 +55,7 @@ if (!$_['has_fileinfo']) {
 if (!$_['islocaleworking']) {
 	?>
 <fieldset class="personalblock">
-	<legend><strong><?php p($l->t('Locale not working'));?></strong></legend>
+	<h2><?php p($l->t('Locale not working'));?></h2>
 
 		<span class="connectionwarning">
 		<?php
@@ -72,7 +72,7 @@ if (!$_['islocaleworking']) {
 if (!$_['internetconnectionworking']) {
 	?>
 <fieldset class="personalblock">
-	<legend><strong><?php p($l->t('Internet connection not working'));?></strong></legend>
+	<h2><?php p($l->t('Internet connection not working'));?></h2>
 
 		<span class="connectionwarning">
 		<?php p($l->t('This server has no working internet connection. This means that some of the features like mounting of external storage, notifications about updates or installation of 3rd party apps don´t work. Accessing files from remote and sending of notification emails might also not work. We suggest to enable internet connection for this server if you want to have all features.')); ?>
@@ -89,7 +89,7 @@ if (!$_['internetconnectionworking']) {
 ;?>
 
 <fieldset class="personalblock" id="backgroundjobs">
-	<legend><strong><?php p($l->t('Cron'));?></strong></legend>
+	<h2><?php p($l->t('Cron'));?></h2>
 	<p>
 				<input type="radio" name="mode" value="ajax"
 					   id="backgroundjobs_ajax" <?php if ($_['backgroundjobs_mode'] === "ajax") {
@@ -117,7 +117,7 @@ if (!$_['internetconnectionworking']) {
 </fieldset>
 
 <fieldset class="personalblock" id="shareAPI">
-	<legend><strong><?php p($l->t('Sharing'));?></strong></legend>
+	<h2><?php p($l->t('Sharing'));?></h2>
 	<table class="shareAPI nostyle">
 		<tr>
 			<td id="enable">
@@ -175,7 +175,7 @@ if (!$_['internetconnectionworking']) {
 </fieldset>
 
 <fieldset class="personalblock" id="security">
-	<legend><strong><?php p($l->t('Security'));?></strong></legend>
+	<h2><?php p($l->t('Security'));?></h2>
 	<table class="nostyle">
 		<tr>
 			<td id="enable">
@@ -208,7 +208,7 @@ if (!$_['internetconnectionworking']) {
 </fieldset>
 
 <fieldset class="personalblock">
-	<legend><strong><?php p($l->t('Log'));?></strong></legend>
+	<h2><?php p($l->t('Log'));?></h2>
 	<?php p($l->t('Log level'));?> <select name='loglevel' id='loglevel'>
 	<option value='<?php p($_['loglevel'])?>'><?php p($levels[$_['loglevel']])?></option>
 	<?php for ($i = 0; $i < 5; $i++):
@@ -247,7 +247,7 @@ endfor;?>
 </fieldset>
 
 <fieldset class="personalblock">
-	<legend><strong><?php p($l->t('Version'));?></strong></legend>
+	<h2><?php p($l->t('Version'));?></h2>
 	<strong><?php p($theme->getTitle()); ?></strong> <?php p(OC_Util::getVersionString()); ?>
 <?php if (OC_Util::getEditionString() === ''): ?>
 	<p>
diff --git a/settings/templates/personal.php b/settings/templates/personal.php
index d2ca8154f16..47227d6ea0f 100644
--- a/settings/templates/personal.php
+++ b/settings/templates/personal.php
@@ -36,7 +36,7 @@ if($_['passwordChangeSupported']) {
 ?>
 <form id="passwordform">
 	<fieldset class="personalblock">
-		<legend><strong><?php p($l->t('Password'));?></strong></legend>
+		<h2><?php p($l->t('Password'));?></h2>
 		<div id="passwordchanged"><?php echo $l->t('Your password was changed');?></div>
 		<div id="passworderror"><?php echo $l->t('Unable to change your password');?></div>
 		<input type="password" id="pass1" name="oldpassword" placeholder="<?php echo $l->t('Current password');?>" />
@@ -55,7 +55,7 @@ if($_['displayNameChangeSupported']) {
 ?>
 <form id="displaynameform">
 	<fieldset class="personalblock">
-		<legend><strong><?php echo $l->t('Display Name');?></strong></legend>
+		<h2><?php echo $l->t('Display Name');?></h2>
 		<input type="text" id="displayName" name="displayName" value="<?php p($_['displayName'])?>" />
         <span class="msg"></span>
 		<input type="hidden" id="oldDisplayName" name="oldDisplayName" value="<?php p($_['displayName'])?>" />
@@ -70,7 +70,7 @@ if($_['passwordChangeSupported']) {
 ?>
 <form id="lostpassword">
 	<fieldset class="personalblock">
-		<legend><strong><?php p($l->t('Email'));?></strong></legend>
+		<h2><?php p($l->t('Email'));?></h2>
 		<input type="text" name="email" id="email" value="<?php p($_['email']); ?>"
 			placeholder="<?php p($l->t('Your email address'));?>" /><span class="msg"></span><br />
 		<em><?php p($l->t('Fill in an email address to enable password recovery'));?></em>
@@ -83,7 +83,7 @@ if($_['passwordChangeSupported']) {
 <?php if ($_['enableAvatars']): ?>
 <form id="avatar" method="post" action="<?php p(\OC_Helper::linkToRoute('core_avatar_post')); ?>">
 	<fieldset class="personalblock">
-		<legend><strong><?php p($l->t('Profile picture')); ?></strong></legend>
+		<h2><?php p($l->t('Profile picture')); ?></h2>
 		<div id="displayavatar">
 			<div class="avatardiv"></div><br>
 			<div class="warning hidden"></div>
@@ -103,7 +103,7 @@ if($_['passwordChangeSupported']) {
 
 <form>
 	<fieldset class="personalblock">
-		<legend><strong><?php p($l->t('Language'));?></strong></legend>
+		<h2><?php p($l->t('Language'));?></h2>
 		<select id="languageinput" class="chzen-select" name="lang" data-placeholder="<?php p($l->t('Language'));?>">
 		<option value="<?php p($_['activelanguage']['code']);?>"><?php p($_['activelanguage']['name']);?></option>
 		<?php foreach($_['commonlanguages'] as $language):?>
@@ -122,7 +122,7 @@ if($_['passwordChangeSupported']) {
 </form>
 
 <fieldset class="personalblock">
-	<legend><strong><?php p($l->t('WebDAV'));?></strong></legend>
+	<h2><?php p($l->t('WebDAV'));?></h2>
 	<code><?php print_unescaped(OC_Helper::linkToRemote('webdav')); ?></code><br />
 	<em><?php print_unescaped($l->t('Use this address to <a href="%s/server/5.0/user_manual/files/files.html" target="_blank">access your Files via WebDAV</a>', array($theme->getDocBaseUrl())));?></em>
 </fieldset>
@@ -134,9 +134,9 @@ if($_['passwordChangeSupported']) {
 <?php if($_['enableDecryptAll']): ?>
 <form id="decryptAll">
 	<fieldset class="personalblock">
-		<legend>
+		<h2>
 			<?php p( $l->t( 'Encryption' ) ); ?>
-		</legend>
+		</h2>
 		<?php p($l->t( "The encryption app is no longer enabled, decrypt all your file" )); ?>
 		<p>
 			<input
@@ -158,7 +158,7 @@ if($_['passwordChangeSupported']) {
 <?php endif; ?>
 
 <fieldset class="personalblock">
-	<legend><strong><?php p($l->t('Version'));?></strong></legend>
+	<h2><?php p($l->t('Version'));?></h2>
 	<strong><?php p($theme->getName()); ?></strong> <?php p(OC_Util::getVersionString()); ?><br/>
 <?php if (OC_Util::getEditionString() === ''): ?>
 	<?php print_unescaped($l->t('Developed by the <a href="http://ownCloud.org/contact" target="_blank">ownCloud community</a>, the <a href="https://github.com/owncloud" target="_blank">source code</a> is licensed under the <a href="http://www.gnu.org/licenses/agpl-3.0.html" target="_blank"><abbr title="Affero General Public License">AGPL</abbr></a>.')); ?>