Snippets

Username Widget

Here's the HTML for the standard Edsu username widget, if you don't want to use the edsuUsernameElement() function from edsu-grant.js:

<div style="border: 2px solid rgba(0, 0, 0, 0.4); padding: 5px 5px;
display: inline-flex; width: 338px; justify-content: space-between;
background-color: rgba(255, 255, 255, 0.85); border-radius: 3px 3px;">
<a style="border: none; text-decoration: none; margin: 0; padding: 0;"
href="https://edsu.org/what-is-an-edsu-app/"><svg style="vertical-align: bottom"
width="34" height="38" viewBox="0 0 34 38" xmlns="http://www.w3.org/2000/svg">
<path fill="#444" d="m0 0v38h34v-38zm6 2h10v4h-10v2h6v4h-6v2h10v4h-10a4 4 0 0 1-4-4v-8a4
4 0 0 1 4-4zm12 0h10a4 4 0 0 1 4 4v8a4 4 0 0 1-4 4h-10v-12zm4 4v8h6v-8zm-16
14h10v4h-10v2h6a4 4 0 0 1 4 4v2a4 4 0 0 1-4 4h-10v-4h10v-2h-6a4 4 0 0 1-4-4v-2a4 4 0 0 1
4-4zm12 0h4v12h6v-12h4v12a4 4 0 0 1-4 4h-6a4 4 0 0 1-4-4z"></svg></a><input type="email"
placeholder="you@example.com" style="width: 243px; padding: 0 5px; box-sizing: border-box;
border-radius: 5px 5px; border: 1px solid rgba(0, 0, 0, 0.2)"><button style="cursor:
pointer; width: 50px; padding: 0 0; border: 1px solid #aaa; border-radius: 5px 5px;
background-color: rgba(200, 200, 200, 0.5);" onMouseOver="this.style.backgroundColor=
'rgba(255, 255, 255, 0.5)'" onMouseLeave="this.style.backgroundColor=
'rgba(200, 200, 200, 0.5)'">&rarr;</button></div>