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

質問編集履歴

2

画像追加

2020/03/31 06:49

投稿

miumei
miumei

スコア6

title CHANGED
File without changes
body CHANGED
@@ -183,4 +183,6 @@
183
183
  font-size: 24px;
184
184
  opacity: 0.5;
185
185
  }
186
- ```
186
+ ```
187
+
188
+ ![イメージ説明](67db26dfb15fc0c426aece7a77d2b9a9.png)

1

コードの追加

2020/03/31 06:49

投稿

miumei
miumei

スコア6

title CHANGED
File without changes
body CHANGED
@@ -1,7 +1,5 @@
1
1
  ProgateでRuby on Rails5 道場コース I 8.投稿機能を作ろう(一覧・詳細ページ)を勉強しています。
2
-
3
- 答えを見ながら、コードを入れても【「localhost:3000/posts/index」に全ての投稿が表示されていません。】と出ます。
2
+ 答えを見ながら、コードを入れても【「localhost:3000/posts/index」に全ての投稿が表示されていません。】と出ます。原因が分からないため教えていただきたいです。
4
- 原因が分からないため助言頂けますと幸いです。
5
3
  ```
6
4
  Ruby on rails
7
5
 
@@ -73,8 +71,116 @@
73
71
  end
74
72
  end
75
73
  end
76
- ```
77
74
 
75
+ エディタ:posts.scss
76
+ コード
77
+ .posts-index-item {
78
+ padding: 20px 30px;
79
+ background-color: white;
80
+ overflow: hidden;
81
+ box-shadow: 0 2px 6px #c1ced7;
82
+ }
83
+
84
+ .post-left img {
85
+ width: 50px;
86
+ border-radius: 40%;
87
+ box-shadow: 0 2px 6px #c1ced7;
88
+ }
89
+
90
+ .post-user-name a {
91
+ font-weight: 600;
92
+ }
93
+
94
+ .post-user-name a:hover {
95
+ color: #3ecdc6;
96
+ }
97
+
98
+ .post-left {
99
+ float: left;
100
+ width: 10%;
101
+ }
102
+
103
+ .post-right {
104
+ float: left;
105
+ width: 90%;
106
+ padding-left: 25px;
107
+ text-align: left;
108
+ }
109
+
110
+ /* posts/show ================================ */
111
+ .posts-show form {
112
+ display: inline;
113
+ }
114
+
115
+ .posts-show-item {
116
+ padding: 30px;
117
+ background-color: white;
118
+ box-shadow: 0 2px 6px #c1ced7;
119
+ overflow: hidden;
120
+ }
121
+
122
+ .posts-show-item img {
123
+ width: 60px;
124
+ border-radius: 40%;
125
+ box-shadow: 0 2px 6px #c1ced7;
126
+ vertical-align: middle;
127
+ }
128
+
129
+ .posts-show-item .post-user-name a {
130
+ vertical-align: middle;
131
+ font-size: 24px;
132
+ margin-left: 15px;
133
+ }
134
+
135
+ .posts-show-item p {
136
+ font-size: 24px;
137
+ margin: 20px 0;
138
+ }
139
+
140
+ .post-time {
141
+ color: #8899a6;
142
+ margin-bottom: 10px;
143
+ }
144
+
145
+ .posts-show-item .fa {
146
+ font-size: 16px;
147
+ margin-right: 3px;
148
+ }
149
+
150
+ .like-btn {
151
+ padding: 0;
152
+ background-color: white;
153
+ color: #8899a6;
154
+ font-size: 16px;
155
+ margin-bottom: 0;
156
+ outline-width: 0;
157
+ }
158
+
159
+ .like-btn-unlike {
160
+ color: #ff2581;
161
+ }
162
+
163
+ .post-menus {
164
+ float: right;
165
+ }
166
+
167
+ .post-menus a {
168
+ color: #8899a6;
169
+ text-decoration: underline;
170
+ font-size: 14px;
171
+ }
172
+
173
+ /* 新規投稿 & 編集 */
174
+ .posts-new textarea {
175
+ font-size: 20px;
176
+ padding: 10px;
177
+ min-height: 140px;
78
- 何を載せればよいか分からず一部載せていますが、他に載せるべきコードがあれば追加します。
178
+ border: 1px solid rgb(216, 218, 223);
179
+ resize: none;
180
+ }
181
+
79
- あと、エディタ:create.posts.rbのコードの意味が全然分からずご説明頂けますと幸いです。
182
+ .posts-new textarea::-webkit-input-placeholder {
183
+ font-size: 24px;
80
- どうぞよろしくお願いします。
184
+ opacity: 0.5;
185
+ }
186
+ ```