質問編集履歴
1
文法の訂正
title
CHANGED
File without changes
|
body
CHANGED
@@ -84,26 +84,6 @@
|
|
84
84
|
|
85
85
|
```
|
86
86
|
|
87
|
-
/assets/stylesheets/application.scss
|
88
|
-
```
|
89
|
-
/*
|
90
|
-
* This is a manifest file that'll be compiled into application.css, which will include all the files
|
91
|
-
* listed below.
|
92
|
-
*
|
93
|
-
* Any CSS and SCSS file within this directory, lib/assets/stylesheets, or any plugin's
|
94
|
-
* vendor/assets/stylesheets directory can be referenced here using a relative path.
|
95
|
-
*
|
96
|
-
* You're free to add application-wide styles to this file and they'll appear at the bottom of the
|
97
|
-
* compiled file so the styles you add here take precedence over styles defined in any other CSS/SCSS
|
98
|
-
* files in this directory. Styles in this file should be added after the last require_* statement.
|
99
|
-
* It is generally better to create a new file per style scope.
|
100
|
-
*
|
101
|
-
*= require_tree .
|
102
|
-
*= require_self
|
103
|
-
*/
|
104
|
-
|
105
|
-
|
106
|
-
```
|
107
87
|
/views/homepage/index.html.erb
|
108
88
|
```
|
109
89
|
<!-- Page Content -->
|
@@ -177,4 +157,164 @@
|
|
177
157
|
</div>
|
178
158
|
<!-- /.container -->
|
179
159
|
|
160
|
+
```
|
161
|
+
|
162
|
+
/assets/stylesheets/homepage.scss
|
163
|
+
```
|
164
|
+
// Place all the styles related to the homepage controller here.
|
165
|
+
// They will automatically be included in application.css.
|
166
|
+
// You can use Sass (SCSS) here: https://sass-lang.com/
|
167
|
+
|
168
|
+
|
169
|
+
/* 以下テンプレートagencyのcss*/
|
170
|
+
|
171
|
+
#services {
|
172
|
+
background:red;
|
173
|
+
}
|
174
|
+
|
175
|
+
body {
|
176
|
+
overflow-x: hidden;
|
177
|
+
font-family: 'Roboto Slab', 'Helvetica Neue', Helvetica, Arial, sans-serif;
|
178
|
+
}
|
179
|
+
|
180
|
+
p {
|
181
|
+
line-height: 1.75;
|
182
|
+
}
|
183
|
+
|
184
|
+
|
185
|
+
.text-primary {
|
186
|
+
color: #fed136 !important;
|
187
|
+
}
|
188
|
+
|
189
|
+
h1,
|
190
|
+
h2,
|
191
|
+
h3,
|
192
|
+
h4,
|
193
|
+
h5,
|
194
|
+
h6 {
|
195
|
+
font-weight: 700;
|
196
|
+
font-family: 'Montserrat', 'Helvetica Neue', Helvetica, Arial, sans-serif;
|
197
|
+
}
|
198
|
+
|
199
|
+
section {
|
200
|
+
padding: 100px 0;
|
201
|
+
}
|
202
|
+
|
203
|
+
section h2.section-heading {
|
204
|
+
font-size: 40px;
|
205
|
+
margin-top: 0;
|
206
|
+
margin-bottom: 15px;
|
207
|
+
}
|
208
|
+
|
209
|
+
section h3.section-subheading {
|
210
|
+
font-size: 16px;
|
211
|
+
font-weight: 400;
|
212
|
+
font-style: italic;
|
213
|
+
margin-bottom: 25px;
|
214
|
+
text-transform: none;
|
215
|
+
line-height: 1.5em;
|
216
|
+
font-family: 'Droid Serif', 'Helvetica Neue', Helvetica, Arial, sans-serif;
|
217
|
+
}
|
218
|
+
|
219
|
+
@media (min-width: 768px) {
|
220
|
+
section {
|
221
|
+
padding: 150px 0;
|
222
|
+
}
|
223
|
+
}
|
224
|
+
|
225
|
+
.btn {
|
226
|
+
font-family: 'Montserrat', 'Helvetica Neue', Helvetica, Arial, sans-serif;
|
227
|
+
font-weight: 700;
|
228
|
+
}
|
229
|
+
|
230
|
+
.btn-xl {
|
231
|
+
font-size: 18px;
|
232
|
+
padding: 20px 40px;
|
233
|
+
}
|
234
|
+
|
235
|
+
.btn-primary {
|
236
|
+
background-color: #fed136;
|
237
|
+
border-color: #fed136;
|
238
|
+
}
|
239
|
+
|
240
|
+
.btn-primary:active, .btn-primary:focus, .btn-primary:hover {
|
241
|
+
background-color: #fec810 !important;
|
242
|
+
border-color: #fec810 !important;
|
243
|
+
color: white;
|
244
|
+
}
|
245
|
+
|
246
|
+
.btn-primary:active, .btn-primary:focus {
|
247
|
+
box-shadow: 0 0 0 0.2rem rgba(254, 209, 55, 0.5) !important;
|
248
|
+
}
|
249
|
+
|
250
|
+
::-moz-selection {
|
251
|
+
background: #fed136;
|
252
|
+
text-shadow: none;
|
253
|
+
}
|
254
|
+
|
255
|
+
::selection {
|
256
|
+
background: #fed136;
|
257
|
+
text-shadow: none;
|
258
|
+
}
|
259
|
+
|
260
|
+
img::selection {
|
261
|
+
background: transparent;
|
262
|
+
}
|
263
|
+
|
264
|
+
img::-moz-selection {
|
265
|
+
background: transparent;
|
266
|
+
}
|
267
|
+
|
268
|
+
#mainNav {
|
269
|
+
background-color: #212529;
|
270
|
+
}
|
271
|
+
|
272
|
+
#mainNav .navbar-toggler {
|
273
|
+
font-size: 12px;
|
274
|
+
right: 0;
|
275
|
+
padding: 13px;
|
276
|
+
text-transform: uppercase;
|
277
|
+
color: #fed136;
|
278
|
+
// border: 0;
|
279
|
+
border:1px solid #fed136;
|
280
|
+
// background-color: #fed136;
|
281
|
+
font-family: 'Montserrat', 'Helvetica Neue', Helvetica, Arial, sans-serif;
|
282
|
+
}
|
283
|
+
|
284
|
+
#mainNav .navbar-brand {
|
285
|
+
color: #fed136;
|
286
|
+
font-family: 'Kaushan Script', 'Helvetica Neue', Helvetica, Arial, cursive;
|
287
|
+
padding: .7rem
|
288
|
+
}
|
289
|
+
|
290
|
+
#mainNav .navbar-brand.active, #mainNav .navbar-brand:active, #mainNav .navbar-brand:focus, #mainNav .navbar-brand:hover {
|
291
|
+
color: #fec503;
|
292
|
+
}
|
293
|
+
|
294
|
+
#mainNav .navbar-nav .nav-item .nav-link {
|
295
|
+
font-size: 90%;
|
296
|
+
font-weight: 400;
|
297
|
+
padding: 0.75em 0;
|
298
|
+
letter-spacing: 1px;
|
299
|
+
color: white;
|
300
|
+
font-family: 'Montserrat', 'Helvetica Neue', Helvetica, Arial, sans-serif;
|
301
|
+
}
|
302
|
+
|
303
|
+
#mainNav .navbar-nav .nav-item .nav-link.active, #mainNav .navbar-nav .nav-item .nav-link:hover {
|
304
|
+
color: #fed136;
|
305
|
+
}
|
306
|
+
|
307
|
+
@media (min-width: 992px) {
|
308
|
+
// 画面サイズが広い時にnavbarの背景が消えて太さが太くなる挙動をここをコメントアウトして制御
|
309
|
+
|
310
|
+
#mainNav .navbar-brand {
|
311
|
+
font-size: 1.75em;
|
312
|
+
-webkit-transition: all 0.3s;
|
313
|
+
-moz-transition: all 0.3s;
|
314
|
+
transition: all 0.3s;
|
315
|
+
}
|
316
|
+
|
317
|
+
|
318
|
+
以下省略
|
319
|
+
|
180
320
|
```
|