reintroduce bitty and add progressive enhancement and tabs
This commit is contained in:
@@ -73,10 +73,10 @@
|
||||
{%- endmacro %}
|
||||
|
||||
{% macro tabs(prefix='', labels = []) -%}
|
||||
<div class="tab-container">
|
||||
<div class="tab-container" data-r="setTab">
|
||||
<div class="tab-bar" role="tablist">
|
||||
{%- for tab_label in labels -%}
|
||||
<button type="button" class="tab-button" role="tab" aria-selected="{{'true' if loop.index0==0 else 'false'}}" id="{{prefix+'-'+(tab_label | lower)+'-tab'}}" aria-controls="{{prefix+'-'+(tab_label | lower)+'-content'}}" disabled>{{tab_label}}</button>
|
||||
<button type="button" class="tab-button" role="tab" aria-selected="{{'true' if loop.index0==0 else 'false'}}" id="{{prefix+'-'+(tab_label | lower)+'-tab'}}" aria-controls="{{prefix+'-'+(tab_label | lower)+'-content'}}" disabled data-r="enhance" data-s="setTab" data-tab-index="{{loop.index0}}">{{tab_label}}</button>
|
||||
{%- endfor -%}
|
||||
</div>
|
||||
{%- for tab_label in labels -%}
|
||||
@@ -97,16 +97,16 @@
|
||||
{%- call(idx) tabs(prefix='babycode', labels=['Write', 'Preview']) -%}
|
||||
{%- if idx == 0 -%}
|
||||
<span class="babycode-editor-controls">
|
||||
<span class="button-row">
|
||||
<button type="button" class="minimal" disabled><b>B</b></button>
|
||||
<button type="button" class="minimal" disabled><i>i</i></button>
|
||||
<button type="button" class="minimal" disabled><s>S</s></button>
|
||||
<button type="button" class="minimal" disabled><u>U</u></button>
|
||||
<button type="button" class="minimal" disabled><code>://</code></button>
|
||||
<button type="button" class="minimal" disabled><code></></code></button>
|
||||
<button type="button" class="minimal" disabled>1.</button>
|
||||
<button type="button" class="minimal" disabled>•</button>
|
||||
<button type="button" class="minimal" disabled><img src="/static/emoji/angry.png" class="emoji"></button>
|
||||
<span class="button-row js-only" data-r="enhance">
|
||||
<button type="button" class="minimal" data-babycode-tag="b" data-s="insertBabycode"><b>B</b></button>
|
||||
<button type="button" class="minimal" data-babycode-tag="i" data-s="insertBabycode"><i>i</i></button>
|
||||
<button type="button" class="minimal" data-babycode-tag="s" data-s="insertBabycode"><s>S</s></button>
|
||||
<button type="button" class="minimal" data-babycode-tag="u" data-s="insertBabycode"><u>U</u></button>
|
||||
<button type="button" class="minimal" data-babycode-tag="url" data-s="insertBabycode"><code>://</code></button>
|
||||
<button type="button" class="minimal" data-babycode-tag="code" data-s="insertBabycode"><code></></code></button>
|
||||
<button type="button" class="minimal" data-babycode-tag="ol" data-s="insertBabycode">1.</button>
|
||||
<button type="button" class="minimal" data-babycode-tag="ul" data-s="insertBabycode">•</button>
|
||||
<button type="button" class="minimal"><img src="/static/emoji/angry.png" class="emoji"></button>
|
||||
</span>
|
||||
<span class="flex-last">{# stub: char count #}</span>
|
||||
</span>
|
||||
@@ -183,12 +183,12 @@
|
||||
<a class="linkbutton" href="{{url_for('posts.edit', post_id=post.id, _anchor='babycode-content')}}">Edit</a>
|
||||
{%- endif -%}
|
||||
{%- if can_reply -%}
|
||||
<button disabled title="This feature requires JavaScript to be enabled.">Quote</button>
|
||||
<button data-r="enhance" disabled title="This feature requires JavaScript to be enabled.">Quote</button>
|
||||
{%- endif -%}
|
||||
{%- if can_delete -%}
|
||||
<a class="linkbutton critical" href="{{url_for('posts.delete', post_id=post.id)}}">Delete</a>
|
||||
{%- endif -%}
|
||||
<button disabled title="This feature requires JavaScript to be enabled.">{{icn_bookmark(24)}}Bookmark…</button>
|
||||
<button data-r="enhance" disabled title="This feature requires JavaScript to be enabled.">{{icn_bookmark(24)}}Bookmark…</button>
|
||||
</span>
|
||||
{%- endif -%}
|
||||
</div>
|
||||
@@ -213,10 +213,10 @@
|
||||
{% set reactors_str = reactors_str + '\n...and many others' %}
|
||||
{% endif %}
|
||||
{% set has_reacted = get_active_user() is not none and get_active_user().username in reactors %}
|
||||
<button type="button" disabled title="{{reactors_str}}" class="minimal {{'alt' if has_reacted else ''}}"><img src="/static/emoji/{{reaction.reaction_text}}.png">{{reaction.c}}</button>
|
||||
<button data-r="enhance" type="button" disabled title="{{reactors_str}}" class="minimal {{'alt' if has_reacted else ''}}"><img src="/static/emoji/{{reaction.reaction_text}}.png">{{reaction.c}}</button>
|
||||
{%- endfor -%}
|
||||
</span>
|
||||
{%- if is_logged_in() and allow_reacting -%}<button disabled title="This feature requires JavaScript to be enabled.">Add reaction</button>{%- endif -%}
|
||||
{%- if is_logged_in() and allow_reacting -%}<button data-r="enhance" disabled title="This feature requires JavaScript to be enabled.">Add reaction</button>{%- endif -%}
|
||||
{%- elif is_editing -%}
|
||||
<input type="submit" value="Save">
|
||||
<a href="{{get_post_url(post.id, _anchor=true)}}" class="linkbutton warn">Cancel</a>
|
||||
|
||||
Reference in New Issue
Block a user