Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

Code foundation to be created by Dev Team (TBD).

Desktop:

 

Mobile:

Code Block
<div class="result-container"filter-block">
    <h2>Non-Appropriated Fund (NAF) Openings</h2>
    <form action="#" class="filter">
        <div class="search-pagination">
"box">
            <label for="job-number">Job Number:</label>
            <input type="text" placeholder="Text Field with Active Box" id="job-number">
        <ul></div>
        <li><a<div onclickclass="#"><strong>1</strong></a></li>
box">
            <li><a<label onclickfor="#department">2</a></li>
>Department:</label>
        <li><a onclick    <select id="#">Next</a></li>
department">
                <option>All</option>
            </select>
        </ul>div>
        <input type="submit" value="Submit">
    </form>
</div>
<div class="result-container">
    <div class="loading-block">
        <div class="result-content loading-holder">
            <div class="holder-row"> 

                <span style="width:55%57.3%" class="job-title"><em>Job Title</em></span> 

                <span class="installation"><em>Installation</em></span> 

                <span class="date"><em>Closing Date</em></span> 

            </div>
            <div class="result-row">
                <div style="width:55%57.3%" class="job-title"> <a href="#">Job Title/Number Here, 00-12345</a></div>
                <div class="installation">
                    <dl>
                        <dt>Installation: </dt>
                        <dd>NAS Installation Name</dd>
                    </dl>
                </div>
                <div class="/job/ffr15-325">Child &amp; Youth Program Custodian</a> <date">
                    <dl>
                        <dt>Closing Date: </dt>
                        <dd>September 30, 2015</dd>
                    </dl>
                </div>
            </div>
            <div class="result-row">
                <div style="width:57.3%" class="job-title"> <a href="#">Job Title/Number Here, 00-12345</a></div>
                <div class="installation">
                    <dl>
                        <dt>Installation: </dt>
                        <dd>NAS <dd>NAFInstallation Atsugi<Name</dd>
                    </dl>
                </div>
                <div class="date">
                    <dl>
                        <dt>Closing Date: </dt>
           <dd>Apr             <dd>September 30, 2015</dd>
                    </dl>
                </div>
            </div>
            <div class="result-row">
                <div style="width:55%57.3%" class="job-title"> <a href="#">Job Title/Number Here, 00-12345</a></div>
                <div class="installation">
                    <dl>
                        <dt>Installation: </dt>
                        <dd>NAS Installation Name</dd>
                    </dl>
                </div>
                <div class="date">
                    <dl>
                        <dt>Closing Date: </dt>
                        <dd>September 30, 2015</dd>
                    </job/ffr15-055">Golf Course Restaurant Cashier</a> </div>
dl>
                </div>
            </div>
            <div class="result-row">
                <div style="width:57.3%" class="job-title"> <a href="#">Job Title/Number Here, 00-12345</a></div>
                <div class="installation">
                    <dl>
                        <dt>Installation: </dt>
               <dd>NAF Atsugi<         <dd>NAS Installation Name</dd>
                    </dl>
                </div>
                <div class="date">
                    <dl>
                        <dt>Closing Date: </dt>
                  <dd><      <dd>September 30, 2015</dd>
                    </dl>
                </div>
            </div>
            <div class="result-row">
                <div style="width:55%57.3%" class="job-title"> <a href="#">Job Title/Number Here, 00-12345</a></div>
                <div class="installation"/job/ffr-15-0025">Golf Course Restaurant Cook</a> <>
                    <dl>
                        <dt>Installation: </dt>
                        <dd>NAS Installation Name</dd>
                    </dl>
                </div>
                <div class="date">
                    <dl>
                        <dt>Closing Date: </dt>
                        <dd>September 30, 2015</dd>
                    </dl>
                </div>
            </div>
            <div class="result-row">
                <div style="width:57.3%" class="job-title"> <a href="#">Job Title/Number Here, 00-12345</a></div>
                <div class="installation">
                    <dl>
                        <dt>Installation: </dt>
            <dd>NAF Atsugi<            <dd>NAS Installation Name</dd>
                    </dl>
                </div>
                <div class="date">
                    <dl>
                        <dt>Closing Date: </dt>
                        <dd>September <dd><30, 2015</dd>
                    </dl>
                </div>
            </div>
            <div class="result-row">
                <div style="width:55%57.3%" class="job-title"> <a href="/job/ffr15-350">Graphic Arts Technician</a> <#">Job Title/Number Here, 00-12345</a></div>
                <div class="installation">
                    <dl>
                        <dt>Installation: </dt>
          <dd>NAF Atsugi<              <dd>NAS Installation Name</dd>
                    </dl>
                </div>
                <div class="date">
                    <dl>
                        <dt>Closing Date: </dt>
                        <dd>September <dd><30, 2015</dd>
                    </dl>
                </div>
            </div>
            <div class="result-row">
                <div style="width:55%57.3%" class="job-title"> <a href="#">Job Title/Number Here, 00-12345</a></div>
                <div class="/job/ffr15-387">Operations Clerk (CDC)</a> </installation">
                    <dl>
                        <dt>Installation: </dt>
                        <dd>NAS Installation Name</dd>
                    </dl>
                </div>
                <div class="date">
                    <dl>
                        <dt>Closing Date: </dt>
                        <dd>September 30, 2015</dd>
                    </dl>
                </div>
            </div>
            <div class="result-row">
                <div style="width:57.3%" class="job-title"> <a href="#">Job Title/Number Here, 00-12345</a></div>
                <div class="installation">
                    <dl>
                        <dt>Installation: </dt>
           <dd>NAF Atsugi<             <dd>NAS Installation Name</dd>
                    </dl>
                </div>
                <div class="date">
                    <dl>
                        <dt>Closing Date: </dt>
              <dd><          <dd>September 30, 2015</dd>
                    </dl>
                </div>
            </div>
         </div>
   <div class="searchresult-paginationrow">
    <ul>
            <div style="width:57.3%"  <li><a onclickclass="job-title"> <a href="#"><strong>1</strong></a></li>
>Job Title/Number Here, 00-12345</a></div>
                <div class="installation">
                    <dl>
                        <dt>Installation: </dt>
                        <dd>NAS Installation Name</dd>
                    </dl>
                </div>
            <li><a onclick    <div class="#">2</a></li>date">
                    <dl>
                        <dt>Closing Date: </dt>
                        <dd>September 30, 2015</dd>
                    </dl>
                </div>
            </div>
        </div>
      <li><a  <div onclickclass="#">Next</a></li>"load-box">
            <a href="inc/result1.html" class="load-more more-link">Load more</a>
        </ul>div>
    </div>
</div>