Problem/Motivation

The forum are using classes that are not following the css standards.

Proposed resolution

* Remove all use of id's
* Remove hidden markup inside the module - make theme files if nessesary
* rename all classes so its clear they belong to the forum
* remove unused css classes, that are left there from back in the days

Remaining tasks

User interface changes

API changes

CommentFileSizeAuthor
forum.diff6.89 KBmortendk
Support from Acquia helps fund testing for Drupal Acquia logo

Comments

mortendk’s picture

Issue summary: View changes
mortendk’s picture

mortendk’s picture

Issue tags: +csslint
mortendk’s picture

Status: Active » Needs review
+++ b/core/modules/forum/css/forum.module.css
@@ -3,19 +3,22 @@
+#forum td.pager,

check if #forum is still needed - pager is afaik now in pager.html.twig ?

Status: Needs review » Needs work

The last submitted patch, forum.diff, failed testing.

LewisNyman’s picture

Component: CSS » forum.module
Issue tags: +CSS

Old classes:
I've added comments next to them for my suggestions for new CSS classes:

#forum .description // .forum__description (Could be less vague. What is this describing?)
#forum td.created, // .forum__created
#forum td.posts, // .forum__posts
#forum td.topics, // .forum__created-date (??)
#forum td.last-reply, // .forum__last-reply
#forum td.replies, // .forum__replies
#forum td.pager // .forum__pager
#forum .icon // .forum__icon
#forum .title // .forum__title (Is this a post title?)
#forum div.indent // .forum__indent (Maybe we can replace this with .indentation from system.module.css?
#forum .topic-status-new // .forum__topic-status--new
#forum .topic-status-hot // .forum__topic-status--hot
#forum .topic-status-hot-new // .forum__topic-status--hot.forum__topic-status--new
#forum .topic-status-sticky // .forum__topic-status--sticky
#forum .topic-status-closed // .forum__topic-status--closed 

What do you think? Maybe some of the classes could be better once we look closely at their purpose.

Also:

[dir="rtl"] .forum-topic-navigation {
  padding: 1em 3em 0 0;
}
[dir="rtl"] .syst .topic-previous {
  text-align: left;
  float: right;
}
[dir="rtl"] .forum-topic-navigation .topic-next {
  text-align: right;
  float: left;
}

Why do we have rtl styling when there is no ltr styling?

LewisNyman’s picture

Status: Needs work » Closed (duplicate)