teratail header banner
teratail header banner
質問するログイン新規登録

質問編集履歴

2

コードの修正

2020/03/26 11:55

投稿

kimaiio
kimaiio

スコア8

title CHANGED
File without changes
body CHANGED
@@ -4,17 +4,17 @@
4
4
 
5
5
  詳しい方教えていただけると幸いです。
6
6
 
7
- ```ここに言語を入力
7
+ ```HTML
8
8
  <div class="timeline-post-new">
9
- <%= form_with model: @post do |f| %>
10
- <%= f.text_area :text, placeholder: "投稿内容", class: "timeline-post-form-new", rows: "3",onkeyup: "ShowLength(value);",id: "text" %>
9
+ <form enctype="multipart/form-data" action="/posts" accept-charset="UTF-8" data-remote="true" method="post"><input name="utf8" type="hidden" value="✓"><input type="hidden" name="authenticity_token" value="b8isHN+ByFBVxfOdZZEJijxzWS60GpmlrqCg98mfuux7b33n1DwyO8ZPgPfXyDpynkmNc2oWWXFzj2VTeBpuIQ==">
10
+ <textarea placeholder="投稿内容" class="timeline-post-form-new" rows="3" onkeyup="ShowLength(value);" id="text" name="post[text]" style="overflow: hidden;vertical-align: middle;"></textarea>
11
11
 
12
12
  <div class="timeline-new-buttons">
13
13
  <div id="preview" class="preview"></div>
14
14
  <label class="post-label">
15
15
  <div class="tooltip1">
16
16
  <span class="filelabel">
17
- <%= f.file_field :image, id: "filesend",onChange: "imgPreView(event)",accept: "image/*",class: "photo-up" %>
17
+ <input id="filesend" onchange="imgPreView(event)" accept="image/*" class="photo-up" type="file" name="post[image]">
18
18
  <span class="material-icons post-photo">image</span>
19
19
  <div class="photo-pop">画像を追加</div>
20
20
  </span>
@@ -23,32 +23,56 @@
23
23
  <label class="post-label">
24
24
  <div class="tooltip1">
25
25
  <span class="filelabel">
26
- <%= f.file_field :video, id: "filesend",onChange: "imgPreView(event)",accept: "video/*",class: "video-up" %>
26
+ <input id="filesend" onchange="imgPreView(event)" accept="video/*" class="video-up" type="file" name="post[video]">
27
27
  <span class="material-icons post-photo">videocam</span>
28
28
  <div class="video-pop">動画を追加</div>
29
29
  </span>
30
30
  </div>
31
31
  </label>
32
32
   
33
- <%= f.submit :投稿, value: "投稿", class: "new-post-btn",id: "submit" %>
33
+ <input type="submit" name="commit" value="投稿" class="new-post-btn" id="submit" data-disable-with="投稿">
34
34
  <p id="inputlength" class="new-textlength">0/250</p>
35
35
  </div>
36
- <% if current_user.high == true %>
37
36
  <div class="accbox">
38
37
  <label for="label1"><span class="material-icons">arrow_drop_down</span></label>
39
- <input type="checkbox" id="label1" class="cssacc" />
38
+ <input type="checkbox" id="label1" class="cssacc">
40
39
  <div class="accshow">
41
40
  <div class="md-checkbox">
42
- <%= f.check_box :noreply, autofocus: true, id: "noreply" %>
41
+ <input name="post[noreply]" type="hidden" value="0"><input autofocus="autofocus" id="noreply" type="checkbox" value="1" name="post[noreply]">
43
42
  <label for="noreply" class="check-text">この投稿へのリプライを無効にする</label>
44
43
  </div>
45
44
  </div>
46
45
  </div>
47
- <% end %>
48
- <% end %>
49
- </div>
46
+ </form></div>
50
47
 
51
48
  ```
52
49
 
50
+ ```CSS
51
+ .timeline-post-new {
52
+ padding: 10px;
53
+ border-bottom: 1px solid var(--border-color);
54
+ background: var(--card-color);
55
+ }
56
+ .timeline-post-form-new {
57
+ cursor: text;
58
+ background-color: var(--card-color);
59
+ border-radius: 4px 4px 0px 0px;
60
+ width: 100%;
61
+ height: 130px;
62
+ padding: 10px;
63
+ margin: 0px 0px 10px 0px;
64
+ resize: none;
65
+ border: none;
66
+ color: var(--primary-color);
67
+ font-size: 19px;
68
+ box-sizing: border-box;
69
+ }
70
+ .timeline-new-buttons {
71
+ width: 100%;
72
+ background-color: var(--card-color);
73
+ margin: -16px 0px 0px 0px;
74
+ border-radius: 0px 0px 4px 4px;
75
+ }
76
+ ```
53
77
 
54
78
  ![イメージ説明](cc3eb30cf14f808552070175e12496ec.png)

1

コードを追加

2020/03/26 11:55

投稿

kimaiio
kimaiio

スコア8

title CHANGED
File without changes
body CHANGED
@@ -4,4 +4,51 @@
4
4
 
5
5
  詳しい方教えていただけると幸いです。
6
6
 
7
+ ```ここに言語を入力
8
+ <div class="timeline-post-new">
9
+ <%= form_with model: @post do |f| %>
10
+ <%= f.text_area :text, placeholder: "投稿内容", class: "timeline-post-form-new", rows: "3",onkeyup: "ShowLength(value);",id: "text" %>
11
+
12
+ <div class="timeline-new-buttons">
13
+ <div id="preview" class="preview"></div>
14
+ <label class="post-label">
15
+ <div class="tooltip1">
16
+ <span class="filelabel">
17
+ <%= f.file_field :image, id: "filesend",onChange: "imgPreView(event)",accept: "image/*",class: "photo-up" %>
18
+ <span class="material-icons post-photo">image</span>
19
+ <div class="photo-pop">画像を追加</div>
20
+ </span>
21
+ </div>
22
+ </label>
23
+ <label class="post-label">
24
+ <div class="tooltip1">
25
+ <span class="filelabel">
26
+ <%= f.file_field :video, id: "filesend",onChange: "imgPreView(event)",accept: "video/*",class: "video-up" %>
27
+ <span class="material-icons post-photo">videocam</span>
28
+ <div class="video-pop">動画を追加</div>
29
+ </span>
30
+ </div>
31
+ </label>
32
+  
33
+ <%= f.submit :投稿, value: "投稿", class: "new-post-btn",id: "submit" %>
34
+ <p id="inputlength" class="new-textlength">0/250</p>
35
+ </div>
36
+ <% if current_user.high == true %>
37
+ <div class="accbox">
38
+ <label for="label1"><span class="material-icons">arrow_drop_down</span></label>
39
+ <input type="checkbox" id="label1" class="cssacc" />
40
+ <div class="accshow">
41
+ <div class="md-checkbox">
42
+ <%= f.check_box :noreply, autofocus: true, id: "noreply" %>
43
+ <label for="noreply" class="check-text">この投稿へのリプライを無効にする</label>
44
+ </div>
45
+ </div>
46
+ </div>
47
+ <% end %>
48
+ <% end %>
49
+ </div>
50
+
51
+ ```
52
+
53
+
7
54
  ![イメージ説明](cc3eb30cf14f808552070175e12496ec.png)