こんにちは、ハヤマです。 今回は、「バリアント」機能を使ってコンポーネントのバリエーションを作っていきたいと思います。 前回の記事はこちら tech.arms-soft.co.jp ※本記事では、Figmaの機能名は日本語化された名称で記載しています。 バリアントとは …

こんにちは、ナカムラです。 今回はCSSの色の指定について書きたいと思います。 CSSのcolor-mix()という関数を使ってみようと思います。 color-mix()とは 簡単にいうと2色を混合させる関数です。 MDNからの引用 color-mix() 関数記法は 2 つの 値を採り、指…

こんにちは、コバヤシです。 以前Laravel6で認証をカスタマイズする方法を書きましたが、 tech.arms-soft.co.jp 今回はLaravel11でBreezeを使用した認証をカスタマイズする方法を書いていきます。 Breezeがインストールされていて動作していることを前提とし…

こんにちは、ドイです！ 前回に引き続き、データサイエンス100本ノックに挑戦していきます。 前回の記事 tech.arms-soft.co.jp S-056: 顧客データ（customer）の年齢（age）をもとに10歳刻みで年代を算出し、顧客ID（customer_id）、生年月日（birth_day）と…

こんにちは、ユアサです。 今回は前々回作成したギャラリーモーダルを改修していきます。 ↓前回の記事はこちら tech.arms-soft.co.jp 現状の動作の流れをまとめる まず改修前のギャラリーモーダルを確認します。 See the Pen gallery_modal by felly (@felly…

こんにちは、ハヤマです。 今回は久しぶりに、こちらのシリーズの続きを。 tech.arms-soft.co.jp コンポーネント化する想定でボタンを作成していきたいと思います。 コンポーネントとは デザインファイルやページの中で何度も利用する要素に対し設定する、共…

こんにちは、ナカムラです。 今回はwebフォントの文字詰めについてです。 デザイナーから基本的に文字詰めはしたいという要望もあったので一度整理しておこうかと思います。 普段Googleフォントから提供されているNoto Sans JPを使用することが多いので文字…

こんにちは、ドイです！ 前回に引き続き、データサイエンス100本ノックに挑戦していきます。 前回の記事 tech.arms-soft.co.jp S-052: レシート明細データ（receipt）の売上金額（amount）を顧客ID（customer_id）ごとに合計の上、売上金額合計に対して2,000…

こんにちは、コバヤシです。 今回はWordPressの投稿ページのパーマリンクにカスタムフィールドの値を使用する方法について書きます。 よくある方法 今回は、/hogehoge/【カスタムフィールドで設定した値】で投稿ページを表示したいと思います。 （カスタムフ…

こんにちは、ユアサです。 今回は前回作成したギャラリーモーダルに工夫を加えるためのパーツについてまとめていきたいと思います ↓前回の記事はこちら tech.arms-soft.co.jp altを取得しよう imgタグに指定されているalt属性はgetAttribute('alt')を使って…

こんにちは、ハヤマです。 前回はFigmaでの申し送りやメモを共有するのに便利なウィジェットについて記事を書いたのですが、 社内でいくつかリアクションをもらえたことと、前回調べた中で紹介しきれなかったものがありましたので 今回も引き続き、コメント…

こんにちは、中村です。 前回書いた文字の下線に関するCSSプロパティについて、そのままでは困ったところがあったので補足として記事にしました。 と言っても解決方法はプロパティを一つ追加するだけです。 前回の記事はこちら tech.arms-soft.co.jp 問題点…

こんにちは、ドイです！ 前回に引き続き、データサイエンス100本ノックに挑戦していきます。 前回の記事 tech.arms-soft.co.jp S-046: 顧客データ（customer）の申し込み日（application_date）はYYYYMMDD形式の文字列型でデータを保有している。これを日付…

こんにちは、コバヤシです。 今回は、ファイルの変更を検知して他のサーバーと同期する方法について書いていきます。 サーバーはAlmaLinux8を想定しています。 inotifywait inotifywaitはLinuxシステムでファイルやディレクトリの変更を監視するためのコマン…

こんにちは、ハヤマです。 今回は、Figmaの「コメントの追加」機能以外で、メンバー間での申し送りやメモを共有するのに便利なウィジェットをご紹介します。 Figmaの「コメントの追加」機能 まずはFigmaのデフォルトの機能について、簡単に。 ツールバーにあ…

こんにちは、ユアサです。 今回は写真ギャラリーの特定の写真をクリックしてモーダルで表示し、更にモーダル内で他の写真も閲覧できるモーダルギャラリーの実装をしていきたいと思います。 そもそもどうして自分で作成しようとしたのか ギャラリーモーダルを…

こんにちは、コバヤシです。 ついにLaravel11が3月15日にリリースされました。 約1ヶ月遅れのリリースですね。 前回のブログでLaravel11の変更点をまとめましたが、今回のリリースに伴い、再び変更点を見ていきたいと思います。 前回のブログはこちら tech.a…

こんにちは！ドイです。 今回は、homebrewをアップデートしたところ、PHPが実行できなくなったので、解決していきます。 現象 PhpStormで、PHP_CodeSnifferが実行できなくなりました。 上部メニューから、PhpStorm > settings > PHP > 品質ツール > PHP_Code…

こんにちは、ナカムラです。 最近関わった案件で文字に下線が引かれたデザインが多かったので、今回は下線のスタイルを調整するときに使うCSSプロパティをご紹介したいと思います。 DEMO See the Pen CSSで文字の下線をスタイル調整する by Nakamura (@takay…

こんにちは、ユアサです。 以前業務でSwiperを使ったスライダーをスマホ表示時に解除してカラム表示にすることがあったので、今回はPC・スマホそれぞれのウィンドウ幅の可変で都度Swiperを実装・解除する方法について備忘録の意味も込めて書きまとめたいと思…

こんにちは、ハヤマです。 今回は、和文のフリーフォント探しに便利なサイトをご紹介します。 モジザイ 「モジザイ」は、和文のフリーフォントを書体の種類やスタイルから連想するイメージワードをもとに約300種類の中から検索できるサイトです。 www.mojiza…

こんにちは、ナカムラです。 今回はCSSだけで円グラフを作ってみたいと思います。 文字を配置するにあたり、CSSの三角関数cos()・sin()を使用します。 グラフを作るというよりまだ使ったことがなかったので、三角関数を使うというのが今回のテーマになります…

こんにちは、コバヤシです。 今回はLaravelの次期バージョンであるLaravel11の新機能を見てみたいと思います。 Laravel11のリリース時期 laravel11は2024/2/6にリリースされることがアナウンスされていましたが、 この記事を書いている2024/2/10時点では、ま…

こんにちは、ドイです！ 前回に引き続き、データサイエンス100本ノックに挑戦していきます。 前回の記事 tech.arms-soft.co.jp S-041: レシート明細データ（receipt）の売上金額（amount）を日付（sales_ymd）ごとに集計し、前回売上があった日からの売上金…

こんにちは、ユアサです。 弊社の案件で要素の角が欠けている（ベベルのある）デザインをコーディングする機会がありましたので、今回はその備忘録も兼ねてまとめていきたいと思います。 どのように作成すればいいのかさっぱり分からなかったので、こちらの…

こんにちは、ハヤマです。 今回は、比較的新しい画像ファイルのフォーマット「WebP（ウェッピー）」について紹介したいと思います。 WebP（ウェッピー）とは 2010年に米Googleが開発した画像ファイルのフォーマットのことで、ファイルの拡張子は「.webp」で…

こんにちは、ナカムラです。 以前の記事でtimelineをスキップするメソッドをご紹介しました。 tech.arms-soft.co.jp 今回は逆再生をしてみたいと思います。 DEMO See the Pen GSAPのtimelineアニメーションを逆再生する by Nakamura (@takayo-nakamura) on C…