diff options
| author | 2025-10-28 19:09:29 +0100 | |
|---|---|---|
| committer | 2025-10-28 19:09:29 +0100 | |
| commit | 53c1562cc096e21b471993bd38bf9b10012ea433 (patch) | |
| tree | 2f179c2fd89f9957dd426334dd3141b48eaeb91b /app | |
| parent | 49a92c2437d3be9fba8c6af2d3f328ae525d81c6 (diff) | |
Improve theme slider (#8152)
Ref https://github.com/FreshRSS/FreshRSS/pull/8149
Ref https://github.com/FreshRSS/FreshRSS/issues/6577
Before
<img width="969" height="582" alt="grafik" src="https://github.com/user-attachments/assets/5e1e5e9a-31de-4327-a639-6327d602cf8a" />
After
Buttons as navigation elements. Not it is crystal clear that the themes can be changed.
The theme counter is a bit more prominent to show the big amount of shipped themes.
<img width="1041" height="575" alt="grafik" src="https://github.com/user-attachments/assets/b498e74f-1284-40ad-b871-41ce238a49ff" />
Diffstat (limited to 'app')
| -rw-r--r-- | app/views/configure/display.phtml | 111 |
1 files changed, 57 insertions, 54 deletions
diff --git a/app/views/configure/display.phtml b/app/views/configure/display.phtml index 8efc13266..57f6b0abf 100644 --- a/app/views/configure/display.phtml +++ b/app/views/configure/display.phtml @@ -43,64 +43,67 @@ <div class="form-group"> <label class="group-name" for="theme"><?= _t('conf.display.theme') ?></label> <div class="group-controls"> - <ul class="theme-preview-list"> - <?php $slides = count($this->themes); $i = 1; $themeAvailable = false; ?> - <?php - foreach ($this->themes as $theme) { ?> - <?php if (FreshRSS_Context::userConf()->theme === $theme['id']) { - $checked = 'checked="checked"'; - $themeAvailable = true; - } else { - $checked = ''; - } ?> - <input type="radio" name="theme" id="img-<?= $i ?>" <?= $checked ?> value="<?= $theme['id'] ?>" /> - <li class="preview-container"> - <div class="preview"> - <img src="<?= Minz_Url::display('/themes/' . $theme['id'] . '/thumbs/original.png') ?>" loading="lazy" /> - </div> - <div class="nav"> - <?php if ($i !== 1) {?> - <label for="img-<?= $i - 1 ?>" class="prev">‹</label> - <?php } ?> - <?php if ($i !== $slides) {?> - <label for="img-<?= $i + 1 ?>" class="next">›</label> - <?php } ?> - </div> - <div class="properties"> - <div> - <?php if (!empty($theme['deprecated'])) { ?> - <span class="deprecated error"><?= _t('conf.display.theme.deprecated') ?>:</span> + <div class="theme-preview-list-wrapper"> + <ul class="theme-preview-list"> + <?php $slides = count($this->themes); $i = 1; $themeAvailable = false; ?> + <?php + foreach ($this->themes as $theme) { ?> + <?php if (FreshRSS_Context::userConf()->theme === $theme['id']) { + $checked = 'checked="checked"'; + $themeAvailable = true; + } else { + $checked = ''; + } ?> + <input type="radio" name="theme" id="img-<?= $i ?>" <?= $checked ?> value="<?= $theme['id'] ?>" /> + <li class="preview-container"> + <div class="preview"> + <img src="<?= Minz_Url::display('/themes/' . $theme['id'] . '/thumbs/original.png') ?>" loading="lazy" /> + </div> + <div class="nav"> + <?php if ($i !== 1) {?> + <label for="img-<?= $i - 1 ?>" class="btn prev"><?= _i('prev') ?></label> + <?php } ?> + <?php if ($i !== $slides) {?> + <label for="img-<?= $i + 1 ?>" class="btn next"><?= _i('next') ?></label> <?php } ?> - <?= sprintf('%s — %s %s', $theme['name'], _t('gen.short.by_author'), $theme['author']) ?> </div> - <div> - <?php if (!empty($theme['deprecated'])) { ?> - <span class="deprecated"><?= _t('conf.display.theme.deprecated.description') ?></span><br /> + <div class="properties"> + <div> + <?php if (!empty($theme['deprecated'])) { ?> + <span class="deprecated error"><?= _t('conf.display.theme.deprecated') ?>:</span> + <?php } ?> + <?= sprintf('%s — %s %s', $theme['name'], _t('gen.short.by_author'), $theme['author']) ?> + </div> + <div> + <?php if (!empty($theme['deprecated'])) { ?> + <span class="deprecated"><?= _t('conf.display.theme.deprecated.description') ?></span><br /> + <?php } ?> + <?= $theme['description'] ?> + </div> + <?php if (!empty($theme['theme-color']['dark'])) { ?> + <div class="darkMode">✔ <?= _t('conf.display.darkMode') ?></div> <?php } ?> - <?= $theme['description'] ?> + + </div> + <div class="page-number">( <?= sprintf('%d/%d', $i, $slides) ?> )</div> + </li> + <?php $i++ ?> + <?php } ?> + <?php if (!$themeAvailable) {?> + <input type="radio" name="theme" checked="checked" value="Origine" /> + <li class="preview-container"> + <div class="preview"> + </div> + <div class="nav"> + <label for="img-<?= $i - 1 ?>" class="prev"><?= _i('prev') ?></label> + </div> + <div class="properties alert-error"> + <div><?= _t('conf.display.theme_not_available', FreshRSS_Context::userConf()->theme)?></div> </div> - <?php if (!empty($theme['theme-color']['dark'])) { ?> - <div class="darkMode">✔ <?= _t('conf.display.darkMode') ?></div> - <?php } ?> - <div class="page-number"><?= sprintf('%d/%d', $i, $slides) ?></div> - </div> - </li> - <?php $i++ ?> - <?php } ?> - <?php if (!$themeAvailable) {?> - <input type="radio" name="theme" checked="checked" value="Origine" /> - <li class="preview-container"> - <div class="preview"> - </div> - <div class="nav"> - <label for="img-<?= $i - 1 ?>" class="prev">‹</label> - </div> - <div class="properties alert-error"> - <div><?= _t('conf.display.theme_not_available', FreshRSS_Context::userConf()->theme)?></div> - </div> - </li> - <?php }?> - </ul> + </li> + <?php }?> + </ul> + </div> </div> </div> |
