MDL-67786 core_contentbank: Templates and theme CSS
[moodle.git] / contentbank / templates / bankcontent.mustache
1 {{!
2     This file is part of Moodle - http://moodle.org/
4     Moodle is free software: you can redistribute it and/or modify
5     it under the terms of the GNU General Public License as published by
6     the Free Software Foundation, either version 3 of the License, or
7     (at your option) any later version.
9     Moodle is distributed in the hope that it will be useful,
10     but WITHOUT ANY WARRANTY; without even the implied warranty of
11     MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
12     GNU General Public License for more details.
14     You should have received a copy of the GNU General Public License
15     along with Moodle.  If not, see <http://www.gnu.org/licenses/>.
16 }}
17 {{!
18     @template core_contentbank/list
20     Example context (json):
21     {
22         "contents": [
23             {
24                 "name": "accordion.h5p",
25                 "link": "http://something/contentbank/contenttype/h5p/view.php?url=http://something/pluginfile.php/1/contentbank/public/accordion.h5p",
26                 "icon" : "<img class='icon iconsize-big' alt='accordion.h5p' aria-hidden='true' src='http://something/theme/image.php/boost/core/1581597850/f/h5p-64'>"
27             },
28             {
29                 "name": "resume.pdf",
30                 "icon": "<img class='icon iconsize-big' alt='resume.pdf' aria-hidden='true' src='http://something/theme/image.php/boost/core/1584597850/f/pdf-64'>"
31             }
32         ],
33         "tools": [
34             {
35                 "name": "Upload",
36                 "link": "http://something/contentbank/contenttype/h5p/view.php?url=http://something/pluginfile.php/1/contentbank/public/accordion.h5p",
37                 "icon" : "i/upload"
38             },
39             {
40                 "icon": "i/export"
41             }
42         ]
43     }
45 }}
46 {{>core_contentbank/toolbar}}
47 <div class="content-bank-container card">
48     <div class="content-bank">
49         <div class="cb-navbar">
50             {{#pix}} i/folder {{/pix}}
51         </div>
52         <div class="cb-content-wrapper">
53         {{#contents}}
54             <div class="cb-content">
55                 <div class="cb-iconview">
56                     <div class="cb-file text-center position-relative">
57                         {{#link}}<a href="{{{ link }}}">{{/link}}
58                             <div style="position:relative;">
59                                 <div class="cb-thumbnail text-center d-block" style="width: 110px; height: 110px;">
60                                     {{{ icon }}}
61                                 </div>
62                             </div>
63                             <div class="cb-contentname-field position-absolute overflow-visible">
64                                 <div class="cb-contentname text-truncate" style="width: 112px;">{{{ name }}}</div>
65                             </div>
66                         {{#link}}</a>{{/link}}
67                     </div>
68                 </div>
69             </div>
70         {{/contents}}
71         </div>
72     </div>
73 </div>