summaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
Diffstat
-rw-r--r--template/admin/html/auth.php20
-rw-r--r--template/admin/html/database.php12
-rw-r--r--template/admin/html/page/form.php60
-rw-r--r--template/admin/html/post/form.php60
-rw-r--r--template/admin/html/user/form.php72
-rw-r--r--template/admin/rsrc/main.css60
-rw-r--r--template/admin/rsrc/main.js135
7 files changed, 205 insertions, 214 deletions
diff --git a/template/admin/html/auth.php b/template/admin/html/auth.php
index 0ab2d90..f5852c1 100644
--- a/template/admin/html/auth.php
+++ b/template/admin/html/auth.php
@@ -10,21 +10,21 @@
<form action="" method="POST">
<input type="hidden" name="token" value="<?=Application::getSecurityToken()?>" />
- <section class="flex">
- <section>
+ <div class="flex">
+ <div class="flex-item">
<div class="form-icon-flex"><i class="fa fa-user-secret"></i></div>
<div class="form-label-flex"><label for="form_username"><?=$Language->template('label_username')?></label></div>
<div class="form-field-flex"><input id="form_username" name="username" value="<?=escapeHTML($FORM['DATA']['USERNAME'])?>" /></div>
- </section>
- </section>
- <section class="flex">
- <section>
+ </div>
+ </div>
+ <div class="flex">
+ <div class="flex-item">
<div class="form-icon-flex"><i class="fa fa-key"></i></div>
<div class="form-label-flex"><label for="form_password"><?=$Language->template('label_password')?></label></div>
<div class="form-field-flex"><input type="password" id="form_password" name="password" /></div>
- </section>
- </section>
- <section class="flex flex-padding background">
+ </div>
+ </div>
+ <div class="flex flex-padding background">
<input type="submit" name="auth" value="Auth" />
- </section>
+ </div>
</form> \ No newline at end of file
diff --git a/template/admin/html/database.php b/template/admin/html/database.php
index 3aad84e..8e69459 100644
--- a/template/admin/html/database.php
+++ b/template/admin/html/database.php
@@ -10,17 +10,17 @@
<form action="" method="POST">
<input type="hidden" name="token" value="<?=$FORM['TOKEN']?>" />
- <section class="flex flex-padding">
+ <div class="flex flex-padding">
<textarea id="content-editor" placeholder="<?=$Language->template('database_warning')?>" name="command"><?=escapeHTML($FORM['COMMAND'])?></textarea>
- </section>
+ </div>
<?php if($FORM['RESULT']): ?>
- <section class="flex flex-padding background flex-direction-column">
+ <div class="flex flex-padding background flex-direction-column">
<pre id="database-result"><?=escapeHTML($FORM['RESULT'])?></pre>
- </section>
+ </div>
<?php endif; ?>
- <section class="flex flex-padding background">
+ <div class="flex flex-padding background">
<input type="submit" name="execute" value="Execute" />
- </section>
+ </div>
</form> \ No newline at end of file
diff --git a/template/admin/html/page/form.php b/template/admin/html/page/form.php
index 4ab61ae..93c45fe 100644
--- a/template/admin/html/page/form.php
+++ b/template/admin/html/page/form.php
@@ -8,13 +8,13 @@
<input type="hidden" name="token" value="<?=$FORM['TOKEN']?>" />
<?php if($FORM['TYPE'] !== 'DELETE'): ?>
- <section class="flex flex-responsive">
- <section>
+ <div class="flex flex-responsive">
+ <div class="flex-item">
<div class="form-icon-flex"><i class="fa fa-database"></i></div>
<div class="form-label-flex"><label for="form_id">ID</label></div>
<div class="form-field-flex"><input<?=($FORM['TYPE'] === 'UPDATE') ? ' disabled="disabled"' : '';?> id="form_id" name="id" type="number" placeholder="[AUTO_INCREMENT]" value="<?=escapeHTML($FORM['DATA']['ID'])?>" /></div>
- </section>
- <section>
+ </div>
+ <div class="flex-item">
<div class="form-icon-flex"><i class="fa fa-user"></i></div>
<div class="form-label-flex"><label for="form_user"><?=$Language->template('label_user')?></label></div>
<div class="form-field-flex">
@@ -24,46 +24,46 @@
<?php endforeach; ?>
</select>
</div>
- </section>
- </section>
- <section class="flex flex-responsive">
- <section>
+ </div>
+ </div>
+ <div class="flex flex-responsive">
+ <div class="flex-item">
<div class="form-icon-flex"><i class="fa fa-file-text-o"></i></div>
<div class="form-label-flex"><label for="form_name"><?=$Language->template('label_name')?></label></div>
<div class="form-field-flex"><input id="form_name" name="name" value="<?=escapeHTML($FORM['DATA']['NAME'])?>" /></div>
- </section>
- <section>
+ </div>
+ <div class="flex-item">
<div class="form-icon-flex"><i class="fa fa-link"></i></div>
<div class="form-label-flex"><label for="form_slug"><?=$Language->template('label_slug')?></label></div>
<div class="form-field-flex"><input id="form_slug" name="slug" value="<?=escapeHTML($FORM['DATA']['SLUG'])?>" /></div>
- </section>
- </section>
- <section class="flex flex-responsive">
- <section>
+ </div>
+ </div>
+ <div class="flex flex-responsive">
+ <div class="flex-item">
<div class="form-icon-flex"><i class="fa fa-clock-o"></i></div>
<div class="form-label-flex"><label for="form_time_insert"><?=$Language->template('label_insert')?></label></div>
<div class="form-field-flex"><input id="form_time_insert" name="time_insert" placeholder="[YYYY-MM-DD HH:II:SS]" value="<?=escapeHTML($FORM['DATA']['TIME_INSERT'])?>" /></div>
- </section>
- <section>
+ </div>
+ <div class="flex-item">
<div class="form-icon-flex"><i class="fa fa-clock-o"></i></div>
<div class="form-label-flex"><label for="form_time_update"><?=$Language->template('label_update')?></label></div>
<div class="form-field-flex"><input id="form_time_update" name="time_update" placeholder="<?=escapeHTML($FORM['DATA']['TIME_UPDATE'] ? $FORM['DATA']['TIME_UPDATE'] : '[CURRENT_TIMESTAMP]')?>" value="" /></div>
- </section>
- </section>
- <section class="flex flex-padding">
+ </div>
+ </div>
+ <div class="flex flex-padding">
<textarea id="content-editor" name="body" placeholder="[…]"><?=escapeHTML($FORM['DATA']['BODY'])?></textarea>
- </section>
- <section class="flex flex-padding background flex-arguments">
+ </div>
+ <div class="flex flex-padding background flex-arguments">
<input id="form_argv" name="argv" maxlength="100" placeholder="[ARGUMENT_FOO=one|ARGUMENT_BAR=two …]" value="<?=escapeHTML($FORM['DATA']['ARGV'])?>" />
- </section>
- <section class="flex flex-padding background flex-emoticons">
+ </div>
+ <div class="flex flex-padding background flex-emoticons">
<ul id="emoticon-list" class="button-list emoticons">
<?php foreach(getEmoticons() as $emoticon => $data):?>
<li data-emoticon="<?=$emoticon?>" title="<?=$data[1]?>"><?=$data[0]?></li>
<?php endforeach; ?>
</ul>
- </section>
- <section class="flex flex-padding background">
+ </div>
+ <div class="flex flex-padding background">
<ul id="markdown-list" class="button-list markdown">
<li data-markdown="bold" class="fa fa-bold" title="<?=$Language->template('markdown_bold')?>"></li>
<li data-markdown="italic" class="fa fa-italic" title="<?=$Language->template('markdown_italic')?>"></li>
@@ -75,14 +75,14 @@
<li data-markdown="list_ul" class="fa fa-list-ul" title="<?=$Language->template('markdown_list_ul')?>"></li>
<li data-markdown="list_ol" class="fa fa-list-ol" title="<?=$Language->template('markdown_list_ol')?>"></li>
</ul>
- </section>
+ </div>
<?php else: ?>
- <section class="flex flex-padding background flex-direction-column">
+ <div class="flex flex-padding background flex-direction-column">
<?=$HTML?>
- </section>
+ </div>
<?php endif; ?>
- <section class="flex flex-padding background">
+ <div class="flex flex-padding background">
<?php if($FORM['TYPE'] === 'INSERT'): ?>
<input type="submit" name="insert" value="<?=$Language->text('insert')?>" />
<?php elseif($FORM['TYPE'] === 'UPDATE'): ?>
@@ -90,5 +90,5 @@
<?php elseif($FORM['TYPE'] === 'DELETE'): ?>
<input type="submit" name="delete" value="<?=$Language->text('delete')?>" id="delete-button" data-text="<?=$Language->template('sure')?>" />
<?php endif; ?>
- </section>
+ </div>
</form> \ No newline at end of file
diff --git a/template/admin/html/post/form.php b/template/admin/html/post/form.php
index 3ad4376..14888aa 100644
--- a/template/admin/html/post/form.php
+++ b/template/admin/html/post/form.php
@@ -8,13 +8,13 @@
<input type="hidden" name="token" value="<?=$FORM['TOKEN']?>" />
<?php if($FORM['TYPE'] !== 'DELETE'): ?>
- <section class="flex flex-responsive">
- <section>
+ <div class="flex flex-responsive">
+ <div class="flex-item">
<div class="form-icon-flex"><i class="fa fa-database"></i></div>
<div class="form-label-flex"><label for="form_id">ID</label></div>
<div class="form-field-flex"><input<?=($FORM['TYPE'] === 'UPDATE') ? ' disabled="disabled"' : '';?> id="form_id" name="id" type="number" placeholder="[AUTO_INCREMENT]" value="<?=escapeHTML($FORM['DATA']['ID'])?>" /></div>
- </section>
- <section>
+ </div>
+ <div class="flex-item">
<div class="form-icon-flex"><i class="fa fa-user"></i></div>
<div class="form-label-flex"><label for="form_user"><?=$Language->template('label_user')?></label></div>
<div class="form-field-flex">
@@ -24,46 +24,46 @@
<?php endforeach; ?>
</select>
</div>
- </section>
- </section>
- <section class="flex flex-responsive">
- <section>
+ </div>
+ </div>
+ <div class="flex flex-responsive">
+ <div class="flex-item">
<div class="form-icon-flex"><i class="fa fa-newspaper-o"></i></div>
<div class="form-label-flex"><label for="form_name"><?=$Language->template('label_name')?></label></div>
<div class="form-field-flex"><input id="form_name" name="name" value="<?=escapeHTML($FORM['DATA']['NAME'])?>" /></div>
- </section>
- <section>
+ </div>
+ <div class="flex-item">
<div class="form-icon-flex"><i class="fa fa-link"></i></div>
<div class="form-label-flex"><label for="form_slug"><?=$Language->template('label_slug')?></label></div>
<div class="form-field-flex"><input id="form_slug" name="slug" value="<?=escapeHTML($FORM['DATA']['SLUG'])?>" /></div>
- </section>
- </section>
- <section class="flex flex-responsive">
- <section>
+ </div>
+ </div>
+ <div class="flex flex-responsive">
+ <div class="flex-item">
<div class="form-icon-flex"><i class="fa fa-clock-o"></i></div>
<div class="form-label-flex"><label for="form_time_insert"><?=$Language->template('label_insert')?></label></div>
<div class="form-field-flex"><input id="form_time_insert" name="time_insert" placeholder="[YYYY-MM-DD HH:II:SS]" value="<?=escapeHTML($FORM['DATA']['TIME_INSERT'])?>" /></div>
- </section>
- <section>
+ </div>
+ <div class="flex-item">
<div class="form-icon-flex"><i class="fa fa-clock-o"></i></div>
<div class="form-label-flex"><label for="form_time_update"><?=$Language->template('label_update')?></label></div>
<div class="form-field-flex"><input id="form_time_update" name="time_update" placeholder="<?=escapeHTML($FORM['DATA']['TIME_UPDATE'] ? $FORM['DATA']['TIME_UPDATE'] : '[CURRENT_TIMESTAMP]')?>" value="" /></div>
- </section>
- </section>
- <section class="flex flex-padding">
+ </div>
+ </div>
+ <div class="flex flex-padding">
<textarea id="content-editor" name="body" placeholder="[…]"><?=escapeHTML($FORM['DATA']['BODY'])?></textarea>
- </section>
- <section class="flex flex-padding background flex-arguments">
+ </div>
+ <div class="flex flex-padding background flex-arguments">
<input id="form_argv" name="argv" maxlength="100" placeholder="[ARGUMENT_FOO=one|ARGUMENT_BAR=two …]" value="<?=escapeHTML($FORM['DATA']['ARGV'])?>" />
- </section>
- <section class="flex flex-padding background flex-emoticons">
+ </div>
+ <div class="flex flex-padding background flex-emoticons">
<ul id="emoticon-list" class="button-list emoticons">
<?php foreach(getEmoticons() as $emoticon => $data):?>
<li data-emoticon="<?=$emoticon?>" title="<?=$data[1]?>"><?=$data[0]?></li>
<?php endforeach; ?>
</ul>
- </section>
- <section class="flex flex-padding background">
+ </div>
+ <div class="flex flex-padding background">
<ul id="markdown-list" class="button-list markdown">
<li data-markdown="bold" class="fa fa-bold" title="<?=$Language->template('markdown_bold')?>"></li>
<li data-markdown="italic" class="fa fa-italic" title="<?=$Language->template('markdown_italic')?>"></li>
@@ -75,14 +75,14 @@
<li data-markdown="list_ul" class="fa fa-list-ul" title="<?=$Language->template('markdown_list_ul')?>"></li>
<li data-markdown="list_ol" class="fa fa-list-ol" title="<?=$Language->template('markdown_list_ol')?>"></li>
</ul>
- </section>
+ </div>
<?php else: ?>
- <section class="flex flex-padding background flex-direction-column">
+ <div class="flex flex-padding background flex-direction-column">
<?=$HTML?>
- </section>
+ </div>
<?php endif; ?>
- <section class="flex flex-padding background">
+ <div class="flex flex-padding background">
<?php if($FORM['TYPE'] === 'INSERT'): ?>
<input type="submit" name="insert" value="<?=$Language->text('insert')?>" />
<?php elseif($FORM['TYPE'] === 'UPDATE'): ?>
@@ -90,5 +90,5 @@
<?php elseif($FORM['TYPE'] === 'DELETE'): ?>
<input type="submit" name="delete" value="<?=$Language->text('delete')?>" id="delete-button" data-text="<?=$Language->template('sure')?>" />
<?php endif; ?>
- </section>
+ </div>
</form> \ No newline at end of file
diff --git a/template/admin/html/user/form.php b/template/admin/html/user/form.php
index be8502c..a260ee0 100644
--- a/template/admin/html/user/form.php
+++ b/template/admin/html/user/form.php
@@ -8,68 +8,68 @@
<input type="hidden" name="token" value="<?=$FORM['TOKEN']?>" />
<?php if($FORM['TYPE'] !== 'DELETE'): ?>
- <section class="flex flex-responsive">
- <section>
+ <div class="flex flex-responsive">
+ <div class="flex-item">
<div class="form-icon-flex"><i class="fa fa-database"></i></div>
<div class="form-label-flex"><label for="form_id">ID</label></div>
<div class="form-field-flex"><input<?=($FORM['TYPE'] === 'UPDATE') ? ' disabled="disabled"' : '';?> id="form_id" name="id" type="number" placeholder="[AUTO_INCREMENT]" value="<?=escapeHTML($FORM['DATA']['ID'])?>" /></div>
- </section>
- <section>
+ </div>
+ <div class="flex-item">
<div class="form-icon-flex"><i class="fa fa-key"></i></div>
<div class="form-label-flex"><label for="form_password"><?=$Language->template('label_password')?></label></div>
<div class="form-field-flex"><input id="form_password" name="password" placeholder="[NO CHANGE]" value="<?=escapeHTML($FORM['DATA']['PASSWORD'])?>" type="password" /></div>
- </section>
- </section>
- <section class="flex flex-responsive">
- <section>
+ </div>
+ </div>
+ <div class="flex flex-responsive">
+ <div class="flex-item">
<div class="form-icon-flex"><i class="fa fa-user"></i></div>
<div class="form-label-flex"><label for="form_fullname"><?=$Language->template('label_fullname')?></label></div>
<div class="form-field-flex"><input id="form_fullname" name="fullname" value="<?=escapeHTML($FORM['DATA']['FULLNAME'])?>" /></div>
- </section>
- <section>
+ </div>
+ <div class="flex-item">
<div class="form-icon-flex"><i class="fa fa-envelope-o"></i></div>
<div class="form-label-flex"><label for="form_mailaddr"><?=$Language->template('label_mailaddr')?></label></div>
<div class="form-field-flex"><input id="form_mailaddr" name="mailaddr" value="<?=escapeHTML($FORM['DATA']['MAILADDR'])?>" /></div>
- </section>
- </section>
- <section class="flex flex-responsive">
- <section>
+ </div>
+ </div>
+ <div class="flex flex-responsive">
+ <div class="flex-item">
<div class="form-icon-flex"><i class="fa fa-user-secret"></i></div>
<div class="form-label-flex"><label for="form_username"><?=$Language->template('label_username')?></label></div>
<div class="form-field-flex"><input id="form_username" name="username" value="<?=escapeHTML($FORM['DATA']['USERNAME'])?>" /></div>
- </section>
- <section>
+ </div>
+ <div class="flex-item">
<div class="form-icon-flex"><i class="fa fa-link"></i></div>
<div class="form-label-flex"><label for="form_slug"><?=$Language->template('label_slug')?></label></div>
<div class="form-field-flex"><input id="form_slug" name="slug" value="<?=escapeHTML($FORM['DATA']['SLUG'])?>" /></div>
- </section>
- </section>
- <section class="flex flex-responsive">
- <section>
+ </div>
+ </div>
+ <div class="flex flex-responsive">
+ <div class="flex-item">
<div class="form-icon-flex"><i class="fa fa-clock-o"></i></div>
<div class="form-label-flex"><label for="form_time_insert"><?=$Language->template('label_insert')?></label></div>
<div class="form-field-flex"><input id="form_time_insert" name="time_insert" placeholder="[YYYY-MM-DD HH:II:SS]" value="<?=escapeHTML($FORM['DATA']['TIME_INSERT'])?>" /></div>
- </section>
- <section>
+ </div>
+ <div class="flex-item">
<div class="form-icon-flex"><i class="fa fa-clock-o"></i></div>
<div class="form-label-flex"><label for="form_time_update"><?=$Language->template('label_update')?></label></div>
<div class="form-field-flex"><input id="form_time_update" name="time_update" placeholder="<?=escapeHTML($FORM['DATA']['TIME_UPDATE'] ? $FORM['DATA']['TIME_UPDATE'] : '[CURRENT_TIMESTAMP]')?>" value="" /></div>
- </section>
- </section>
- <section class="flex flex-padding">
+ </div>
+ </div>
+ <div class="flex flex-padding">
<textarea id="content-editor" name="body" placeholder="[…]"><?=escapeHTML($FORM['DATA']['BODY'])?></textarea>
- </section>
- <section class="flex flex-padding background flex-arguments">
+ </div>
+ <div class="flex flex-padding background flex-arguments">
<input id="form_argv" name="argv" maxlength="100" placeholder="[ARGUMENT_FOO=one|ARGUMENT_BAR=two …]" value="<?=escapeHTML($FORM['DATA']['ARGV'])?>" />
- </section>
- <section class="flex flex-padding background flex-emoticons">
+ </div>
+ <div class="flex flex-padding background flex-emoticons">
<ul id="emoticon-list" class="button-list emoticons">
<?php foreach(getEmoticons() as $emoticon => $data):?>
<li data-emoticon="<?=$emoticon?>" title="<?=$data[1]?>"><?=$data[0]?></li>
<?php endforeach; ?>
</ul>
- </section>
- <section class="flex flex-padding background">
+ </div>
+ <div class="flex flex-padding background">
<ul id="markdown-list" class="button-list markdown">
<li data-markdown="bold" class="fa fa-bold" title="<?=$Language->template('markdown_bold')?>"></li>
<li data-markdown="italic" class="fa fa-italic" title="<?=$Language->template('markdown_italic')?>"></li>
@@ -81,14 +81,14 @@
<li data-markdown="list_ul" class="fa fa-list-ul" title="<?=$Language->template('markdown_list_ul')?>"></li>
<li data-markdown="list_ol" class="fa fa-list-ol" title="<?=$Language->template('markdown_list_ol')?>"></li>
</ul>
- </section>
+ </div>
<?php else: ?>
- <section class="flex flex-padding background flex-direction-column">
+ <div class="flex flex-padding background flex-direction-column">
<?=$HTML?>
- </section>
+ </div>
<?php endif; ?>
- <section class="flex flex-padding background">
+ <div class="flex flex-padding background">
<?php if($FORM['TYPE'] === 'INSERT'): ?>
<input type="submit" name="insert" value="<?=$Language->text('insert')?>" />
<?php elseif($FORM['TYPE'] === 'UPDATE'): ?>
@@ -96,5 +96,5 @@
<?php elseif($FORM['TYPE'] === 'DELETE'): ?>
<input type="submit" name="delete" value="<?=$Language->text('delete')?>" id="delete-button" data-text="<?=$Language->template('sure')?>" />
<?php endif; ?>
- </section>
+ </div>
</form> \ No newline at end of file
diff --git a/template/admin/rsrc/main.css b/template/admin/rsrc/main.css
index aa13b22..ed79989 100644
--- a/template/admin/rsrc/main.css
+++ b/template/admin/rsrc/main.css
@@ -31,8 +31,8 @@ h5{font-size:0.55rem;}h6{font-size:0.50rem;}
/* Document
/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
html,body{margin:0;padding:0;}
-main{padding:1rem;}
-html{font-size:1.25rem;color:#333;background:url(background.png) fixed center #CCC;-webkit-hyphens:auto;hyphens:auto;}
+main{padding:0.75rem;}
+html{font-size:1.25rem;color:#333;background:url("background.png") fixed center #CCC;-webkit-hyphens:auto;hyphens:auto;}
body{font-family:Ruda,sans-serif;font-size:0.7rem;line-height:1.2rem;}
/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
@@ -54,9 +54,9 @@ body{font-family:Ruda,sans-serif;font-size:0.7rem;line-height:1.2rem;}
#header-desc{font-size:0.6rem;font-weight:700;line-height:1rem;}
#header-desc span{color:#CCC;}
#header-logo{display:block;max-height:5rem;float:left;margin-right:0.5rem;}
-.header-line{padding:0.5rem 1rem;overflow:hidden;}
+.header-line{padding:0.5rem 0.75rem;overflow:hidden;}
.header-line:first-child{background:#5E819F;position:sticky;top:0;}
-.header-line:last-child{background:#EEE;border:0.05rem solid #AAA;border-left:none;border-right:none;padding:0.25rem 1rem;}
+.header-line:last-child{background:#EEE;border:0.05rem solid #AAA;border-left:none;border-right:none;padding:0.25rem 0.75rem;}
/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
/* Footer
@@ -85,11 +85,9 @@ body{font-family:Ruda,sans-serif;font-size:0.7rem;line-height:1.2rem;}
#site-navi{clear:both;display:flex;box-sizing:border-box;justify-content:space-between;}
#site-navi > div{display:flex;align-items:center;border:0.05rem solid #AAA;background:#EEE;}
#site-navi > div > a{display:block;}
-#site-navi > section{display:flex;overflow:hidden;align-items:center;}
-#site-navi > section > div{border:0.05rem solid #AAA;background:#EEE;}
#site-navi .disabled{pointer-events:none;color:#AAA;}
-#site-navi .active a{background:#CCC !important;font-weight:600;pointer-events: none;}
+#site-navi .active a{background:#CCC !important;font-weight:600;pointer-events:none;}
#site-navi ol{list-style:none;margin:0;padding:0;}
#site-navi li{float:left;display:inline-block;}
@@ -111,13 +109,10 @@ img{border:none;max-width:100%;}
#database-result{color:inherit;}
/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
-/* Table elements
+/* Tables
/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
-table{width:100%;margin:0 0 1rem;}td{vertical-align:middle;}
-table,td{border-spacing:0;border-collapse:collapse;padding:0.5rem;border:0.05rem solid #000;}
-thead,tr:nth-child(even){background:#EEE;}
-thead > tr, th{font-weight:700;font-style:italic;}
-thead > tr > td, th > td{text-align:center;}
+table{width:100%;margin-bottom:1rem;}td{vertical-align:middle;}
+table,td{padding:0.5rem;border:0.05rem solid #AAA;}
/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
/* Brackets
@@ -138,8 +133,8 @@ a.brackets:before,a.brackets:after{color:#222;}
.item-list-li{display:block;border:0.05rem solid #AAA;margin-bottom:1rem;clear:both;}
.item-list-li > header,
.item-list-li > footer{background:#EEE;overflow:hidden;}
-.item-list-li > blockquote{margin:0;padding:1rem;font-family:inherit;}
-.item-list-li > header{padding:0.5rem 1rem;border-bottom:0.05rem solid #AAA;position:sticky;top:0;}
+.item-list-li > blockquote{margin:0;padding:0.75rem;font-family:inherit;}
+.item-list-li > header{padding:0.5rem 0.75rem;border-bottom:0.05rem solid #AAA;position:sticky;top:0;}
.item-list-li > footer{border-top:0.05rem solid #AAA;}
.item-list-li > footer > ul{margin:0;padding:0;list-style:none;}
.item-list-li > footer > ul > li{display:inline-block;float:left;}
@@ -152,7 +147,7 @@ a.brackets:before,a.brackets:after{color:#222;}
/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
/* Argument list
/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
-.arguments{list-style:none;margin:0;padding:0.25rem 1rem;background:#EEE;font-size:0.6rem;text-align:center;border-top:0.05rem solid #AAA;}
+.arguments{list-style:none;margin:0;padding:0.25rem 0.75rem;background:#EEE;font-size:0.6rem;text-align:center;border-top:0.05rem solid #AAA;}
.arguments > li{display:inline;}
.arguments > li:before{content:"[";font-weight:700;margin-right:0.1rem;}
.arguments > li:after{content:"]";font-weight:700;margin-left:0.1rem;}
@@ -163,19 +158,18 @@ a.brackets:before,a.brackets:after{color:#222;}
form{border:0.05rem solid #AAA;}
.flex{display:flex;width:100%;justify-content:center;overflow:hidden;box-sizing:border-box;}
-.flex + section{border-top:0.05rem solid #AAA;}
-.flex > section {display:flex;box-sizing:padding-box;width:100%;}
-.flex > section{border-right:0.05rem solid #AAA;}
-.flex > section:last-child{border-right:none;}
-.flex > section > div{display:flex;align-items:center;padding:0.5rem;box-sizing:border-box;}
-.flex > section > div + div{border-left:0.05rem solid #AAA;}
-.flex.flex-responsive > section{width:50%;}
+.flex + .flex{border-top:0.05rem solid #AAA;}
+.flex > .flex-item {display:flex;box-sizing:padding-box;width:100%;}
+.flex > .flex-item{border-right:0.05rem solid #AAA;}
+.flex > .flex-item:last-child{border-right:none;}
+.flex > .flex-item > div{display:flex;align-items:center;padding:0.5rem;box-sizing:border-box;}
+.flex > .flex-item > div + div{border-left:0.05rem solid #AAA;}
+.flex.flex-responsive > .flex-item{width:50%;}
.form-icon-flex{background:#DDD;width:10%;justify-content:center;}
.form-label-flex{background:#DDD;width:30%;border-left:none !important;}
.form-field-flex{width:60%;}
-.fa + label{margin-left:0.25rem;}
.background{background:#DDD;}
.flex-padding{padding:0.5rem;}
.flex-direction-column{flex-direction:column;}
@@ -193,7 +187,7 @@ form{border:0.05rem solid #AAA;}
/* Form elements
/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
input,select,textarea{width:100%;box-sizing:padding-box;background:#EEE;color:#404040;font-family:inherit;font-size:0.7rem;padding:0.25rem;border:0.05rem solid #AAA;}
-textarea{font-family:Kadwa,sans-serif;box-sizing:border-box;display:inline-block;resize:vertical;min-height:15rem;line-height:1.4rem;padding:0.75rem;}
+textarea{font-family:Kadwa,sans-serif;box-sizing:border-box;display:inline-block;resize:vertical;min-height:15rem;line-height:1.3rem;padding:0.5rem;-webkit-hyphens:none;hyphens:none;}
input[type="submit"]{text-transform:uppercase;}
input:disabled{background:#DDD;color:#888;}
input:disabled:hover{cursor:not-allowed;}
@@ -208,33 +202,25 @@ label:after{content:":";}
/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
/* FontAwesome Icons
/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
-.fa-rss:before{content:"\f09e"}
.fa-bug:before{content:"\f188"}
.fa-key:before{content:"\f084"}
.fa-link:before{content:"\f0c1"}
.fa-bold:before{content:"\f032"}
.fa-code:before{content:"\f121"}
-.fa-bars:before{content:"\f0c9"}
.fa-user:before{content:"\f007"}
-.fa-home:before{content:"\f015"}
-.fa-plus:before{content:"\f067"}
.fa-book:before{content:"\f02d"}
.fa-italic:before{content:"\f033"}
.fa-header:before{content:"\f1dc"}
-.fa-search:before{content:"\f002"}
.fa-trash-o:before{content:"\f014"}
.fa-sign-in:before{content:"\f090"}
.fa-clock-o:before{content:"\f017"}
.fa-list-ul:before{content:"\f0ca"}
.fa-list-ol:before{content:"\f0cb"}
-.fa-smile-o:before{content:"\f118"}
.fa-database:before{content:"\f1c0"}
.fa-sign-out:before{content:"\f08b"}
.fa-dashboard:before{content:"\f0e4"}
.fa-picture-o:before{content:"\f03e"}
.fa-envelope-o:before{content:"\f003"}
-.fa-eyedropper:before{content:"\f1fb"}
-.fa-rss-square:before{content:"\f143"}
.fa-arrow-left:before{content:"\f060"}
.fa-quote-right:before{content:"\f10e"}
.fa-user-secret:before{content:"\f21b"}
@@ -244,8 +230,6 @@ label:after{content:":";}
.fa-external-link:before{content:"\f08e"}
.fa-github-square:before{content:"\f092"}
.fa-pencil-square-o:before{content:"\f044"}
-.fa-question-circle:before{content:"\f059"}
-.fa-pencil-square-o:before{content:"\f044"}
.fa-exclamation-triangle:before{content:"\f071"}
/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
@@ -260,15 +244,15 @@ label:after{content:":";}
/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
@media only screen and (max-width:37.5rem) {
.flex.flex-responsive{display:block;width:auto;}
- .flex.flex-responsive > section {width:100%;}
- .flex.flex-responsive > section + section{border-top:0.05rem solid #AAA;}
+ .flex.flex-responsive > .flex-item {width:100%;}
+ .flex.flex-responsive > .flex-item + .flex-item{border-top:0.05rem solid #AAA;}
#main-navi{font-size:1rem;}
#main-navi li span{display:none;}
#main-navi li .fa{margin-right:0;}
#main-navi a{padding:0.5rem;}
- .flex-emoticons{display:none !important;}
+ .flex-emoticons{display:none;}
}
/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
diff --git a/template/admin/rsrc/main.js b/template/admin/rsrc/main.js
index a93b8be..f6f7884 100644
--- a/template/admin/rsrc/main.js
+++ b/template/admin/rsrc/main.js
@@ -7,10 +7,10 @@ var next = document.getElementById("next-site");
//==============================================================================
// Handle arrow keys and change the location to the desired direction
//==============================================================================
-document.addEventListener("keyup", function(event) {
- if(!event.ctrlKey && !event.shiftKey) {
- (event.keyCode === 37 && prev) && (window.location.href = prev.getAttribute("href"));
- (event.keyCode === 39 && next) && (window.location.href = next.getAttribute("href"));
+document.addEventListener("keyup", function(e) {
+ if(!e.ctrlKey && !e.shiftKey) {
+ (e.keyCode === 37 && prev) && (window.location.href = prev.getAttribute("href"));
+ (e.keyCode === 39 && next) && (window.location.href = next.getAttribute("href"));
}
}, false);
@@ -30,124 +30,131 @@ var markdownTags = {
};
//==============================================================================
+// Timeout function for delayed execution of code
+//==============================================================================
+function delayed(callback) {
+ window.setTimeout(callback, 20);
+}
+
+//==============================================================================
// Set caret position in editor
//==============================================================================
function setCaretPosition(position) {
- window.setTimeout(function() {
- document.getElementById("content-editor").focus();
- document.getElementById("content-editor").setSelectionRange(position, position);
- }, 50);
-
+ document.getElementById("content-editor").setSelectionRange(position, position);
+ document.getElementById("content-editor").focus();
}
//==============================================================================
-// Insert markdown around text in editor
+// Insert emoticon after cursor in editor
//==============================================================================
-function markdownReplace(tagname) {
- var element = document.activeElement;
+function insertEmoticon(target, emoticon) {
+ var selectionStart = target.selectionStart;
+ var selectionEnd = target.selectionEnd;
- if(element.nodeName === 'TEXTAREA') {
- var selectionStart = element.selectionStart;
- var selectionEnd = element.selectionEnd;
+ var content = target.value;
+ target.value = content.slice(0, selectionStart) + emoticon + content.slice(selectionEnd);
- var selectedText = element.value.substring(selectionStart, selectionEnd);
-
- var content = element.value;
- element.value = content.slice(0, selectionStart) + markdownTags[tagname][0] + selectedText + markdownTags[tagname][1] + content.slice(selectionEnd);
-
- setCaretPosition(selectionStart + markdownTags[tagname][0].length + selectedText.length + markdownTags[tagname][1].length);
- }
+ delayed(function() {
+ setCaretPosition(selectionStart + emoticon.length);
+ });
}
//==============================================================================
-// Insert emoticon after cursor in editor
+// Insert markdown around text in editor
//==============================================================================
-function emoticonReplace(emoticon) {
- var element = document.activeElement;
+function insertMarkdown(target, markdown) {
+ var selectionStart = target.selectionStart;
+ var selectionEnd = target.selectionEnd;
- if(element.nodeName === 'TEXTAREA') {
- var selectionStart = element.selectionStart;
- var selectionEnd = element.selectionEnd;
+ var selectedText = target.value.substring(selectionStart, selectionEnd);
- var content = element.value;
- element.value = content.slice(0, selectionStart) + emoticon + content.slice(selectionEnd);
+ var content = target.value;
+ target.value = content.slice(0, selectionStart) + markdownTags[markdown][0] + selectedText + markdownTags[markdown][1] + content.slice(selectionEnd);
- setCaretPosition(selectionStart + emoticon.length);
- }
+ delayed(function() {
+ setCaretPosition(selectionStart + markdownTags[markdown][0].length + selectedText.length + markdownTags[markdown][1].length);
+ });
}
//==============================================================================
// Keep server-side session active if the user is writing a long text
//==============================================================================
-addEventListener("DOMContentLoaded", function() {
- setInterval(function() {
- var Request = new XMLHttpRequest();
- Request.open("HEAD", "", true);
- Request.send();
- }, 300000);
-}, false);
+setInterval(function() {
+ var Request = new XMLHttpRequest();
+ Request.open("HEAD", "", true);
+ Request.send();
+}, 300000);
//==============================================================================
-// Insert tab indent into editor if <tab> is pressed
+// Confirmation message for delete button
//==============================================================================
-addEventListener("DOMContentLoaded", function() {
+if(document.getElementById("delete-button")) {
+ document.getElementById("delete-button").onclick = function(e) {
+ return confirm(e.target.getAttribute('data-text'));
+ };
+}
+
+//==============================================================================
+// Insert or remove tab indent in editor if [<shift>+]<tab> is pressed
+//==============================================================================
+(function() {
if(document.getElementById("content-editor")) {
var element = document.getElementById("content-editor");
element.addEventListener('keydown', function(e) {
- if(e.keyCode === 9 && !e.ctrlKey && !e.shiftKey) {
+ if(e.keyCode === 9 && !e.ctrlKey) {
var selectionStart = element.selectionStart;
var selectionEnd = element.selectionEnd;
var content = element.value;
- element.value = content.substring(0, selectionStart) + "\t" + content.substring(selectionEnd);
+ if(e.shiftKey) {
+ if(content.substring(selectionStart, selectionStart -1) === "\t") {
+ element.value = content.substring(0, selectionStart - 1) + content.substring(selectionEnd);
+ setCaretPosition(selectionStart - 1);
+ }
+ }
+
+ else {
+ element.value = content.substring(0, selectionStart) + "\t" + content.substring(selectionEnd);
+ setCaretPosition(selectionStart + 1);
+ }
- setCaretPosition(selectionStart + 1);
e.preventDefault();
}
}, false);
}
-}, false);
+})();
//==============================================================================
-// Confirmation message for delete buttons
+// Emoticon button list
//==============================================================================
-addEventListener("DOMContentLoaded", function() {
- if(document.getElementById("delete-button")) {
- document.getElementById("delete-button").onclick = function(e) {
- return confirm(e.target.getAttribute('data-text'));
- };
- }
-}, false);
-
-//==============================================================================
-// Emoticon listener
-//==============================================================================
-addEventListener("DOMContentLoaded", function() {
+(function() {
if(document.getElementById("emoticon-list")) {
var list = document.getElementById("emoticon-list");
+ var node = document.getElementById("content-editor");
var items = list.getElementsByTagName("li");
for(var i = 0; i < items.length; ++i) {
items[i].onmousedown = function(e) {
- emoticonReplace(e.target.getAttribute('data-emoticon'));
+ insertEmoticon(node, e.target.getAttribute('data-emoticon'));
};
}
}
-}, false);
+})();
//==============================================================================
-// Markdown listener
+// Markdown button list
//==============================================================================
-addEventListener("DOMContentLoaded", function() {
+(function() {
if(document.getElementById("markdown-list")) {
var list = document.getElementById("markdown-list");
+ var node = document.getElementById("content-editor");
var items = list.getElementsByTagName("li");
for(var i = 0; i < items.length; ++i) {
items[i].onmousedown = function(e) {
- markdownReplace(e.target.getAttribute('data-markdown'));
+ insertMarkdown(node, e.target.getAttribute('data-markdown'));
};
}
}
-}, false); \ No newline at end of file
+})(); \ No newline at end of file
generated by cgit v1.2.3 (git 2.39.1) at 2024-10-31 23:59:26 +0000