Hide advanced options in new feed form (#3516)

* Hide new feed advanced options in a details tag

The form was huge and hard to process for beginners. Most of the fields
are optional 99% of time, there is no need to have them so proeminently.

* Remove sub.feed.auth.configuration i18n key

* Sync RTL css files

* Fix stylelint

Co-authored-by: Alexandre Alapetite <alexandre@alapetite.fr>

* Fix "for" attributes in add feed form

Co-authored-by: Alexandre Alapetite <alexandre@alapetite.fr>

Co-authored-by: Alexandre Alapetite <alexandre@alapetite.fr>

app/i18n/cz/sub.php

@@ -26,7 +26,6 @@ return array(
 		'advanced' => 'Pokročilé',
 		'archiving' => 'Archivace',
 		'auth' => array(
-			'configuration' => 'Přihlášení',
 			'help' => 'Umožní přístup k RSS kanálům chráneným HTTP autentizací',
 			'http' => 'HTTP přihlášení',
 			'password' => 'Heslo',

app/i18n/de/sub.php

@@ -26,7 +26,6 @@ return array(
 		'advanced' => 'Erweitert',
 		'archiving' => 'Archivierung',
 		'auth' => array(
-			'configuration' => 'Anmelden',
 			'help' => 'Die Verbindung erlaubt Zugriff auf HTTP-geschützte RSS-Feeds',
 			'http' => 'HTTP-Authentifizierung',
 			'password' => 'HTTP-Passwort',

app/i18n/en-us/sub.php

@@ -26,7 +26,6 @@ return array(
 		'advanced' => 'Advanced',
 		'archiving' => 'Archiving',
 		'auth' => array(
-			'configuration' => 'Login',
 			'help' => 'Allows access to HTTP protected RSS feeds',
 			'http' => 'HTTP Authentication',
 			'password' => 'HTTP password',

app/i18n/en/sub.php

@@ -26,7 +26,6 @@ return array(
 		'advanced' => 'Advanced',
 		'archiving' => 'Archiving',
 		'auth' => array(
-			'configuration' => 'Login',
 			'help' => 'Allows access to HTTP protected RSS feeds',
 			'http' => 'HTTP Authentication',
 			'password' => 'HTTP password',

app/i18n/es/sub.php

@@ -26,7 +26,6 @@ return array(
 		'advanced' => 'Avanzado',
 		'archiving' => 'Archivo',
 		'auth' => array(
-			'configuration' => 'Identificación',
 			'help' => 'Permitir acceso a fuentes RSS protegidas con HTTP',
 			'http' => 'Identificación HTTP',
 			'password' => 'Contraseña HTTP',

app/i18n/fr/sub.php

@@ -26,7 +26,6 @@ return array(
 		'advanced' => 'Avancé',
 		'archiving' => 'Archivage',
 		'auth' => array(
-			'configuration' => 'Identification',
 			'help' => 'La connexion permet d’accéder aux flux protégés par une authentification HTTP.',
 			'http' => 'Authentification HTTP',
 			'password' => 'Mot de passe HTTP',

app/i18n/he/sub.php

@@ -26,7 +26,6 @@ return array(
 		'advanced' => 'מתקדם',
 		'archiving' => 'ארכוב',
 		'auth' => array(
-			'configuration' => 'כניסה לחשבון',
 			'help' => 'החיבור מתיר לגשת להזנות RSS מוגנות',
 			'http' => 'HTTP אימות',
 			'password' => 'HTTP סיסמה',

app/i18n/it/sub.php

@@ -26,7 +26,6 @@ return array(
 		'advanced' => 'Avanzate',
 		'archiving' => 'Archiviazione',
 		'auth' => array(
-			'configuration' => 'Autenticazione',
 			'help' => 'Accesso per feeds protetti',
 			'http' => 'Autenticazione HTTP',
 			'password' => 'HTTP password',	// TODO - Translation

app/i18n/kr/sub.php

@@ -26,7 +26,6 @@ return array(
 		'advanced' => '고급 설정',
 		'archiving' => '보관',
 		'auth' => array(
-			'configuration' => '로그인',
 			'help' => 'HTTP 접속이 제한되는 RSS 피드에 접근합니다',
 			'http' => 'HTTP 인증',
 			'password' => 'HTTP 암호',

app/i18n/nl/sub.php

@@ -26,7 +26,6 @@ return array(
 		'advanced' => 'Geavanceerd',
 		'archiving' => 'Archiveren',
 		'auth' => array(
-			'configuration' => 'Log in',
 			'help' => 'Verbinding toestaan toegang te krijgen tot HTTP beveiligde RSS-feeds',
 			'http' => 'HTTP Authenticatie',
 			'password' => 'HTTP wachtwoord',

app/i18n/oc/sub.php

@@ -26,7 +26,6 @@ return array(
 		'advanced' => 'Avançat',
 		'archiving' => 'Archivar',
 		'auth' => array(
-			'configuration' => 'Identificacion',
 			'help' => 'Permet l’accès als fluxes protegits per una autentificacion HTTP',
 			'http' => 'Autentificacion HTTP',
 			'password' => 'Senhal HTTP',

app/i18n/pl/sub.php

@@ -26,7 +26,6 @@ return array(
 		'advanced' => 'Zaawansowane',
 		'archiving' => 'Archiwizacja',
 		'auth' => array(
-			'configuration' => 'Uwierzytelnianie',
 			'help' => 'Pozwala na dostęp do kanałów chronionych hasłem HTTP',
 			'http' => 'HTTP Authentication',	// TODO - Translation
 			'password' => 'Hasło HTTP',

app/i18n/pt-br/sub.php

@@ -26,7 +26,6 @@ return array(
 		'advanced' => 'Avançado',
 		'archiving' => 'Arquivar',
 		'auth' => array(
-			'configuration' => 'Entrar',
 			'help' => 'Permite acesso a feeds RSS protegidos por HTTP',
 			'http' => 'Autenticação HTTP',
 			'password' => 'Senha HTTP',

app/i18n/ru/sub.php

@@ -26,7 +26,6 @@ return array(
 		'advanced' => 'Advanced',	// TODO - Translation
 		'archiving' => 'Archivage',
 		'auth' => array(
-			'configuration' => 'Login',	// TODO - Translation
 			'help' => 'Connection allows to access HTTP protected RSS feeds',
 			'http' => 'HTTP Authentication',	// TODO - Translation
 			'password' => 'HTTP password',	// TODO - Translation

app/i18n/sk/sub.php

@@ -26,7 +26,6 @@ return array(
 		'advanced' => 'Pokročilé',
 		'archiving' => 'Archivovanie',
 		'auth' => array(
-			'configuration' => 'Prihlásenie',
 			'help' => 'Povoliť prístup do kanálov chránených cez HTTP.',
 			'http' => 'Prihlásenie cez HTTP',
 			'password' => 'Heslo pre HTTP',

app/i18n/tr/sub.php

@@ -26,7 +26,6 @@ return array(
 		'advanced' => 'Gelişmiş',
 		'archiving' => 'Arşiv',
 		'auth' => array(
-			'configuration' => 'Giriş',
 			'help' => 'HTTP korumalı RSS akışlarına bağlantı izni sağlar',
 			'http' => 'HTTP Kimlik Doğrulama',
 			'password' => 'HTTP şifre',

app/i18n/zh-cn/sub.php

@@ -26,7 +26,6 @@ return array(
 		'advanced' => '高级',
 		'archiving' => '归档',
 		'auth' => array(
-			'configuration' => '认证',
 			'help' => '用于连接启用 HTTP 认证的订阅源',
 			'http' => 'HTTP 认证',
 			'password' => 'HTTP 密码',

app/views/subscription/add.phtml

@@ -44,69 +44,73 @@
 			</div>
 		</div>
 
-		<legend><?= _t('sub.feed.auth.configuration') ?></legend>
-		<div class="form-group">
-			<label class="group-name" for="http_user"><?= _t('sub.feed.auth.username') ?></label>
-			<div class="group-controls">
-				<input id="http_user" name="http_user" type="text" autocomplete="off"/>
+		<details class="form-advanced">
+			<summary class="form-advanced-title">
+				<?= _t('sub.feed.advanced') ?>
+			</summary>
+
+			<div class="form-group">
+				<label class="group-name" for="http_user"><?= _t('sub.feed.auth.username') ?></label>
+				<div class="group-controls">
+					<input id="http_user" name="http_user" type="text" autocomplete="off"/>
+				</div>
 			</div>
-		</div>
 
-		<div class="form-group">
-		<label class="group-name" for="http_pass"><?= _t('sub.feed.auth.password') ?></label>
-			<div class="group-controls">
-				<input id="http_pass" name="http_pass" type="text" value=" " autocomplete="new-password"/>
+			<div class="form-group">
+				<label class="group-name" for="http_pass"><?= _t('sub.feed.auth.password') ?></label>
+				<div class="group-controls">
+					<input id="http_pass" name="http_pass" type="text" value=" " autocomplete="new-password"/>
+				</div>
 			</div>
-		</div>
 
-		<legend><?= _t('sub.feed.advanced') ?></legend>
-		<div class="form-group">
-			<label class="group-name" for="path_entries"><?= _t('sub.feed.useragent') ?></label>
-			<div class="group-controls">
-				<div class="stick">
-					<input type="text" name="curl_params_useragent" id="curl_params_useragent" class="extend" value="" placeholder="<?= _t('gen.short.blank_to_disable') ?>" />
+			<div class="form-group">
+				<label class="group-name" for="curl_params_useragent"><?= _t('sub.feed.useragent') ?></label>
+				<div class="group-controls">
+					<div class="stick">
+						<input type="text" name="curl_params_useragent" id="curl_params_useragent" class="extend" value="" placeholder="<?= _t('gen.short.blank_to_disable') ?>" />
+					</div>
+					<p class="help"><?= _i('help') ?> <?= _t('sub.feed.useragent_help') ?></p>
 				</div>
-				<p class="help"><?= _i('help') ?> <?= _t('sub.feed.useragent_help') ?></p>
 			</div>
-		</div>
 
-		<div class="form-group">
-			<label class="group-name" for="path_entries"><?= _t('sub.feed.proxy') ?></label>
-			<div class="group-controls">
-				<select class="number" name="proxy_type" id="proxy_type"><?php
-					foreach(['' => '', 3 => 'NONE', 0 => 'HTTP', 2 => 'HTTPS', 4 => 'SOCKS4', 6 => 'SOCKS4A', 5 => 'SOCKS5', 7 => 'SOCKS5H'] as $k => $v) {
-						echo '<option value="' . $k . '">' . $v . '</option>';
-					}
-				?>
-				</select>
-				<div class="stick">
-					<input type="text" name="curl_params" id="curl_params" class="extend" value="" placeholder="<?= _t('gen.short.blank_to_disable') ?>" />
+			<div class="form-group">
+				<label class="group-name" for="proxy_type"><?= _t('sub.feed.proxy') ?></label>
+				<div class="group-controls">
+					<select class="number" name="proxy_type" id="proxy_type"><?php
+						foreach(['' => '', 3 => 'NONE', 0 => 'HTTP', 2 => 'HTTPS', 4 => 'SOCKS4', 6 => 'SOCKS4A', 5 => 'SOCKS5', 7 => 'SOCKS5H'] as $k => $v) {
+							echo '<option value="' . $k . '">' . $v . '</option>';
+						}
+					?>
+					</select>
+					<div class="stick">
+						<input type="text" name="curl_params" id="curl_params" class="extend" value="" placeholder="<?= _t('gen.short.blank_to_disable') ?>" />
+					</div>
+					<p class="help"><?= _i('help') ?> <?= _t('sub.feed.proxy_help') ?></p>
 				</div>
-				<p class="help"><?= _i('help') ?> <?= _t('sub.feed.proxy_help') ?></p>
 			</div>
-		</div>
 
-		<?php if (FreshRSS_Auth::hasAccess('admin')) { ?>
-		<div class="form-group">
-			<label class="group-name" for="timeout"><?= _t('sub.feed.timeout') ?></label>
-			<div class="group-controls">
-				<input type="number" name="timeout" id="timeout" min="3" max="120" value="" placeholder="<?= _t('gen.short.by_default') ?>" />
+			<?php if (FreshRSS_Auth::hasAccess('admin')) { ?>
+			<div class="form-group">
+				<label class="group-name" for="timeout"><?= _t('sub.feed.timeout') ?></label>
+				<div class="group-controls">
+					<input type="number" name="timeout" id="timeout" min="3" max="120" value="" placeholder="<?= _t('gen.short.by_default') ?>" />
+				</div>
 			</div>
-		</div>
 
-		<div class="form-group">
-			<label class="group-name" for="ssl_verify"><?= _t('sub.feed.ssl_verify') ?></label>
-			<div class="group-controls">
-				<label class="checkbox" for="ssl_verify">
-					<select name="ssl_verify" id="ssl_verify">
-						<option value=""><?= _t('gen.short.by_default') ?></option>
-						<option value="0"><?= _t('gen.short.no') ?></option>
-						<option value="1"><?= _t('gen.short.yes') ?></option>
-					</select>
-				</label>
+			<div class="form-group">
+				<label class="group-name" for="ssl_verify"><?= _t('sub.feed.ssl_verify') ?></label>
+				<div class="group-controls">
+					<label class="checkbox" for="ssl_verify">
+						<select name="ssl_verify" id="ssl_verify">
+							<option value=""><?= _t('gen.short.by_default') ?></option>
+							<option value="0"><?= _t('gen.short.no') ?></option>
+							<option value="1"><?= _t('gen.short.yes') ?></option>
+						</select>
+					</label>
+				</div>
 			</div>
-		</div>
-		<?php } ?>
+			<?php } ?>
+		</details>
 
 		<div class="form-group form-actions">
 			<div class="group-controls">

cli/i18n/ignore/en-us.php

@@ -707,7 +707,6 @@ return array(
 	'sub.feed.add',
 	'sub.feed.advanced',
 	'sub.feed.archiving',
-	'sub.feed.auth.configuration',
 	'sub.feed.auth.help',
 	'sub.feed.auth.http',
 	'sub.feed.auth.password',

p/themes/Alternative-Dark/adark.rtl.css

@@ -671,6 +671,10 @@ a.btn {
 	text-align: center;
 }
 
+.prompt label {
+	text-align: right;
+}
+
 .prompt form {
 	margin-top: 2rem;
 	margin-bottom: 3rem;
@@ -1001,7 +1005,7 @@ a.btn {
 /*=== Slider */
 #slider {
 	background: #171717;
-	border-left: 1px solid #333;
+	border-right: 1px solid #333;
 }
 
 /*=== SLIDESHOW */

p/themes/Ansum/ansum.rtl.css

@@ -1099,7 +1099,6 @@ form th {
 .content code, .content.thin code {
 	padding: 2px 5px;
 	background: #fcfaf8;
-	color: #f5f0ec;
 	border: 1px solid #f5f0ec;
 	border-radius: 3px;
 }

p/themes/BlueLagoon/BlueLagoon.rtl.css

@@ -15,14 +15,6 @@ a, button.as-link {
 	outline: none;
 }
 
-/*=== Forms */
-.form-group {
-	display: inline-block;
-	float: right;
-	width: 100%;
-	height: auto;
-}
-
 legend {
 	margin: 20px 0 5px;
 	padding: 5px 0;
@@ -786,6 +778,10 @@ a.btn {
 	text-align: right;
 }
 
+.prompt label {
+	text-align: right;
+}
+
 .prompt .form-group {
 	margin-bottom: 1rem;
 }

p/themes/Mapco/mapco.rtl.css

@@ -1105,7 +1105,6 @@ form th {
 .content code, .content.thin code {
 	padding: 2px 5px;
 	background: #f9fafb;
-	color: #eff0f2;
 	border: 1px solid #eff0f2;
 	border-radius: 3px;
 }

p/themes/Screwdriver/screwdriver.rtl.css

@@ -15,14 +15,6 @@ a, button.as-link {
 	outline: none;
 }
 
-/*=== Forms */
-.form-group {
-	display: inline-block;
-	float: right;
-	width: 100%;
-	height: auto;
-}
-
 legend {
 	margin: 20px 0 5px;
 	padding: 5px 0;
@@ -766,6 +758,7 @@ a.btn {
 	padding-right: .5rem;
 	padding-left: .5rem;
 	text-align: center;
+	text-shadow: 0 1px rgba(255,255,255,0.08);
 }
 
 .prompt form {
@@ -793,7 +786,6 @@ a.btn {
 .prompt input {
 	width: 100%;
 	box-sizing: border-box;
-
 }
 
 .prompt input#username,.prompt input#passwordPlain {

p/themes/base-theme/template.css

@@ -212,6 +212,15 @@ td.numeric {
 	display: block;
 }
 
+.form-advanced-title {
+	padding: 15px 0;
+	width: 200px;
+	font-size: 1.1em;
+	font-weight: bold;
+	text-align: right;
+	cursor: pointer;
+}
+
 @supports (position: sticky) {
 	#mark-read-aside {
 		position: sticky;

p/themes/base-theme/template.rtl.css

@@ -16,6 +16,7 @@ html, body {
 	margin: 0;
 	padding: 0;
 	background: white;
+	color: black;
 	font-family: "OpenSans", "Cantarell", "Helvetica", "Arial", sans-serif;
 	font-size: 100%;
 }
@@ -211,6 +212,15 @@ td.numeric {
 	display: block;
 }
 
+.form-advanced-title {
+	padding: 15px 0;
+	width: 200px;
+	font-size: 1.1em;
+	font-weight: bold;
+	text-align: left;
+	cursor: pointer;
+}
+
 @supports (position: sticky) {
 	#mark-read-aside {
 		position: sticky;
@@ -719,7 +729,7 @@ input[type="search"] {
 }
 
 .flux .item.title .author {
-	padding-left: 1rem;
+	padding-right: 1rem;
 	color: #555;
 	font-size: .9rem;
 	font-weight: normal;
@@ -1295,6 +1305,7 @@ input:checked + .slide-container .properties {
 
 	.aside:target {
 		width: 90%;
+		height: 100vh;
 	}
 
 	.aside_feed .configure-feeds {