WIP: apply bootstrap theme

* icons

lib/views/crowi-plus/widget/comments.html

@@ -2,7 +2,7 @@
 
   <div class="page-comments col-lg-7 col-md-9">
 
-    <h4><i class="fa fa-comments"></i> Comments</h4>
+    <h4><i class="ti-comment-alt"></i> Comments</h4>
 
     <div class="page-comments-list" id="page-comments-list">
       {# transplanted to PageComments React component -- 2017.06.02 Yuki Takei

lib/views/layout/layout.html

@@ -179,7 +179,7 @@ gh/highlightjs/cdn-release@9.12.0/build/languages/yaml.min.js
         {% if user %}
         <li id="" class="dropdown">
           <a href="#" data-target="#create-page" data-toggle="modal">
-            <i class="ti-pencil-alt"></i> {{ t('New') }}
+            <i class="ti-pencil"></i> {{ t('New') }}
           </a>
         </li>
         <li class="dropdown">

lib/views/page.html

@@ -90,10 +90,10 @@
   {% endif %}
 
   {% if not page.isDeleted() %}
-  <ul class="nav nav-tabs hidden-print">
+  <ul class="nav nav-tabs customtab hidden-print">
     <li class=" {% if not req.body.pageForm %}active{% endif %}" data-toggle="tooltip" {# data-title="あなたの 確認待ち です" title="" data-placement="bottom" data-trigger="manual" data-tooltip-stay #}>
       <a href="#revision-body" data-toggle="tab">
-      <i class="fa fa-magic"></i>
+      <i class="ti-control-play"></i> View
       {#
         <span class="label label-danger" style=""> 承認待ち</span>
       #}
@@ -102,28 +102,28 @@
 
     <li {% if req.body.pageForm %}class="active"{% endif %}>
       <a {% if user %}href="#edit-form" data-toggle="tab"{% endif %} class="edit-button {% if not user %}edit-button-disabled{% endif %}">
-        <i class="fa fa-pencil-square-o"></i> {{ t('Edit') }}
+        <i class="ti-pencil-alt"></i> {{ t('Edit') }}
       </a>
     </li>
 
 
     <li class="dropdown pull-right">
       <a class="dropdown-toggle {% if not user %}dropdown-disabled{% endif %}" {% if user %}data-toggle="dropdown" href="#"{% endif %}>
-        <i class="fa fa-wrench"></i> <span class="caret"></span>
+        <i class="fa fa-ellipsis-v"></i>
       </a>
       <ul class="dropdown-menu">
-       <li><a href="#" data-target="#renamePage" data-toggle="modal"><i class="fa fa-share"></i> {{ t('Move') }}</a></li>
+       <li><a href="#" data-target="#renamePage" data-toggle="modal"><i class="fa-fw ti-location-arrow"></i> {{ t('Move') }}</a></li>
        <li class="divider"></li>
-       <li><a href="#" data-target="#duplicatePage" data-toggle="modal"><i class="fa fa-clone"></i> {{ t('Duplicate') }}</a></li>
+       <li><a href="#" data-target="#duplicatePage" data-toggle="modal"><i class="fa-fw ti-files"></i> {{ t('Duplicate') }}</a></li>
        {% if isDeletablePage() %}
        <li class="divider"></li>
-       <li class=""><a href="#" data-target="#deletePage" data-toggle="modal"><i class="fa fa-trash-o text-danger"></i> {{ t('Delete') }}</a></li>
+       <li class=""><a href="#" data-target="#deletePage" data-toggle="modal"><i class="fa-fw ti-trash text-danger"></i> {{ t('Delete') }}</a></li>
        {% endif %}
       </ul>
     </li>
     {% if page %}
-    <li class="pull-right"><a href="#revision-history" data-toggle="tab"><i class="fa fa-history"></i> History</a></li>
-    <li class="pull-right"><a href="?presentation=1" class="toggle-presentation"><i class="fa fa-film"></i> {{ t('Presentation Mode') }}</a></li>
+    <li class="pull-right"><a href="#revision-history" data-toggle="tab"><i class="ti-timer"></i> History</a></li>
+    <li class="pull-right"><a href="?presentation=1" class="toggle-presentation"><i class="ti-layout-slider-alt"></i> {{ t('Presentation Mode') }}</a></li>
     {% endif %}
   </ul>
   {% endif %}

resource/js/components/Page/RevisionPath.js

@@ -106,7 +106,7 @@ export default class RevisionPath extends React.Component {
         </span>
         {afterElements}
         <CopyButton buttonId="btnCopyRevisionPath" text={this.props.pagePath}
-            buttonClassName="btn btn-default btn-copy" iconClassName="ti-layers" />
+            buttonClassName="btn btn-default btn-copy" iconClassName="ti-clipboard" />
         <a href="#edit-form" className="btn btn-default btn-edit" style={editButtonStyle}>
           <i className="ti-pencil-alt"></i>
         </a>

resource/js/components/Page/RevisionUrl.js

@@ -19,7 +19,7 @@ export default class RevisionUrl extends React.Component {
       <span>
         {url}
         <CopyButton buttonId="btnCopyRevisionUrl" text={copiedText}
-            buttonClassName="btn btn-default btn-copy-link" buttonStyle={buttonStyle} iconClassName="fa fa-link" />
+            buttonClassName="btn btn-default btn-copy-link" buttonStyle={buttonStyle} iconClassName="ti-clipboard" />
       </span>
     );
   }

resource/js/legacy/crowi.js

@@ -46,7 +46,7 @@ Crowi.appendEditSectionButtons = function(parentElement) {
     $(this).append(`
       <span class="revision-head-edit-button">
         <a href="#edit-form" onClick="Crowi.setCaretLineData(${line})">
-          <i class="fa fa-edit"></i>
+          <i class="ti-pencil-alt"></i>
         </a>
       </span>
       `

resource/js/util/markdown-it/toc-and-anchor.js

@@ -12,7 +12,7 @@ export default class TocAndAnchorConfigurer {
         tocLastLevel: 3,
         anchorLinkBefore: false,
         anchorLinkSymbol: '',
-        anchorLinkSymbolClassName: 'fa fa-link',
+        anchorLinkSymbolClassName: 'ti-link',
         anchorClassName: 'revision-head-link',
         slugify: this.customSlugify,
       })