mirror/php-flarum
1
0
Fork 0
mirror of https://github.com/flarum/core.git synced 2025-08-29 11:00:12 +02:00
Code Issues Releases Wiki Activity

fix: TagTiles contrast

Browse Source
This commit is contained in:
protoclown
2022-09-25 21:11:43 +02:00
parent 3de6afada3
commit acae7f776b
2 changed files with 21 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
extensions/tags/js/src/forum/components/TagsPage.js
View File

@@ -4,6 +4,7 @@ import Link from 'flarum/common/components/Link';
import LoadingIndicator from 'flarum/common/components/LoadingIndicator';
import listItems from 'flarum/common/helpers/listItems';
import humanTime from 'flarum/common/helpers/humanTime';
import getContrast from 'flarum/common/utils/getContrast';
import tagIcon from '../../common/helpers/tagIcon';
import tagLabel from '../../common/helpers/tagLabel';
@@ -58,7 +59,7 @@ export default class TagsPage extends Page {
const children = sortTags(tag.children() || []);
return (
<li className={'TagTile ' + (tag.color() ? 'colored' : '')} style={{ '--tag-bg': tag.color() }}>
<li className={'TagTile ' + (tag.color() ? 'colored ' : '') + (getContrast(tag.color()) >= 128 ? 'tag-light' : 'tag-dark')} style={{ '--tag-bg': tag.color() }}>
<Link className="TagTile-info" href={app.route.tag(tag)}>
{tag.icon() && tagIcon(tag, {}, { useColor: false })}
<h3 className="TagTile-name">{tag.name()}</h3>

21
extensions/tags/less/forum/TagTiles.less
View File

@@ -63,8 +63,25 @@
color: @control-color;
}
&.colored {
&, a {
color: @body-bg;
&.tag-light {
&, a {
color: @text-color;
}
& when (@config-dark-mode = true) {
&, a {
color: @body-bg;
}
}
}
&.tag-dark {
&, a {
color: @body-bg;
}
& when (@config-dark-mode = true) {
&, a {
color: @text-color;
}
}
}
}
}