Page Comparison

...

This section describes the UI images that are supplied with the Sample Theme. These images fit into the default styling and design of the user interface and can be used . You can use these images as a guide for the approximate dimensions of your images.

In Abiquo CSS branding you can also add your own images and restyle them as required.

...

...

...

...

logo

The default enterprise logo is called logo.png.

• We recommend a transparent background so that the background shading underneath the logo will be visible

• High resolution logos (with higher

  ppi

  PPI) may download slowly to the browser and display slowly to the user

• The abiquo_gray.png file is the default enterprise logo in the sample theme

abiquo_gray

The abiquo_gray.png file is used as the default enterprise logo.

Dimensions: 132 x 33 pixels

Image Removed

abiquo_login

The abiquo_login.png file is displayed in the login dialog

Dimensions: 223 x 53

Image Removed

abiquo_watermark

The abiquo_watermark.png file is displayed in Dimensions: 150 x 150 pixels

...

Reserved area: 48 x 48 pixels.

...

abiquo login logo

The login logo file called abiquo.png displays on the login dialog.

Dimensions: 156 x 42 pixels

...

...

login-panel-bg

The login-panel-bg.png file is the background of the login screen.

Dimensions: 677 360 x 577 360 pixelsImage Removed

...

...

favicon

The favico.ico file contains a small Abiquo logo in Microsoft icon format. By default the favicon is shown in the browser tab where Abiquo is running

Dimensions: 16 x 16 pixelsImage Removed

...

The image shown here is a png version. To obtain get the favico.ico version, click on the following linkfind it in the Abiquo default theme files.

favicon.ico

...

Locale flags

See Abiquo UI Client Language Configuration

...

mainmenu-buttons

The main menu buttons are individual icons of 30x30 pixels, loaded by the customer in the CSS file.

Individual icons

Home icon

Image Removed

Infrastructure icon

The infrastructure icon is the solid fa-server icon from fontawesome.

Virtual datacenters icon

The virtual datacenters icon is the solid fa-cloud icon from fontawesome.

Apps library icon

Image Removed

Users icon

The users icon is the solid fa-users icon from fontawesome.

Pricing icon

Image Removed

Events icon

...

Control icon

The control icon is the solid fa-heartbeat icon from fontawesome.

Configuration icon

Image Removed

Reports icon

Image Removed

Documentation icon

The documentation icon is the fa-book icon from fontawesome.

External URLs icon

...

Icon sheet

If you have a custom icon sheet as in previous versions of Abiquo, you will need to create custom CSS to reference the icons on this sheet. An icon sheet is displayed here against a colored Abiquo loads the main menu icons from an icon sheet.

Dimensions of icon sheet: 216 x 2300

If you do not wish to use an icon sheet, you can add individual images, although this method is less efficient.

Reserved area per icon: 24 x 24

This is a small version of the icon sheet displayed against a gray background. 

...

...

For example, the CSS to reference the virtual datacenters icon is:

...