link_toで作ったリンクの文字の色や下線を消したい時

haml

%li.Edit-btn
= link_to 'Edit', edit_group_path(@group.id),class: "Editlink"

link_toの最後にclass名を指定する。今回はEditlink。

scss

.Edit-btn {
  list-style: none;
  color: #38aef0 ;
  font-size: 16px;
  height: 40px;
  line-height: 40px;
  width: 72px;
  padding: 0 20px;
  margin-top: 28px;
  border: 1px solid #38aef0 ;
  position: absolute;
  right: 40px;
  .Editlink {
    text-decoration: none;
    color: #38aef0 ;
  }

}

これをscss上.Edit-btnの中に.Editlinkとしてネストし、

その中で、

text-decoration: none;
color: #38aef0 ;

などと指定してあげると、色変えや下線を取り除くことができる。

この記事が気に入ったらサポートをしてみませんか?