Skip to content

E
edx-platform
Commit 994afbb6 by Peter Fogg
Options

[safe templates] Common components.

parent cbbda52a
Showing with 26 additions and 27 deletions
common/static/common/templates/components/paginated-view.underscore
<div class="sr-is-focusable sr-<%= type %>-view" tabindex="-1"></div>
<div class="<%= type %>-paging-header"></div>
<ul class="<%= type %>-list cards-list"></ul>
<div class="<%= type %>-paging-footer"></div>
<div class="sr-is-focusable sr-<%- type %>-view" tabindex="-1"></div>
<div class="<%- type %>-paging-header"></div>
<ul class="<%- type %>-list cards-list"></ul>
<div class="<%- type %>-paging-footer"></div>
common/static/common/templates/components/paging-footer.underscore
<nav class="pagination pagination-full bottom" aria-label="<%= paginationLabel %>">
<div class="nav-item previous"><button class="nav-link previous-page-link"><span class="icon fa fa-angle-left" aria-hidden="true"></span> <span class="nav-label"><%= gettext("Previous") %></span></button></div>
<nav class="pagination pagination-full bottom" aria-label="<%- paginationLabel %>">
<div class="nav-item previous"><button class="nav-link previous-page-link"><span class="icon fa fa-angle-left" aria-hidden="true"></span> <span class="nav-label"><%- gettext("Previous") %></span></button></div>
<div class="nav-item page">
<div class="pagination-form">
<label class="page-number-label" for="page-number-input"><%= interpolate(
gettext("Page number out of %(total_pages)s"),
{total_pages: total_pages},
true
<label class="page-number-label" for="page-number-input"><%- StringUtils.interpolate(
gettext("Page number out of {total_pages}"),
{total_pages: total_pages}
)%></label>
<input id="page-number-input" class="page-number-input" name="page-number" type="text" size="4" autocomplete="off" aria-describedby="page-number-input-helper"/>
<span class="sr field-helper" id="page-number-input-helper"><%= gettext("Enter the page number you'd like to quickly navigate to.") %></span>
<span class="sr field-helper" id="page-number-input-helper"><%- gettext("Enter the page number you'd like to quickly navigate to.") %></span>
</div>
<span class="current-page"><%= current_page %></span>
<span class="current-page"><%- current_page %></span>
<span class="sr">&nbsp;out of&nbsp;</span>
<span class="page-divider" aria-hidden="true">/</span>
<span class="total-pages"><%= total_pages %></span>
<span class="total-pages"><%- total_pages %></span>
</div>
<div class="nav-item next"><button class="nav-link next-page-link"><span class="nav-label"><%= gettext("Next") %></span> <span class="icon fa fa-angle-right" aria-hidden="true"></span></button></div>
<div class="nav-item next"><button class="nav-link next-page-link"><span class="nav-label"><%- gettext("Next") %></span> <span class="icon fa fa-angle-right" aria-hidden="true"></span></button></div>
</nav>
common/static/common/templates/components/system-feedback.underscore
<div class="wrapper wrapper-<%= type %> wrapper-<%= type %>-<%= intent %>
<div class="wrapper wrapper-<%- type %> wrapper-<%- type %>-<%- intent %>
<% if(obj.shown) { %>is-shown<% } else { %>is-hiding<% } %>
<% if(_.contains(['help', 'mini'], intent)) { %>wrapper-<%= type %>-status<% } %>"
id="<%= type %>-<%= intent %>"
<% if(_.contains(['help', 'mini'], intent)) { %>wrapper-<%- type %>-status<% } %>"
id="<%- type %>-<%- intent %>"
aria-hidden="<% if(obj.shown) { %>false<% } else { %>true<% } %>"
aria-labelledby="<%= type %>-<%= intent %>-title"
aria-labelledby="<%- type %>-<%- intent %>-title"
tabindex="-1"
<% if (obj.message) { %>aria-describedby="<%= type %>-<%= intent %>-description" <% } %>
<% if (obj.message) { %>aria-describedby="<%- type %>-<%- intent %>-description" <% } %>
<% if (obj.actions) { %>role="dialog"<% } %>
>
<div class="<%= type %> <%= intent %> <% if(obj.actions) { %>has-actions<% } %>">
<div class="<%- type %> <%- intent %> <% if(obj.actions) { %>has-actions<% } %>">
<% if(obj.icon) { %>
<% var iconClass = {"warning": "warning", "confirmation": "check", "error": "warning", "announcement": "bullhorn", "step-required": "exclamation-circle", "help": "question", "mini": "cog"} %>
<span class="feedback-symbol fa fa-<%= iconClass[intent] %>" aria-hidden="true"></span>
<span class="feedback-symbol fa fa-<%- iconClass[intent] %>" aria-hidden="true"></span>
<% } %>
<div class="copy">
<h2 class="title title-3" id="<%= type %>-<%= intent %>-title"><%- title %></h2>
<% if(obj.message) { %><p class="message" id="<%= type %>-<%= intent %>-description"><%- message %></p><% } %>
<h2 class="title title-3" id="<%- type %>-<%- intent %>-title"><%- title %></h2>
<% if(obj.message) { %><p class="message" id="<%- type %>-<%- intent %>-description"><%- message %></p><% } %>
</div>
<% if(obj.actions) { %>
......@@ -24,13 +24,13 @@
<ul>
<% if(actions.primary) { %>
<li class="nav-item">
<button class="action-primary <%= actions.primary.class %>"><%- actions.primary.text %></button>
<button class="action-primary <%- actions.primary.class %>"><%- actions.primary.text %></button>
</li>
<% } %>
<% if(actions.secondary) {
_.each(actions.secondary, function(secondary) { %>
<li class="nav-item">
<button class="action-secondary <%= secondary.class %>"><%- secondary.text %></button>
<button class="action-secondary <%- secondary.class %>"><%- secondary.text %></button>
</li>
<% });
} %>
......@@ -39,9 +39,9 @@
<% } %>
<% if(obj.closeIcon) { %>
<a href="#" rel="view" class="action action-close action-<%= type %>-close">
<a href="#" rel="view" class="action action-close action-<%- type %>-close">
<span class="icon fa fa-times-circle" aria-hidden="true"></span>
<span class="label">close <%= type %></span>
<span class="label">close <%- type %></span>
</a>
<% } %>
</div>
......
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