Graphics
      Back to home
      1. Knowledge Base
      2. Onboarding
      3. Graphics

      Adding Graphics (Icons & Elements)

      Where to upload static graphics into the duel dashboard?

      Look for the ⬆️ emoji below for where to upload specific graphics.

      If you don't yet have access to the Duel Dashboard then speak to your BSE to set you up as an operator.

      Icons

      • Programme Logo

        • This can either be a custom programme logo or simply the brands logo
        • 📏 400px by 400px 
        • ⬆️ Upload a dashboard wide icon from the settings (top right dropdown) under brand profile picture
        • ⬆️ Unless a unique logo is required for a specific group then Members > Group profiles > General / text > under logo

      The programme logo's crop can also be edited in Members > Group profiles > select appropriate group > Styles.

      Search the variables for logoRadius (0% = square & 50% = circle)  

      • Favicon

        • 📏 One icon at 180px by 180px (solid background) & one icon at 32px by 32px (any background)
        • ⬆️ Members > Group profiles > General / text > under favicons

      • Tier Icons

        • These icons should be designed to represent the tier names that have been confirmed by your team
        • 📏 400px by 400px (icons are circle cropped)
        • ⬆️ Members > Groups > Select appropriate group > Tiers > Under Icon (if the tiers are missing ask your BSE) 

      • Default Profile Image

        • 📏 400px by 400px circle cropped
        • ⬆️ Members > Group profiles > General / text > under default profile picture

      Background Imagery & Banners: 

      • Portal Banner Image

        • 📏 1650px width, 150px height
        • ⬆️ Members > Group profiles > Select appropriate group > Styles > Search the variables for headerBgImg
          • Click on the three dots and hit select to open the file manager
          • Then upload your graphic, after uploading click the graphic and then hit the blue 'use selection' 

      These graphics can also be hosted elsewhere and the image URL simply added into the styles page.

      Sign Up & Support Background

      • 📏 This can either be a graphic, hex colour or gradient

          • If you choose to use a graphic, we suggest designing it while considering different device sizes. Graphics that can be repeated tend to work better.

        • ⬆️ Members > Group profiles > Select appropriate group > Styles > Search the variables for supportBgImage

          • Note hex colours can be added here or use the below instructions to upload a graphic:  
            • Click the three dots and hit select to open the file manager
            • Then upload your graphic, after uploading click the graphic and then hit the blue 'use selection' 
            • You can also modify the image repeat, size, position etc using CSS simply search for supportBg

      Member Pages: