常連

link_toを用いて、リンクパスを指定しました。
下記のようなコードになったのですが、
font awesomeを使用していて、font awesomeの下に下線ができました。
```
.tweets
  = link_to new_tweets_path do
    %i.fas.fa-pen
```
font awesomeのscssはこのようになっています。
```
.fa-pen {
  line-height: 90px;
  text-align: center;
  display: block;
  font-size: 30px;
  color: white;
  text-decoration: none;
}
```
```
text-decoration: none;
```
これを当ててみても下線は消えません。
一体、何が原因でしょうか？
ご回答お願い致します。

link_toを使った後の下線が消えない

### 前提・実現したいこと

現在、フリマの仮装アプリを制作しております。
商品編集ページの実装ですが
カテゴリーが呼び込めません。

自分の中で
色んな記事を噛み砕いた内容になってますが、記述ミス、いらない内容あるかもです。
（カテゴリーと画像の導入以外のjsは触ってない箇所もあります）


■商品編集機能実装中にカテゴリーの機能を実装中に以下のエラーメッセージが発生しました。

### 発生している問題・エラーメッセージ

```
ActiveRecord::RecordNotFound in ProductionsController#edit
Couldn't find Category without an ID

```

### 該当のソースコード

```ここに言語名を入力
production_controller.rb

def edit
    @production = Production.find(params[:id])
    @category = Category.where(ancestry: "")
~~~~~~~~~~~~省略~~~~~~~~~~~~~~~~~~~~~~~
end

category.js

$(document).ready(function(){
  $(function(){
    function appendOption(category){
      var html = `<option value="${category.id}" data-category="${category.id}">${category.name}</option>`;
      return html;
    }
    // 子カテゴリーの表示作成
    function appendChidrenBox(insertHTML){
        var childSelectHtml = '';
        childSelectHtml = `<div class='exhibitionPage__main__contents__detail__category__choose__added' id= 'children_wrapper'>
                            <div class='exhibitionPage__main__contents__detail__category__choose1'>
                              <i class='fas fa-chevron-down exhibitionPage__main__contents__detail__category__choose--arrow-down'></i>
                              <select class="exhibitionPage__main__contents__detail__category__choose--select" id="child_category" name="production[category_id]">
                                <option value="---" data-category="---">---</option>
                                ${insertHTML}
                              <select>
                            </div>
                          </div>`;
        $('.products_new-product_explanation__category').append(childSelectHtml);
      }
  
      // 孫カテゴリーの表示作成
      function appendGrandchidrenBox(insertHTML){
        var grandchildSelectHtml = '';
        grandchildSelectHtml = `<div class='exhibitionPage__main__contents__detail__category__choose__added' id= 'grandchildren_wrapper'>
                                  <div class='exhibitionPage__main__contents__detail__category__choose2'>
                                    <i class='fas fa-chevron-down exhibitionPage__main__contents__detail__category__choose--arrow-down'></i>
                                    <select class="exhibitionPage__main__contents__detail__category__choose__box--select" id="grandchild_category" name="production[category_id]">
                                      <option value="---" data-category="---">---</option>
                                      ${insertHTML}
                                    </select>
                                  </div>
                                </div>`;
        $('.products_new-product_explanation__category').append(grandchildSelectHtml);
      }
  
      // 親カテゴリー選択後のイベント
      // 親はクラスのIDの方を選択してあげる
      $('#production_category').on('change', function(){
        var parent_category_id = document.getElementById('production_category').value; //選択された親カテゴリーの名前を取得
        if (parent_category_id != "選択してください"){ //親カテゴリーが初期値でないことを確認
          $.ajax({
            url: '/productions/category/get_category_children',
            type: 'GET',
            data: { parent_id: parent_category_id },
            dataType: 'json'
          })
          .done(function(children){
            $('#children_wrapper').remove(); //親が変更された時、子以下を削除する
            $('#grandchildren_wrapper').remove();
            var insertHTML = '';
            children.forEach(function(child){
              insertHTML += appendOption(child);
            });
            appendChidrenBox(insertHTML);
          })
          .fail(function(){
            alert('カテゴリー取得に失敗しました');
          })
        }else{
          $('#children_wrapper').remove(); //親カテゴリーが初期値になった時、子以下を削除する
          $('#child_category').remove();
        }
      });
  
      // 子カテゴリー選択後のイベント
      // これは元々HTMLに表示されているクラスをレシーバーとして指定する必要がある
      $('.products_new-product_explanation__category').on('change', '#child_category', function(){
        var child_category_id = $('#child_category option:selected').data('category'); //選択された子カテゴリーのidを取得
        if (child_category_id != "--"){ //子カテゴリーが初期値でないことを確認
          $.ajax({
            url: '/productions/category/get_category_grandchildren',
            type: 'GET',
            data: { child_id: child_category_id },
            dataType: 'json'
          })
          .done(function(grandchildren){
            if (grandchildren.length != 0) {
              $('#grandchildren_wrapper').remove(); //子が変更された時、孫以下を削除する
              var insertHTML = '';
              grandchildren.forEach(function(grandchild){
                insertHTML += appendOption(grandchild);
              });
              appendGrandchidrenBox(insertHTML);
            }
          })
          .fail(function(){
            alert('カテゴリー取得に失敗しました');
          })
        }else{
          $('#grandchildren_wrapper').remove(); //子カテゴリーが初期値になった時、孫以下を削除する
        }
      });
    });
  });

vies/production/edit.html.haml
~~~~~~~~~~~~~~~~~~~~~~~省略~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 .category-wrapper
          = form_with model: @production :@category, local: true do |f|
            = f.label :category_id , class: 'wrapper__label category-wrapper-label', id: "wrapper__label--category" do
              カテゴリー：
              %span.required ※必須
              .category-wrapper-box
                .category-wrapper-select
                  .category-wrapper-select__box
                    = f.collection_select :category_id, Category.roots, :id, :name, {selected:@production.category.parent.parent.name}, { class: 'category-wrapper__category form-control', id: 'parent_category_edit', name: "" }
                .category-wrapper-select#children_wrapper
                  .category-wrapper-select__box
                    = f.collection_select :category_id,  @production.category.parent.parent.children, :id, :name{prompt: "選択してください", selected: @production.category.parent_id}, {class: 'listing-select-wrapper--edit__child--select', id: 'child_category_edit', name: "" }
                  .category-wrapper-select__box
                    = f.collection_select :category_id, @production.category.parent.children, :id, :name,{prompt: "選択してください", selected: @production.category.id}, {class: 'listing-select-wrapper--edit__grandchild--select', id: 'grandchild_category_edit', name: "product[category_id]" }

~~~~~~~~~~~~~~~~~~~~~~~省略~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~


get_category_children.json.jbuilder

json.array! @category_children do |child|
  json.id child.id
  json.name child.name
end

get_category_grandchildren.json.jbuilder

json.array! @category_grandchildren do |grandchild|
  json.id grandchild.id
  json.name grandchild.name
end
```

### 試したこと

付与した、クラスの名前
記述ミスないか
@production(:category_id)or@production(:category.id)
など、思いつくことは行ったのですが、うまくいかないのでご教授いただけると幸いです！！汗


### 補足情報（FW/ツールのバージョンなど）

rails 6.0.0

ここにより詳細な情報を記載してください。

カテゴリーの取得ができない　Couldn't find Category without an IDエラー

### 前提・実現したいこと

漫画閲覧サイトを作ろうとしています。
モーダル内でスライダーで閲覧できるようにしたいのですが、
知識不足でエラーが解決できません。
皆様のお力貸していただければと思っております。

eachで回して動的にid名を生成させようとしてましたらエラーが発生し、
前に進めれない状況です。
何卒、よろしくお願いいたします。

### 発生している問題・エラーメッセージ

```
ActionView::Template::Error (undefined method `map' for "modal-content-1":String):
```

### index.html.haml

```ruby
  - @mangas.each do |manga|
        - manga_pages = manga.to_s.length
        - manga.manga_image.each.with_index(1) do |manga_img, i|
          %label.mpo-modal-close{:for => "mpo-modal-controller"} ×
          -if i == 1
            %input{id = "modal-content-#{i}"}.modal-radio{:checked => "checked", :hidden => "", :name => "content-nav", :type => "radio"}/
          -else
            %input{id = "modal-content-#{i}"}.modal-radio{:hidden => "", :name => "content-nav", :type => "radio"}/
          %div(class="content-#{i}, mpo-modal-slide")
            .mpo-modal-content
              = image_tag manga_img.to_s, alt: "#{manga_img}"
              .mpo-modal-nav
              - if i > 1
                %label.prev-slide{:for => "modal-content-#{i - 1}"} ‹‹
              - else
                = nil

              - if i < manga_pages
                %label.next-slide{:for => "modal-content-#{i + 1}"} ››
              - else
                = nil
```


### 補足情報（FW/ツールのバージョンなど）
centos
ruby 2.5.1p57 (2018-03-29 revision 63029) [x86_64-linux]
Rails 5.2.0
gem 'mysql2', '>= 0.4.4', '< 0.6.0'
gem 'carrierwave'
→2.7.6

下記のサイトを参考にスライダーを作成しようとしておりました。
https://codepen.io/marv117/pen/WvZdGV/

undefined method `map' for の解決方法がわかりません

railsでform_withを使って送信フォームを作っています。
フォームを入力必須にしたいのですが、うまくいきません。
htmlに変換されるときに、inputタグにrequiredをつけるだけなのですが、どうすればよいでしょうか？

下記のようにしたら、
<input html="required">
とhtml=がついてしまい、ダメでした

```haml
= form_with url:article_path, local: true do |f|
  = f.text_field :title, html:"required"
  = f.text_field :content

  = f.submit "送信"

```

railsのform_withを入力必須にする

### 環境
haml、Bootstrap４

### やりたいこと
ヘッダーを２段にしたい
![イメージ説明](8ee7a7ac1b773e8852ef83cfaa5f4b30.png)

```haml
%nav.navbar.navbar-header.navbar-expand-lg.fixed-top
  .col-12
    %a.navbar-brand.align-items-left{:href => "/"} 
      = image_tag("logo.png", width: '100%',alt: "logo")
    .text-rigth
      メールはこちら  

    #navbarSupportedContent.collapse.navbar-collapse
      %ul.navbar-nav.mx-auto
        %li.nav-item.active.justify-content-center.align-items-center
          %a.nav-link{:href => "#"}
            ナビ１
        %li.nav-item.justify-content-center
          %a.nav-link{:href => "#"} ナビ２
        %li.nav-item.justify-content-center
          %a.nav-link{:href => "#"} ナビ３
        %li.nav-item.justify-content-center
          %a.nav-link{:href => "#"} ナビ４
        %li.nav-item.justify-content-center
          %a.nav-link{:href => "#"} ナビ５

```

### できたこと
ナビを５つ２段目に並べることができた

### できないこと
メールが画像と同じ並び且つ右寄せ

### 調べたこと
flex-column　を navbar-collapseに入れてみて２段になりましたが、
ロゴの横にナビが来てしまった。

containerでヘッダーとナビを分けたが、ナビが右に寄ったため
text-centerにしたが変化がなかった。


ご教授よろしくお願いいたします。

【Bootstrap】ヘッダーを２段にしたい

`haml-rails'を使って、HTMLをhamlに変換しました。
逆に、hamlをHTMLに変換したいのですが、どうすればよいですか？

hamlをHTMLに変換するには

１回目のクリックの際にコピーもツールチップ表示もできないのですが、２回目以降だと出来ます。
原因が分かりません。
copyUrl自体は１回目でも呼ばれています。
```Haml
%span.clip.clipboard{:onclick => "cpyUrl(this)", ':data-clipboard-text' => "user.url"}
```

```JavaScriptInHaml
:javascript
  function cpyUrl(select) {
    var form;
    form = new Form;
    form.hideFieldset()
    clipboard = new Clipboard(select)
    clipboard.on('success', function(e) { // ここがクリック１回目だと動作しない
      return form.showTooltip($(e.trigger), 'copied!');
    });
    $('.clipboard').on('mouseleave', function() {
      $(this).attr('class', 'clip clipboard');
      return $(this).removeAttr('aria-label');
    });
    form.updateChildrenSelectOptions($('.select-parent'))
  }
```
もし何かお分かりの方、いらっしゃいましたら教えて頂けますと幸いです。
よろしくお願いいたします。

【JS】クリック１回目のイベントだけ発生しない【Clipboard.js】

### 前提・実現したいこと
ArgumentError in Groups#index
直したいです。

- リスト
### 発生している問題・エラーメッセージ
ArgumentError in Groups#index
First argument in form cannot contain nil or be empty
と、出てしまって困っています。
どなたか助けていただけますでしょうか？

### 該当のソースコード

```ここに言語名を入力
routes.rb

 Rails.application.routes.draw do
   devise_for :users
   root 'groups#index'
   resources :users, only: [:index, :edit, :update]
   resources :groups, only: [:new, :create, :edit, :update] do
     resources :messages, only: [:index, :create]
   end
 end
```
```
messages_controller

 class MessagesController < ApplicationController
  before_action :set_group

  def index
    @message = Message.new
    @messages = @group.messages.includes(:user)
  end

  def create
    @message = @group.messages.new(message_params)
    if @message.save
      redirect_to group_messages_path(@group), notice: 'メッセージが送信されました'
    else
      @messages = @group.messages.includes(:user)
      flash.now[:alert] = 'メッセージを入力してください。'
      render :index
    end
  end

  private

  def message_params
    params.require(:message).permit(:content, :image).merge(user_id: current_user.id)
  end

  def set_group
    @group = Group.find(params[:group_id])
  end
end
```
```
  group_controller

class GroupsController < ApplicationController
  before_action :set_group, only: [:edit, :update]
  
  def index
  end

  def new
    @group = Group.new
    @group.users << current_user
  end

  def create
    @group = Group.new(group_params)
    if @group.save
      redirect_to root_path, notice: 'グループを作成しました'
    else
      render :new
    end
  end


  def update
    if @group.update(group_params)
      redirect_to root_path, notice: 'グループを更新しました'
    else
      render :edit
    end
  end

  private

  def group_params
    params.require(:group).permit(:name, { :user_ids => [] })
  end

  def set_group
    @group = Group.find(params[:id])
  end
 
end
```
```
_main_chat.html.haml

.chat-main
  .main-header
    .main-header__left-box
      .main-header__left-box__current-group aaa
      .main-header__left-box__member-list  
    .main-header__edit-btn
      =link_to "https://master.tech-camp.in/", class: "contents__btn" do
        Edit
  .messages
  .message
  .chat-form
    %form.new_message
      .input-box
        %input{type:"text",class:"input-box__text",placeholder: "type a message"}
        %label{class: "input-box__image"}
          = icon('fas', 'image')
          %input{type: "file", class: "input-box__image__file"}
      %input{type: "submit",class: "submit-btn",:value => "Send"} 
    .form
      = form_for [@group, @message] do |f|
        = f.text_field :content, class: 'form__message', placeholder: 'type a message'
        .form__mask
          = f.label :image, class: 'form__mask__image' do
            = icon('fas', 'image', class: 'icon')
            = f.file_field :image, class: 'hidden'
        = f.submit 'Send', class: 'form__submit'
```
```
_side_bar/html/haml

.chat-side
  .side-header
    .side-header__box
      %p.side-header__box_username
        = current_user.name
      %ul.side-header__box__menu
        %li.side-header__box__edit-user
          = link_to new_group_path do
            = icon('fas', 'edit')
        %li.side-header__box__new-group
          = link_to edit_user_path(current_user) do
            = icon('fas', 'cog', class: 'icon')
   
  .groups
    - current_user.groups.each do |group|
      .group
        = link_to '#' do
          .group__name
            = group.name
          .group__message
            メッセージはまだありません。
  
```
```
index/html/haml

.wrapper
= render "shared/side_bar"
= render "shared/main_chat"

```
### 試したこと

routesやcontrollerの記述やindexアクションに対して色々と試行錯誤したのですが内容がsyntaxエラーになるだけで根本のエラーが解決できません。。。

どなたかよろしくお願いします。。。