mirror of
https://github.com/TitanEmbeds/Titan.git
synced 2024-11-15 02:21:21 +01:00
69 lines
2.6 KiB
Django/Jinja
69 lines
2.6 KiB
Django/Jinja
{% extends 'site_layout.html.j2' %}
|
|
{% if new %}
|
|
{% set title="New - User CSS" %}
|
|
{% else %}
|
|
{% set title="Editing " + css.name + " - User CSS" %}
|
|
{% endif %}
|
|
|
|
{% block content %}
|
|
<h1>{% if new %}New{% else %}Editing {{ css.name }}{% endif %} - User Defined CSS</h1>
|
|
<p><strong>Note:</strong> This feature is only used for CSS. Any attempts to enter HTML or malicious CSS code
|
|
will have CSS cosmetic privilages removed, if caught. Please don't, we check the databases often. Thanks!</p>
|
|
|
|
{% if not new %}
|
|
<div class="card-panel indigo lighten-5 z-depth-3 hoverable black-text">
|
|
<div class="row">
|
|
<div class="col s12">
|
|
<p class="flow-text">Using your custom CSS</p>
|
|
<p><strong>This user defined CSS has a unique ID of <em style="font-size: 130%;">{{ css.id }}</em>.</strong></p>
|
|
<p>To use this CSS in the embed, you must apped a <code>?css={{ css.id }}</code> to the embed URL.</p>
|
|
<p>Something like this will work:</p>
|
|
<input readonly value="https://titanembeds.tk/embed/1234567890987654321?css={{ css.id }}" id="disabled" type="text" onClick="this.setSelectionRange(48, this.value.length)">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endif %}
|
|
|
|
<div class="card-panel indigo lighten-5 z-depth-3 hoverable black-text">
|
|
<div class="row">
|
|
<div class="col s12">
|
|
<p class="flow-text">Give your CSS a name</p>
|
|
<input placeholder="Some Lit CSS" id="css_name" type="text" {% if not new %}value="{{ css.name }}"{% endif %}>
|
|
<label for="css_name">Name</label>
|
|
</div>
|
|
<div class="col s12">
|
|
<p class="flow-text">Edit your CSS code here</p>
|
|
<div style="position: relative; height: 40vh;">
|
|
<div id="css_editor">{% if new %}/* Enter your CSS code here! */{% else %}{{ css.css }}{% endif %}</div>
|
|
</div>
|
|
<br>
|
|
</div>
|
|
<div class="col s12">
|
|
<a id="submit-btn" class="waves-effect waves-light btn">Submit</a>
|
|
{% if not new %}<a id="delete-btn" class="waves-effect waves-light btn red">Delete</a>{% endif %}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
{% endblock %}
|
|
|
|
{% block script %}
|
|
<script src="//cdnjs.cloudflare.com/ajax/libs/ace/1.2.6/ace.js" integrity="sha256-xrr4HH5eSY+cFz4SH7ja/LaAi9qcEdjMpeMP49/iOLs=" crossorigin="anonymous"></script>
|
|
<script>
|
|
const newCSS = {% if new %}true{% else %}false{% endif %};
|
|
</script>
|
|
<script type="text/javascript" src="{{ url_for('static', filename='js/usercss.js') }}"></script>
|
|
{% endblock %}
|
|
|
|
|
|
{% block additional_head_elements %}
|
|
<style>
|
|
#css_editor {
|
|
position: absolute;
|
|
top: 0;
|
|
right: 0;
|
|
bottom: 0;
|
|
left: 0;
|
|
}
|
|
</style>
|
|
{% endblock %} |