AS1024
/
Kanboard-Prod
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Replace accordion Javascript component by <details> HTML element

This commit is contained in:
Frédéric Guillot 2019-02-19 14:45:01 -08:00
parent 1b6f98604a
commit 23417da763
14 changed files with 36 additions and 82 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
app/Template/project_overview/activity.php
View File

@ -1,8 +1,6 @@
<section class="accordion-section <?= empty($events) ? 'accordion-collapsed' : '' ?>">
<div class="accordion-title">
<h3><a href="#" class="fa accordion-toggle"></a> <?= t('Last activity') ?></h3>
</div>
<details class="accordion-section" <?= empty($events) ? '' : 'open' ?>>
<summary class="accordion-title"><?= t('Last activity') ?></summary>
<div class="accordion-content">
<?= $this->render('event/events', array('events' => $events)) ?>
</div>
</section>
</details>

8
app/Template/project_overview/attachments.php
View File

@ -1,7 +1,5 @@
<section class="accordion-section <?= empty($files) && empty($images) ? 'accordion-collapsed' : '' ?>">
<div class="accordion-title">
<h3><a href="#" class="fa accordion-toggle"></a> <?= t('Attachments') ?></h3>
</div>
<details class="accordion-section" <?= empty($files) && empty($images) ? '' : 'open' ?>>
<summary class="accordion-title"><?= t('Attachments') ?></summary>
<div class="accordion-content">
<?php if ($this->user->hasProjectAccess('ProjectFileController', 'create', $project['id'])): ?>
<div class="buttons-header">
@ -12,4 +10,4 @@
<?= $this->render('project_overview/images', array('project' => $project, 'images' => $images)) ?>
<?= $this->render('project_overview/files', array('project' => $project, 'files' => $files)) ?>
</div>
</section>
</details>

8
app/Template/project_overview/description.php
View File

@ -1,7 +1,5 @@
<section class="accordion-section <?= empty($project['description']) ? 'accordion-collapsed' : '' ?>">
<div class="accordion-title">
<h3><a href="#" class="fa accordion-toggle"></a> <?= t('Description') ?></h3>
</div>
<details class="accordion-section" <?= empty($project['description']) ? '' : 'open' ?>>
<summary class="accordion-title"><?= t('Description') ?></summary>
<div class="accordion-content">
<?php if ($this->user->hasProjectAccess('ProjectEditController', 'show', $project['id'])): ?>
<div class="buttons-header">
@ -12,4 +10,4 @@
<?= $this->text->markdown($project['description']) ?>
</article>
</div>
</section>
</details>

8
app/Template/project_overview/information.php
View File

@ -1,7 +1,5 @@
<section class="accordion-section">
<div class="accordion-title">
<h3><a href="#" class="fa accordion-toggle"></a> <?= t('Information') ?></h3>
</div>
<details class="accordion-section" open>
<summary class="accordion-title"><?= t('Information') ?></summary>
<div class="accordion-content">
<div class="panel">
<ul>
@ -36,4 +34,4 @@
</ul>
</div>
</div>
</section>
</details>

8
app/Template/subtask/show.php
View File

@ -1,7 +1,5 @@
<section class="accordion-section <?= empty($subtasks) ? 'accordion-collapsed' : '' ?>">
<div class="accordion-title">
<h3><a href="#" class="fa accordion-toggle"></a> <?= t('Sub-Tasks') ?></h3>
</div>
<details class="accordion-section" <?= empty($subtasks) ? '' : 'open' ?>>
<summary class="accordion-title"><?= t('Sub-Tasks') ?></summary>
<div class="accordion-content">
<?= $this->render('subtask/table', array(
'subtasks' => $subtasks,
@ -9,4 +7,4 @@
'editable' => $editable
)) ?>
</div>
</section>
</details>

8
app/Template/task/description.php
View File

@ -1,10 +1,8 @@
<section class="accordion-section <?= empty($task['description']) ? 'accordion-collapsed' : '' ?>">
<div class="accordion-title">
<h3><a href="#" class="fa accordion-toggle"></a> <?= t('Description') ?></h3>
</div>
<details class="accordion-section" <?= empty($task['description']) ? '' : 'open' ?>>
<summary class="accordion-title"><?= t('Description') ?></summary>
<div class="accordion-content">
<article class="markdown">
<?= $this->text->markdown($task['description'], isset($is_public) && $is_public) ?>
</article>
</div>
</section>
</details>

8
app/Template/task_comments/show.php
View File

@ -1,7 +1,5 @@
<section class="accordion-section <?= empty($comments) ? 'accordion-collapsed' : '' ?>">
<div class="accordion-title">
<h3><a href="#" class="fa accordion-toggle"></a> <?= t('Comments') ?></h3>
</div>
<details class="accordion-section" <?= empty($comments) ? '' : 'open' ?>>
<summary class="accordion-title"><?= t('Comments') ?></summary>
<div class="accordion-content comments" id="comments">
<?php if (!isset($is_public) || !$is_public): ?>
<div class="comment-sorting">
@ -35,4 +33,4 @@
)) ?>
<?php endif ?>
</div>
</section>
</details>

8
app/Template/task_external_link/show.php
View File

@ -1,7 +1,5 @@
<section class="accordion-section <?= empty($links) ? 'accordion-collapsed' : '' ?>">
<div class="accordion-title">
<h3><a href="#" class="fa accordion-toggle"></a> <?= t('External links') ?></h3>
</div>
<details class="accordion-section" <?= empty($links) ? '' : 'open' ?>>
<summary class="accordion-title"><?= t('External links') ?></summary>
<div class="accordion-content">
<?= $this->render('task_external_link/table', array(
'links' => $links,
@ -9,4 +7,4 @@
'project' => $project,
)) ?>
</div>
</section>
</details>

8
app/Template/task_file/show.php
View File

@ -1,9 +1,7 @@
<section class="accordion-section <?= empty($files) && empty($images) ? 'accordion-collapsed' : '' ?>">
<div class="accordion-title">
<h3><a href="#" class="fa accordion-toggle"></a> <?= t('Attachments') ?></h3>
</div>
<details class="accordion-section" <?= empty($files) && empty($images) ? '' : 'open' ?>>
<summary class="accordion-title"><?= t('Attachments') ?></summary>
<div class="accordion-content">
<?= $this->render('task_file/images', array('task' => $task, 'images' => $images)) ?>
<?= $this->render('task_file/files', array('task' => $task, 'files' => $files)) ?>
</div>
</section>
</details>

8
app/Template/task_internal_link/show.php
View File

@ -1,7 +1,5 @@
<section class="accordion-section <?= empty($links) ? 'accordion-collapsed' : '' ?>">
<div class="accordion-title">
<h3><a href="#" class="fa accordion-toggle"></a> <?= t('Internal links') ?></h3>
</div>
<details class="accordion-section" <?= empty($links) ? '' : 'open' ?>>
<summary class="accordion-title"><?= t('Internal links') ?></summary>
<div class="accordion-content">
<?= $this->render('task_internal_link/table', array(
'links' => $links,
@ -11,4 +9,4 @@
'is_public' => $is_public,
)) ?>
</div>
</section>
</details>

2
assets/css/app.min.css vendored
View File

File diff suppressed because one or more lines are too long

4
assets/js/app.min.js vendored
View File

File diff suppressed because one or more lines are too long

7
assets/js/components/accordion.js
View File

@ -1,7 +0,0 @@
KB.onClick('.accordion-toggle', function (e) {
var sectionElement = KB.dom(e.target).parent('.accordion-section');
if (sectionElement) {
KB.dom(sectionElement).toggleClass('accordion-collapsed');
}
});

25
assets/sass/_accordion.sass
View File

@ -1,29 +1,10 @@
@import variables
.accordion-title
background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAADCAYAAABS3WWCAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYwIDYxLjEzNDc3NywgMjAxMC8wMi8xMi0xNzozMjowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNSBNYWNpbnRvc2giIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6NEQ5RDgxQzc2RjQ5MTFFMjhEMUNENzFGRUMwRjhBRTciIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NEQ5RDgxQzg2RjQ5MTFFMjhEMUNENzFGRUMwRjhBRTciPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo0RDlEODFDNTZGNDkxMUUyOEQxQ0Q3MUZFQzBGOEFFNyIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDo0RDlEODFDNjZGNDkxMUUyOEQxQ0Q3MUZFQzBGOEFFNyIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PvXFWFAAAAAYSURBVHjaYvj//z8D0/Pnz/8zgFgAAQYAS5UJscReGMIAAAAASUVORK5CYII=) repeat-x scroll 0 10px
h3
display: inline
padding-right: 5px
background: #fff
font-size: size('medium')
cursor: pointer
margin-top: 10px
.accordion-content
margin-top: 15px
margin-bottom: 25px
.accordion-toggle
color: color('primary')
text-decoration: none
&:focus
color: color('primary')
&:hover
color: color('light')
&:before
content: "\f0d7"
.accordion-collapsed
margin-bottom: 25px
.accordion-toggle:before
content: "\f0da"
.accordion-content
display: none