Advertisement

UCP CSS changes

This is a list of changes that will/may need to be made to wikis when transitioning to UCP Phase 1. Document any changes that will need to be made here.

Different/renamed classes

The class/id names of the following have been changed or removed:

  • .thumbimage has been changed to .thumb, meaning any modifications to thumb will need the class changed.
  • .article-table remains and has new styling entirely from Fandom. Coloration will need overwriting in CSS so wikis can make use of this class.
  • #WikiaArticle has been changed to #content.
  • There are a few other changes in the tree of elements that wrap the content, so selectors have to be re-checked. For example, the class .mw-content-text was removed, but the id #mw-content-text still exists on the same element, along with a class about the content language direction.
  • The dedicated element #WikiaPageBackground does not exist anymore. It is possible to apply background properties to elements in the main HTML tree (in particular, #WikiaPage or .WikiaPageContentWrapper), but since all page content elements are their descendants, it limits some options such as applying transparency.

Differences

Infoboxes

These are mostly the same, though the image tabs, at .pi-image-collection-tabs now has a top and bottom margin, that may need removing depending on the wiki.

Edit buttons

The edit buttons have entirely different look with both edit and edit source buttons. These are contained in the .mw-editsection in order to edit it. Any modifications to the previous classes such as .sprite.edit-pencil will not be present, and new modifications will be needed.

Edit windows

Because the entire edit window is now in a new modal, any CSS affecting #editarea will need to be removed and rethought entirely, as it can cause the page to break.

Dark theme

.oasis-dark-theme does not work on UCP (phase 1). As an alternative, it is recommended to make CSS variables for dark/light theme equivalents, and then just comment/uncomment when switching between them.

See also

Community content is available under CC-BY-SA unless otherwise noted.
  NODES
COMMUNITY 6
Note 1