reformats AWS sso page. (greasemonkey script)

format-aws-sso.js

// ==UserScript==
// @name        format-aws-sso
// @namespace   signin.aws.amazon.com
// @description reformats that page
// @include     https://signin.aws.amazon.com/saml
// @version     1.1
// @grant       none
// ==/UserScript==
$('#saml_form').css('max-width', 'none');
$('fieldset').css('width', 'none');
$('fieldset > div.saml-account').css('border', '1px solid black');
$('fieldset > div.saml-account').css('float', 'left');
$('fieldset > div.saml-account').css('margin', '5px');
$('fieldset > div.saml-account').css('margin-bottom', '20px');
$('fieldset > div.saml-account').css('padding', '5px');
$('fieldset > div.saml-account').css('padding-bottom', '20px');
$('fieldset > div.saml-account').css('width', '400px');
$('fieldset > div.saml-account').css('height', '190px');
$('fieldset > div.saml-account').css('cursor', 'pointer');

$('fieldset > div.saml-account').click(function(){
  $('fieldset > div.saml-account').css('background-color', 'white');
  $('fieldset > div.saml-account').removeClass('selectedItem');

  if ($(this).find('input').length == 1) {
    $(this).find('input').attr('checked', 'checked');
  } else {
    numberItems = $(this).find('input').length;
    selectedItem = 0;

    i = 0;
    $(this).find('input').each(function(){
      if ($(this).is(':checked')) {
        selectedItem = i;
      }
      i++;
    });

    selectedItem++;
    if(selectedItem >= numberItems) {
      selectedItem = 0;
    }

    i = 0;
    $(this).find('input').each(function(){
      if (i == selectedItem) {
        $(this).attr('checked', 'checked');
        selectedItem = -1;
      }
      i++;
    });
  }


  $(this).toggleClass('selectedItem');
  $(this).css('background-color', 'yellowgreen');
});

$('fieldset > div.saml-account').mouseenter(function(){
  $(this).css('background-color', 'yellow');
}).mouseleave(function(){
  if ($(this).hasClass('selectedItem')) {
    $(this).css('background-color', 'yellowgreen');
  } else {
    $(this).css('background-color', 'white');
  }

});

$('div.saml-account-name').css('font-size', '14px');
$('div.saml-account-name').each(function(){
  $(this).text(
   $(this).text().replace("Account: ", "")
  );
})

$('fieldset').before('<div id="searchbox"><input type="text" placeholder="find account..."></div>');
$('#searchbox').css('margin', '5px');
$('#searchbox > input').css('width', '385px');
$('#searchbox > input').focus();

$('#searchbox > input').keyup(function(){
  if ($(this).val() == '') {
    $('fieldset > div.saml-account').show();
  } else {
    var _keyword = $(this).val();
    var keywords = _keyword.split(" ")
    if (keywords[keywords.length]=="") {
        keywords = keywords.splice(-1);
    }
    $('fieldset > div.saml-account').each(function(){
        var show = 0;
        var accountName = $(this).find('.saml-account-name').text();

        for (let i = 0; i < keywords.length; i++) {
            if (accountName.indexOf(keywords[i]) >= 0 ) {
                show +=1;
            } else {
                show -=1;
            }
        }


        if (show == keywords.length) {
            $(this).show();
        }else{
            $(this).hide();
        }
    })
  }
});

special thanks to @marcobazzani who forked and improved it

you can now search for multiple string parts of the aws account name (not only the exactly fitting one)

@martinlindenberg I did another little improvement bookmark support
https://gist.github.com/marcobazzani/71f061e803d32d8e4d5931e331ef12da