AIM Web API | CSS Documentation
The following is a list of class names and ids assigned to HTML elements generated by the API so that you can style your widgets however you like.
An example CSS file that styles the Buddy List widget to look similar to the AIM 6.0 client can be found here.
Buddy List Selectors
- #AIMBuddyListContainer
- This is the main container element that the API hook and builds its required elements into. It is the only element that you are required to hard code into the document, and is the element with the wim_key attribute that the API will access and pass to the host.
- #AIMBuddyList
- A <ul> element that acts as the top level container element for the buddy list.
- .AIMBuddyListHeading
- An <h2> element used for the group names in the buddy list, i.e., "Family" or "Buddies"
- .AIMBuddyListGroup
- A <ul> element that is the container element for the aim ids in that group.
- .AIMBuddyListGroupEven
- Assigned to the <ul> elements that act as the container element for aim ids in a group. Can be used to faciliate zebra stripe color schemes, etc, for buddy groups.
- .AIMBuddyListGroupOdd
- Assigned to the <ul> elements that act as the container element for aim ids in a group. Can be used to faciliate zebra stripe color schemes, etc, for buddy groups.
- #AIMBuddyList .AIMBuddyListGroup .buddy
- An <li> element that contains an aim id. Is a child of .AIMBuddyListGroup.
- #AIMBuddyList .AIMBuddyListGroup .away
- Assigned to the <li> element that represents a given aim id when that user has changed their online status to "away".
- #AIMBuddyList .AIMBuddyListGroup .online
- Assigned to the <li> element that represents a given aim id when that user has changed their online status to "available".
- #AIMBuddyList .AIMBuddyListGroup .idle
- Assigned to the <li> element that represents a given aim id when that user has changed their online status to "idle".
- #AIMBuddyList .AIMBuddyListGroup .mobile
- Assigned to the <li> element that represents a given aim id when that user has changed their online status to "mobile".
- #AIMBuddyList .AIMBuddyListGroup .offline
- Assigned to the <li> element that represents a given aim id when that user signs off or goes invisible.
- #AIMBuddyList .AIMBuddyListGroup .even
- Assigned to even numbered <li> elements in the buddy list. Can be used to zebra-stripe the list, etc.
- #AIMBuddyList .AIMBuddyListGroup .odd
- Assigned to odd numbered <li> elements in the buddy list. Can be used to zebra-stripe the list, etc.
- #AIMBuddyListBuddyInfo
- A <div> element that floats above aim ids in the buddy list and displays that users information.
- .AIMBuddyListAvailabilityMenu
- A menu that allows the user to set their status, sign off, start a conversation, etc. Also exists on IM windows if
CREATE_AVAILABILITY_MENU_IM is true.
- .AIMBuddyListAvailabilityMenuActionPoint
- The clickable portion of the menu that invokes the menu proper. Also exists on IM windows if
CREATE_AVAILABILITY_MENU_IM is true.
- .AIMBuddyListAvailabilityMenuAvailable
- How the actionable portion of the availablity menu will appear when the user's state is "online".
- .AIMBuddyListAvailabilityMenuAway
- How the actionable portion of the availablity menu will appear when the user's state is "away".
- .AIMBuddyListAvailabilitySubMenu
- The appearence of the menu that pops up when the user activates the availability menu.
- .AIMBuddyListAvailabilitySubMenu li
- Each item in the availability menu.
- .AIMBuddyListUserScreenName
- The user's screen name at the top of the buddy list.
- .AIMBuddyListBranding
- An element to contain branding for the application.
- #AIMBuddyListContainer hr
- Divider lines in the availability menu.
Instant Message Window Selectors
- .AIMBuddyListIMWindow
- Assigned to <div> elements that act as IM windows.
- .AIMBuddyListWindowTitleBar
- Assigned to <h2> elements that act as the title bar in IM windows.
- .AIMBuddyListIMWindowDragState
- Assigned to the <div> element that acts as an IM window when the window is being dragged by the user.
- .AIMBuddyListIMWindowTextArea
- A <div> element in the IM window where converstation text appears.
- .AIMBuddyListIMWindow .AIMBuddyListIMWindowTextArea p
- Each conversation block in the IM window is wrapped in a paragraph element. This includes the aim id, the time stamp and the message text.
- .AIMBuddyListIMWindowTextInput
- The text <input> element that the user enters IM text into.
- .AIMBuddyListUser
- How the person running the applications screen name will appear in their converstation window.
- .AIMBuddyListUserBuddy
- How the person the user is having a conversation with name will appear in the conversation window.
- .AIMBuddyListIMWindowButton
- The look of the "send" button on an IM window.
- .AIMBuddyListTimeStamp
- The appearence of the time stamp in the conversation window.
- .AIMBuddyListTypingStatusTyping
- Assigned to the element that shows typing status when the other user is currently typing.
- .AIMBuddyListTypingStatusTyped
- Assigned to the element that shows typing status when the other user has entered text.
- .AIMBuddyListTypingStatusStoppedTyping
- Assigned to the element that shows typing status when the other user has stopped typing, or cleared the text from the input box.
- .AIMBuddyListIMWindowNotifyOn
- Applied to the title bar of an IM window as the "on" state of a flashing visual notification.
- .AIMBuddyListIMWindowNotifyOff
- Applied to the title bar of an IM window as the "off" state of a flashing visual notification.
Miscellaneous Selectors
- .AIMFrameContainer
- Applied to the <div> element that wraps the authentication and consent iframe.
- .AIMFrameContainer iframe
- The iframe that contains the authentication and consent forms.
- .AIMFrameContainer h2
- The element that acts as the window title for the authentication/consent iframe.