Change Log

UI Elements

• Improved the horizontal positioning of att.dropdown when it is displayed offscreen

• Reposition att.dropdown on window resize or device reorientation

• Allow the att.dropdown to be used as a link list

Iconography

• Added the 'icon-lock' and the 'icon-alt-faq'

• Updated the 'icon-network'

Site specific

• Fix dev docs when building for production

Site specific

• Added temporary dev docs to the UIElements page

UI Elements

• Fixed att.tabs when clicking on an already active tab

UI Elements

• Removed IE10+ input's pseudo-elements (clear and reveal)

• Fixed the text color of active the dropdowns

• Fixed pagination styles of browsers that don't support 3D transforms

• Fixed reference to inexistent icon variables

• Removed links-list visited text color

• Fixed pointer-events of icons with tooltips

• Added a fixed position class modifier to tooltips

• Updated all icon SASS extends to use icon variables

• Moved icon fonts silent selector to variables

• Fixed style of button-groups with a single button

• Fixed style of icons inside links

• Removed focus outline from popovers

• Added hide delay to att.popover

• Fixed nested accordions

• Hide all tooltips when closing popovers

• Added tooltips style option on att.color-selector

• Fixed text color for different AT&T brand colors

• Added popovers position option on att.color-selector

• Don't add an hide delay to att.popover unless specified

• Improved att.tooltip custom container feature

• Fixed grouped form fields label's font weight

• Renamed grouped form fields classes

• Fixed alignment of superscript in price labels

Iconography

• Added the 'icon-invoice'

• Updated the 'icon-calendar'

Site specific

• Added loading animation preview

• Fixed copy in Structures page

• Updated color prime-blue from #067ab4 to #0574ac

UI Elements

• Updated color prime-blue from #067ab4 to #0574ac

• Fixed att.color-selector tooltips

• Added hidden input with selected value to att.color-selector and att.value-selector

• Don't stop att.button.dropdown events propagation

• Added variables to font flat-icons, outline-icons and all-icons

• Fixed focus in Natural Language Form

• Added focus to Freestanding Accordion

• Fixed form fields transitions

• Fixed att.popover and att.tooltip click outside

• Refactor text colors in different backgrounds

Iconography

• Add Full-linear-atticons to Iconography page

Iconography

• Updated the following outline-icons:
  - outline-icon-accounts-billing
  - outline-icon-airplane
  - outline-icon-application
  - outline-icon-business-tv
  - outline-icon-camera
  - outline-icon-cart
  - outline-icon-chat
  - outline-icon-city
  - outline-icon-cloud
  - outline-icon-creditcard
  - outline-icon-cruise
  - outline-icon-deptstr
  - outline-icon-dining
  - outline-icon-download
  - outline-icon-email
  - outline-icon-employee-id
  - outline-icon-error
  - outline-icon-ethernet
  - outline-icon-faqs
  - outline-icon-featured
  - outline-icon-file
  - outline-icon-firewall
  - outline-icon-flip
  - outline-icon-folder
  - outline-icon-forum
  - outline-icon-gps
  - outline-icon-group
  - outline-icon-home
  - outline-icon-hotel
  - outline-icon-hotspot
  - outline-icon-included-checkmark
  - outline-icon-info-alert
  - outline-icon-information
  - outline-icon-internet
  - outline-icon-keyboard
  - outline-icon-keypad
  - outline-icon-laptop
  - outline-icon-lightbulb
  - outline-icon-location-pin
  - outline-icon-lock
  - outline-icon-maintenance
  - outline-icon-mobile
  - outline-icon-music
  - outline-icon-network
  - outline-icon-new
  - outline-icon-offers
  - outline-icon-overview
  - outline-icon-password
  - outline-icon-pdf
  - outline-icon-plus
  - outline-icon-power-onoff
  - outline-icon-print
  - outline-icon-protect
  - outline-icon-remove
  - outline-icon-rental
  - outline-icon-restricted
  - outline-icon-s-beam
  - outline-icon-save
  - outline-icon-search-people
  - outline-icon-smartphone
  - outline-icon-social
  - outline-icon-sound-message
  - outline-icon-sports
  - outline-icon-tech-support
  - outline-icon-temperature
  - outline-icon-top-picks
  - outline-icon-towtruck
  - outline-icon-update
  - outline-icon-usb-drive
  - outline-icon-video
  - outline-icon-voice-data
  - outline-icon-vpn
  - outline-icon-weather
  - outline-icon-webwindow
  - outline-icon-wifi

Site specific

• Fixed att.readmore script include

• Added a "Visited links" in the Elements page

• Fixed color contrast ratio values in the Structures Page

UI Elements

• Updated max width of menu dropdown from 320px to 380px

• Updated Omnes ATT fonts

• Fixed dropdowns arrows on retina screens

• Added focus state to Vertical Navigation menu items

• Added a Tag placeholder

• Added active state to Tag Cloud items

• Fixed Radio Buttons disabled state

• Updated Radio Buttons focused state

• Fixed margin between dots in Carousels

• Added aria-expanded-text and aria-collapsed-text options to att.collapse

• Fixed Information Modals icon's color

• Added focused state to all types of Tabs

• Fix not being able to toggle radios with tooltips

• Added focus state to Pagination links

• Fixed Vertical Navigation menu item's height

• Fixed the Vertical Navigation "back to top" item not being totally hidden

• Added focus state to Tabs

• Added focus state to Links

• Added a fallback for the Natural Language Form's opacity in IE8

• Update the Split Buttons dropdown to always open below the button

• Added a "form-actions" class that allows setting the marginns between form action buttons

• Added "form-field--radios" and "form-field--checkboxes" that allow the correct positioning of adjacent radios/checkboxes

• Added indeterminate state to Checkbox

• Added focus state to pagination

• Fixed the toggle-swicth's thumb background color

• Updated the radios focus outline ring to be square

• Added ability to close Popovers with the ESC key

• Fixed visited links default text color

• Updated the focus outline default color to #44c8f5 ($prime-blue-highlight)

Iconography

• Updated the 'outline-icon-information' and 'outline-icon-info-alert' icons

• Added the 'icon-arrow-button' and 'icon-folder' icons

Site specific

• Fixed the RGB and HEX color values of the "prime blue" button's hover state, in the Structures page

• Various small bug fixes

• Fixed Split Buttons guidelines

• Updated Tables demo

• Fixed Accordions guidelines

• Fixed Dropdowns guidelines

• Added an Input Masking example

• Added Natural Language Forms guidelines

• Fixed the Button Icons example

• Added a Text Styles PDF download link

• Added "promo header italic" text style example

• Updated images and copy of the Forms section in the Patterns page

• Added Form Fields validation guidelines

• Removed the "text boxes" height redline from the blue bar images in the Patterns page

• Updated content of the Copy section in the Structures page

UI Elements

• Fixed Split Button's focus state border

• Added disabled state for tags

• Added small tag cloud

• Fixed max width and paddings of tooltips

• Fixed distance of the prev and next buttons to the pager dots in carousels

• Fixed vertical distance between simplified tabs titles and separators

• Fixed shadow and border radius of dropdowns when the menu is above the input

• Added aria-label to tooltips

• Fixed forms error/warning messages pointer position and max width

• Fixed tabs with image's H1 title's padding and height

• Fixed links color/behaviour on different backgrounds

• Fixed the margins of icons inside Form Fields

• Fixed the margins of icons in Form Fields labels

• Fixed the font size of the arrow in "checkout" buttons

• Fixed text fields and dropdwons focus state text color

• Fixed floating tab's border radius

• Fixed small floating tab's font size

• Updated labels bottom margin

• Fixed the margin of icons in links

• Fixed the heigth of separators in horizontal links list

• Fixed padding of dropdown button of split buttons

• Fixed Natural Language Forms on android

• Fixed att.radio calling select multiple times

• Fixed tags close separator and focus state

• Fixed background color of active toggle switches

• Added max height to dropdown menus

• Show table rows actions when hovering the row

• Removed min width of dropdowns

• Fixed button groups to prevent wrapping

• Don't allow elements outside modals to gain focus when a modal is open

• Added triggers for show/hide events on att.button.dropdown

• Added :focusable and :tabbable jQuery selectors to att.base

• Fixed links text color when inside popovers

• Added a 'dot' to large price label for accessibility

• Added focus state to Tags

• Set aria-hidden to true for hidden modals

• Fixed style of labels with a checkbox

• Fixed dropdown buttons on firefox.
  Block elements don't work properly inside buttons on Firefox. We changed the button's tag to a div.

• Fix dropdown button's focus state

• Fixed att.checkbox not toggling when using the keyboard

• Added focused state to att.radio, att.checkbox and att.switch

• Updated the form's messages icon class from 'icon-information' to 'icon-info-warning'

• Added 'icon-tag' to iconography

• Fixed button dropdown's border radius

• Fixed text inputs right padding when they have a clear button

• Added keyboard navigation to att.select

• Added size modifiers to form controls.
  This allows .form-field elements (the controls wrappers) to have auto width, while setting the controls size. It can
  be useful when, for example, we want to have an "xxs" input with a large label text or warning/error
  message, without "forcing" the label and message to wrap to the field's small width.

• Do nothing when att.labelmask does not have the required options set

• Fixed the visibility of the search input in dropdowns

• Fixed the transparency of att.quicknav (vertical navigatin)

• Made att.select dropdown's width automatic

• Fixed dropdown fields sizes

• Fixed .form-field max-width

• Fixed image tab's icons default color

• Fixed text colors of pagination

• Fixed alignment of buttons in Modals

• Fixed color of 'outline-icon-info-alert' in Modals

• Fixed the tect color of the dropdown's caret

• Fixed border radius of freestanding accordions

• Updated max height of natural language forms dropdown from 90% to 80% of the screen's height

• Fixed distance between buttons of the split buttons

• Fix the default size of button icons and dropdown buttons

• Added modifier to align the buttons dropdown to the left

• Fixed att.button.dropdown closing the dropdown when clicking on it's items

• Fixed size of the caret in Natural Language Forms

• Added auto font size downscaling to att.dropdown dropdown items

• Fixed tags margin

• Fixed Simplified Tabs background and pointer colors

• Added slide transition to the pointers of Simplified Tabs and Tabs with Image

• Added max width to input fields label

• Added att.readmore widget

• Fixed border radius of error/warning messages in vertically "glued" form fields

• Fixed disabled inputs fields background to transparent

• Fixed Accordions slide animation

• Updated Accordions styles

• Added a "disabled" modifier class to carousel navigation arrows

• Added a "loading" falback for IE

• Use outline icons instead of images on Modals

• Added new outline font with the new class names.The real icons are now work in progress

• Added a copy of the icons font for outlined icons.
  The icons are the same as in the original font, but the class names are
  already the correct ones.

• Fixed the class name of the active simplified tab, for it to work properly with att.tabs

• Added zip for the flat icons font

• Added new promo header italic style

• Added 'icon-add-line' to iconography

• Fixed pointer in Tooltips and Popovers

• Fixed color and value selectors when used in a popover

• Updated superscripts styles

• Fixed dropdowns menu background in IE

• Makes att.select only copy relevant class names to the dropdown menu

• Added a 'visuallyhidden' utility class
  This class should be added to elements that should not be rendered on screen,
  but still be picked up by screen readers.

• Improved att.dropdown.
  - Improve the overall accessibility. Add a prefix and suffix option to the selection that gets read by screen readers.
  The dropdown list items are now also read by screen readers when they get focus.
  - Fixed the selected dropdown list item checkmark sometimes being rendered in it's own line.

• Fixed position of the dropdown menu

• Fixed color and value selectors on IE

• Added various states of dropdowns

• Added selected state of tags in tag clouds

• Removed min width of error/warning form messages

• Removed the green border from "valid" input fields

• Fixed the text color of disabled button's hover state on IE

• Fixed the clickable area of tabs with image

• Fixed modals and dropdown's overlay on IE8

• Fixed the font family of the "font-size-h5" mixin

• Fixed modals on IE8 and IE9

• Fixed Simplified tabs on IE8

• Fixed position of checkboxes checked indicator on IE8

• Fixed "masked" characters of password inputs on IE8

• Increased the tabs pointer size to 28px

• Fixed carousel and pagination on IE8

• Fixed tooltips on IE8

• Set the cursor to pointer on accordion headers

Site specific

• Added the "background gray" circle in the structures page

• Fixed the "dark gray" circle background color in the structures page

• Fixed "tags" and "tag cloud" elements

• Various copy fixes/updates

• Fixed the "devices demo" not being styled

• Fixed the "small" prices class name on the copy section of the structures page

• Removed the "Horizontal Images" section from the patterns page

• Fixed sorting the iconography items

UI Elements

• Added "bg-background-gray" and "bg-dark-background-gray" class names

• Reset popovers text alignment

• Fix views per page on IE8

• Fix pagination dots redraw issue on IE8

• Added an optional wrapper for simplified tabs that allows the border to expand to the parent's full width

• Improved simplified tabs display logic and styling

• Fixed the popover's close icon position

• Updated popovers padding

• Fixed alignment of the carousel controls

• Added shorted class names for tags (kept the old ones for backwards compatibility)

• Reset accordions text alignment to left

• Fixed text color of active "icon tabs" on IE8

• Fixed form fields line-height and padding on IE8

• Fixed "value selectors" on IE8 and IE9

• Fixed "color selectors" on IE8 and IE9

• Fixed the text color of disabled buttons

• Fixed buttons with loading indicators not hidding their text correctly

• Fixed several styling issues of buttons with dropdowns

• Split the button modifiers into their on sass file

• Fixed pagination on IE8 and IE9

• Fixed pagination on Firefox

• Fixed carousels on Firefox

general

initial release

• Updated and consolidated content

• Interactive elements with dimension guides and behaviour guidelines

• Updated iconography

• New overall site design