質問編集履歴

1

情報を追加します。

2018/02/23 11:39

投稿

galaxymaximum
galaxymaximum

スコア11

test CHANGED
File without changes
test CHANGED
@@ -47,3 +47,679 @@
47
47
  これのどこをどう直せばいいのか、わかりません。
48
48
 
49
49
  ご教授願いたいです。
50
+
51
+
52
+
53
+ view
54
+
55
+ ```
56
+
57
+ <% if logged_in? %>
58
+
59
+ <div class="row">
60
+
61
+ <aside class="col-md-4">
62
+
63
+ <section class="user_info">
64
+
65
+ <%= render 'shared/user_info' %>
66
+
67
+ </section>
68
+
69
+ <section class="stats">
70
+
71
+ <%= render 'shared/stats' %>
72
+
73
+ </section>
74
+
75
+ <section class="micropost_form">
76
+
77
+ <%= render 'shared/micropost_form' %>
78
+
79
+ </section>
80
+
81
+ </aside>
82
+
83
+ <div class="col-md-8">
84
+
85
+ <h3>投稿</h3>
86
+
87
+ <%= render 'shared/feed' %>
88
+
89
+ </div>
90
+
91
+ </div>
92
+
93
+ <% else %>
94
+
95
+ <div class="top-main">
96
+
97
+ <div class="center jumbotron">
98
+
99
+
100
+
101
+ <h1>懐かし掲示板</h1>
102
+
103
+
104
+
105
+ <h2>
106
+
107
+ ああ、懐かしや・・・
108
+
109
+ </h2>
110
+
111
+
112
+
113
+ <%= link_to "ユーザー登録する", signup_path, class: "btn btn-lg btn-primary" %>
114
+
115
+ </div>
116
+
117
+ <% end %>
118
+
119
+
120
+
121
+ </div>
122
+
123
+
124
+
125
+ ```
126
+
127
+
128
+
129
+ カスタムCSS
130
+
131
+ ```ここに言語を入力
132
+
133
+ @import "bootstrap-sprockets";
134
+
135
+ @import "bootstrap";
136
+
137
+
138
+
139
+ @mixin box_sizing {
140
+
141
+ -moz-box-sizing: border-box;
142
+
143
+ -webkit-box-sizing: border-box;
144
+
145
+ box-sizing: border-box;
146
+
147
+ }
148
+
149
+
150
+
151
+ /* universal */
152
+
153
+
154
+
155
+ body {
156
+
157
+ padding-top: 60px;
158
+
159
+ }
160
+
161
+
162
+
163
+ section {
164
+
165
+ overflow: auto;
166
+
167
+ }
168
+
169
+
170
+
171
+ textarea {
172
+
173
+ resize: vertical;
174
+
175
+ }
176
+
177
+
178
+
179
+ .center {
180
+
181
+ text-align: center;
182
+
183
+ }
184
+
185
+
186
+
187
+ .center h1 {
188
+
189
+ margin-bottom: 10px;
190
+
191
+ }
192
+
193
+
194
+
195
+ /* typography */
196
+
197
+
198
+
199
+ h1, h2, h3, h4, h5, h6 {
200
+
201
+ line-height: 1;
202
+
203
+ }
204
+
205
+
206
+
207
+ h1 {
208
+
209
+ font-size: 3em;
210
+
211
+ letter-spacing: -2px;
212
+
213
+ margin-bottom: 30px;
214
+
215
+ text-align: center;
216
+
217
+ }
218
+
219
+
220
+
221
+ h2 {
222
+
223
+ font-size: 1.2em;
224
+
225
+ letter-spacing: -1px;
226
+
227
+ margin-bottom: 30px;
228
+
229
+ text-align: center;
230
+
231
+ font-weight: normal;
232
+
233
+ color: #777;
234
+
235
+ }
236
+
237
+
238
+
239
+ p {
240
+
241
+ font-size: 1.1em;
242
+
243
+ line-height: 1.7em;
244
+
245
+ }
246
+
247
+
248
+
249
+ /* header */
250
+
251
+
252
+
253
+ #logo {
254
+
255
+ float: left;
256
+
257
+ margin-right: 10px;
258
+
259
+ font-size: 1.7em;
260
+
261
+ color: #fff;
262
+
263
+ text-transform: uppercase;
264
+
265
+ letter-spacing: -1px;
266
+
267
+ padding-top: 9px;
268
+
269
+ font-weight: bold;
270
+
271
+ }
272
+
273
+
274
+
275
+ #logo:hover {
276
+
277
+ color: #fff;
278
+
279
+ text-decoration: none;
280
+
281
+ }
282
+
283
+
284
+
285
+ /* footer */
286
+
287
+
288
+
289
+ footer {
290
+
291
+ margin-top: 45px;
292
+
293
+ padding-top: 5px;
294
+
295
+ border-top: 1px solid #eaeaea;
296
+
297
+ color: #777;
298
+
299
+ }
300
+
301
+
302
+
303
+ footer a {
304
+
305
+ color: #555;
306
+
307
+ }
308
+
309
+
310
+
311
+ footer a:hover {
312
+
313
+ color: #222;
314
+
315
+ }
316
+
317
+
318
+
319
+ footer small {
320
+
321
+ float: left;
322
+
323
+ }
324
+
325
+
326
+
327
+ footer ul {
328
+
329
+ float: right;
330
+
331
+ list-style: none;
332
+
333
+ }
334
+
335
+
336
+
337
+ footer ul li {
338
+
339
+ float: left;
340
+
341
+ margin-left: 15px;
342
+
343
+ }
344
+
345
+
346
+
347
+ /* miscellaneous */
348
+
349
+
350
+
351
+ .debug_dump {
352
+
353
+ clear: both;
354
+
355
+ float: left;
356
+
357
+ width: 100%;
358
+
359
+ margin-top: 45px;
360
+
361
+ @include box_sizing;
362
+
363
+ }
364
+
365
+
366
+
367
+ /* sidebar */
368
+
369
+
370
+
371
+ aside {
372
+
373
+ section.user_info {
374
+
375
+ margin-top: 20px;
376
+
377
+ }
378
+
379
+ section {
380
+
381
+ padding: 10px 0;
382
+
383
+ margin-top: 20px;
384
+
385
+ &:first-child {
386
+
387
+ border: 0;
388
+
389
+ padding-top: 0;
390
+
391
+ }
392
+
393
+ span {
394
+
395
+ display: block;
396
+
397
+ margin-bottom: 3px;
398
+
399
+ line-height: 1;
400
+
401
+ }
402
+
403
+ h1 {
404
+
405
+ font-size: 1.4em;
406
+
407
+ text-align: left;
408
+
409
+ letter-spacing: -1px;
410
+
411
+ margin-bottom: 3px;
412
+
413
+ margin-top: 0px;
414
+
415
+ }
416
+
417
+ }
418
+
419
+ }
420
+
421
+
422
+
423
+ .gravatar {
424
+
425
+ float: left;
426
+
427
+ margin-right: 10px;
428
+
429
+ }
430
+
431
+
432
+
433
+ .gravatar_edit {
434
+
435
+ margin-top: 15px;
436
+
437
+ }
438
+
439
+
440
+
441
+
442
+
443
+ .stats {
444
+
445
+ overflow: auto;
446
+
447
+ margin-top: 0;
448
+
449
+ padding: 0;
450
+
451
+ a {
452
+
453
+ float: left;
454
+
455
+ padding: 0 10px;
456
+
457
+ border-left: 1px solid $gray-lighter;
458
+
459
+ color: gray;
460
+
461
+ &:first-child {
462
+
463
+ padding-left: 0;
464
+
465
+ border: 0;
466
+
467
+ }
468
+
469
+ &:hover {
470
+
471
+ text-decoration: none;
472
+
473
+ color: blue;
474
+
475
+ }
476
+
477
+ }
478
+
479
+ strong {
480
+
481
+ display: block;
482
+
483
+ }
484
+
485
+ }
486
+
487
+
488
+
489
+ .user_avatars {
490
+
491
+ overflow: auto;
492
+
493
+ margin-top: 10px;
494
+
495
+ .gravatar {
496
+
497
+ margin: 1px 1px;
498
+
499
+ }
500
+
501
+ a {
502
+
503
+ padding: 0;
504
+
505
+ }
506
+
507
+ }
508
+
509
+
510
+
511
+ .users.follow {
512
+
513
+ padding: 0;
514
+
515
+ }
516
+
517
+
518
+
519
+ /* forms */
520
+
521
+
522
+
523
+ input, textarea, select, .uneditable-input {
524
+
525
+ border: 1px solid #bbb;
526
+
527
+ width: 100%;
528
+
529
+ margin-bottom: 15px;
530
+
531
+ @include box_sizing;
532
+
533
+ }
534
+
535
+
536
+
537
+ input {
538
+
539
+ height: auto !important;
540
+
541
+ }
542
+
543
+
544
+
545
+ #error_explanation {
546
+
547
+ color: red;
548
+
549
+ ul {
550
+
551
+ color: red;
552
+
553
+ margin: 0 0 30px 0;
554
+
555
+ }
556
+
557
+ }
558
+
559
+
560
+
561
+ .field_with_errors {
562
+
563
+ @extend .has-error;
564
+
565
+ .form-control {
566
+
567
+ color: $state-danger-text;
568
+
569
+ }
570
+
571
+ }
572
+
573
+
574
+
575
+ .checkbox {
576
+
577
+ margin-top: -10px;
578
+
579
+ margin-bottom: 10px;
580
+
581
+ span {
582
+
583
+ margin-left: 20px;
584
+
585
+ font-weight: normal;
586
+
587
+ }
588
+
589
+ }
590
+
591
+
592
+
593
+ #session_remember_me {
594
+
595
+ width: auto;
596
+
597
+ margin-left: 0;
598
+
599
+ }
600
+
601
+
602
+
603
+ /* Users index */
604
+
605
+
606
+
607
+ .users {
608
+
609
+ list-style: none;
610
+
611
+ margin: 0;
612
+
613
+ li {
614
+
615
+ overflow: auto;
616
+
617
+ padding: 10px 0;
618
+
619
+ border-bottom: 1px solid $gray-lighter;
620
+
621
+ }
622
+
623
+ }
624
+
625
+
626
+
627
+ /* microposts */
628
+
629
+
630
+
631
+ .microposts {
632
+
633
+ list-style: none;
634
+
635
+ padding: 0;
636
+
637
+ li {
638
+
639
+ padding: 10px 0;
640
+
641
+ border-top: 1px solid #e8e8e8;
642
+
643
+ }
644
+
645
+ .user {
646
+
647
+ margin-top: 5em;
648
+
649
+ padding-top: 0;
650
+
651
+ }
652
+
653
+ .content {
654
+
655
+ display: block;
656
+
657
+ margin-left: 60px;
658
+
659
+ img {
660
+
661
+ display: block;
662
+
663
+ padding: 5px 0;
664
+
665
+ }
666
+
667
+ }
668
+
669
+ .timestamp {
670
+
671
+ color: $gray-light;
672
+
673
+ display: block;
674
+
675
+ margin-left: 60px;
676
+
677
+ }
678
+
679
+ .gravatar {
680
+
681
+ float: left;
682
+
683
+ margin-right: 10px;
684
+
685
+ margin-top: 5px;
686
+
687
+ }
688
+
689
+ }
690
+
691
+
692
+
693
+ aside {
694
+
695
+ textarea {
696
+
697
+ height: 100px;
698
+
699
+ margin-bottom: 5px;
700
+
701
+ }
702
+
703
+ }
704
+
705
+
706
+
707
+ span.picture {
708
+
709
+ margin-top: 10px;
710
+
711
+ input {
712
+
713
+ border: 0;
714
+
715
+ }
716
+
717
+ }
718
+
719
+
720
+
721
+ ```
722
+
723
+
724
+
725
+ かなり汚いコードですが、よろしくお願いいたします。