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

質問編集履歴

1

文法の訂正

2020/01/20 07:15

投稿

kazuki0323
kazuki0323

スコア14

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
  ```