次のうちのいずれかのエンティティで作成された定義をインポートして使用します: Design System オブジェクト、デザインシステムのトークン、デザインシステムのスタイルおよび外部 CSS。
このルールは、Design System オブジェクト (DSO) のスタイルの定義の先頭に記述します。

構文

{@import {{ <DSO_name> | <DSO_name>.tokens  | <DSO_name>.styles }...           
           | 
           { <CSS_path_file> }...           
           | 
           {gx-file'('<CSS_KB_file>')'}...           
           }';' 
}...

「デザインシステムのクラスの記述スタイル」を参照
入力値の説明:
DSO_name
    KB の DSO の [ Qualified Name ] プロパティの値です。 
CSS_path_file
     インポートする外部 CSS ファイルの相対パスまたは絶対パスです。
CSS_KB_file
     CSS 形式を含む KB の File オブジェクトの名前です。
gx-file
     アクセスする KB の File オブジェクトを指定するために、 [ Styles ] で使用できる関数です。 

制限

●   .css ファイルのみをインポートできます。
●    ファイルのインポートと DSO のインポートを同じ行で組み合わせることはできません。
●    このルールは、 [ Styles ] での定義の先頭にのみ記述できます。

考慮事項

●    デザインシステムの [ Styles ] には、同じ DSO のトークンの暗黙的なインポートが常に存在します。この暗黙的なインポートは、実行されるほかのすべてのインポートよりも優先され、削除できません。
●    上記の事項、また同じ DSO 内の [ Styles ] エレメントと [ Tokens ] エレメントが直接的な依存関係にあることから、外部 DSO からスタイルをインポートすることは、完全な DSO をトークンでインポートすることと同じです。
●    インポートの優先順位は、次のルールに従います:
                       ○    DSO 自体のすべてのクラスおよびトークンは、ほかからインポートされたクラスおよびトークンよりも優先されます。
                       ○    import ルールが複数ある場合、前に記述されているルールよりも 2 つ目に記述されたルールが優先されます。

例

styles MyStyles 
{ 
    @import DesignSystem1 DesignSystem2.tokens DesignSystem3.styles; 
    @import "../my_file1.css" "../my_file2.css"; 
    @import gx-file(CSSFile.css); 

    .class1 
    { 
        //プロパティ...     
    }
}

使用可能バージョン

GeneXus 17 Upgrade 6 以降。

参考情報

一般的なトピック「デザインシステムのスタイルのルール」を参照してください。
構文の表記規則