Packages

ex_ussd_simulator

0.1.2
0.1.4 0.1.3 0.1.2 0.1.1 0.1.0

A development UI for ExUssd

HexDocs

Current section

Files

Jump to
Readme
5 Versions
6 Dependencies
Dependants
Files
Activity
ex_ussd_simulator lib templates page show.html.leex
Raw

lib/templates/page/show.html.leex 

<section class="w-full h-full flex flex-col justify-center items-center">

  <div class="w-full h-full max-h-phone max-w-xs relative">

    <div class="flex flex-col pt-16 pb-16 px-3 h-full relative z-10">

      <!--- Display --->

      <div class="flex flex-col justify-center items-center flex-grow bg-gray-200 border-b-2 border-gray-400 rounded-t-lg">

        <div class="text-lg font-normal leading-snug text-gray-800 break-words max-w-xs pb-3 px-6">

        <%= Phoenix.HTML.Format.text_to_html(@prompt) %>

        </div>

        <div class="mt-2 text-xl font-normal text-black h-1">

          <%= Phoenix.HTML.Format.text_to_html(@ussd_code) %>

        </div>

      </div>

      <!--- Num pad --->

      <div id="num-pad" class="flex flex-col rounded-b-3xl">

        <%= render "num_row.html", values: 1..3 %>

        <%= render "num_row.html", values: 4..6 %>

        <%= render "num_row.html", values: 7..9 %>

        <%= render "num_row.html", values: ["*", 0, "\#"] %>

        <div class="flex pt-1">

          <div class="phone-button-reset" phx-click="reset">Reset</div>

          <div class="phone-button-call" phx-click="call">Call</div>

          <div class="phone-button-reset" phx-click="end_session">End</div>

        </div>

      </div>

    </div>

    <!--- Phone layout --->

    <div class="absolute z-0 top-0 bottom-0 left-0 right-0">

      <%= render "_phone.html", classes: "text-gray-400" %>

    </div>

  </div>

</section>