演習課題「Googleマップの横幅の調整」
右の環境には、Railsで「catmap」というプロジェクトに、「cat」という掲示板と「feed」という掲示板が作ってあり、Googleマップが導入されています。
エディタを使って、app/views/cats/show.html.erbを修正して、ウィンドウの幅に合わせて、Googleマップの横幅が変わるようにください。
採点して、すべてのジャッジに正解すれば、演習課題クリアです！
＃04:スマートフォン向けの画面にしよう vol.2
このチャプターでは、引き続き、Railsアプリをスマートフォン向けの画面に変えたいと思います。今度は、詳細ページと登録ページのレイアウトを整理しましょう。
app/views/shops/show.html.erb<%= content_tag(:iframe,
'map',
src:'https://www.google.com/maps/embed/v1/place?key=AIzaSyCJBgcuCowQa5-V8owXaUCHhUNBN8bfMfU&q=' + @shop.address,
width: '100%',
height: 320,
frameborder: 0) %>
app/views/shops/show.html.erb<%= link_to 'Delete', @shop,
method: :delete, data: { confirm: 'Are you sure?' }, class: 'btn btn-danger' %>
<%= link_to 'Edit', edit_shop_path(@shop), class: 'btn btn-primary' %>
<%= link_to 'Back', shops_path, class: 'btn btn-default' %>
app/views/shops/＿form.html.erb<div class='actions'>
<div class='form-group'>
<div class='col-sm-offset-2 col-sm-10'>
<%= f.submit 'Submit', class: 'btn btn-success' %>
<%= link_to 'Back', :back, class: 'btn btn-default' %>
</div>
</div>
</div>
app/views/shops/edit.html.erb<h1>Editing Shop</h1>
<%= render 'form', shop: @shop %>
<!-- <%= link_to 'Show', @shop %> | -->
<!-- <%= link_to 'Back', shops_path %> -->
app/views/shops/new.html.erb<h1>New Shop</h1>
<%= render 'form', shop: @shop %>
<!-- <%= link_to 'Back', shops_path %> -->
- Linuxコマンド集 - ITpro
http://itpro.nikkeibp.co.jp/article/COLUMN/20060224/230573/
- Ruby on Railsサービス開発逆引き辞典
http://code.materializer.co/index.html
- Railsドキュメント
http://railsdoc.com/