Not Solved [Enhanced Account Switcher] Issues modifying Accountlist Page
#1
Not Solved
Problem:  I'm struggling pretty bad with the Account List doing what I want. I've got a codepen whipped up, and that's great. And I can get most of the templates appear to be doing what i want but not quite... As you can see from the active page, the characters are all squished together, and then the Player (Master) accounts are chilling out at the bottom of the pack...

Any assistance is greatly appreciated, and thank you for your time <3

Evidence:
Code Pen
Active Page

Special Request: Any guidance on how to fix this to look like the mockup would be outstanding xD

Code: I think this is all of the ones I've edited specifically -



accountswitcher_accountlist
<html>
                    <head>
                        <title>{$settings['bbname']} - {$lang->aj_accountlist}</title>
                        {$headerinclude}
                    </head>
                    <body>
                        {$header}
      
      <div class="WPW-MainBox">
  <div class="WPW-BoxWrap">
       <div class="WPW-AccountList">Account List</div>

<div class="WPW-Rows">   {$accountlist_masterbit}   </div>
   
       </div>
</div>
      
      {$multipage}
                        {$footer}
                    </body>
                </html>

accountswitcher_accountlist_attached
    
   <span class="WPW-Charries">{$attachedAvatar}{$cardbreak}{$attachedlink}</span>

accountswitcher_accountlist_attached_card
   <span class="WPW-Charries">{$attachedAvatar}{$cardbreak}{$attachedlink}</span>

accountswitcher_accountlist_card
<html>
                    <head>
                        <title>{$settings['bbname']} - {$lang->aj_accountlist}</title>
                        {$headerinclude}
                    </head>
                    <body>
                        {$header}
      
  <div class="WPW-Characters">  {$accountlist_masterbit}    </div>
       
      {$multipage}
                        {$footer}
                    </body>
                </html>

accountswitcher_accountlist_master
  <div class="WPW-Player">{$masterAvatar}{$cardbreak}{$masterlink}
    
  </div>

accountswitcher_accountlist_master_card
  <div class="WPW-Player">{$masterAvatar}{$cardbreak}{$masterlink}
    
  </div>

And the CSS;
body {background: #000; font-size: 11px}

.WPW-MainBox {min-width: 90%; margin: auto; background: #3d5c5c; padding: 10px;}

.WPW-Rows {display: flex; flex-wrap: wrap}

.WPW-BoxWrap {background: #d1e0e0}

.WPW-AccountList {background: #1f2e2e; font-size: 20px; text-transform: lowercase; padding: 4px 10px; color: #FFF;}

.WPW-Player {background: #669999; max-width: 250px; min-height: 500px; flex-basis: 20%; flex-grow: 1; padding: 5px; order: 2; text-align: center;}

.WPW-Characters {background: #a3c2c2; flex-basis: 30%; flex-grow: 3; display: flex; flex-wrap: wrap; justify-content: flex-start; padding: 5px; order: 6}

/*background: #b3cccc; flex-basis: 30%; flex-grow: 3; padding: 5px; color: #1f2e2e; order: 3;*/

.WPW-Charries {background: #1f2e2e; flex-basis: 5%; min-width: 250px; height: 500px; flex-wrap: wrap; padding: 4px; color: #FFF; text-align: center; margin: 0.5%;}

[Image: HaLp2lk.png]

[Image: LQwJ7VV.png]
Reply


Messages In This Thread
[Enhanced Account Switcher] Issues modifying Accountlist Page - by ThistleProse - 2020-07-07, 09:07 AM

Forum Jump:


Users browsing this thread: 1 Guest(s)