質問編集履歴

2

修正

2019/05/22 12:11

投稿

avicii
avicii

スコア49

test CHANGED
File without changes
test CHANGED
File without changes

1

修正

2019/05/22 12:11

投稿

avicii
avicii

スコア49

test CHANGED
File without changes
test CHANGED
@@ -284,6 +284,206 @@
284
284
 
285
285
  ```
286
286
 
287
+
288
+
289
+ app/assets/style.scss
290
+
291
+ ```
292
+
293
+ div.contents.row {
294
+
295
+ h2 {
296
+
297
+
298
+
299
+ @include boxBase(20px 0, 0);
300
+
301
+ font-weight: normal;
302
+
303
+ strong {
304
+
305
+ font-weight: bold;
306
+
307
+ padding-right: 5px;
308
+
309
+ font-size: 1.2em;
310
+
311
+ }
312
+
313
+ }
314
+
315
+
316
+
317
+ div.avicii {
318
+
319
+ top: 12%;
320
+
321
+ bottom: 0;
322
+
323
+ right: 0;
324
+
325
+ font-size: 15px;
326
+
327
+ padding: 0 auto;
328
+
329
+
330
+
331
+ }
332
+
333
+ div.martin.garrix {
334
+
335
+ top: 12%;
336
+
337
+ bottom: 0;
338
+
339
+ right: 0;
340
+
341
+ font-size: 15px;
342
+
343
+ padding: 0 auto;
344
+
345
+ .clear {
346
+
347
+ clear: left;
348
+
349
+ }
350
+
351
+ }
352
+
353
+
354
+
355
+ .new_user{
356
+
357
+ font-family: "游ゴシック", "YuGothic";
358
+
359
+ }
360
+
361
+
362
+
363
+ div.content_post, .edm_post {
364
+
365
+ @include boxBase(20px 0 ,30px);
366
+
367
+
368
+
369
+ position: relative;
370
+
371
+ height: 400px;
372
+
373
+ color: #fff;
374
+
375
+ background-size: cover;
376
+
377
+ background-position: center center;
378
+
379
+ border-radius: 3px;
380
+
381
+ box-shadow: 0 0 10px rgba($black,0.2);
382
+
383
+ &:after {
384
+
385
+ content: '';
386
+
387
+ position: absolute;
388
+
389
+ top: 0;
390
+
391
+ bottom: 0;
392
+
393
+ left: 0;
394
+
395
+ right: 0;
396
+
397
+ @include filter-gradient(#000000, #a60000, vertical);
398
+
399
+ @include background-image(linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0) 62%,rgba(0,0,0,0.85) 100%));
400
+
401
+ z-index: 1;
402
+
403
+ border-radius: 3px;
404
+
405
+ }
406
+
407
+ .more {
408
+
409
+ position: absolute;
410
+
411
+ cursor: pointer;
412
+
413
+ top: 20px;
414
+
415
+ right: 30px;
416
+
417
+ z-index: 2;
418
+
419
+ height: 100px;
420
+
421
+ width: 80px;
422
+
423
+ text-align: right;
424
+
425
+ &:hover ul.more_list {
426
+
427
+ display: block;
428
+
429
+ }
430
+
431
+ ul.more_list {
432
+
433
+ position: absolute;
434
+
435
+ text-align: left;
436
+
437
+ width: 80px;
438
+
439
+ right: 0;
440
+
441
+ font-size: 12px;
442
+
443
+ background-color: #fff;
444
+
445
+ border: 1px solid #ddd;
446
+
447
+ display: none;
448
+
449
+ box-shadow: 1px 1px 2px rgba(0,0,0,0.2);
450
+
451
+ border-radius: 3px;
452
+
453
+ li {
454
+
455
+ border-bottom: 1px solid #ddd;
456
+
457
+ &:last-child {
458
+
459
+ border-bottom: 0;
460
+
461
+ }
462
+
463
+ a {
464
+
465
+ display: block;
466
+
467
+ padding: 5px;
468
+
469
+ &:hover {
470
+
471
+ background-color: $accent;
472
+
473
+ color: #fff;
474
+
475
+ }
476
+
477
+ }
478
+
479
+ }
480
+
481
+ }
482
+
483
+ }
484
+
485
+ ```
486
+
287
487
  app/views/layout/application.html.erb
288
488
 
289
489
  ```
@@ -381,3 +581,67 @@
381
581
 
382
582
 
383
583
  ```
584
+
585
+
586
+
587
+ app/view/plans/index.html.erb
588
+
589
+ ```
590
+
591
+ <div class="contents row">
592
+
593
+ <% @plans.each do |plan| %>
594
+
595
+ <div class="content_post" style="background-image: url(<%= plan.image %>);">
596
+
597
+ <div class="more">
598
+
599
+ <span><%= image_tag 'arrow_top.png' %></span>
600
+
601
+ <ul class="more_list">
602
+
603
+ <li>
604
+
605
+ <%= link_to 'detail', "/plans/#{plan.id}", method: :get %>
606
+
607
+ </li>
608
+
609
+ <% if guider_signed_in? && current_guider.id == plan.guider_id %>
610
+
611
+ <li>
612
+
613
+ <%= link_to '編集', "/plans/#{plan.id}/edit", method: :get %>
614
+
615
+ </li>
616
+
617
+ <li>
618
+
619
+ <%= link_to '削除', "/plans/#{plan.id}", method: :delete %>
620
+
621
+ </li>
622
+
623
+ <% end %>
624
+
625
+ </ul>
626
+
627
+ </div>
628
+
629
+ <%= simple_format(plan.title) %>
630
+
631
+ <span class="name">
632
+
633
+ <a href="/guiders/<%= plan.guider_id %>">
634
+
635
+ <span>guider</span><%= plan.guider.nickname %>
636
+
637
+ </a>
638
+
639
+ </span>
640
+
641
+ </div>
642
+
643
+ <% end %>
644
+
645
+ </div>
646
+
647
+ ```