Page History

Sv translation

language	en

Below you can see a detailed list of css elements you can select and customize. That way you can very easily change a complete visual style of your Belladati domain.

Info
See the whitelabeling tutorial here.

Navigation topbar:	.topbar
Topbar menu links + icons:	.topbar ul li a
Search input:	.topbar form input
Search input typed text:	form#quickSearchForm .txt
Search icon:	#quickSearchForm .icon-search:before
Search vertical line:	.icon-search-position-fix (border-right: 1px solid #fff; )

BODY CONTENT

Note
Be careful when modifying the global css styles, it could result in unexpected visual modifications throughout the entire application.

Body:	body.desktop
Dashboard dashlets title header:	.dashletHeader
Other links:	a

LEFT SIDEBAR

Sidebar body:	.sidebarBlock
Sidebar title:	.sidebarBlock h3
Sidebar link:	.sidebarBlock a

RIGHT SIDEBAR - HISTORY, FILTERS & VARIABLES

Sidebar body:	.setupPanel, .sidePanelPadding
Sidebar body content:	#reportView .setupPanel, #reportView .sharingPanel, #reportView .historyPanel
Icon colors:	.icon-info:before, .icon-search:before, .icon-calendar:before, .icon-attribute-date:before
Other icons “i”:	#reportView .setupPanel i, #reportView .sharingPanel i, #reportView .historyPanel i
Button colors:	.btn.primary, .btn
Sidebar links:	#reportView .setupPanel a, #reportView .sharingPanel a, #reportView .historyPanel a

REPORTS

Report title (without top banner):	.top_header_no_topbar h2
Report title (with top banner):	.topbar_bg_title
Report title icon (without top banner):	#contentColumn h2 [class^="icon-"]:before, h2 [class=" icon-"]:before, #content h2 [class^="icon-"]:before, h2 [class=" icon-"]:before
Report title icon (with top banner)	.topbar_bg_out [class^="icon-"]:before, .topbar_bg_out [class*=" icon-"]:before
Report top control buttons:	#reportPanelActions .btn
Report top control buttons pop-up menu:	#reportPopupMenu, #reportPopupMenu a
Report view control buttons:	.editViewMenu a, .viewMenu a
Report view title color:	.viewContentInnerLayout
Floating button - Edit:	.btn.primary.editModeStart
Floating button - Save changes:	.btn.primary.saveAllViews
Floating button - Finish:	.btn.primary.editModeEnd
Floating button - Reset:	.btn.editModeReset

TABLES

Table body:	table.list, table.t-data-grid
Table header:	table.t-data-grid thead tr th, table.t-data-grid tr th
Odd table row:	.oddRow, .oddRow td
Even table row:	.evenRow, .evenRow td

Data import table:	.dataImportTable

FORM ELEMENTS

Select	select
Text input	`input[type=text]`

BOTTOM MENU

Bottom menu:	#bottomMenu
Bottom menu links:	#bottomMenu a
Bottom menu copyright:	#bottomMenu .copyright
Bottom menu line separators	#bottomMenu .support, #bottomMenu .privacyPolicy, #bottomMenu .securityStatement, #bottomMenu .termsOfUse (border-left: 1px solid #7893ac;)

OTHER

Note
To customize the other elements not listed here, please use the inspector feature in your browser in order to find the css selector.

PAGE IDENTIFICATION

Each page has its own unique identifier stored in the attribute "data-page-name" of the body element.

POP-UP WINDOW IDENTIFICATION

Each pop-up window has its own unique identifier stored in the attribute "data-id" of the div element.

MULTI-SELECT ELEMENTS

All multi-select elements have an attribute "data-label" containing the actual value of the element.

Sv translation

language	ja

下には、選択してカスタマイズできるCSS要素の詳細なリストがあります。そうすれば、Belladatiドメインの完全なビジュアルスタイルを簡単に変更できます。

Info
ホワイトラベリングマニュアルをここでご参照してください。

トップバー

ナビゲーショントップバー:	.topbar
トップバーメニューのリンク+アイコン:	.topbar ul li a
入力検索:	.topbar form input
入力テキスト検索:	form#quickSearchForm .txt
アイコン検索:	#quickSearchForm .icon-search:before
縦線検索:	.icon-search-position-fix (border-right: 1px solid #fff; )

本文の内容

Note
グローバルCSSスタイルを変更するときは、アプリケーション全体に予期しない視覚的な変更が発生する可能性があるので注意してください。

本文:	body.desktop
ダッシュボードダッシュレットのタイトルヘッダ	.dashletHeader
その他のリンク:	a

左のサイドバー

サイドバー本文:	.sidebarBlock
サイドバーのタイトル:	.sidebarBlock h3
サイドバーリンク:	.sidebarBlock a

右側のサイドバー・歴史・フィルタ・変数

サイドバー本文:	.setupPanel, .sidePanelPadding
サイドバー本文の内容:	#reportView .setupPanel, #reportView .sharingPanel, #reportView .historyPanel
アイコンの色:	.icon-info:before, .icon-search:before, .icon-calendar:before, .icon-attribute-date:before
の他のアイコン"i":	#reportView .setupPanel i, #reportView .sharingPanel i, #reportView .historyPanel i
ボタンの色:	.btn.primary, .btn
サイドバーリンク:	#reportView .setupPanel a, #reportView .sharingPanel a, #reportView .historyPanel a

報告

レポートのタイトル（トップバナーなし）	.top_header_no_topbar h2
レポートのタイトル（トップバナーがある）	.topbar_bg_title
レポートのタイトルのアイコン（トップバナーなし）:	#contentColumn h2 [class^="icon-"]:before, h2 [class=" icon-"]:before, #content h2 [class^="icon-"]:before, h2 [class=" icon-"]:before
レポートのタイトルのアイコン（トップバナーがある）	.topbar_bg_out [class^="icon-"]:before, .topbar_bg_out [class*=" icon-"]:before
トップコントロールボタンのレポート	#reportPanelActions .btn
トップコントロールボタンポップアップメニューのレポート	#reportPopupMenu, #reportPopupMenu a
ビューのコントロールボタンのレポート	.editViewMenu a, .viewMenu a
ビューのタイトルの色のレポート	.viewContentInnerLayout
フローティングボタン・編集	.btn.primary.editModeStart
フローティングボタン・変更保存	.btn.primary.saveAllViews
フローティングボタン・完了	.btn.primary.editModeEnd
フローティングボタン・リセット：	.btn.editModeReset

テーブル

テーブル本文：	table.list, table.t-data-grid
テーブルのヘッダー:	table.t-data-grid thead tr th, table.t-data-grid tr th
奇数のテーブル行:	.oddRow, .oddRow td
偶数のテーブル行:	.evenRow, .evenRow td

データのインポートテーブル:	.dataImportTable

フォーム要素

選択	select
テキスト入力	`input[type=text]`

下部のメニュー

下部のメニュー:	#bottomMenu
下部のメニューのリンク:	#bottomMenu a
下部のメニューの著作権:	#bottomMenu .copyright
下部のメニューの行区切り	#bottomMenu .support, #bottomMenu .privacyPolicy, #bottomMenu .securityStatement, #bottomMenu .termsOfUse (border-left: 1px solid #7893ac;)

その他

Note
ここに記載されない他の要素をカスタマイズするには、ブラウザのインスペクタ機能を使用してcssセレクタを探してください。

Page tree

Versions Compared

Old Version 13

New Version 14

Key

TOPBAR