ベーステンプレートを更新しました (C-24.0725)

コピー元サイト


目次[非表示]

  1. 1.コピー元のページ構成の変更
    1. 1.1.ボックスリンクが行・カラムで実装また、ボックスシャドウも実装
    2. 1.2.ナビの４カラム実装＆ナビ専用ボタン実装
  2. 2.管理Vr C-24.0725
    1. 2.1.ボックスリンク専用ボタンの廃止
    2. 2.2.ナビゲーションの調整
    3. 2.3.ボタンに新たなclass追加

コピー元のページ構成の変更

ボックスリンクが行・カラムで実装
また、ボックスシャドウも実装

上記の実装によりデザインパーツも新しくなったのでパーツを差し替え。


ナビの４カラム実装＆ナビ専用ボタン実装

４カラム実装により不要なクラスを削除。
また、ナビ専用ボタンを配置。


管理Vr C-24.0725

ボックスリンク専用ボタンの廃止


行やカラムにリンクが設置できる事になりましたので「btn_custom_boxlink 」を廃止。
また、それに連なるclassも廃止（box_link_colなど ）


ナビゲーションの調整

新機能追加（４カラムの実装等）により、不要な記述を削除。
また、class名も変更。

削除されたclass

  • first_2btn_col
  • second_2btn_col

変更されてたclass

icon →　stage1

stage1の役割

SP時に通常だと2段以上になるのを1段で収める役割をしてます。


ボタンに新たなclass追加

SP時にアイコンになるclassを追加

class名「sp_icon 」

    //sp時アイコン化
    &.sp_icon {
      .button-cont {
        a {
          &:is(.size-s,.size-m,.size-l) {
            @include breakpoint-sp {
              background: none !important;
              width: auto !important;
              min-width: auto !important;
              font-size: 0 !important;
              letter-spacing: 0 !important;
              border: 0 !important;
              border-radius: 0 !important;
              box-shadow: none !important;
              margin: 0;
              padding: 5px;
            }
          }
          &::before,
          &::after {
            @include breakpoint-sp {
              font-size: 22px;
              line-height: 1;
              color: var(--fo-main-color);
              margin: 0;
              top: 0;
            }
          }
        }
      }
    }


前の記事

prev-article-image

ベーステンプレートを更新しました (C-24.0509)

fOでの基本設定

パーツ配置

CSSでの装飾

サイトチェック

pagetop

© Basic Inc. All Rights Reserved.