Dynamically change the text in the middle to state who sent request

document.getElementById("name").innerHTML = requestSender + " wants to be your friend!";

<head>
    <meta charset="UTF-8">
    <title>Friend Request</title>

    <style>
        body{
            font-family: 'Montserrat', sans-serif;
            background:#f6f7fb;
            display:flex;
            flex-direction:row;
            align-items:flex-start;
            justify-content:center;
            margin:0;
        }

        body *{
            font-family: 'Montserrat', sans-serif;
        }

        #desktop-wrapper{
            width:600px;
            display:flex;
            flex-direction:column;
        }

        #desktop-wrapper > a > img{
            width:600px;
        }

        #button-container-buttons > button{
            flex-shrink:0;
            color:white;
            font-weight:700;
            text-transform:uppercase;
            font-size:12px;
            height:32px;
            border-radius:16px;
            border:none;
        }

        #button-container-buttons > button:not(.accent-button){
            background:#1e1e1e;
        }

        .accent-button{
            background:linear-gradient(135deg, #fe599d, #f30096);
        }

        #main-wrapper > div > button{
            width:236px;
            font-size:12px;
            height:32px;
            border-radius:16px;
        }

        #button-container-buttons > button{
            width:260px;
            font-size:14px;
            height:36px;
            border-radius:18px;
        }

        #button-container-buttons{
            display:flex;
            flex-direction:row;
            align-items:center;
            justify-content:center;
            gap:24px;
        }

        #main-wrapper > div > h6{
            color:gray;
            font-weight:500;
            margin:0;
            font-size:9px;
        }

        #button-container{
            width:100%;
            display:flex;
            flex-direction:column;
            align-items:center;
            justify-content:flex-start;
            text-align:center;
            background:white;
            padding:32px 0;
            gap:16px;
        }

        #button-container > h2{
            font-size:16px;
            margin:0;
        }

        #button-container > p{
            font-size:9px;
            width:500px;
            margin:0;
        }
    </style>
</head>
<body>
    <div id="desktop-wrapper">
        <a href="https://elephantsuite.me/flashcards/dashboard">
            <img src="friend-header.png" alt="">
        </a>
        <div id="button-container">
            <h2 id="name">Ronak Kothari wants to be your friend!</h2>
            <div id="button-container-buttons">
                <button onclick="window.open('https://elephantsuite.me/flashcards/dashboard')">Accept Request</button>
                <button class="accent-button">Deny Request</button>
            </div>
            <p>Accepting a friend request will give you access to more features on Elephant. You can share decks privately with your friends and you are able to collaborate easier using the website. These requests do not expire.</p>
        </div>
        <a href="https://elephantsuite.me">
            <img src="friend-footer.png" alt="">
        </a>
    </div>
</body>

Uh oh!

Send Email When Receiving Friend Request #68

Description

Metadata

Metadata

Assignees

Labels

Type

Fields

Projects

Milestone

Relationships

Development

Issue actions