[% site_config.title = c.loc('Panel Branding') -%]

<div class="ngcp-separator"></div>

<span>
    <a href="[% c.uri_for('/back') %]" class="btn btn-primary btn-large"><i class="icon-arrow-left"></i> [% c.loc('Back') %]</a>
    [% back_created = 1 -%]
    [% UNLESS c.user.read_only -%]
        <a href="[% c.uri_for_action('/reseller/edit_branding_css', c.req.captures) %]" class="btn btn-large btn-primary"><i class="icon-edit"></i> [% c.loc('Edit Branding') %]</a>
        [% IF branding.logo -%]
            <a href="[% c.uri_for_action('/reseller/delete_branding_logo', c.req.captures) %]" class="btn btn-large btn-primary"><i class="icon-trash"></i> [% c.loc('Delete Logo') %]</a>
        [% END -%]
    [% END -%]
</span>

<div class="row">
    [% FOREACH m IN messages -%]
        <div class="alert alert-[% m.type %]">[% m.text %]</div>
    [% END -%]
    [% IF reseller.first.status != "active" -%]
        <div class="alert">[% c.loc('Reseller is <b>[_1]</b>', reseller.first.status) %]</div>
    [% END -%]
    [% messages = [] -%]
</div>

[% IF branding.defined -%]
    [% IF branding.logo.defined -%]
        <h3>[% c.loc('Custom Logo') %]</h3>
        <img src="[% c.uri_for_action('/reseller/get_branding_logo', c.req.captures) %]">
        <p>
            [% c.loc("You can use the logo by adding the following CSS to the Custom CSS below:") %]
<pre>
#header .brand {
    background: url([% c.uri_for_action('/reseller/get_branding_logo', c.req.captures) %]) no-repeat 0 0;
    background-size: 280px 32px;
}
</pre>
        </p>
    [% ELSE -%]
        [% c.loc('No logo uploaded') %]
    [% END -%]

    <h3>[% c.loc('Custom CSS') %]</h3>
    <p>
    <pre style="color:#000">
[% branding.css %]
    </pre>
    </p>
    <h3>[% c.loc('CSC Primary Color: ') %]
    <div class="color-box" style="background-color: [% branding.csc_color_primary %]">
        &nbsp;
    </div>
    <div style="display: inline-block;">[% branding.csc_color_primary %]</div>
    </h3>
    <h3>[% c.loc('CSC Secondary Color: ') %]
    <div class="color-box" style="background-color: [% branding.csc_color_secondary %]">
        &nbsp;
    </div>
    <div style="display: inline-block;">[% branding.csc_color_secondary %]</div>
    </h3>
[% ELSE -%]
  [% c.loc('No branding specified, using standard branding.') %]
[% END -%]

[% IF branding_edit_flag == 1 -%]
[%
    IF form.has_for_js;
        form.render_repeatable_js;
    END;
    PROCESS "helpers/modal.tt";
    modal_header(m.edit_flag = branding_edit_flag,
                 m.name = "Reseller Branding");
    branding_form.render;
    modal_footer();
    modal_script(m.close_target = close_target);
-%]
<script type="text/javascript" src="/js/spectrum.min.js"></script>
<link rel="stylesheet" type="text/css" href="/css/spectrum.min.css" />
<script>
    $(document).ready(function() {
        $('.ngcp-csc-color-primary').spectrum({
          type: "component",
          showInput: true
        });
        $('.ngcp-csc-color-secondary').spectrum({
          type: "component",
          showInput: true
        });
    });
</script>
[% END -%]

[% # vim: set tabstop=4 syntax=html expandtab: -%]
