Share via

CSS Theme Styling

  • Article

 

Applies To: Windows Azure Pack

There are 6 CSS file that allow custom theming the Windows Azure Pack management portal for tenants. A further CSS file allows custom theming of the authorization site. In the Contoso theming kit, the files are as follows:

Management Portal for Tenants CSS Files

Location:\MgmtSvc-TenantSite\Content\ThirdPartyTheme\Styles

Dashboard.css

Dashboard.css defines styles for the Windows Azure Pack dashboard. You can style the following items:

Controls

  • Push button - Selected

  • Push button - edited

  • Table – edited row

  • Slider – current value

  • Slider - edited

Usage Bars

  • Background color

Drawer.CSS

Drawer.CSS defines styles for the drawer.

Windows Azure Pack Drawer.css

Closed Drawer

  • Background color

  • Highlight on drawer New button

  • Highlights on drawer commands

Open Drawer

  • Quick create Ok button

  • Background color of open drawer

  • Color of New button when drawer is opened

  • Color of Help button when drawer is opened

  • Border color for main menu and sub menu

  • Erase menu bottom border

  • Border color for item preview text

  • Menu active and hover item

  • Menu item hover

Progress Operations

Deterministic Progress

Confirmations

Help Drawer

Extensions.CSS

Extensions.CSS defines styles for Windows Azure Pack extensions. You can style the following items:

  • Category selection

  • Product selection and hover

Web Sites Quick Start

Lists.CSS

Lists.CSS defines list styles within the Windows Azure Pack Tenant Portal.

Windows Azure Pack Lists.css

You can style the following items:

  • Selected row background color

  • Background color for selected navigation item

  • Background color when row is selected and navigation item is hovered

  • Background color for rows being hovered

  • Background color of navigation item when non hovered and non-selected

  • Background color - navigation item when row is hovered

  • Background color - navigation item when navigation item is hovered

Navigation.CSS defines styles for navigation. You can style the following areas:

  • Avatar bar

  • Tabs

  • Left navigation bar

  • Left navigation - second level

Wizard.CSS

Wizard.CSS defines styles for wizard pages.

Windows Azure Pack Login.css

Authorization Site CSS Files

Location:\MgmtSvc-AuthSite\Content\ThirdPartyTheme\Styles

Login.CSS

Login.CSS defines styles for the Login page.

Windows Azure Pack Login.css

See Also

Windows Azure Pack Custom Theming