simplify dlgSec-related markup

classes/dlg.php

@@ -38,12 +38,16 @@ class Dlg extends Handler_Protected {
 	function pubOPMLUrl() {
 		$url_path = Opml::opml_publish_url();
 
-		print __("Your Public OPML URL is:");
+		print "<div class='dlgSec'>" . __("Your Public OPML URL is:") . "</div>";
+
+		print "<div class='dlgSecCont'>";
 
 		print "<div class='panel text-center'>";
 		print "<a id='pub_opml_url' href='$url_path' target='_blank'>$url_path</a>";
 		print "</div>";
 
+		print "</div>";
+
 		print "<div align='center'>";
 
 		print "<button dojoType=\"dijit.form.Button\" onclick=\"return Helpers.OPML.changeKey()\">".
@@ -165,11 +169,13 @@ class Dlg extends Handler_Protected {
 
 		$feed_title = Feeds::getFeedTitle($feed_id, $is_cat);
 
-		print "<div>".T_sprintf("%s can be accessed via the following secret URL:", $feed_title)."</div>";
+		print "<div class='dlgSec'>".T_sprintf("%s can be accessed via the following secret URL:", $feed_title)."</div>";
 
+		print "<div class='dlgSecCont'>";
 		print "<div class='panel text-center'>";
 		print "<a id='gen_feed_url' href='$url_path' target='_blank'>$url_path</a>";
 		print "</div>";
+		print "</div>";
 
 		print "<div align='center'>";
 
@@ -196,4 +202,4 @@ class Dlg extends Handler_Protected {
 			__('Close this window')."</button>";
 		print "</div>";
 	}
-}
+}

classes/feeds.php

@@ -652,45 +652,55 @@ class Feeds extends Handler_Protected {
 			<img style='display : none'
 				id='feed_add_spinner' src='images/indicator_white.gif'></div>";
 
-		print "<input style=\"font-size : 16px; width : 20em;\"
+		print "<fieldset>";
+
+		print "<input style=\"font-size : 16px; width : 400px;\"
 			placeHolder=\"".__("Feed or site URL")."\"
 			dojoType=\"dijit.form.ValidationTextBox\" required=\"1\" name=\"feed\" id=\"feedDlg_feedUrl\">";
 
-		print "<hr/>";
+		print "</fieldset>";
+
+		print "<fieldset>";
 
 		if (get_pref('ENABLE_FEED_CATS')) {
-			print __('Place in category:') . " ";
+			print "<label>" . __('Place in category:') . "</label> ";
 			print_feed_cat_select("cat", false, 'dojoType="dijit.form.Select"');
 		}
 
+		print "</fieldset>";
+
 		print "</div>";
 
 		print '<div id="feedDlg_feedsContainer" style="display : none">
 
 				<div class="dlgSec">' . __('Available feeds') . '</div>
-				<div class="dlgSecCont">'.
-				'<select id="feedDlg_feedContainerSelect"
-					dojoType="dijit.form.Select" size="3">
-					<script type="dojo/method" event="onChange" args="value">
-						dijit.byId("feedDlg_feedUrl").attr("value", value);
-					</script>
-				</select>'.
-				'</div></div>';
+				<div class="dlgSecCont">
+					<fieldset>
+						<select id="feedDlg_feedContainerSelect"
+							dojoType="dijit.form.Select" size="3">
+							<script type="dojo/method" event="onChange" args="value">
+								dijit.byId("feedDlg_feedUrl").attr("value", value);
+							</script>
+						</select>
+					</fieldset>
+				</div></div>';
 
 		print "<div id='feedDlg_loginContainer' style='display : none'>
 
 				<div class=\"dlgSec\">".__("Authentication")."</div>
-				<div class=\"dlgSecCont\">".
-
-				" <input dojoType=\"dijit.form.TextBox\" name='login'\"
-					placeHolder=\"".__("Login")."\"
-					autocomplete=\"new-password\"
-					style=\"width : 10em;\"> ".
-				" <input
-					placeHolder=\"".__("Password")."\"
-					dojoType=\"dijit.form.TextBox\" type='password'
-					autocomplete=\"new-password\"
-					style=\"width : 10em;\" name='pass'\">
+				<div class=\"dlgSecCont\">
+				<fieldset>
+					<input dojoType=\"dijit.form.TextBox\" name='login'\"
+						placeHolder=\"".__("Login")."\"
+						autocomplete=\"new-password\"
+						style=\"width : 10em;\">
+				</fieldset><fieldset>						
+					<input
+						placeHolder=\"".__("Password")."\"
+						dojoType=\"dijit.form.TextBox\" type='password'
+						autocomplete=\"new-password\"
+						style=\"width : 10em;\" name='pass'\">
+				</fieldset>
 			</div></div>";
 
 

classes/pref/feeds.php

@@ -523,66 +523,77 @@ class Pref_Feeds extends Handler_Protected {
 
 			/* Title */
 
+			print "<fieldset>";
+
 			print "<input dojoType=\"dijit.form.ValidationTextBox\" required=\"1\"
-			placeHolder=\"".__("Feed Title")."\"
-			style=\"font-size : 16px; width: 20em\" name=\"title\" value=\"$title\">";
+				placeHolder=\"".__("Feed Title")."\"
+				style=\"font-size : 16px; width: 460px\" name=\"title\" value=\"$title\">";
+
+			print "</fieldset>";
 
 			/* Feed URL */
 
 			$feed_url = htmlspecialchars($row["feed_url"]);
 
-			print "<hr/>";
+			print "<fieldset>";
 
-			print __('URL:') . " ";
+			print "<label>" . __('URL:') . "</label> ";
 			print "<input dojoType=\"dijit.form.ValidationTextBox\" required=\"1\"
-			placeHolder=\"".__("Feed URL")."\"
-			regExp='^(http|https)://.*' style=\"width : 20em\"
-			name=\"feed_url\" value=\"$feed_url\">";
+				placeHolder=\"".__("Feed URL")."\"
+				regExp='^(http|https)://.*' style=\"width : 300px\"
+				name=\"feed_url\" value=\"$feed_url\">";
 
 			$last_error = $row["last_error"];
 
 			if ($last_error) {
 				print "&nbsp;<i class=\"material-icons\" 
 					title=\"".htmlspecialchars($last_error)."\">error</i>";
-
 			}
 
+			print "</fieldset>";
+
 			/* Category */
 
 			if (get_pref('ENABLE_FEED_CATS')) {
 
 				$cat_id = $row["cat_id"];
 
-				print "<hr/>";
+				print "<fieldset>";
 
-				print __('Place in category:') . " ";
+				print "<label>" . __('Place in category:') . "</label> ";
 
 				print_feed_cat_select("cat_id", $cat_id,
 					'dojoType="dijit.form.Select"');
+
+				print "</fieldset>";
 			}
 
 			/* Site URL  */
 
 			$site_url = htmlspecialchars($row["site_url"]);
 
-			print "<hr/>";
+			print "<fieldset>";
 
-			print __('Site URL:') . " ";
+			print "<label>" . __('Site URL:') . "</label> ";
 			print "<input dojoType=\"dijit.form.ValidationTextBox\" required=\"1\"
-			placeHolder=\"".__("Site URL")."\"
-			regExp='^(http|https)://.*' style=\"width : 15em\"
-			name=\"site_url\" value=\"$site_url\">";
+				placeHolder=\"".__("Site URL")."\"
+				regExp='^(http|https)://.*' style=\"width : 300px\"
+				name=\"site_url\" value=\"$site_url\">";
+
+			print "</fieldset>";
 
 			/* FTS Stemming Language */
 
 			if (DB_TYPE == "pgsql") {
 				$feed_language = $row["feed_language"];
 
-				print "<hr/>";
+				print "<fieldset>";
 
-				print __('Language:') . " ";
+				print "<label>" . __('Language:') . "</label> ";
 				print_select("feed_language", $feed_language, $this::$feed_languages,
 					'dojoType="dijit.form.Select"');
+
+				print "</fieldset>";
 			}
 
 			print "</div>";
@@ -594,20 +605,27 @@ class Pref_Feeds extends Handler_Protected {
 
 			$update_interval = $row["update_interval"];
 
+			print "<fieldset>";
+
 			print_select_hash("update_interval", $update_interval, $update_intervals,
 				'dojoType="dijit.form.Select"');
 
+			print "</fieldset>";
+
 			/* Purge intl */
 
 			$purge_interval = $row["purge_interval"];
 
-			print "<hr/>";
-			print __('Article purging:') . " ";
+			print "<fieldset>";
+
+			print "<label>" . __('Article purging:') . "</label> ";
 
 			print_select_hash("purge_interval", $purge_interval, $purge_intervals,
 				'dojoType="dijit.form.Select" ' .
 				((FORCE_ARTICLE_PURGE == 0) ? "" : 'disabled="1"'));
 
+			print "</fieldset>";
+
 			print "</div>";
 
 			$auth_login = htmlspecialchars($row["auth_login"]);
@@ -620,19 +638,26 @@ class Pref_Feeds extends Handler_Protected {
 			print "<div class=\"dlgSec\">".__("Authentication")."</div>";
 			print "<div class=\"dlgSecCont\">";
 
+			print "<fieldset>";
+
 			print "<input dojoType=\"dijit.form.TextBox\" id=\"feedEditDlg_login\"
-			placeHolder=\"".__("Login")."\"
-			autocomplete=\"new-password\"
-			name=\"auth_login\" value=\"$auth_login\"><hr/>";
+				placeHolder=\"".__("Login")."\"
+				autocomplete=\"new-password\"
+				name=\"auth_login\" value=\"$auth_login\">";
+
+			print "</fieldset>";
+			print "<fieldset>";
 
 			print "<input dojoType=\"dijit.form.TextBox\" type=\"password\" name=\"auth_pass\"
-			autocomplete=\"new-password\"
-			placeHolder=\"".__("Password")."\"
-			value=\"$auth_pass\">";
+				autocomplete=\"new-password\"
+				placeHolder=\"".__("Password")."\"
+				value=\"$auth_pass\">";
 
 			print "<div dojoType=\"dijit.Tooltip\" connectId=\"feedEditDlg_login\" position=\"below\">
-			".__('<b>Hint:</b> you need to fill in your login information if your feed requires authentication, except for Twitter feeds.')."
-			</div>";
+				".__('<b>Hint:</b> you need to fill in your login information if your feed requires authentication, except for Twitter feeds.')."
+				</div>";
+
+			print "</fieldset>";
 
 			print "</div></div>";
 
@@ -656,8 +681,12 @@ class Pref_Feeds extends Handler_Protected {
 				$checked = "";
 			}
 
-			print "<input dojoType=\"dijit.form.CheckBox\" type=\"checkbox\" name=\"private\" id=\"private\"
-			$checked>&nbsp;<label for=\"private\">".__('Hide from Popular feeds')."</label>";
+			print "<fieldset class='narrow'>";
+
+			print "<label class='checkbox'><input dojoType=\"dijit.form.CheckBox\" type=\"checkbox\" name=\"private\" id=\"private\"
+				$checked> ".__('Hide from Popular feeds')."</label>";
+
+			print "</fieldset>";
 
 			$include_in_digest = $row["include_in_digest"];
 
@@ -667,10 +696,13 @@ class Pref_Feeds extends Handler_Protected {
 				$checked = "";
 			}
 
-			print "<hr/><input dojoType=\"dijit.form.CheckBox\" type=\"checkbox\" id=\"include_in_digest\"
-			name=\"include_in_digest\"
-			$checked>&nbsp;<label for=\"include_in_digest\">".__('Include in e-mail digest')."</label>";
+			print "<fieldset class='narrow'>";
+
+			print "<label class='checkbox'><input dojoType=\"dijit.form.CheckBox\" type=\"checkbox\" id=\"include_in_digest\"
+				name=\"include_in_digest\"
+				$checked> ".__('Include in e-mail digest')."</label>";
 
+			print "</fieldset>";
 
 			$always_display_enclosures = $row["always_display_enclosures"];
 
@@ -680,9 +712,13 @@ class Pref_Feeds extends Handler_Protected {
 				$checked = "";
 			}
 
-			print "<hr/><input dojoType=\"dijit.form.CheckBox\" type=\"checkbox\" id=\"always_display_enclosures\"
-			name=\"always_display_enclosures\"
-			$checked>&nbsp;<label for=\"always_display_enclosures\">".__('Always display image attachments')."</label>";
+			print "<fieldset class='narrow'>";
+
+			print "<label class='checkbox'><input dojoType=\"dijit.form.CheckBox\" type=\"checkbox\" id=\"always_display_enclosures\"
+				name=\"always_display_enclosures\"
+				$checked> ".__('Always display image attachments')."</label>";
+
+			print "</fieldset>";
 
 			$hide_images = $row["hide_images"];
 
@@ -692,10 +728,13 @@ class Pref_Feeds extends Handler_Protected {
 				$checked = "";
 			}
 
-			print "<hr/><input dojoType=\"dijit.form.CheckBox\" type=\"checkbox\" id=\"hide_images\"
-		name=\"hide_images\"
-			$checked>&nbsp;<label for=\"hide_images\">".
-				__('Do not embed media')."</label>";
+			print "<fieldset class='narrow'>";
+
+			print "<label class='checkbox'><input dojoType=\"dijit.form.CheckBox\" type=\"checkbox\" id=\"hide_images\"
+				name=\"hide_images\"
+				$checked> ".__('Do not embed media')."</label>";
+
+			print "</fieldset>";
 
 			$cache_images = $row["cache_images"];
 
@@ -705,10 +744,13 @@ class Pref_Feeds extends Handler_Protected {
 				$checked = "";
 			}
 
-			print "<hr/><input dojoType=\"dijit.form.CheckBox\" type=\"checkbox\" id=\"cache_images\"
-		name=\"cache_images\"
-			$checked>&nbsp;<label for=\"cache_images\">".
-				__('Cache media')."</label>";
+			print "<fieldset class='narrow'>";
+
+			print "<label class='checkbox'><input dojoType=\"dijit.form.CheckBox\" type=\"checkbox\" id=\"cache_images\"
+				name=\"cache_images\"
+				$checked> ". __('Cache media')."</label>";
+
+			print "</fieldset>";
 
 			$mark_unread_on_update = $row["mark_unread_on_update"];
 
@@ -718,9 +760,13 @@ class Pref_Feeds extends Handler_Protected {
 				$checked = "";
 			}
 
-			print "<hr/><input dojoType=\"dijit.form.CheckBox\" type=\"checkbox\" id=\"mark_unread_on_update\"
-			name=\"mark_unread_on_update\"
-			$checked>&nbsp;<label for=\"mark_unread_on_update\">".__('Mark updated articles as unread')."</label>";
+			print "<fieldset class='narrow'>";
+
+			print "<label class='checkbox'><input dojoType=\"dijit.form.CheckBox\" type=\"checkbox\" id=\"mark_unread_on_update\"
+				name=\"mark_unread_on_update\"
+				$checked> ".__('Mark updated articles as unread')."</label>";
+
+			print "</fieldset>";
 
 			print "</div>";
 
@@ -757,7 +803,6 @@ class Pref_Feeds extends Handler_Protected {
 			PluginHost::getInstance()->run_hooks(PluginHost::HOOK_PREFS_EDIT_FEED,
 				"hook_prefs_edit_feed", $feed_id);
 
-
 			print "</div></div>";
 
 			$title = htmlspecialchars($title, ENT_QUOTES);
@@ -796,25 +841,30 @@ class Pref_Feeds extends Handler_Protected {
 
 		if (get_pref('ENABLE_FEED_CATS')) {
 
-			print __('Place in category:') . " ";
+			print "<fieldset>";
+
+			print "<label>" . __('Place in category:') . "</label> ";
 
 			print_feed_cat_select("cat_id", false,
 				'disabled="1" dojoType="dijit.form.Select"');
 
 			$this->batch_edit_cbox("cat_id");
 
+			print "</fieldset>";
 		}
 
 		/* FTS Stemming Language */
 
 		if (DB_TYPE == "pgsql") {
-			print "<hr/>";
+			print "<fieldset>";
 
-			print __('Language:') . " ";
+			print "<label>" . __('Language:') . "</label> ";
 			print_select("feed_language", "", $this::$feed_languages,
 				'disabled="1" dojoType="dijit.form.Select"');
 
 			$this->batch_edit_cbox("feed_language");
+
+			print "</fieldset>";
 		}
 
 		print "</div>";
@@ -824,29 +874,37 @@ class Pref_Feeds extends Handler_Protected {
 
 		/* Update Interval */
 
+		print "<fieldset>";
+
 		print_select_hash("update_interval", "", $update_intervals,
 			'disabled="1" dojoType="dijit.form.Select"');
 
 		$this->batch_edit_cbox("update_interval");
 
+		print "</fieldset>";
+
 		/* Purge intl */
 
 		if (FORCE_ARTICLE_PURGE == 0) {
 
-			print "<br/>";
+			print "<fieldset>";
 
-			print __('Article purging:') . " ";
+			print "<label>" . __('Article purging:') . "</label> ";
 
 			print_select_hash("purge_interval", "", $purge_intervals,
 				'disabled="1" dojoType="dijit.form.Select"');
 
 			$this->batch_edit_cbox("purge_interval");
+
+			print "</fieldset>";
 		}
 
 		print "</div>";
 		print "<div class=\"dlgSec\">".__("Authentication")."</div>";
 		print "<div class=\"dlgSecCont\">";
 
+		print "<fieldset>";
+
 		print "<input dojoType=\"dijit.form.TextBox\"
 			placeHolder=\"".__("Login")."\" disabled=\"1\"
 			autocomplete=\"new-password\"
@@ -854,60 +912,74 @@ class Pref_Feeds extends Handler_Protected {
 
 		$this->batch_edit_cbox("auth_login");
 
-		print "<hr/> <input dojoType=\"dijit.form.TextBox\" type=\"password\" name=\"auth_pass\"
+		print "</fieldset>";
+		print "<fieldset>";
+
+		print "<input dojoType=\"dijit.form.TextBox\" type=\"password\" name=\"auth_pass\"
 			autocomplete=\"new-password\"
 			placeHolder=\"".__("Password")."\" disabled=\"1\"
 			value=\"\">";
 
 		$this->batch_edit_cbox("auth_pass");
 
+		print "</fieldset>";
+
 		print "</div>";
 		print "<div class=\"dlgSec\">".__("Options")."</div>";
 		print "<div class=\"dlgSecCont\">";
 
-		print "<input disabled=\"1\" type=\"checkbox\" name=\"private\" id=\"private\"
-			dojoType=\"dijit.form.CheckBox\">&nbsp;<label id=\"private_l\" class='insensitive' for=\"private\">".__('Hide from Popular feeds')."</label>";
+		print "<fieldset class='narrow'>";
+		print "<label class='checkbox'><input disabled=\"1\" type=\"checkbox\" name=\"private\" id=\"private\"
+			dojoType=\"dijit.form.CheckBox\">&nbsp;".__('Hide from Popular feeds')."</label>";
 
 		print "&nbsp;"; $this->batch_edit_cbox("private", "private_l");
 
-		print "<br/><input disabled=\"1\" type=\"checkbox\" id=\"include_in_digest\"
+		print "</fieldset><fieldset class='narrow'>";
+
+		print "<label class='checkbox'><input disabled=\"1\" type=\"checkbox\" id=\"include_in_digest\"
 			name=\"include_in_digest\"
-			dojoType=\"dijit.form.CheckBox\">&nbsp;<label id=\"include_in_digest_l\" class='insensitive' for=\"include_in_digest\">".__('Include in e-mail digest')."</label>";
+			dojoType=\"dijit.form.CheckBox\">&nbsp;".__('Include in e-mail digest')."</label>";
 
 		print "&nbsp;"; $this->batch_edit_cbox("include_in_digest", "include_in_digest_l");
 
-		print "<br/><input disabled=\"1\" type=\"checkbox\" id=\"always_display_enclosures\"
+		print "</fieldset><fieldset class='narrow'>";
+
+		print "<label class='checkbox'><input disabled=\"1\" type=\"checkbox\" id=\"always_display_enclosures\"
 			name=\"always_display_enclosures\"
-			dojoType=\"dijit.form.CheckBox\">&nbsp;<label id=\"always_display_enclosures_l\" class='insensitive' for=\"always_display_enclosures\">".__('Always display image attachments')."</label>";
+			dojoType=\"dijit.form.CheckBox\">&nbsp;".__('Always display image attachments')."</label>";
 
 		print "&nbsp;"; $this->batch_edit_cbox("always_display_enclosures", "always_display_enclosures_l");
 
-		print "<br/><input disabled=\"1\" type=\"checkbox\" id=\"hide_images\"
+		print "</fieldset><fieldset class='narrow'>";
+
+		print "<label class='checkbox'><input disabled=\"1\" type=\"checkbox\" id=\"hide_images\"
 			name=\"hide_images\"
-			dojoType=\"dijit.form.CheckBox\">&nbsp;<label class='insensitive' id=\"hide_images_l\"
-			for=\"hide_images\">".
-		__('Do not embed media')."</label>";
+			dojoType=\"dijit.form.CheckBox\">&nbsp;". __('Do not embed media')."</label>";
 
 		print "&nbsp;"; $this->batch_edit_cbox("hide_images", "hide_images_l");
 
-		print "<br/><input disabled=\"1\" type=\"checkbox\" id=\"cache_images\"
+		print "</fieldset><fieldset class='narrow'>";
+
+		print "<label class='checkbox'><input disabled=\"1\" type=\"checkbox\" id=\"cache_images\"
 			name=\"cache_images\"
-			dojoType=\"dijit.form.CheckBox\">&nbsp;<label class='insensitive' id=\"cache_images_l\"
-			for=\"cache_images\">".
-		__('Cache media')."</label>";
+			dojoType=\"dijit.form.CheckBox\">&nbsp;".__('Cache media')."</label>";
 
 		print "&nbsp;"; $this->batch_edit_cbox("cache_images", "cache_images_l");
 
-		print "<br/><input disabled=\"1\" type=\"checkbox\" id=\"mark_unread_on_update\"
+		print "</fieldset><fieldset class='narrow'>";
+
+		print "<label class='checkbox'><input disabled=\"1\" type=\"checkbox\" id=\"mark_unread_on_update\"
 			name=\"mark_unread_on_update\"
-			dojoType=\"dijit.form.CheckBox\">&nbsp;<label id=\"mark_unread_on_update_l\" class='insensitive' for=\"mark_unread_on_update\">".__('Mark updated articles as unread')."</label>";
+			dojoType=\"dijit.form.CheckBox\">&nbsp;".__('Mark updated articles as unread')."</label>";
 
 		print "&nbsp;"; $this->batch_edit_cbox("mark_unread_on_update", "mark_unread_on_update_l");
 
+		print "</fieldset>";
+
 		print "</div>";
 
 		print "<div class='dlgButtons'>
-			<button dojoType=\"dijit.form.Button\"
+			<button dojoType=\"dijit.form.Button\" type='submit' class='alt-primary'
 				onclick=\"return dijit.byId('feedEditDlg').execute()\">".
 				__('Save')."</button>
 			<button dojoType=\"dijit.form.Button\"

classes/pref/filters.php

@@ -339,20 +339,22 @@ class Pref_Filters extends Handler_Protected {
 			$inverse = $row["inverse"];
 			$title = htmlspecialchars($row["title"]);
 
-			print "<form id=\"filter_edit_form\" onsubmit='return false'>";
+			print "<form id='filter_edit_form' onsubmit='return false'>";
 
 			print_hidden("op", "pref-filters");
 			print_hidden("id", "$filter_id");
 			print_hidden("method", "editSave");
 			print_hidden("csrf_token", $_SESSION['csrf_token']);
 
-			print "<div class=\"dlgSecHoriz\">".__("Caption")."</div>";
+			print "<div class='dlgSecHoriz'>".__("Caption")."</div>";
+			print "<div class='dlgSecCont'>";
 
 			print "<input required=\"true\" dojoType=\"dijit.form.ValidationTextBox\" style=\"width : 20em;\" name=\"title\" value=\"$title\">";
 
 			print "</div>";
 
-			print "<div class=\"dlgSecHoriz\">".__("Match")."</div>";
+			print "<div class='dlgSecHoriz'>".__("Match")."</div>";
+			print "<div class='dlgSecCont'>";
 
 			print "<div dojoType=\"dijit.Toolbar\">";
 
@@ -410,7 +412,9 @@ class Pref_Filters extends Handler_Protected {
 
 			print "</div>";
 
-			print "<div class=\"dlgSecHoriz\">".__("Apply actions")."</div>";
+			print "<div class='dlgSecHoriz'>".__("Apply actions")."</div>";
+
+			print "<div class='dlgSecCont'>";
 
 			print "<div dojoType=\"dijit.Toolbar\">";
 
@@ -454,14 +458,18 @@ class Pref_Filters extends Handler_Protected {
 
 			print "</div>";
 
+			print "<div class='dlgSec'>".__("Options")."</div>";
+			print "<div class='dlgSecCont'>";
+
 			if ($enabled) {
 				$checked = "checked=\"1\"";
 			} else {
 				$checked = "";
 			}
 
-			print "<input dojoType=\"dijit.form.CheckBox\" type=\"checkbox\" name=\"enabled\" id=\"enabled\" $checked>
-				<label for=\"enabled\">".__('Enabled')."</label>";
+			print "<fieldset class='narrow'>";
+			print "<label class='checkbox'><input dojoType=\"dijit.form.CheckBox\" type=\"checkbox\" name=\"enabled\" id=\"enabled\" $checked>
+				".__('Enabled')."</label>";
 
 			if ($match_any_rule) {
 				$checked = "checked=\"1\"";
@@ -469,8 +477,12 @@ class Pref_Filters extends Handler_Protected {
 				$checked = "";
 			}
 
-			print "<br/><input dojoType=\"dijit.form.CheckBox\" type=\"checkbox\" name=\"match_any_rule\" id=\"match_any_rule\" $checked>
-				<label for=\"match_any_rule\">".__('Match any rule')."</label>";
+			print "</fieldset><fieldset class='narrow'>";
+
+			print "<label class='checkbox'><input dojoType=\"dijit.form.CheckBox\" type=\"checkbox\" name=\"match_any_rule\" id=\"match_any_rule\" $checked>
+				".__('Match any rule')."</label>";
+
+			print "</fieldset><fieldset class='narrow'>";
 
 			if ($inverse) {
 				$checked = "checked=\"1\"";
@@ -478,10 +490,12 @@ class Pref_Filters extends Handler_Protected {
 				$checked = "";
 			}
 
-			print "<br/><input dojoType=\"dijit.form.CheckBox\" type=\"checkbox\" name=\"inverse\" id=\"inverse\" $checked>
-				<label for=\"inverse\">".__('Inverse matching')."</label>";
+			print "<label class='checkbox'><input dojoType=\"dijit.form.CheckBox\" type=\"checkbox\" name=\"inverse\" id=\"inverse\" $checked>
+				".__('Inverse matching')."</label>";
 
-			print "<p/>";
+			print "</fieldset>";
+
+			print "</div>";
 
 			print "<div class=\"dlgButtons\">";
 
@@ -835,11 +849,15 @@ class Pref_Filters extends Handler_Protected {
 		print_hidden("method", "add");
 		print_hidden("csrf_token", $_SESSION['csrf_token']);
 
-		print "<div class=\"dlgSecHoriz\">".__("Caption")."</div>";
+		print "<div class='dlgSecHoriz'>".__("Caption")."</div>";
 
+		print "<div class='dlgSecCont'>";
 		print "<input required=\"true\" dojoType=\"dijit.form.ValidationTextBox\" style=\"width : 20em;\" name=\"title\" value=\"\">";
+		print "</div>";
 
-		print "<div class=\"dlgSecHoriz\">".__("Match")."</div>";
+		print "<div class='dlgSecHoriz'>".__("Match")."</div>";
+
+		print "<div class='dlgSecCont'>";
 
 		print "<div dojoType=\"dijit.Toolbar\">";
 
@@ -864,9 +882,12 @@ class Pref_Filters extends Handler_Protected {
 #		print "<li>No rules</li>";
 		print "</ul>";
 
+		print "</div>";
 		print "</div>";
 
-		print "<div class=\"dlgSecHoriz\">".__("Apply actions")."</div>";
+		print "<div class='dlgSecHoriz'>".__("Apply actions")."</div>";
+
+		print "<div class='dlgSecCont'>";
 
 		print "<div dojoType=\"dijit.Toolbar\">";
 
@@ -887,21 +908,33 @@ class Pref_Filters extends Handler_Protected {
 
 		print "</div>";
 
+
 		print "<ul id='filterDlg_Actions'>";
 #		print "<li>No actions</li>";
 		print "</ul>";
+		print "</div>";
+
+		print "<div class='dlgSec'>".__("Options")."</div>";
+
+		print "<div class='dlgSecCont'>";
+		print "<fieldset class='narrow'>";
 
-/*		print "<div class=\"dlgSec\">".__("Options")."</div>";
-		print "<div class=\"dlgSecCont\">"; */
+		print "<label class='checkbox'><input dojoType=\"dijit.form.CheckBox\" type=\"checkbox\" name=\"enabled\" id=\"enabled\" checked=\"1\">
+				".__('Enabled')."</label>";
 
-		print "<input dojoType=\"dijit.form.CheckBox\" type=\"checkbox\" name=\"enabled\" id=\"enabled\" checked=\"1\">
-				<label for=\"enabled\">".__('Enabled')."</label>";
+		print "</fieldset><fieldset class='narrow'>";
 
-		print "<br/><input dojoType=\"dijit.form.CheckBox\" type=\"checkbox\" name=\"match_any_rule\" id=\"match_any_rule\">
-				<label for=\"match_any_rule\">".__('Match any rule')."</label>";
+		print "<label class='checkbox'><input dojoType=\"dijit.form.CheckBox\" type=\"checkbox\" name=\"match_any_rule\" id=\"match_any_rule\">
+				".__('Match any rule')."</label>";
 
-		print "<br/><input dojoType=\"dijit.form.CheckBox\" type=\"checkbox\" name=\"inverse\" id=\"inverse\">
-				<label for=\"inverse\">".__('Inverse matching')."</label>";
+		print "</fieldset><fieldset class='narrow'>";
+
+		print "<label class='checkbox'><input dojoType=\"dijit.form.CheckBox\" type=\"checkbox\" name=\"inverse\" id=\"inverse\">
+				".__('Inverse matching')."</label>";
+
+		print "</fieldset>";
+
+		print "</div>";
 
 //		print "</div>";
 

classes/pref/users.php

@@ -61,6 +61,8 @@ class Pref_Users extends Handler_Protected {
 				print "<div class=\"dlgSec\">".__("Authentication")."</div>";
 				print "<div class=\"dlgSecCont\">";
 
+				print "<fieldset>";
+
 				print __('Access level: ') . " ";
 
 				if (!$sel_disabled) {
@@ -72,10 +74,13 @@ class Pref_Users extends Handler_Protected {
 					print_hidden("access_level", "$access_level");
 				}
 
-				print "<hr/>";
+				print "</fieldset>";
+				print "<fieldset>";
 
 				print "<input dojoType=\"dijit.form.TextBox\" type=\"password\" size=\"20\" placeholder=\"Change password\"
-				name=\"password\">";
+					name=\"password\">";
+
+				print "</fieldset>";
 
 				print "</div>";
 

css/default.css

@@ -422,41 +422,44 @@ body.ttrss_main div#headlines-frame.wide .title {
 body.ttrss_main div#headlines-frame.wide .hl .feed {
   display: none;
 }
-body.ttrss_main div.dlgSec {
-  font-size: 14px;
-  font-weight: bold;
-  clear: both;
-  margin: 8px;
-  position: relative;
-  top: 8px;
+body.ttrss_main .dijitDialog .dlgSec,
+body.ttrss_main .dijitDialog .dlgSecHoriz {
+  font-size: 16px;
+  font-weight: 600;
+  color: #555;
+  font-family: "Segoe WP Semibold", "Segoe UI Semibold", "Segoe UI Web Semibold", "Segoe UI", Ubuntu, "Helvetica Neue", Helvetica, Arial, sans-serif;
 }
-body.ttrss_main div.dlgSecHoriz {
-  font-size: 14px;
+body.ttrss_main .dijitDialog .dlgSecCont {
+  margin: 10px 20px;
+}
+body.ttrss_main .dijitDialog div.dlgSecCont fieldset > label,
+body.ttrss_main .dijitDialog div.dlgSecSimple fieldset > label {
   font-weight: bold;
-  clear: both;
-  margin-bottom: 8px;
-  margin-top: 8px;
+  margin-right: 10px;
+  display: inline-block;
+  min-width: 140px;
+  text-align: right;
 }
-body.ttrss_main div.dlgSecCont {
-  position: relative;
-  left: 150px;
-  top: -20px;
-  float: left;
+body.ttrss_main .dijitDialog div.dlgSecCont fieldset > label.checkbox,
+body.ttrss_main .dijitDialog div.dlgSecSimple fieldset > label.checkbox {
   font-weight: normal;
+  display: inline;
 }
-body.ttrss_main div.dlgSecCont > * {
-  position: relative;
-  top: -2px;
+body.ttrss_main .dijitDialog div.dlgSecCont fieldset,
+body.ttrss_main .dijitDialog div.dlgSecSimple fieldset {
+  border-width: 0px;
+  padding: 5px 0px;
 }
-body.ttrss_main div.dlgSecCont hr,
-body.ttrss_main div.dlgSecSimple hr {
-  height: 0px;
-  line-height: 0px;
-  border: 0px solid transparent;
-  margin: 2px;
+body.ttrss_main .dijitDialog div.dlgSecCont fieldset.narrow,
+body.ttrss_main .dijitDialog div.dlgSecSimple fieldset.narrow {
+  padding: 2px 0px;
+}
+body.ttrss_main .dijitDialog div.dlgSecCont fieldset.align-right,
+body.ttrss_main .dijitDialog div.dlgSecSimple fieldset.align-right {
+  text-align: right;
 }
 body.ttrss_main .dijitDialog .dlgButtons {
-  margin-top: 4px;
+  margin-top: 5px;
   text-align: right;
   clear: both;
 }
@@ -1510,7 +1513,7 @@ body.ttrss_utility .content fieldset.align-right {
   text-align: right;
 }
 body.ttrss_utility .content fieldset > label:first-of-type {
-  width: 140px;
+  min-width: 140px;
   margin-right: 20px;
   display: inline-block;
   text-align: right;

css/tt-rss.less

@@ -487,47 +487,52 @@ body.ttrss_main {
 		}
 	}
 
+	.dijitDialog {
 
-	div.dlgSec {
-		font-size : 14px;
-		font-weight : bold;
-		clear : both;
-		margin : 8px;
-		position : relative;
-		top : 8px;
-	}
+		.dlgSec, .dlgSecHoriz {
+			font-size : 16px;
+			font-weight : 600;
+			color : @default-text;
+			font-family: @fonts-ui-bold;
+		}
 
-	div.dlgSecHoriz {
-		font-size : 14px;
-		font-weight : bold;
-		clear : both;
-		margin-bottom : 8px;
-		margin-top : 8px;
-	}
+		.dlgSecCont {
+			margin : 10px 20px;
+		}
 
-	div.dlgSecCont {
-		position : relative;
-		left : 150px;
-		top : -20px;
-		float : left;
-		font-weight : normal;
+		div.dlgSecCont, div.dlgSecSimple {
 
-		> * {
-			position : relative;
-			top : -2px;
-		}
-	}
+			fieldset {
+				> label {
+					font-weight : bold;
+					margin-right : 10px;
+					display : inline-block;
+					min-width : 140px;
+					text-align : right;
+				}
 
-	div.dlgSecCont hr, div.dlgSecSimple hr {
-		height : 0px;
-		line-height : 0px;
-		border : 0px solid transparent;
-		margin : 2px;
-	}
+				> label.checkbox {
+					font-weight : normal;
+					display : inline;
+				}
+			}
+
+			fieldset {
+				border-width : 0px;
+				padding : 5px 0px;
+			}
+
+			fieldset.narrow {
+				padding : 2px 0px;
+			}
+
+			fieldset.align-right {
+				text-align : right;
+			}
+		}
 
-	.dijitDialog {
 		.dlgButtons {
-			margin-top : 4px;
+			margin-top : 5px;
 			text-align: right;
 			clear: both;
 		}

css/utility.less

@@ -46,7 +46,7 @@ body.ttrss_utility {
 		}
 
 		fieldset > label:first-of-type {
-			width : 140px;
+			min-width : 140px;
 			margin-right : 20px;
 			display : inline-block;
 			text-align : right;

plugins/af_psql_trgm/init.php

@@ -223,9 +223,13 @@ class Af_Psql_Trgm extends Plugin {
 		$key = array_search($feed_id, $enabled_feeds);
 		$checked = $key !== FALSE ? "checked" : "";
 
-		print "<hr/><input dojoType=\"dijit.form.CheckBox\" type=\"checkbox\" id=\"trgm_similarity_enabled\"
+		print "<fieldset>";
+
+		print "<label class='checkbox'><input dojoType=\"dijit.form.CheckBox\" type=\"checkbox\" id=\"trgm_similarity_enabled\"
 			name=\"trgm_similarity_enabled\"
-			$checked>&nbsp;<label for=\"trgm_similarity_enabled\">".__('Mark similar articles as read')."</label>";
+			$checked> ".__('Mark similar articles as read')."</label>";
+
+		print "</fieldset>";
 
 		print "</div>";
 	}
@@ -335,4 +339,4 @@ class Af_Psql_Trgm extends Plugin {
 		return $tmp;
 	}
 
-}
+}

plugins/af_readability/init.php

@@ -113,9 +113,13 @@ class Af_Readability extends Plugin {
 		$key = array_search($feed_id, $enabled_feeds);
 		$checked = $key !== FALSE ? "checked" : "";
 
-		print "<hr/><input dojoType=\"dijit.form.CheckBox\" type=\"checkbox\" id=\"af_readability_enabled\"
+		print "<fieldset>";
+
+		print "<label class='checkbox'><input dojoType=\"dijit.form.CheckBox\" type=\"checkbox\" id=\"af_readability_enabled\"
 			name=\"af_readability_enabled\"
-			$checked>&nbsp;<label for=\"af_readability_enabled\">".__('Inline article content')."</label>";
+			$checked>&nbsp;".__('Inline article content')."</label>";
+
+		print "</fieldset>";
 
 		print "</div>";
 	}

themes/night.css

@@ -423,41 +423,44 @@ body.ttrss_main div#headlines-frame.wide .title {
 body.ttrss_main div#headlines-frame.wide .hl .feed {
   display: none;
 }
-body.ttrss_main div.dlgSec {
-  font-size: 14px;
-  font-weight: bold;
-  clear: both;
-  margin: 8px;
-  position: relative;
-  top: 8px;
+body.ttrss_main .dijitDialog .dlgSec,
+body.ttrss_main .dijitDialog .dlgSecHoriz {
+  font-size: 16px;
+  font-weight: 600;
+  color: #ccc;
+  font-family: "Segoe WP Semibold", "Segoe UI Semibold", "Segoe UI Web Semibold", "Segoe UI", Ubuntu, "Helvetica Neue", Helvetica, Arial, sans-serif;
 }
-body.ttrss_main div.dlgSecHoriz {
-  font-size: 14px;
+body.ttrss_main .dijitDialog .dlgSecCont {
+  margin: 10px 20px;
+}
+body.ttrss_main .dijitDialog div.dlgSecCont fieldset > label,
+body.ttrss_main .dijitDialog div.dlgSecSimple fieldset > label {
   font-weight: bold;
-  clear: both;
-  margin-bottom: 8px;
-  margin-top: 8px;
+  margin-right: 10px;
+  display: inline-block;
+  min-width: 140px;
+  text-align: right;
 }
-body.ttrss_main div.dlgSecCont {
-  position: relative;
-  left: 150px;
-  top: -20px;
-  float: left;
+body.ttrss_main .dijitDialog div.dlgSecCont fieldset > label.checkbox,
+body.ttrss_main .dijitDialog div.dlgSecSimple fieldset > label.checkbox {
   font-weight: normal;
+  display: inline;
 }
-body.ttrss_main div.dlgSecCont > * {
-  position: relative;
-  top: -2px;
+body.ttrss_main .dijitDialog div.dlgSecCont fieldset,
+body.ttrss_main .dijitDialog div.dlgSecSimple fieldset {
+  border-width: 0px;
+  padding: 5px 0px;
 }
-body.ttrss_main div.dlgSecCont hr,
-body.ttrss_main div.dlgSecSimple hr {
-  height: 0px;
-  line-height: 0px;
-  border: 0px solid transparent;
-  margin: 2px;
+body.ttrss_main .dijitDialog div.dlgSecCont fieldset.narrow,
+body.ttrss_main .dijitDialog div.dlgSecSimple fieldset.narrow {
+  padding: 2px 0px;
+}
+body.ttrss_main .dijitDialog div.dlgSecCont fieldset.align-right,
+body.ttrss_main .dijitDialog div.dlgSecSimple fieldset.align-right {
+  text-align: right;
 }
 body.ttrss_main .dijitDialog .dlgButtons {
-  margin-top: 4px;
+  margin-top: 5px;
   text-align: right;
   clear: both;
 }
@@ -1511,7 +1514,7 @@ body.ttrss_utility .content fieldset.align-right {
   text-align: right;
 }
 body.ttrss_utility .content fieldset > label:first-of-type {
-  width: 140px;
+  min-width: 140px;
   margin-right: 20px;
   display: inline-block;
   text-align: right;

themes/night_blue.css

@@ -423,41 +423,44 @@ body.ttrss_main div#headlines-frame.wide .title {
 body.ttrss_main div#headlines-frame.wide .hl .feed {
   display: none;
 }
-body.ttrss_main div.dlgSec {
-  font-size: 14px;
-  font-weight: bold;
-  clear: both;
-  margin: 8px;
-  position: relative;
-  top: 8px;
+body.ttrss_main .dijitDialog .dlgSec,
+body.ttrss_main .dijitDialog .dlgSecHoriz {
+  font-size: 16px;
+  font-weight: 600;
+  color: #ccc;
+  font-family: "Segoe WP Semibold", "Segoe UI Semibold", "Segoe UI Web Semibold", "Segoe UI", Ubuntu, "Helvetica Neue", Helvetica, Arial, sans-serif;
 }
-body.ttrss_main div.dlgSecHoriz {
-  font-size: 14px;
+body.ttrss_main .dijitDialog .dlgSecCont {
+  margin: 10px 20px;
+}
+body.ttrss_main .dijitDialog div.dlgSecCont fieldset > label,
+body.ttrss_main .dijitDialog div.dlgSecSimple fieldset > label {
   font-weight: bold;
-  clear: both;
-  margin-bottom: 8px;
-  margin-top: 8px;
+  margin-right: 10px;
+  display: inline-block;
+  min-width: 140px;
+  text-align: right;
 }
-body.ttrss_main div.dlgSecCont {
-  position: relative;
-  left: 150px;
-  top: -20px;
-  float: left;
+body.ttrss_main .dijitDialog div.dlgSecCont fieldset > label.checkbox,
+body.ttrss_main .dijitDialog div.dlgSecSimple fieldset > label.checkbox {
   font-weight: normal;
+  display: inline;
 }
-body.ttrss_main div.dlgSecCont > * {
-  position: relative;
-  top: -2px;
+body.ttrss_main .dijitDialog div.dlgSecCont fieldset,
+body.ttrss_main .dijitDialog div.dlgSecSimple fieldset {
+  border-width: 0px;
+  padding: 5px 0px;
 }
-body.ttrss_main div.dlgSecCont hr,
-body.ttrss_main div.dlgSecSimple hr {
-  height: 0px;
-  line-height: 0px;
-  border: 0px solid transparent;
-  margin: 2px;
+body.ttrss_main .dijitDialog div.dlgSecCont fieldset.narrow,
+body.ttrss_main .dijitDialog div.dlgSecSimple fieldset.narrow {
+  padding: 2px 0px;
+}
+body.ttrss_main .dijitDialog div.dlgSecCont fieldset.align-right,
+body.ttrss_main .dijitDialog div.dlgSecSimple fieldset.align-right {
+  text-align: right;
 }
 body.ttrss_main .dijitDialog .dlgButtons {
-  margin-top: 4px;
+  margin-top: 5px;
   text-align: right;
   clear: both;
 }
@@ -1511,7 +1514,7 @@ body.ttrss_utility .content fieldset.align-right {
   text-align: right;
 }
 body.ttrss_utility .content fieldset > label:first-of-type {
-  width: 140px;
+  min-width: 140px;
   margin-right: 20px;
   display: inline-block;
   text-align: right;