tase-shared-components v1.5.41

Sharedlibs

Contains

• Header + Search button

  <tase-header white-offset="100" fixed fetch-url="https://taseapi-wa-qa.azurewebsites.net/api/Cms?Route=header" transparent="true">
    <tase-search most-active-url="https://taseapi-wa-qa.azurewebsites.net/api/MarketTrends/most-active" search-url="https://taseapi-wa-qa.azurewebsites.net/api/Search"></tase-search>
  </tase-header>

• Footer

  <tase-footer fetch-url="https://taseapi-wa-qa.azurewebsites.net/api/Cms?Route=footer"> </tase-footer>

• Cookies policy

  <tase-cookies-policy fetch-url="https://taseapi-wa-qa.azurewebsites.net/api/Cms?Route=%2Ffloating"> </tase-cookies-policy>

• Accessibility button (For high contrast mode)

  <tase-accessibility></tase-accessibility>

• Scroll to Top button

  <tase-scroll-top></tase-scroll-top>

• Skip to main content menu

  <tase-skip-to-main-content-menu element="#main1"> </tase-skip-to-main-content-menu>

• Side menu for share button and customer service

  <tase-share-and-customer-service fetch-url="https://taseapi-wa-qa.azurewebsites.net/api/Cms?Route=%2Ffloating"> </tase-share-and-customer-service>

• Focus trap, copy of this focus-trap but with more features
  • getFocus event
  • loseFocus event - It is very handy to close the drop-down menus on loss of focus
  • focusFirst attribute - it is very handy for modal windows to set the focus on the first element

  <tase-focus-trap></tase-focus-trap>

Specs

Adboe XD

• home page header
• home page menu - 1 & 2
• Search popup
• table page menu
• stock lobby
• mobile view
  • page header
  • page side nav
  • popup mobile

Figma

• side menu for mobile
• footer desktop and mobile UI
• header UI for desktop and mobile, regular and white
• header UI for tablet
• header UI 4 states:
  • Desktop 1920px
  • Header 1200px
  • Tablet 768px
  • Mobile 414px

Adobe XD

• Header UI
  • menu, popup animtaions and open state
• Search open state
• Side menu UI
• Search modal UI, desktop and mobile
• Footer UI, desktop and mobile

Figma

• Icons
• header UI desktop and mobile
• sticky header (white one)
• footer desktop, tablet and mobile
• Side menu
• Menu Popups
• A lot of random elements

Adobe XD

• Icons

Adobe XD

• Search menu
• "Install our app" header

Adobe XD

• News Popup

Adobe XD

• News Popup Mobile

Adobe XD

• cookies policy