OSDN Git Service

template: convert bootstrap-style modal dialog to new modal system
[newslash/newslash.git] / src / newslash_web / templates / admin / feed / index.html.tt2
index c20c32b..8bbf10b 100644 (file)
 </div>
 
 <script type="text/x-template" id="feed-editor">
-  <div class="modal vue-modal" v-if="feed.editing">
-    <div class="modal-dialog" role="document">
-      <div class="modal-content">
-        <form>
-          <div class="modal-header">
-            <span>feed edit</span>
-          </div>
-          <div class="modal-body">
-            <p class="form-inline">
-              <label for="feed-name">name: </label>
-              <input id="feed-name" type="text" class="form-control" name="name" v-model="feed.name" placeholder="name" />
-            </p>
-            <p class="form-inline">
-              <label for="feed-title">title: </label>
-              <input id="feed-title" type="text" class="form-control" name="title" v-model="feed.title" placeholder="title" />
-            </p>
-            <p class="form-group">
-              <label for="feed-description">description: </label>
-              <textarea id="feed-description" name="description" class="form-control" v-model="feed.description" placeholder="description" />
-            </p>
-            <p class="form-inline">
-              <label for="feed-url">url: </label>
-              <input id="feed-url" type="text" class="form-control" name="url" v-model="feed.url" placeholder="url" />
-            </p>
-          </div>
-          <div class="modal-footer">
+  <div class="modal" :class="['modal', { 'open': feed.editing }]" v-if="feed.editing">
+    <div class="dialog-wrapper">
+      <form class="dialog form">
+
+        <div class="dialog-header">
+          <h4 class="modal-title">feed editor</h4>
+        </div>
+
+        <div class="dialog-body">
+          <label>name:
+            <input id="feed-name" type="text" name="name" v-model="feed.name" placeholder="name" />
+          </label>
+
+          <label>title:
+            <input id="feed-title" type="text" name="title" v-model="feed.title" placeholder="title" />
+          </label>
+
+          <label>description:
+            <textarea id="feed-description" name="description" v-model="feed.description" placeholder="description" />
+          </label>
+
+          <label>url:
+            <input id="feed-url" type="text" name="url" v-model="feed.url" placeholder="url" />
+          </label>
+        </div>
+
+        <div class="dialog-footer">
             <span v-text="message"></span>
             <button type="submit" class="btn btn-default" v-on:click.prevent="fetch()">fetch title and description</button>
             <button type="submit" class="btn btn-default" v-on:click.prevent="save()">save</button>
             <button type="button" class="btn" v-on:click="close()">close</button>
-          </div>
-        </form>
-      </div>
+        </div>
+      </form>
     </div>
   </div>
 </script>