mkody/README.md

## README.md

      
    Raw
  

              README.md
            
          
    This is a dark color scheme for the Swage theme in FreshRSS.
To use it, copy/paste the content of custom.css in the settings of the Custom CSS extension.

To go further, I've edited manifest.json and layout.phtml so that the colors for the window and PWA matches.
You can replace those files or if you use docker (compose) you can mount them.

For example this is the volumes settings in my docker-compose.yaml:
    volumes:
      - data:/var/www/FreshRSS/data
      - ./extensions:/var/www/FreshRSS/extensions
      - ./manifest.json:/var/www/FreshRSS/p/themes/manifest.json:ro
      - ./layout.phtml:/var/www/FreshRSS/app/layout/layout.phtml:ro

  
## custom.css
:root{
  --color-background-hover: #22303d;
  --color-background-light-darker: #282828;
  --color-background-light: #1f1f1f;
  --color-background-nav-darker: #2d3e4f;
  --color-background-nav: #22303d;
  --color-background-stared: #565140;
  --color-background-unread: #282828;
  --color-border-light-darker: #3a3a3a;
  --color-border-light: #4e4e4e;
  --color-text-dark: #fcfcfc;
  --color-text-nav: #6ab7ff;
  --frss-background-color: #1f1f1f;
  --frss-font-color-dark: #fcfcfc;
}

input,
select,
textarea {
  color: var(--color-text-dark);
}

.alert-warn,
.alert-success,
.alert-error,
.flux.not_read:not(.active) {
  background: var(--color-background-unread);
}

.flux:not(.active):hover,
.flux.not_read:not(.active):hover {
  color: var(--color-text-dark);
}

/* Change unread counts backgrounds + borders and fix alignement */
.aside_feed .category .title:not([data-unread="0"])::after {
  border: 1px solid var(--color-background-nav-darker);
  margin: 0.35rem 0 0 0;
}
.aside_feed .category.active .title:not([data-unread="0"])::after {
  background-color: var(--color-background-nav);
  border: 1px solid var(--frss-border-color);
}
.aside_feed .feed .item-title:not([data-unread="0"])::after {
  margin: 0.35rem 0 0 0;
}
.aside_feed .feed:not(.active) .item-title:not([data-unread="0"])::after {
  border: 1px solid var(--color-background-nav-darker);
}

## layout.phtml
<?php
	/** @var FreshRSS_View $this */
	FreshRSS::preLayout();
?>
<!DOCTYPE html>
<html lang="<?= FreshRSS_Context::$user_conf->language ?>" xml:lang="<?= FreshRSS_Context::$user_conf->language ?>"<?php
if (_t('gen.dir') === 'rtl') {
	echo ' dir="rtl" class="rtl"';
}
?>>
	<head>
		<meta charset="UTF-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover" />
		<?= FreshRSS_View::headStyle() ?>
		<script id="jsonVars" type="application/json">
<?php $this->renderHelper('javascript_vars'); ?>
		</script>
		<?= FreshRSS_View::headScript() ?>
		<link rel="manifest" href="<?= Minz_Url::display('/themes/manifest.json') ?>" />
		<link rel="shortcut icon" id="favicon" type="image/x-icon" sizes="16x16 64x64" href="<?= Minz_Url::display('/favicon.ico') ?>" />
		<link rel="icon msapplication-TileImage apple-touch-icon" type="image/png" sizes="256x256" href="<?= Minz_Url::display('/themes/icons/favicon-256.png') ?>" />
		<link rel="apple-touch-icon" href="<?= Minz_Url::display('/themes/icons/apple-touch-icon.png') ?>" />
		<meta name="apple-mobile-web-app-capable" content="yes" />
		<meta name="apple-mobile-web-app-status-bar-style" content="black" />
		<meta name="apple-mobile-web-app-title" content="<?= FreshRSS_Context::$system_conf->title ?>">
		<meta name="msapplication-TileColor" content="#22303d" />
		<meta name="theme-color" content="#22303d" />
<?php if (!FreshRSS_Context::$system_conf->allow_referrer) { ?>
		<meta name="referrer" content="never" />
<?php } ?>
		<?= FreshRSS_View::headTitle() ?>
<?php
	$url_base = Minz_Request::currentRequest();
	if ($this->rss_title != '') {
		$url_rss = $url_base;
		$url_rss['a'] = 'rss';
		unset($url_rss['params']['rid']);
		if (FreshRSS_Context::$user_conf->since_hours_posts_per_rss) {
			$url_rss['params']['hours'] = FreshRSS_Context::$user_conf->since_hours_posts_per_rss;
		}
?>
		<link rel="alternate" type="application/rss+xml" title="<?= $this->rss_title ?>" href="<?= Minz_Url::display($url_rss) ?>" />
<?php } if (FreshRSS_Context::isAll() || FreshRSS_Context::isCategory() || FreshRSS_Context::isFeed()) {
		$opml_rss = $url_base;
		$opml_rss['a'] = 'opml';
		unset($opml_rss['params']['rid']);
?>
		<link rel="outline" type="text/x-opml" title="OPML" href="<?= Minz_Url::display($opml_rss) ?>" />
<?php } if (FreshRSS_Context::$system_conf->allow_robots) { ?>
		<meta name="description" content="<?= htmlspecialchars(FreshRSS_Context::$name . ' | ' . FreshRSS_Context::$description, ENT_COMPAT, 'UTF-8') ?>" />
<?php } else { ?>
		<meta name="robots" content="noindex,nofollow" />
<?php } ?>
	</head>
	<body class="<?= Minz_Request::actionName() ?><?= (FreshRSS_Context::$user_conf->darkMode === 'no') ? '' : ' darkMode_' . FreshRSS_Context::$user_conf->darkMode ?>">
<?php
	if (!Minz_Request::param('ajax')) {
		flush();
		$this->partial('header');
	}
?>

<div id="global">
	<?php
		flush();
		if (isset($this->callbackBeforeFeeds)) {
			call_user_func($this->callbackBeforeFeeds, $this);
		}
		$this->render();
	?>
</div>

<?php
	$msg = '';
	$status = 'closed';
	if (!empty($this->notification)) {
		$msg = $this->notification['content'];
		$status = $this->notification['type'];

		invalidateHttpCache();
	}
?>
<div id="notification" class="notification <?= $status ?>">
	<span class="msg"><?= $msg ?></span>
	<a class="close" href=""><?= _i('close') ?></a>
</div>
	</body>
</html>

## manifest.json
{
  "name": "FreshRSS",
  "short_name": "FreshRSS",
  "start_url": "../i/",
  "scope": "../",
  "icons": [
    {
      "src": "icons/favicon.svg",
      "type": "image/svg+xml",
      "sizes": "150x150",
      "purpose": "any"
    },
    {
      "src": "icons/favicon-96-padding.png",
      "type": "image/png",
      "sizes": "96x96",
      "purpose": "maskable"
    },
    {
      "src": "icons/favicon-512-padding.png",
      "type": "image/png",
      "sizes": "512x512",
      "purpose": "maskable"
    }
  ],
  "categories": ["news"],
  "display": "standalone",
  "background_color": "#22303d",
  "theme_color": "#22303d",
  "description": "FreshRSS is a self-hosted RSS feed aggregator."
}
	:root{
	--color-background-hover: #22303d;
	--color-background-light-darker: #282828;
	--color-background-light: #1f1f1f;
	--color-background-nav-darker: #2d3e4f;
	--color-background-nav: #22303d;
	--color-background-stared: #565140;
	--color-background-unread: #282828;
	--color-border-light-darker: #3a3a3a;
	--color-border-light: #4e4e4e;
	--color-text-dark: #fcfcfc;
	--color-text-nav: #6ab7ff;
	--frss-background-color: #1f1f1f;
	--frss-font-color-dark: #fcfcfc;
	}

	input,
	select,
	textarea {
	color: var(--color-text-dark);
	}

	.alert-warn,
	.alert-success,
	.alert-error,
	.flux.not_read:not(.active) {
	background: var(--color-background-unread);
	}

	.flux:not(.active):hover,
	.flux.not_read:not(.active):hover {
	color: var(--color-text-dark);
	}

	/* Change unread counts backgrounds + borders and fix alignement */
	.aside_feed .category .title:not([data-unread="0"])::after {
	border: 1px solid var(--color-background-nav-darker);
	margin: 0.35rem 0 0 0;
	}
	.aside_feed .category.active .title:not([data-unread="0"])::after {
	background-color: var(--color-background-nav);
	border: 1px solid var(--frss-border-color);
	}
	.aside_feed .feed .item-title:not([data-unread="0"])::after {
	margin: 0.35rem 0 0 0;
	}
	.aside_feed .feed:not(.active) .item-title:not([data-unread="0"])::after {
	border: 1px solid var(--color-background-nav-darker);
	}
	<?php
	/** @var FreshRSS_View $this */
	FreshRSS::preLayout();
	?>
	<!DOCTYPE html>
	<html lang="<?= FreshRSS_Context::$user_conf->language ?>" xml:lang="<?= FreshRSS_Context::$user_conf->language ?>"<?php
	if (_t('gen.dir') === 'rtl') {
	echo ' dir="rtl" class="rtl"';
	}
	?>>
	<head>
	<meta charset="UTF-8" />
	<meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover" />
	<?= FreshRSS_View::headStyle() ?>
	<script id="jsonVars" type="application/json">
	<?php $this->renderHelper('javascript_vars'); ?>
	</script>
	<?= FreshRSS_View::headScript() ?>
	<link rel="manifest" href="<?= Minz_Url::display('/themes/manifest.json') ?>" />
	<link rel="shortcut icon" id="favicon" type="image/x-icon" sizes="16x16 64x64" href="<?= Minz_Url::display('/favicon.ico') ?>" />
	<link rel="icon msapplication-TileImage apple-touch-icon" type="image/png" sizes="256x256" href="<?= Minz_Url::display('/themes/icons/favicon-256.png') ?>" />
	<link rel="apple-touch-icon" href="<?= Minz_Url::display('/themes/icons/apple-touch-icon.png') ?>" />
	<meta name="apple-mobile-web-app-capable" content="yes" />
	<meta name="apple-mobile-web-app-status-bar-style" content="black" />
	<meta name="apple-mobile-web-app-title" content="<?= FreshRSS_Context::$system_conf->title ?>">
	<meta name="msapplication-TileColor" content="#22303d" />
	<meta name="theme-color" content="#22303d" />
	<?php if (!FreshRSS_Context::$system_conf->allow_referrer) { ?>
	<meta name="referrer" content="never" />
	<?php } ?>
	<?= FreshRSS_View::headTitle() ?>
	<?php
	$url_base = Minz_Request::currentRequest();
	if ($this->rss_title != '') {
	$url_rss = $url_base;
	$url_rss['a'] = 'rss';
	unset($url_rss['params']['rid']);
	if (FreshRSS_Context::$user_conf->since_hours_posts_per_rss) {
	$url_rss['params']['hours'] = FreshRSS_Context::$user_conf->since_hours_posts_per_rss;
	}
	?>
	<link rel="alternate" type="application/rss+xml" title="<?= $this->rss_title ?>" href="<?= Minz_Url::display($url_rss) ?>" />
	<?php } if (FreshRSS_Context::isAll() \|\| FreshRSS_Context::isCategory() \|\| FreshRSS_Context::isFeed()) {
	$opml_rss = $url_base;
	$opml_rss['a'] = 'opml';
	unset($opml_rss['params']['rid']);
	?>
	<link rel="outline" type="text/x-opml" title="OPML" href="<?= Minz_Url::display($opml_rss) ?>" />
	<?php } if (FreshRSS_Context::$system_conf->allow_robots) { ?>
	<meta name="description" content="<?= htmlspecialchars(FreshRSS_Context::$name . ' \| ' . FreshRSS_Context::$description, ENT_COMPAT, 'UTF-8') ?>" />
	<?php } else { ?>
	<meta name="robots" content="noindex,nofollow" />
	<?php } ?>
	</head>
	<body class="<?= Minz_Request::actionName() ?><?= (FreshRSS_Context::$user_conf->darkMode === 'no') ? '' : ' darkMode_' . FreshRSS_Context::$user_conf->darkMode ?>">
	<?php
	if (!Minz_Request::param('ajax')) {
	flush();
	$this->partial('header');
	}
	?>

	<div id="global">
	<?php
	flush();
	if (isset($this->callbackBeforeFeeds)) {
	call_user_func($this->callbackBeforeFeeds, $this);
	}
	$this->render();
	?>
	</div>

	<?php
	$msg = '';
	$status = 'closed';
	if (!empty($this->notification)) {
	$msg = $this->notification['content'];
	$status = $this->notification['type'];

	invalidateHttpCache();
	}
	?>
	<div id="notification" class="notification <?= $status ?>">
	<span class="msg"><?= $msg ?></span>
	<a class="close" href=""><?= _i('close') ?></a>
	</div>
	</body>
	</html>
	{
	"name": "FreshRSS",
	"short_name": "FreshRSS",
	"start_url": "../i/",
	"scope": "../",
	"icons": [
	{
	"src": "icons/favicon.svg",
	"type": "image/svg+xml",
	"sizes": "150x150",
	"purpose": "any"
	},
	{
	"src": "icons/favicon-96-padding.png",
	"type": "image/png",
	"sizes": "96x96",
	"purpose": "maskable"
	},
	{
	"src": "icons/favicon-512-padding.png",
	"type": "image/png",
	"sizes": "512x512",
	"purpose": "maskable"
	}
	],
	"categories": ["news"],
	"display": "standalone",
	"background_color": "#22303d",
	"theme_color": "#22303d",
	"description": "FreshRSS is a self-hosted RSS feed aggregator."
	}