Browse Source

utility css updates

Andrew Dolgov 3 months ago
parent
commit
8cd7f31bde
11 changed files with 798 additions and 554 deletions
  1. 27 24
      classes/feeds.php
  2. 12 45
      classes/handler/public.php
  3. 225 169
      css/default.css
  4. 1 1
      css/default.css.map
  5. 85 11
      css/utility.less
  6. 4 46
      css/zoom.less
  7. 2 2
      include/login_form.php
  8. 220 127
      themes/night.css
  9. 1 1
      themes/night.css.map
  10. 220 127
      themes/night_blue.css
  11. 1 1
      themes/night_blue.css.map

+ 27 - 24
classes/feeds.php

@@ -831,31 +831,34 @@ class Feeds extends Handler_Protected {
 			<?php echo stylesheet_tag("css/default.css") ?>
 			<title>Feed Debugger</title>
 		</head>
-		<body class="small_margins ttrss_utility claro">
-		<h1>Feed Debugger: <?php echo "$feed_id: " . $this->getFeedTitle($feed_id) ?></h1>
-		<form method="GET" action="">
-			<input type="hidden" name="op" value="feeds">
-			<input type="hidden" name="method" value="update_debugger">
-			<input type="hidden" name="xdebug" value="1">
-			<input type="hidden" name="csrf_token" value="<?php echo $csrf_token ?>">
-			<input type="hidden" name="action" value="do_update">
-			<input type="hidden" name="feed_id" value="<?php echo $feed_id ?>">
-			<input type="checkbox" name="force_refetch" value="1" <?php echo $refetch_checked ?>> Force refetch<br/>
-			<input type="checkbox" name="force_rehash" value="1" <?php echo $rehash_checked ?>> Force rehash<br/>
-
-			<p/><button type="submit">Continue</button>
-		</form>
-
-		<hr>
-
-		<pre><?php
-
-		if ($do_update) {
-			RSSUtils::update_rss_feed($feed_id, true);
-		}
-
-		?></pre>
+		<body class="ttrss_utility feed_debugger">
+			<div class="container">
+				<h1>Feed Debugger: <?php echo "$feed_id: " . $this->getFeedTitle($feed_id) ?></h1>
+				<div class="content">
+					<form method="GET" action="">
+						<input type="hidden" name="op" value="feeds">
+						<input type="hidden" name="method" value="update_debugger">
+						<input type="hidden" name="xdebug" value="1">
+						<input type="hidden" name="csrf_token" value="<?php echo $csrf_token ?>">
+						<input type="hidden" name="action" value="do_update">
+						<input type="hidden" name="feed_id" value="<?php echo $feed_id ?>">
+						<input type="checkbox" name="force_refetch" value="1" <?php echo $refetch_checked ?>> Force refetch<br/>
+						<input type="checkbox" name="force_rehash" value="1" <?php echo $rehash_checked ?>> Force rehash<br/>
+
+						<p/><button type="submit">Continue</button>
+					</form>
+
+					<hr>
+
+					<pre><?php
+
+					if ($do_update) {
+						RSSUtils::update_rss_feed($feed_id, true);
+					}
 
+					?></pre>
+				</div>
+			</div>
 		</body>
 		</html>
 		<?php

+ 12 - 45
classes/handler/public.php

@@ -429,62 +429,29 @@ class Handler_Public extends Handler {
             }
 
             $rv .= "<body class='flat ttrss_utility ttrss_zoom'>";
-			$rv .= "<div class='post post-$id'>";
-
-			/* header */
-
-			$rv .= "<div class='header'>";
-			$rv .= "<div class='row'>"; # row
-
-			//$entry_author = $line["author"] ? " - " . $line["author"] : "";
-			$parsed_updated = make_local_datetime($line["updated"], true,
-				$owner_uid, true);
+            $rv .= "<div class='container'>";
 
 			if ($line["link"]) {
-				$rv .= "<div class='title'><a target='_blank' rel='noopener noreferrer'
+				$rv .= "<h1><a target='_blank' rel='noopener noreferrer'
 					title=\"".htmlspecialchars($line['title'])."\"
-					href=\"" .htmlspecialchars($line["link"]) . "\">" .	$line["title"] . "</a></div>";
+					href=\"" .htmlspecialchars($line["link"]) . "\">" .	$line["title"] . "</a></h1>";
 			} else {
-				$rv .= "<div class='title'>" . $line["title"] . "</div>";
+				$rv .= "<h1>" . $line["title"] . "</h1>";
 			}
 
-            $rv .= "<div class='date'>$parsed_updated<br/></div>";
+			$rv .= "<div class='content post'>";
 
-			$rv .= "</div>"; # row
+			/* header */
 
+			$rv .= "<div class='header'>";
 			$rv .= "<div class='row'>"; # row
 
-			/* left buttons */
-
-			$rv .= "<div class='buttons left'>";
-			foreach (PluginHost::getInstance()->get_hooks(PluginHost::HOOK_ARTICLE_LEFT_BUTTON) as $p) {
-				$rv .= $p->hook_article_left_button($line);
-			}
-			$rv .= "</div>";
-
-			/* comments */
-
-			$rv .= "<div class='comments'>$entry_comments</div>";
-			$rv .= "<div class='author'>".$line['author']."</div>";
-
-			/* tags */
-
-			$tags_str = Article::format_tags_string($line["tags"], $id);
-
-			$rv .= "<i class='material-icons'>label_outline</i><div>";
-
-            $tags_str = strip_tags($tags_str);
-			$rv .= "<span id=\"ATSTR-$id\">$tags_str</span>";
-
-			$rv .= "</div>";
-
-			/* buttons */
+			//$entry_author = $line["author"] ? " - " . $line["author"] : "";
+			$parsed_updated = make_local_datetime($line["updated"], true,
+				$owner_uid, true);
 
-			$rv .= "<div class='buttons right'>";
-			foreach (PluginHost::getInstance()->get_hooks(PluginHost::HOOK_ARTICLE_BUTTON) as $p) {
-				$rv .= $p->hook_article_button($line);
-			}
-			$rv .= "</div>";
+			$rv .= "<div>".$line['author']."</div>";
+            $rv .= "<div>$parsed_updated</div>";
 
 			$rv .= "</div>"; # row
 

+ 225 - 169
css/default.css

@@ -1477,43 +1477,222 @@ body.ttrss_utility.sanity_failed {
 body.ttrss_utility {
   background: #f5f5f5;
   color: black;
-  padding: 0;
-  margin: 0;
   font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
   font-size: 14px;
-  display: flex;
-  width: 100%;
-  height: 100%;
-  justify-content: center;
-  align-items: center;
-}
-body.ttrss_utility form {
-  margin: 10px 0px 0px 0px;
-  padding: 0px;
-}
-body.ttrss_utility div.content {
+  margin: 4em;
+  /* form {
+		margin : 10px 0px 0px 0px;
+		padding : 0px;
+	}
+
+	div.content {
+		background : white;
+		overflow : hidden;
+		border : 1px solid #ddd;
+		padding : 20px;
+		box-shadow : 0px 1px 1px -1px rgba(0,0,0,0.1);
+	}
+
+	div.content:not(.login-form) {
+		min-width : 600px;
+	}
+
+	p.warning {
+		color : red;
+	}
+
+	p.query, code {
+		color : green;
+	}
+
+	p.insensitive {
+		color : gray;
+	}
+
+	div.insensitive-small {
+		color : gray;
+		font-size : 10px;
+	}
+
+	a {
+		color : @color-link;
+		text-decoration : none;
+	}
+
+	a:hover,
+	a:focus {
+		color: darken(@color-link, 20%);
+		text-decoration: underline;
+	}
+
+	h1 {
+		color : gray;
+		font-family: @fonts-ui-bold;
+		font-size : 18px;
+		margin : 10px 0 0 0;
+	}
+
+	h2, h3, h4 {
+		color : @color-accent;
+	}
+
+	div.content > h2 {
+		margin-top : 0px;
+	}
+
+	div.rss h1 {
+		border-width : 0px 0px 1px 0px;
+		border-color : gray;
+		border-style : dotted;
+		color : gray;
+	}
+
+	div.rss h2 {
+		font-size : 12pt;
+	}
+
+	div.rss a.extlink {
+		color : gray;
+		border-width : 0px 0px 1px 0px;
+		border-color : #778899;
+		border-style : dotted;
+		font-size : 9pt;
+	}
+
+	div.rss img {
+		max-width : 775px;
+	}
+
+	div.rss p.description {
+		color : gray;
+		font-size : 9pt;
+	}
+
+	div.rss div.content {
+		margin-top : 0.5em;
+	}
+
+	div.rss img.feedicon {
+		float : right;
+	}
+
+	div.rss hr {
+		border-width : 0px 0px 1px 0px;
+		border-style : dashed;
+		border-color : #e0e0e0;
+	}
+
+	div.autocomplete {
+		position : absolute;
+		width : 250px;
+		background-color : white;
+		border :1px solid #778899;
+		margin : 0px;
+		padding : 0px;
+		z-index : 4;
+	}
+
+	div.autocomplete ul {
+		list-style-type : none;
+		margin : 0px;
+		padding : 0px;
+		font-size : 10px;
+	}
+
+	div.autocomplete ul li.selected {
+		background-color : #fff7d5;
+	}
+
+	div.autocomplete ul li {
+		list-style-type : none;
+		display : block;
+		margin : 0;
+		padding : 2px;
+		height : 32px;
+		cursor : pointer;
+	}
+
+	fieldset {
+		border-width : 0px;
+		padding : 5px 0px;
+	}
+
+	fieldset.narrow {
+		padding : 2px 0px;
+	}
+
+	fieldset.align-right {
+		text-align : right;
+	}
+
+	fieldset > label:first-of-type {
+		width : 120px;
+		margin-right : 20px;
+		display : inline-block;
+		text-align : right;
+		font-weight : bold;
+	}
+
+	.footer {
+		text-align : center;
+		padding-top : 10px;
+
+		a {
+			color : gray;
+		}
+
+		a:hover {
+			color : @color-accent;
+		}
+	}
+
+	body.otp {
+		margin : 1em;
+		padding : 0px;
+	}
+
+	form.otpform {
+		margin : 0px;
+		padding : 0px;
+	}
+
+	form.otpform label {
+		margin : 0px;
+		padding : 0px;
+	}
+
+	body.otp div.content {
+		display : inline-block;
+		width : auto;
+	}
+
+	span.hint {
+		font-size : 10px;
+		color : gray;
+	} */
+}
+body.ttrss_utility .content {
   background: white;
-  overflow: hidden;
   border: 1px solid #ddd;
   padding: 20px;
   box-shadow: 0px 1px 1px -1px rgba(0, 0, 0, 0.1);
 }
-body.ttrss_utility div.content:not(.login-form) {
-  min-width: 600px;
-}
-body.ttrss_utility p.warning {
-  color: red;
+body.ttrss_utility fieldset {
+  border-width: 0px;
+  padding: 5px 0px;
 }
-body.ttrss_utility p.query,
-body.ttrss_utility code {
-  color: green;
+body.ttrss_utility fieldset.narrow {
+  padding: 2px 0px;
 }
-body.ttrss_utility p.insensitive {
-  color: gray;
+body.ttrss_utility fieldset.align-right {
+  text-align: right;
 }
-body.ttrss_utility div.insensitive-small {
-  color: gray;
-  font-size: 10px;
+body.ttrss_utility fieldset > label:first-of-type {
+  width: 120px;
+  margin-right: 20px;
+  display: inline-block;
+  text-align: right;
+  font-weight: bold;
 }
 body.ttrss_utility a {
   color: #257aa7;
@@ -1535,86 +1714,6 @@ body.ttrss_utility h3,
 body.ttrss_utility h4 {
   color: #257aa7;
 }
-body.ttrss_utility div.content > h2 {
-  margin-top: 0px;
-}
-body.ttrss_utility div.rss h1 {
-  border-width: 0px 0px 1px 0px;
-  border-color: gray;
-  border-style: dotted;
-  color: gray;
-}
-body.ttrss_utility div.rss h2 {
-  font-size: 12pt;
-}
-body.ttrss_utility div.rss a.extlink {
-  color: gray;
-  border-width: 0px 0px 1px 0px;
-  border-color: #778899;
-  border-style: dotted;
-  font-size: 9pt;
-}
-body.ttrss_utility div.rss img {
-  max-width: 775px;
-}
-body.ttrss_utility div.rss p.description {
-  color: gray;
-  font-size: 9pt;
-}
-body.ttrss_utility div.rss div.content {
-  margin-top: 0.5em;
-}
-body.ttrss_utility div.rss img.feedicon {
-  float: right;
-}
-body.ttrss_utility div.rss hr {
-  border-width: 0px 0px 1px 0px;
-  border-style: dashed;
-  border-color: #e0e0e0;
-}
-body.ttrss_utility div.autocomplete {
-  position: absolute;
-  width: 250px;
-  background-color: white;
-  border: 1px solid #778899;
-  margin: 0px;
-  padding: 0px;
-  z-index: 4;
-}
-body.ttrss_utility div.autocomplete ul {
-  list-style-type: none;
-  margin: 0px;
-  padding: 0px;
-  font-size: 10px;
-}
-body.ttrss_utility div.autocomplete ul li.selected {
-  background-color: #fff7d5;
-}
-body.ttrss_utility div.autocomplete ul li {
-  list-style-type: none;
-  display: block;
-  margin: 0;
-  padding: 2px;
-  height: 32px;
-  cursor: pointer;
-}
-body.ttrss_utility fieldset {
-  border-width: 0px;
-  padding: 5px 0px;
-}
-body.ttrss_utility fieldset.narrow {
-  padding: 2px 0px;
-}
-body.ttrss_utility fieldset.align-right {
-  text-align: right;
-}
-body.ttrss_utility fieldset > label:first-of-type {
-  width: 120px;
-  margin-right: 20px;
-  display: inline-block;
-  text-align: right;
-  font-weight: bold;
-}
 body.ttrss_utility .footer {
   text-align: center;
   padding-top: 10px;
@@ -1625,29 +1724,23 @@ body.ttrss_utility .footer a {
 body.ttrss_utility .footer a:hover {
   color: #257aa7;
 }
-body.ttrss_utility body.otp {
-  margin: 1em;
-  padding: 0px;
-}
-body.ttrss_utility form.otpform {
-  margin: 0px;
-  padding: 0px;
-}
-body.ttrss_utility form.otpform label {
-  margin: 0px;
-  padding: 0px;
-}
-body.ttrss_utility body.otp div.content {
-  display: inline-block;
-  width: auto;
+body.ttrss_utility.ttrss_login {
+  margin: 0;
+  padding: 0;
+  width: 100%;
+  height: 100%;
+  position: absolute;
+  display: flex;
+  align-items: center;
+  justify-content: center;
 }
-body.ttrss_utility span.hint {
-  font-size: 10px;
-  color: gray;
+body.ttrss_utility.ttrss_login .container {
+  max-width: 600px;
+  margin-left: auto;
+  margin-right: auto;
 }
-body.small_margins {
-  margin: 1em;
-  max-width: none;
+body.ttrss_utility.feed_debugger {
+  margin: 2em;
 }
 body#sharepopup {
   color: black;
@@ -1811,13 +1904,6 @@ body#sharepopup input {
 .flat .dijitCheckBox {
   background: #ccc;
 }
-body.ttrss_zoom {
-  margin-left: auto;
-  margin-right: auto;
-  padding: 20px;
-  max-width: 800px;
-  background: #f5f5f5;
-}
 body.ttrss_zoom div.post {
   border: 1px solid #ddd;
   background: white;
@@ -1827,7 +1913,6 @@ body.ttrss_zoom div.post .attachments {
   display: none;
 }
 body.ttrss_zoom div.post div.header {
-  margin: 10px;
   padding-bottom: 10px;
   border: 0px solid #eee;
   border-bottom-width: 1px;
@@ -1839,48 +1924,19 @@ body.ttrss_zoom div.post div.header .row {
   display: flex;
   margin-bottom: 4px;
   flex-wrap: nowrap;
-}
-body.ttrss_zoom div.post div.header .row > * {
-  align-self: center;
-}
-body.ttrss_zoom div.post div.header .comments {
-  flex-grow: 2;
-}
-body.ttrss_zoom div.post div.header .date {
-  text-align: right;
-  white-space: nowrap;
-  align-self: flex-start;
-}
-body.ttrss_zoom div.post div.header img,
-body.ttrss_zoom div.post div.header i {
-  margin: 0px 4px;
-  vertical-align: middle;
-}
-body.ttrss_zoom div.post div.header .title {
-  flex-grow: 2;
-  align-self: flex-start;
-  font-size: 15px;
-  font-weight: 600;
-  text-rendering: optimizelegibility;
-  font-family: "Segoe WP Semibold", "Segoe UI Semibold", "Segoe UI Web Semibold", "Segoe UI", Ubuntu, "Helvetica Neue", Helvetica, Arial, sans-serif;
-}
-body.ttrss_zoom div.post div.header div.feed-title {
-  text-align: right;
+  align-items: center;
+  justify-content: space-between;
 }
 body.ttrss_zoom div.post p {
   -webkit-hyphens: auto;
   -moz-hyphens: auto;
   hyphens: auto;
 }
-body.ttrss_zoom div.post div.footer {
-  margin-top: 1em;
-  text-align: center;
-}
 body.ttrss_zoom div.post div.content {
   font-size: 15px;
   line-height: 1.5;
-  padding: 10px;
-  border-width: 0px;
+  border-width: 0;
+  padding: 0;
 }
 body.ttrss_zoom div.post div.content img,
 body.ttrss_zoom div.post div.content video {

File diff suppressed because it is too large
+ 1 - 1
css/default.css.map


+ 85 - 11
css/utility.less

@@ -5,17 +5,75 @@ body.ttrss_utility.sanity_failed {
 body.ttrss_utility {
 	background : @color-panel-bg;
 	color : @default-fg;
-	padding : 0;
-	margin : 0;
 	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
 	font-size: 14px;
-	display : flex;
-	width : 100%;
-	height : 100%;
-	justify-content : center;
-	align-items : center;
+	margin : 4em;
 
-	form {
+	.content {
+		background : white;
+		border : 1px solid #ddd;
+		padding : 20px;
+		box-shadow : 0px 1px 1px -1px rgba(0,0,0,0.1);
+	}
+
+	fieldset {
+		border-width : 0px;
+		padding : 5px 0px;
+	}
+
+	fieldset.narrow {
+		padding : 2px 0px;
+	}
+
+	fieldset.align-right {
+		text-align : right;
+	}
+
+	fieldset > label:first-of-type {
+		width : 120px;
+		margin-right : 20px;
+		display : inline-block;
+		text-align : right;
+		font-weight : bold;
+	}
+
+	a {
+		color : @color-link;
+		text-decoration : none;
+	}
+
+	a:hover,
+	a:focus {
+		color: darken(@color-link, 20%);
+		text-decoration: underline;
+	}
+
+	h1 {
+		color : gray;
+		font-family: @fonts-ui-bold;
+		font-size : 18px;
+		margin : 10px 0 0 0;
+	}
+
+	h2, h3, h4 {
+		color : @color-accent;
+	}
+
+	.footer {
+		text-align : center;
+		padding-top : 10px;
+
+		a {
+			color : gray;
+		}
+
+		a:hover {
+			color : @color-accent;
+		}
+	}
+
+
+	/* form {
 		margin : 10px 0px 0px 0px;
 		padding : 0px;
 	}
@@ -204,12 +262,28 @@ body.ttrss_utility {
 	span.hint {
 		font-size : 10px;
 		color : gray;
+	} */
+}
+
+body.ttrss_utility.ttrss_login {
+	margin : 0;
+	padding : 0;
+	width : 100%;
+	height : 100%;
+	position : absolute;
+	display : flex;
+	align-items: center;
+	justify-content : center;
+
+	.container {
+		max-width : 600px;
+		margin-left : auto;
+		margin-right : auto;
 	}
 }
 
-body.small_margins {
-	margin : 1em;
-	max-width : none;
+body.ttrss_utility.feed_debugger {
+	margin : 2em;
 }
 
 body#sharepopup {

+ 4 - 46
css/zoom.less

@@ -1,10 +1,4 @@
 body.ttrss_zoom {
-	margin-left : auto;
-	margin-right : auto;
-	padding : 20px;
-	max-width : 800px;
-	background : @color-panel-bg;
-
 	div.post {
 		border : 1px solid #ddd;
 		background : white;
@@ -15,7 +9,6 @@ body.ttrss_zoom {
 		}
 
 		div.header {
-			margin : 10px;
 			padding-bottom : 10px;
 			border: 0px solid #eee;
 			border-bottom-width: 1px;
@@ -27,38 +20,8 @@ body.ttrss_zoom {
 				display : flex;
 				margin-bottom : 4px;
 				flex-wrap : nowrap;
-
-				> * {
-					align-self : center;
-				}
-			}
-
-			.comments {
-				flex-grow : 2;
-			}
-
-			.date {
-				text-align : right;
-				white-space : nowrap;
-				align-self : flex-start;
-			}
-
-			img, i {
-				margin : 0px 4px;
-				vertical-align: middle;
-			}
-
-			.title {
-				flex-grow : 2;
-				align-self : flex-start;
-				font-size : 15px;
-				font-weight : 600;
-				text-rendering: optimizelegibility;
-				font-family : @fonts-ui-bold;
-			}
-
-			div.feed-title {
-				text-align : right;
+				align-items : center;
+				justify-content : space-between;
 			}
 		}
 
@@ -68,16 +31,11 @@ body.ttrss_zoom {
 			hyphens: auto;
 		}
 
-		div.footer {
-			margin-top : 1em;
-			text-align : center;
-		}
-
 		div.content {
 			font-size : 15px;
 			line-height : 1.5;
-			padding : 10px;
-			border-width : 0px;
+			border-width : 0;
+			padding : 0;
 
 			img, video {
 				max-width : 760px;

+ 2 - 2
include/login_form.php

@@ -21,7 +21,7 @@
 	</script>
 </head>
 
-<body class="flat ttrss_main ttrss_utility">
+<body class="flat ttrss_utility ttrss_login">
 
 <script type="text/javascript">
 require(['dojo/parser', "dojo/ready", 'dijit/form/Button','dijit/form/CheckBox', 'dijit/form/Form',
@@ -65,7 +65,7 @@ function bwLimitChange(elem) {
 <div class="container">
 
 	<h1><?php echo "Authentication" ?></h1>
-	<div class="content login-form">
+	<div class="content">
 		<form action="public.php?return=<?php echo $return ?>"
 			  dojoType="dijit.form.Form" method="POST">
 

+ 220 - 127
themes/night.css

@@ -1478,43 +1478,222 @@ body.ttrss_utility.sanity_failed {
 body.ttrss_utility {
   background: #222;
   color: #ccc;
-  padding: 0;
-  margin: 0;
   font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
   font-size: 14px;
-  display: flex;
-  width: 100%;
-  height: 100%;
-  justify-content: center;
-  align-items: center;
-}
-body.ttrss_utility form {
-  margin: 10px 0px 0px 0px;
-  padding: 0px;
+  margin: 4em;
+  /* form {
+		margin : 10px 0px 0px 0px;
+		padding : 0px;
+	}
+
+	div.content {
+		background : white;
+		overflow : hidden;
+		border : 1px solid #ddd;
+		padding : 20px;
+		box-shadow : 0px 1px 1px -1px rgba(0,0,0,0.1);
+	}
+
+	div.content:not(.login-form) {
+		min-width : 600px;
+	}
+
+	p.warning {
+		color : red;
+	}
+
+	p.query, code {
+		color : green;
+	}
+
+	p.insensitive {
+		color : gray;
+	}
+
+	div.insensitive-small {
+		color : gray;
+		font-size : 10px;
+	}
+
+	a {
+		color : @color-link;
+		text-decoration : none;
+	}
+
+	a:hover,
+	a:focus {
+		color: darken(@color-link, 20%);
+		text-decoration: underline;
+	}
+
+	h1 {
+		color : gray;
+		font-family: @fonts-ui-bold;
+		font-size : 18px;
+		margin : 10px 0 0 0;
+	}
+
+	h2, h3, h4 {
+		color : @color-accent;
+	}
+
+	div.content > h2 {
+		margin-top : 0px;
+	}
+
+	div.rss h1 {
+		border-width : 0px 0px 1px 0px;
+		border-color : gray;
+		border-style : dotted;
+		color : gray;
+	}
+
+	div.rss h2 {
+		font-size : 12pt;
+	}
+
+	div.rss a.extlink {
+		color : gray;
+		border-width : 0px 0px 1px 0px;
+		border-color : #778899;
+		border-style : dotted;
+		font-size : 9pt;
+	}
+
+	div.rss img {
+		max-width : 775px;
+	}
+
+	div.rss p.description {
+		color : gray;
+		font-size : 9pt;
+	}
+
+	div.rss div.content {
+		margin-top : 0.5em;
+	}
+
+	div.rss img.feedicon {
+		float : right;
+	}
+
+	div.rss hr {
+		border-width : 0px 0px 1px 0px;
+		border-style : dashed;
+		border-color : #e0e0e0;
+	}
+
+	div.autocomplete {
+		position : absolute;
+		width : 250px;
+		background-color : white;
+		border :1px solid #778899;
+		margin : 0px;
+		padding : 0px;
+		z-index : 4;
+	}
+
+	div.autocomplete ul {
+		list-style-type : none;
+		margin : 0px;
+		padding : 0px;
+		font-size : 10px;
+	}
+
+	div.autocomplete ul li.selected {
+		background-color : #fff7d5;
+	}
+
+	div.autocomplete ul li {
+		list-style-type : none;
+		display : block;
+		margin : 0;
+		padding : 2px;
+		height : 32px;
+		cursor : pointer;
+	}
+
+	fieldset {
+		border-width : 0px;
+		padding : 5px 0px;
+	}
+
+	fieldset.narrow {
+		padding : 2px 0px;
+	}
+
+	fieldset.align-right {
+		text-align : right;
+	}
+
+	fieldset > label:first-of-type {
+		width : 120px;
+		margin-right : 20px;
+		display : inline-block;
+		text-align : right;
+		font-weight : bold;
+	}
+
+	.footer {
+		text-align : center;
+		padding-top : 10px;
+
+		a {
+			color : gray;
+		}
+
+		a:hover {
+			color : @color-accent;
+		}
+	}
+
+	body.otp {
+		margin : 1em;
+		padding : 0px;
+	}
+
+	form.otpform {
+		margin : 0px;
+		padding : 0px;
+	}
+
+	form.otpform label {
+		margin : 0px;
+		padding : 0px;
+	}
+
+	body.otp div.content {
+		display : inline-block;
+		width : auto;
+	}
+
+	span.hint {
+		font-size : 10px;
+		color : gray;
+	} */
 }
-body.ttrss_utility div.content {
+body.ttrss_utility .content {
   background: white;
-  overflow: hidden;
   border: 1px solid #ddd;
   padding: 20px;
   box-shadow: 0px 1px 1px -1px rgba(0, 0, 0, 0.1);
 }
-body.ttrss_utility div.content:not(.login-form) {
-  min-width: 600px;
-}
-body.ttrss_utility p.warning {
-  color: red;
+body.ttrss_utility fieldset {
+  border-width: 0px;
+  padding: 5px 0px;
 }
-body.ttrss_utility p.query,
-body.ttrss_utility code {
-  color: green;
+body.ttrss_utility fieldset.narrow {
+  padding: 2px 0px;
 }
-body.ttrss_utility p.insensitive {
-  color: gray;
+body.ttrss_utility fieldset.align-right {
+  text-align: right;
 }
-body.ttrss_utility div.insensitive-small {
-  color: gray;
-  font-size: 10px;
+body.ttrss_utility fieldset > label:first-of-type {
+  width: 120px;
+  margin-right: 20px;
+  display: inline-block;
+  text-align: right;
+  font-weight: bold;
 }
 body.ttrss_utility a {
   color: #b87d2c;
@@ -1536,86 +1715,6 @@ body.ttrss_utility h3,
 body.ttrss_utility h4 {
   color: #b87d2c;
 }
-body.ttrss_utility div.content > h2 {
-  margin-top: 0px;
-}
-body.ttrss_utility div.rss h1 {
-  border-width: 0px 0px 1px 0px;
-  border-color: gray;
-  border-style: dotted;
-  color: gray;
-}
-body.ttrss_utility div.rss h2 {
-  font-size: 12pt;
-}
-body.ttrss_utility div.rss a.extlink {
-  color: gray;
-  border-width: 0px 0px 1px 0px;
-  border-color: #778899;
-  border-style: dotted;
-  font-size: 9pt;
-}
-body.ttrss_utility div.rss img {
-  max-width: 775px;
-}
-body.ttrss_utility div.rss p.description {
-  color: gray;
-  font-size: 9pt;
-}
-body.ttrss_utility div.rss div.content {
-  margin-top: 0.5em;
-}
-body.ttrss_utility div.rss img.feedicon {
-  float: right;
-}
-body.ttrss_utility div.rss hr {
-  border-width: 0px 0px 1px 0px;
-  border-style: dashed;
-  border-color: #e0e0e0;
-}
-body.ttrss_utility div.autocomplete {
-  position: absolute;
-  width: 250px;
-  background-color: white;
-  border: 1px solid #778899;
-  margin: 0px;
-  padding: 0px;
-  z-index: 4;
-}
-body.ttrss_utility div.autocomplete ul {
-  list-style-type: none;
-  margin: 0px;
-  padding: 0px;
-  font-size: 10px;
-}
-body.ttrss_utility div.autocomplete ul li.selected {
-  background-color: #fff7d5;
-}
-body.ttrss_utility div.autocomplete ul li {
-  list-style-type: none;
-  display: block;
-  margin: 0;
-  padding: 2px;
-  height: 32px;
-  cursor: pointer;
-}
-body.ttrss_utility fieldset {
-  border-width: 0px;
-  padding: 5px 0px;
-}
-body.ttrss_utility fieldset.narrow {
-  padding: 2px 0px;
-}
-body.ttrss_utility fieldset.align-right {
-  text-align: right;
-}
-body.ttrss_utility fieldset > label:first-of-type {
-  width: 120px;
-  margin-right: 20px;
-  display: inline-block;
-  text-align: right;
-  font-weight: bold;
-}
 body.ttrss_utility .footer {
   text-align: center;
   padding-top: 10px;
@@ -1626,29 +1725,23 @@ body.ttrss_utility .footer a {
 body.ttrss_utility .footer a:hover {
   color: #b87d2c;
 }
-body.ttrss_utility body.otp {
-  margin: 1em;
-  padding: 0px;
-}
-body.ttrss_utility form.otpform {
-  margin: 0px;
-  padding: 0px;
-}
-body.ttrss_utility form.otpform label {
-  margin: 0px;
-  padding: 0px;
-}
-body.ttrss_utility body.otp div.content {
-  display: inline-block;
-  width: auto;
+body.ttrss_utility.ttrss_login {
+  margin: 0;
+  padding: 0;
+  width: 100%;
+  height: 100%;
+  position: absolute;
+  display: flex;
+  align-items: center;
+  justify-content: center;
 }
-body.ttrss_utility span.hint {
-  font-size: 10px;
-  color: gray;
+body.ttrss_utility.ttrss_login .container {
+  max-width: 600px;
+  margin-left: auto;
+  margin-right: auto;
 }
-body.small_margins {
-  margin: 1em;
-  max-width: none;
+body.ttrss_utility.feed_debugger {
+  margin: 2em;
 }
 body#sharepopup {
   color: #ccc;

File diff suppressed because it is too large
+ 1 - 1
themes/night.css.map


+ 220 - 127
themes/night_blue.css

@@ -1478,43 +1478,222 @@ body.ttrss_utility.sanity_failed {
 body.ttrss_utility {
   background: #222;
   color: #ccc;
-  padding: 0;
-  margin: 0;
   font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
   font-size: 14px;
-  display: flex;
-  width: 100%;
-  height: 100%;
-  justify-content: center;
-  align-items: center;
-}
-body.ttrss_utility form {
-  margin: 10px 0px 0px 0px;
-  padding: 0px;
+  margin: 4em;
+  /* form {
+		margin : 10px 0px 0px 0px;
+		padding : 0px;
+	}
+
+	div.content {
+		background : white;
+		overflow : hidden;
+		border : 1px solid #ddd;
+		padding : 20px;
+		box-shadow : 0px 1px 1px -1px rgba(0,0,0,0.1);
+	}
+
+	div.content:not(.login-form) {
+		min-width : 600px;
+	}
+
+	p.warning {
+		color : red;
+	}
+
+	p.query, code {
+		color : green;
+	}
+
+	p.insensitive {
+		color : gray;
+	}
+
+	div.insensitive-small {
+		color : gray;
+		font-size : 10px;
+	}
+
+	a {
+		color : @color-link;
+		text-decoration : none;
+	}
+
+	a:hover,
+	a:focus {
+		color: darken(@color-link, 20%);
+		text-decoration: underline;
+	}
+
+	h1 {
+		color : gray;
+		font-family: @fonts-ui-bold;
+		font-size : 18px;
+		margin : 10px 0 0 0;
+	}
+
+	h2, h3, h4 {
+		color : @color-accent;
+	}
+
+	div.content > h2 {
+		margin-top : 0px;
+	}
+
+	div.rss h1 {
+		border-width : 0px 0px 1px 0px;
+		border-color : gray;
+		border-style : dotted;
+		color : gray;
+	}
+
+	div.rss h2 {
+		font-size : 12pt;
+	}
+
+	div.rss a.extlink {
+		color : gray;
+		border-width : 0px 0px 1px 0px;
+		border-color : #778899;
+		border-style : dotted;
+		font-size : 9pt;
+	}
+
+	div.rss img {
+		max-width : 775px;
+	}
+
+	div.rss p.description {
+		color : gray;
+		font-size : 9pt;
+	}
+
+	div.rss div.content {
+		margin-top : 0.5em;
+	}
+
+	div.rss img.feedicon {
+		float : right;
+	}
+
+	div.rss hr {
+		border-width : 0px 0px 1px 0px;
+		border-style : dashed;
+		border-color : #e0e0e0;
+	}
+
+	div.autocomplete {
+		position : absolute;
+		width : 250px;
+		background-color : white;
+		border :1px solid #778899;
+		margin : 0px;
+		padding : 0px;
+		z-index : 4;
+	}
+
+	div.autocomplete ul {
+		list-style-type : none;
+		margin : 0px;
+		padding : 0px;
+		font-size : 10px;
+	}
+
+	div.autocomplete ul li.selected {
+		background-color : #fff7d5;
+	}
+
+	div.autocomplete ul li {
+		list-style-type : none;
+		display : block;
+		margin : 0;
+		padding : 2px;
+		height : 32px;
+		cursor : pointer;
+	}
+
+	fieldset {
+		border-width : 0px;
+		padding : 5px 0px;
+	}
+
+	fieldset.narrow {
+		padding : 2px 0px;
+	}
+
+	fieldset.align-right {
+		text-align : right;
+	}
+
+	fieldset > label:first-of-type {
+		width : 120px;
+		margin-right : 20px;
+		display : inline-block;
+		text-align : right;
+		font-weight : bold;
+	}
+
+	.footer {
+		text-align : center;
+		padding-top : 10px;
+
+		a {
+			color : gray;
+		}
+
+		a:hover {
+			color : @color-accent;
+		}
+	}
+
+	body.otp {
+		margin : 1em;
+		padding : 0px;
+	}
+
+	form.otpform {
+		margin : 0px;
+		padding : 0px;
+	}
+
+	form.otpform label {
+		margin : 0px;
+		padding : 0px;
+	}
+
+	body.otp div.content {
+		display : inline-block;
+		width : auto;
+	}
+
+	span.hint {
+		font-size : 10px;
+		color : gray;
+	} */
 }
-body.ttrss_utility div.content {
+body.ttrss_utility .content {
   background: white;
-  overflow: hidden;
   border: 1px solid #ddd;
   padding: 20px;
   box-shadow: 0px 1px 1px -1px rgba(0, 0, 0, 0.1);
 }
-body.ttrss_utility div.content:not(.login-form) {
-  min-width: 600px;
-}
-body.ttrss_utility p.warning {
-  color: red;
+body.ttrss_utility fieldset {
+  border-width: 0px;
+  padding: 5px 0px;
 }
-body.ttrss_utility p.query,
-body.ttrss_utility code {
-  color: green;
+body.ttrss_utility fieldset.narrow {
+  padding: 2px 0px;
 }
-body.ttrss_utility p.insensitive {
-  color: gray;
+body.ttrss_utility fieldset.align-right {
+  text-align: right;
 }
-body.ttrss_utility div.insensitive-small {
-  color: gray;
-  font-size: 10px;
+body.ttrss_utility fieldset > label:first-of-type {
+  width: 120px;
+  margin-right: 20px;
+  display: inline-block;
+  text-align: right;
+  font-weight: bold;
 }
 body.ttrss_utility a {
   color: #257aa7;
@@ -1536,86 +1715,6 @@ body.ttrss_utility h3,
 body.ttrss_utility h4 {
   color: #257aa7;
 }
-body.ttrss_utility div.content > h2 {
-  margin-top: 0px;
-}
-body.ttrss_utility div.rss h1 {
-  border-width: 0px 0px 1px 0px;
-  border-color: gray;
-  border-style: dotted;
-  color: gray;
-}
-body.ttrss_utility div.rss h2 {
-  font-size: 12pt;
-}
-body.ttrss_utility div.rss a.extlink {
-  color: gray;
-  border-width: 0px 0px 1px 0px;
-  border-color: #778899;
-  border-style: dotted;
-  font-size: 9pt;
-}
-body.ttrss_utility div.rss img {
-  max-width: 775px;
-}
-body.ttrss_utility div.rss p.description {
-  color: gray;
-  font-size: 9pt;
-}
-body.ttrss_utility div.rss div.content {
-  margin-top: 0.5em;
-}
-body.ttrss_utility div.rss img.feedicon {
-  float: right;
-}
-body.ttrss_utility div.rss hr {
-  border-width: 0px 0px 1px 0px;
-  border-style: dashed;
-  border-color: #e0e0e0;
-}
-body.ttrss_utility div.autocomplete {
-  position: absolute;
-  width: 250px;
-  background-color: white;
-  border: 1px solid #778899;
-  margin: 0px;
-  padding: 0px;
-  z-index: 4;
-}
-body.ttrss_utility div.autocomplete ul {
-  list-style-type: none;
-  margin: 0px;
-  padding: 0px;
-  font-size: 10px;
-}
-body.ttrss_utility div.autocomplete ul li.selected {
-  background-color: #fff7d5;
-}
-body.ttrss_utility div.autocomplete ul li {
-  list-style-type: none;
-  display: block;
-  margin: 0;
-  padding: 2px;
-  height: 32px;
-  cursor: pointer;
-}
-body.ttrss_utility fieldset {
-  border-width: 0px;
-  padding: 5px 0px;
-}
-body.ttrss_utility fieldset.narrow {
-  padding: 2px 0px;
-}
-body.ttrss_utility fieldset.align-right {
-  text-align: right;
-}
-body.ttrss_utility fieldset > label:first-of-type {
-  width: 120px;
-  margin-right: 20px;
-  display: inline-block;
-  text-align: right;
-  font-weight: bold;
-}
 body.ttrss_utility .footer {
   text-align: center;
   padding-top: 10px;
@@ -1626,29 +1725,23 @@ body.ttrss_utility .footer a {
 body.ttrss_utility .footer a:hover {
   color: #257aa7;
 }
-body.ttrss_utility body.otp {
-  margin: 1em;
-  padding: 0px;
-}
-body.ttrss_utility form.otpform {
-  margin: 0px;
-  padding: 0px;
-}
-body.ttrss_utility form.otpform label {
-  margin: 0px;
-  padding: 0px;
-}
-body.ttrss_utility body.otp div.content {
-  display: inline-block;
-  width: auto;
+body.ttrss_utility.ttrss_login {
+  margin: 0;
+  padding: 0;
+  width: 100%;
+  height: 100%;
+  position: absolute;
+  display: flex;
+  align-items: center;
+  justify-content: center;
 }
-body.ttrss_utility span.hint {
-  font-size: 10px;
-  color: gray;
+body.ttrss_utility.ttrss_login .container {
+  max-width: 600px;
+  margin-left: auto;
+  margin-right: auto;
 }
-body.small_margins {
-  margin: 1em;
-  max-width: none;
+body.ttrss_utility.feed_debugger {
+  margin: 2em;
 }
 body#sharepopup {
   color: #ccc;

File diff suppressed because it is too large
+ 1 - 1
themes/night_blue.css.map