Commit 1cdef090 authored by alexpott's avatar alexpott

Issue #2408513 by MathieuSpil, Manjit.Singh, Vidushi Mehta, svendecabooter,...

Issue #2408513 by MathieuSpil, Manjit.Singh, Vidushi Mehta, svendecabooter, LewisNyman, emma.maria: Refactor forum module CSS files inline with our CSS standards
parent e7b1e4e0
......@@ -3,19 +3,14 @@
* Styling for the Forum module.
*/
#forum .description {
.forum__description {
font-size: 0.9em;
margin: 0.5em;
}
#forum td.created,
#forum td.posts,
#forum td.topics,
#forum td.last-reply,
#forum td.replies,
#forum td.pager {
.forum td {
white-space: nowrap;
}
#forum .icon{
.forum__icon {
background-image: url(../icons/forum-icons.png);
background-repeat: no-repeat;
float: left; /* LTR */
......@@ -23,48 +18,32 @@
margin: 0 9px 0 0; /* LTR */
width: 24px;
}
[dir="rtl"] #forum .icon {
[dir="rtl"] .forum__icon {
float: right;
margin: 0 0 0 9px;
}
#forum .title {
.forum__title {
overflow: hidden;
}
#forum div.indent {
.forum .indented {
margin-left: 20px; /* LTR */
}
[dir="rtl"] #forum div.indent {
[dir="rtl"] .forum .indented {
margin-left: 0;
margin-right: 20px;
}
#forum .topic-status-new {
.forum__topic-status--new {
background-position: -24px 0;
}
#forum .topic-status-hot {
.forum__topic-status--hot {
background-position: -48px 0;
}
#forum .topic-status-hot-new {
.forum__topic-status--hot-new {
background-position: -72px 0;
}
#forum .topic-status-sticky {
.forum__topic-status--sticky {
background-position: -96px 0;
}
#forum .topic-status-closed {
.forum__topic-status--closed {
background-position: -120px 0;
}
[dir="rtl"] .forum-topic-navigation {
padding: 1em 3em 0 0;
}
[dir="rtl"] .forum-topic-navigation .topic-previous {
text-align: left;
float: right;
}
[dir="rtl"] .forum-topic-navigation .topic-next {
text-align: right;
float: left;
}
.action--forum {
list-style: none;
}
......@@ -487,10 +487,10 @@ function template_preprocess_forums(&$variables) {
'data' => array(
$topic->icon,
array(
'#markup' => '<div class="title"><div>' . $topic->title_link . '</div><div>' . $topic->submitted . '</div></div>',
'#markup' => '<div class="forum__title"><div>' . $topic->title_link . '</div><div>' . $topic->submitted . '</div></div>',
),
),
'class' => array('topic'),
'class' => array('forum__topic'),
);
if ($topic->moved) {
......@@ -507,11 +507,11 @@ function template_preprocess_forums(&$variables) {
$row[] = array(
'data' => $topic->comment_count . $new_replies,
'class' => array('replies'),
'class' => array('forum__replies'),
);
$row[] = array(
'data' => $topic->last_reply,
'class' => array('last-reply'),
'class' => array('forum__last-reply'),
);
}
$table['#rows'][] = $row;
......
......@@ -260,7 +260,7 @@ protected function buildActionLinks($vid, TermInterface $forum_term = NULL) {
foreach ($this->fieldMap['node']['taxonomy_forums']['bundles'] as $type) {
if ($this->nodeAccess->createAccess($type)) {
$links[$type] = [
'#attributes' => ['class' => ['action--forum']],
'#attributes' => ['class' => ['action-links']],
'#theme' => 'menu_local_action',
'#link' => [
'title' => $this->t('Add new @node_type', [
......@@ -286,7 +286,7 @@ protected function buildActionLinks($vid, TermInterface $forum_term = NULL) {
// Anonymous user does not have access to create new topics.
else {
$links['login'] = [
'#attributes' => ['class' => ['action--forum']],
'#attributes' => ['class' => ['action-links']],
'#theme' => 'menu_local_action',
'#link' => array(
'title' => $this->t('Log in to post new content in the forum.'),
......
......@@ -193,7 +193,7 @@ function testForum() {
$forum_arg = array(':forum' => 'forum-list-' . $this->forum['tid']);
// Topics cell contains number of topics and number of unread topics.
$xpath = $this->buildXPathQuery('//tr[@id=:forum]//td[@class="topics"]', $forum_arg);
$xpath = $this->buildXPathQuery('//tr[@id=:forum]//td[@class="forum__topics"]', $forum_arg);
$topics = $this->xpath($xpath);
$topics = trim($topics[0]);
$this->assertEqual($topics, '6', 'Number of topics found.');
......@@ -201,14 +201,14 @@ function testForum() {
// Verify the number of unread topics.
$unread_topics = $this->container->get('forum_manager')->unreadTopics($this->forum['tid'], $this->editAnyTopicsUser->id());
$unread_topics = \Drupal::translation()->formatPlural($unread_topics, '1 new post', '@count new posts');
$xpath = $this->buildXPathQuery('//tr[@id=:forum]//td[@class="topics"]//a', $forum_arg);
$xpath = $this->buildXPathQuery('//tr[@id=:forum]//td[@class="forum__topics"]//a', $forum_arg);
$this->assertFieldByXPath($xpath, $unread_topics, 'Number of unread topics found.');
// Verify that the forum name is in the unread topics text.
$xpath = $this->buildXPathQuery('//tr[@id=:forum]//em[@class="placeholder"]', $forum_arg);
$this->assertFieldByXpath($xpath, $this->forum['name'], 'Forum name found in unread topics text.');
// Verify total number of posts in forum.
$xpath = $this->buildXPathQuery('//tr[@id=:forum]//td[@class="posts"]', $forum_arg);
$xpath = $this->buildXPathQuery('//tr[@id=:forum]//td[@class="forum__posts"]', $forum_arg);
$this->assertFieldByXPath($xpath, '6', 'Number of posts found.');
// Test loading multiple forum nodes on the front page.
......
#forum .name {
.forum__name {
font-size: 1.083em;
}
#forum .description {
.forum__description {
font-size: 1em;
}
......@@ -18,8 +18,8 @@
#}
{%
set classes = [
'icon',
'topic-status-' ~ icon_status,
'forum__icon',
'forum__topic-status--' ~ icon_status,
]
%}
<div{{ attributes.addClass(classes) }}>
......
......@@ -45,33 +45,33 @@
<td {% if forum.is_container == true -%}
colspan="4" class="container"
{%- else -%}
class="forum"
class="forum-list__forum"
{%- endif -%}>
{#
Enclose the contents of this cell with X divs, where X is the
depth this forum resides at. This will allow us to use CSS
left-margin for indenting.
#}
{% for i in 1..forum.depth if forum.depth > 0 %}<div class="indent">{% endfor %}
<div class="icon forum-status-{{ forum.icon_class }}" title="{{ forum.icon_title }}">
{% for i in 1..forum.depth if forum.depth > 0 %}<div class="indented">{% endfor %}
<div class="forum__icon forum-status-{{ forum.icon_class }}" title="{{ forum.icon_title }}">
<span class="visually-hidden">{{ forum.icon_title }}</span>
</div>
<div class="name"><a href="{{ forum.link }}">{{ forum.label }}</a></div>
{% if forum.description.value %}
<div class="description">{{ forum.description.value }}</div>
<div class="forum__description">{{ forum.description.value }}</div>
{% endif %}
{% for i in 1..forum.depth if forum.depth > 0 %}</div>{% endfor %}
</td>
{% if forum.is_container == false %}
<td class="topics">
<td class="forum__topics">
{{ forum.num_topics }}
{% if forum.new_topics == true %}
<br />
<a href="{{ forum.new_url }}">{{ forum.new_text }}</a>
{% endif %}
</td>
<td class="posts">{{ forum.num_posts }}</td>
<td class="last-reply">{{ forum.last_reply }}</td>
<td class="forum__posts">{{ forum.num_posts }}</td>
<td class="forum__last-reply">{{ forum.last_reply }}</td>
{% endif %}
</tr>
{% endfor %}
......
......@@ -15,7 +15,7 @@
*/
#}
{% if forums_defined %}
<div id="forum">
<div class="forum">
{{ forums }}
{{ topics }}
{{ topics_pager }}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment