Aureliaダイアログでボーダーカラーを変更するには？

Question

あなたがここに見ることができるように私は、ダイアログを持っている：

<template > 
     <ux-dialog > 
     <ux-dialog-body> 
      <div t="logbook.delete-logs">Möchten Sie alle Logbücher löschen?</div> 
     </ux-dialog-body> 

     <ux-dialog-footer> 
      <button attach-focus="true" click.trigger="controller.cancel()" t="logbook.cancel">Abbrechen</button> 
      <button click.trigger="controller.ok()" t="logbook.ok">Ok</button> 
     </ux-dialog-footer> 
     </ux-dialog> 
</template> 

および関連ビューモデル：

import { inject } from 'aurelia-dependency-injection' 
import { DialogController } from 'aurelia-dialog' 

@inject(DialogController) 
export class DeleteLogbook { 
    public controller: DialogController 

    constructor (controller: DialogController) { 
    this.controller = controller 
    } 
} 

私は、ダイアログの枠線の色を変更したいです。 この目的のためにAureliaのコンセプトを使用したいと思います。解決策を教えてください。

Answer 1

@Jesseがコメントで提案したように、特定の要素のスタイルをオーバーライドすることができます。この場合

、あなたは単にあなたのスタイルシートに

ux-dialog { 
    border: 5px solid #fff700; 
} 

を以下を追加しかし、注意すべき一つのことは、あなたがある場合は非常に一般的であるあなたのアウレリアmainで上記を含むスタイルシートをロードするために、ということです（または他の方法でaurelia-dialogをロードする前に）、スタイルに!importantを追加する必要があります。

ux-dialog { 
    border: 5px solid #fff700 !important; 
} 

実際のパッケージは独自のスタイルの後に読み込まれており、自然に上書きされるからです。

しかし、それはapp中またはコンポーネントによって、あなたのスタイルをロードする方が良いでしょう、あなたがこれまでに試してみました何あなたのスタイル