Select to view content in your preferred language

Configuring pop-up HTML Syntax for Capital Project Tracking Solution

576
0
04-20-2023 03:58 PM
Krocha
by
New Contributor III

I deployed the Capital Project Tracking Solution. I am trying to configure the pop-up.  CPTPop-up.PNGIf you notice on the Phase the Pre-design block is filled in blue. This is from my Pre-design field. However, when i change something on the pop-up for example changing Fiscal Year to a different field, the pre-design block disappears. I believe it is all tied together. The HTML sytax is below. Im not very great with HTML Syntax if someone could help with this. I really would like to change the fields displaying for my pop-up.

<div style="max-width:750px;padding:0px 4px;">

    <p>

        <span style="font-size:x-large;"><font style="color:#1987bb;">{projname}</font></span>

    </p>

    <p>

        <strong>Project ID:</strong> {projid}

    </p>

    <figure class="table" style="width:initial;">

        <table style="border-collapse:separate;border-spacing:6px 4px;margin:8px -6px;table-layout:fixed;">

            <tbody>

                <tr style="height:26px;">

                    <td style="background-color:#00734c;color:#ffffff;display:{expression/expr6};font-weight:normal;max-width:100%;min-width:0%;padding:0px 6px;text-align:left;vertical-align:middle;width:initial;">

                        On Budget

                    </td>

                    <td style="background-color:#a80000;color:#ffffff;display:{expression/expr7};font-weight:normal;max-width:100%;min-width:0%;padding:0px 6px;text-align:left;vertical-align:middle;width:initial;">

                        Over Budget

                    </td>

                    <td style="background-color:#00734c;color:#ffffff;display:{expression/expr8};font-weight:normal;max-width:100%;min-width:0%;padding:0px 6px;text-align:left;vertical-align:middle;width:initial;">

                        On Schedule

                    </td>

                    <td style="background-color:#a80000;color:#ffffff;display:{expression/expr9};font-weight:normal;max-width:100%;min-width:0%;padding:0px 6px;text-align:left;vertical-align:middle;width:initial;">

                        Behind Schedule

                    </td>

                </tr>

            </tbody>

        </table>

    </figure>

    <p>

        <strong>Description</strong>

        <br>

        {projdesc}

    </p>

    <figure class="table" style="width:100%;">

        <table style="border-collapse:separate;border-spacing:0px 8px;margin:8px 0px;table-layout:fixed;">

            <tbody>

                <tr>

                    <td style="font-weight:normal;max-width:100%;padding-left:0px;text-align:center;width:50%;">

                        <span style="font-size:medium;">Fiscal Year</span>

                        <br>

                        <span style="font-size:large;"><font style="color:#1987bb;">{fiscalyr}</font></span>

                    </td>

                    <td style="font-weight:normal;max-width:100%;padding-left:0px;text-align:center;width:50%;">

                        <span style="font-size:medium;">Funding Source</span>

                        <br>

                        <span style="font-size:large;"><font style="color:#1987bb;">{fundsource}</font></span>

                    </td>

                </tr>

                <tr>

                    <td style="font-weight:normal;max-width:100%;padding-left:0px;text-align:center;width:50%;">

                        <span style="font-size:medium;">Estimated Cost</span>

                        <br>

                        <span style="font-size:large;"><font style="color:#1987bb;">${estcost}</font></span>

                    </td>

                    <td style="font-weight:normal;max-width:100%;padding-left:0px;text-align:center;width:50%;">

                        <span style="font-size:medium;">Actual Cost</span>

                        <br>

                        <span style="font-size:large;"><font style="color:#1987bb;">{expression/expr10}</font></span>

                    </td>

                </tr>

                <tr>

                    <td style="font-weight:normal;max-width:100%;padding-left:0px;text-align:center;width:50%;">

                        <span style="font-size:medium;">Estimated Start Date</span>

                        <br>

                        <span style="font-size:large;"><font style="color:#1987bb;">{planstart}</font></span>

                    </td>

                    <td style="font-weight:normal;max-width:100%;padding-left:0px;text-align:center;width:50%;">

                        <span style="font-size:medium;">Actual Start Date</span>

                        <br>

                        <span style="font-size:large;"><font style="color:#1987bb;">{expression/expr11}</font></span>

                    </td>

                </tr>

                <tr>

                    <td style="font-weight:normal;max-width:100%;padding-left:0px;text-align:center;width:50%;">

                        <span style="font-size:medium;">Estimated End Date</span>

                        <br>

                        <span style="font-size:large;"><font style="color:#1987bb;">{planend}</font></span>

                    </td>

                    <td style="font-weight:normal;max-width:100%;padding-left:0px;text-align:center;width:50%;">

                        <span style="font-size:medium;">Actual End Date</span>

                        <br>

                        <span style="font-size:large;"><font style="color:#1987bb;">{expression/expr12}</font></span>

                    </td>

                </tr>

            </tbody>

        </table>

    </figure>

    <p>

        <strong>Phase</strong>

    </p>

    <div style="min-width:365px;">

        <figure class="table" style="width:100%;">

            <table style="border-collapse:separate;border-spacing:6px 4px;margin:8px -6px;table-layout:fixed;">

                <tbody>

                    <tr height="16">

                        <td style="text-align:center;width:25%;">

                            &nbsp;

                        </td>

                        <td style="text-align:center;width:25%;">

                            &nbsp;

                        </td>

                        <td style="text-align:center;width:25%;">

                            &nbsp;

                        </td>

                        <td style="text-align:center;width:25%;">

                            &nbsp;

                        </td>

                    </tr>

                    <tr style="text-align:center;" height="24">

                        <td style="font-weight:normal;padding-left:0px;text-align:center;width:25%;">

                            PreDesign

                        </td>

                        <td style="font-weight:normal;padding-left:0px;text-align:center;width:25%;">

                            Design

                        </td>

                        <td style="font-weight:normal;padding-left:0px;text-align:center;width:25%;">

                            Construction

                        </td>

                        <td style="font-weight:normal;padding-left:0px;text-align:center;width:25%;">

                            Closeout

                        </td>

                    </tr>

                </tbody>

            </table>

        </figure>

    </div>

    <p>

        <strong>Status</strong>

        <br>

        {status}

    </p>

    <p>

        <strong>Contact</strong>

        <br>

        {pocname}

        <br>

        {pocphone}

        <br>

        <a href="mailto:{pocemail}">{pocemail}</a>

    </p>

</div>

 

Tags (3)
0 Kudos
0 Replies