<div class="translate-bar bar bg-tuatara">
<div class="row">
<div class="translate-bar_notice-column small-12 medium-6 columns">
<!-- in the web app, this whole section gets hidden if selected on English -->
<div class="translate-bar_notice">
<span class="translate-bar_message c-white t-small t-semi">Esta página ha sido traducida por Google Translate.</span>
<a href="#" class="translate-bar_learn lined c-white t-small">Learn more.</a>
</div>
</div>
<div class="small-12 medium-6 columns">
<ul class="translate-bar_languages inline-list t-semi right">
<li><a href="#" class="">English</a></li>
<li><a href="#" class="">Espanol</a></li>
<li><a href="#" class=" t-ch">中国</a></li>
<li><a href="#" class="">Tagalog</a></li>
</ul>
</div>
</div>
</div>
<div class="version-bar bar bg-primary">
<div class="row">
<div class="medium-12 columns">
<p class="text-right t-small c-white no-margin">This site is in <strong class="t-caps">BETA</strong>: We're just getting started. <br class="show-for-small-only"> We'd love to get <a href="#" class="a-white lined">your feedback</a>.</p>
</div>
</div>
</div>
<nav class="top-bar" role="navigation">
<div class="row">
<ul class="title-area">
<li class="name">
<div class="name-logo is-tall is-offset-up t-alt-sans"><a title="DAHLIA San Francisco Housing Portal" href="/pages/home.html">DAHLIA San Francisco Housing Portal</a></div>
</li>
<li class="toggle-topbar menu-icon">
<button href="#" class="button-link t-caps t-bold" aria-label="Open Menu">
Menu
<span class="ui-icon ui-static ui-large i-primary ">
<svg>
<use xlink:href="#i-menu"></use>
</svg>
</span>
</button>
</li>
</ul>
<section class="top-bar-section has-flex-items">
<ul class="nav-menu right">
<li>
<a href="/browse/browse-grid--default.html">
Browse Properties
</a>
</li>
<li>
<a href="/pages/favorites-grid.html">
My Favorites
</a>
</li>
<li>
<a href="/pages/get-assistance.html">
Get Assistance
</a>
</li>
<li>
<a href="/pages/get-assistance.html">
Sign In
</a>
</li>
</ul>
</section>
</div>
</nav>
<section class="app-container">
<div class="row collapse">
<div class="medium-6 medium-centered columns fixed-width">
<div class="app-header app-card form-card">
<header class="app-card_header">
<h1 class="app-card_title">Application: 123 Main St.</h1>
</header>
<div class="app-card_nav">
<ol class="progress-nav">
<li class="progress-nav_item active"><a href="#">You</a></li>
<li class="progress-nav_item disabled"><a href="#">Household</a></li>
<li class="progress-nav_item disabled"><a href="#">Preferences</a></li>
<li class="progress-nav_item disabled"><a href="#">Income</a></li>
<li class="progress-nav_item disabled"><a href="#">Review</a></li>
</ol>
</div>
</div>
<form class="app-card form-card">
<div class="app-inner leader border-bottom">
<div class="form-back"><a href="#" class="lined">Back</a></div>
<h2 class="app-card_question">There are some special programs we’d like to ask you about. Do you have any of the following?</h2>
</div>
<div class="app-inner">
<div class="form-group">
<div class="checkbox-group">
<div class="">
<div class="checkbox-block">
<input aria-decribedby="description-displaced" type="checkbox" name="preferences-displaced" value="preferences-displaced" id="preferences-displaced">
<label class="checkbox-block_label" for="preferences-displaced">
<strong class="form-label caps">Displaced Tenants Preference</strong>
</label>
<div class="checkbox-block_note-inner">
<div class="checkbox-block_note margin-bottom" id="description-displaced">Primarily households displaced by Ellis Act evictions as defined by The Ellis Act Displacement Emergency Assistance Ordinance passed into law on December 18, 2013. (Formerly Ellis Act Preference)</div>
</div>
</div>
<div class="form-group input-inset">
<label class="form-label caps">Which household member has this preference?</label>
<label for="options" class="sr-only">Label</label>
<select name="options" id="options" class="" data-width="auto">
<option value="">Select one</option>
<option value="1">Option 1</option>
<option value="2">Option 2</option>
<option value="3">Option 3</option>
<option value="4">Option 4</option>
<option value="5">Option 5</option>
<option value="6">Option 6</option>
</select> </div>
</div>
<div class="checkbox-block">
<input type="checkbox" name="preferences" value="preferences-cop" id="preferences-cop">
<label class="checkbox-block_label" for="preferences-cop">
<strong class="form-label caps">Certificate of Preference</strong>
</label>
<div class="checkbox-block_note-inner">
<div class="checkbox-block_note">Primarily households displaced by Agency action in Redevelopment Project Areas during the 1960’s and 1970's, but may also include other persons displaced by Agency action.</div>
</div>
</div>
</div>
</div>
</div>
<div class="button-pager">
<div class="button-pager_row primary">
<button class="button primary">Next</button>
</div>
<div class="button-pager_row ">
<button class="button button-link button-lined small-text-center expand-small">Save and finish later</button>
</div>
</div>
</form>
</div>
</div>
</section>
<footer class="footer-section bg-tuatara ">
<div class="row text-center padding-top--2x padding-bottom--2x">
<div class="medium-12 columns">
<ul class="inline-list welcome-links t-semi">
<li>
<a href="#">Bienvenido</a>
</li>
<li>
<a href="#">歡迎</a>
</li>
<li>
<a href="#">Maligayang pagdating</a>
</li>
</ul>
</div>
<div class="medium-12 columns">
<img src="/toolkit/images/logo-city.png" class="city-logo margin-bottom--2x" alt="City & County of San Francisco Logo">
</div>
<div class="clear"></div>
<div class="medium-8 medium-centered columns">
<p class="c-iron">The San Francisco Housing Portal is a project of the <br> <a href="#" class="a-white">Mayor's Office of Housing and Community Development</a></p>
<p class="t-small c-iron margin-top">in partnership with <br>
<a href="#" class="a-white">San Francisco Department of Technology</a><br>
<a href="#" class="a-white">Mayor's Office of Civic Innovation</a>
</p>
<p class="t-small c-iron margin-top--2x">For listing and application questions, please contact the Leasing Agent displayed on the listing.<br> For general program inquiries, you may call MOHCD at 415-701-5560.</p>
</div>
</div>
<section class="footer-sock bg-ebony padding-top--2x padding-bottom">
<div class="row">
<div class="medium-3 large-4 columns small-only-text-center">
<span class="c-iron">© City & County of San Francisco</span>
</div>
<div class="medium-9 large-8 columns small-only-text-center">
<ul class="inline-list">
<li>
<a href="#">Give Feedback</a>
</li>
<li>
<a href="mailto:sfhousing.info@sfgov.org">Contact</a>
</li>
<li>
<a href="/pages/disclaimer.html">Disclaimer</a>
</li>
<li>
<a href="/pages/privacy-policy.html">Privacy Policy</a>
</li>
<li>
<a href="https://heapanalytics.com/?utm_source=badge" rel="nofollow"><img style="width:108px;height:41px" src="/toolkit/images/heap.png" alt="Heap | Mobile and Web Analytics" /></a>
</li>
</ul>
</div>
</div>
</section>
<section class="footer-sole">
<span>made with <span class="ui-icon ui-static ui-small i-color ">
<svg>
<use xlink:href="#i-favorite"></use>
</svg>
</span> by <a href="#">exygy</a> & <a href="#">vertiba</a> </span>
</section>
</footer>
{{> @translate-bar }}
{{> @version-bar }}
{{> @top-bar }}
<section class="app-container">
<div class="row collapse">
<div class="medium-6 medium-centered columns fixed-width">
{{ render '@app-header' }}
<form class="app-card form-card">
<div class="app-inner leader border-bottom">
<div class="form-back"><a href="#" class="lined">Back</a></div>
<h2 class="app-card_question">There are some special programs we’d like to ask you about. Do you have any of the following?</h2>
</div>
<div class="app-inner">
<div class="form-group">
<div class="checkbox-group">
<div class="">
<div class="checkbox-block">
<input aria-decribedby="description-displaced" type="checkbox" name="preferences-displaced" value="preferences-displaced" id="preferences-displaced">
<label class="checkbox-block_label" for="preferences-displaced">
<strong class="form-label caps">Displaced Tenants Preference</strong>
</label>
<div class="checkbox-block_note-inner">
<div class="checkbox-block_note margin-bottom" id="description-displaced">Primarily households displaced by Ellis Act evictions as defined by The Ellis Act Displacement Emergency Assistance Ordinance passed into law on December 18, 2013. (Formerly Ellis Act Preference)</div>
</div>
</div>
<div class="form-group input-inset">
<label class="form-label caps">Which household member has this preference?</label>
{{> @select}}
</div>
</div>
<div class="checkbox-block">
<input type="checkbox" name="preferences" value="preferences-cop" id="preferences-cop">
<label class="checkbox-block_label" for="preferences-cop">
<strong class="form-label caps">Certificate of Preference</strong>
</label>
<div class="checkbox-block_note-inner">
<div class="checkbox-block_note">Primarily households displaced by Agency action in Redevelopment Project Areas during the 1960’s and 1970's, but may also include other persons displaced by Agency action.</div>
</div>
</div>
</div>
</div>
</div>
{{> @button-pager left="Next" l-classes="primary" right="Save and finish later" r-classes="button-link button-lined small-text-center expand-small"}}
</form>
</div>
</div>
</section>
{{> @footer}}
{
"page-class": "center-body",
"sections": [
{
"header": "You",
"info-items": [
{
"name": "Name",
"value": "Laura Smith"
},
{
"name": "Date of Birth",
"value": "12/02/1980"
},
{
"name": "Phone",
"value": "415-123-1234",
"note": "Cell"
},
{
"name": "Additional Phone",
"value": "415-123-1234",
"note": "Home"
},
{
"name": "Email",
"value": "lara.smith@gmail.com"
},
{
"name": "Address",
"value": "649 Avalon St <br> San Francisco, CA 94117"
},
{
"name": "Mailing Address",
"value": "456 Mission St <br> San Francisco, CA 94117"
}
]
},
{
"header": "Alternate Contact",
"info-items": [
{
"name": "Name",
"value": "Michael Smith",
"note": "Counselor",
"secondary": "MEDA"
},
{
"name": "Email",
"value": "michael.smith@gmail.com"
},
{
"name": "Phone",
"value": "415-876-5432"
},
{
"name": "Mailing Address",
"value": "456 Mission St <br> San Francisco, CA 94117"
}
]
},
{
"header": "Household Members",
"info-items": [
{
"name": "Name",
"value": "Michael Smith",
"note": "Child"
},
{
"name": "Date of Birth",
"value": "12/2/1980"
},
{
"divider": true
},
{
"name": "Name",
"value": "Michael Johnson",
"note": "Family Member"
},
{
"name": "Date of Birth",
"value": "12/2/1970"
},
{
"name": "Address",
"value": "700 Avalon St <br> San Francisco, CA 94117"
}
]
},
{
"header": "Household Details",
"info-items": [
{
"name": "Rent at 2106 Park Blvd",
"value": "$1200 per month",
"note": "for Michael Smith"
},
{
"name": "Rent at 4106 Terrace St",
"value": "$1200 per month",
"note": "for Jane Smith and Denise Jones"
},
{
"name": "Seniors in Household",
"value": "Yes"
},
{
"name": "Veterans in Household",
"value": "Yes"
},
{
"name": "People with Developmental Disabilities",
"value": "Yes"
},
{
"name": "ADA Accessible Units",
"value": "Mobility Impairments<br> Visual Impairments"
}
]
},
{
"header": "Income",
"info-items": [
{
"name": "Vouchers and Subsidies",
"value": "Yes"
},
{
"name": "Household Income",
"value": "$32,000 per year"
}
]
},
{
"header": "Preferences",
"info-items": [
{
"name": "You Have Claimed",
"value": "Certificate of Preference",
"note": "for Michael Smith"
},
{
"name": "You Have Claimed",
"value": "Neighborhood Resident Housing Preference",
"note": "for Michael Smith",
"secondary": "Telephone Bill attached"
},
{
"name": "You Have Claimed",
"value": "Rent Burden Preference",
"note": "for 2106 Park Blvd",
"secondary": "Copy of Lease and Cancelled Check attached",
"note-2": "for 4106 Terrace St",
"secondary-2": "Copy of Lease and Money order attached"
}
]
}
],
"sections-general": [
{
"header": "You",
"info-items": [
{
"name": "Name",
"value": "Laura Smith"
},
{
"name": "Date of Birth",
"value": "12/02/1980"
},
{
"name": "Phone",
"value": "415-123-1234",
"note": "Cell"
},
{
"name": "Additional Phone",
"value": "415-123-1234",
"note": "Home"
},
{
"name": "Email",
"value": "lara.smith@gmail.com"
},
{
"name": "Address",
"value": "649 Avalon St <br> San Francisco, CA 94117"
},
{
"name": "Mailing Address",
"value": "456 Mission St <br> San Francisco, CA 94117"
}
]
},
{
"header": "Alternate Contact",
"info-items": [
{
"name": "Name",
"value": "Michael Smith",
"note": "Counselor",
"secondary": "MEDA"
},
{
"name": "Email",
"value": "michael.smith@gmail.com"
},
{
"name": "Phone",
"value": "415-876-5432"
},
{
"name": "Mailing Address",
"value": "456 Mission St <br> San Francisco, CA 94117"
}
]
},
{
"header": "Household Members",
"info-items": [
{
"name": "Name",
"value": "Michael Smith",
"note": "Child"
},
{
"name": "Date of Birth",
"value": "12/2/1980"
},
{
"divider": true
},
{
"name": "Name",
"value": "Michael Johnson",
"note": "Family Member"
},
{
"name": "Date of Birth",
"value": "12/2/1970"
},
{
"name": "Address",
"value": "700 Avalon St <br> San Francisco, CA 94117"
}
]
},
{
"header": "Preferences",
"info-items": [
{
"name": null,
"value": "Based on the information you have entered, your household has not claimed any housing lottery preferences. you will be in the general lottery.",
"is-sentence": "yes"
}
]
},
{
"header": "Income",
"info-items": [
{
"name": "Vouchers and Subsidies",
"value": "No"
},
{
"name": "Household Income",
"value": "$32,000 per year"
}
]
}
],
"sections-preview": [
{
"header": "You",
"info-items": [
{
"name": "Name",
"value": "Laura Smith"
},
{
"name": "Date of Birth",
"value": "12/02/1980"
},
{
"name": "Phone",
"value": "415-123-1234",
"note": "Cell"
},
{
"name": "Additional Phone",
"value": "415-123-1234",
"note": "Home"
},
{
"name": "Email",
"value": "lara.smith@gmail.com"
},
{
"name": "Address",
"value": "649 Avalon St <br> San Francisco, CA 94117"
},
{
"name": "Mailing Address",
"value": "456 Mission St <br> San Francisco, CA 94117"
}
]
},
{
"header": "Alternate Contact",
"info-items": [
{
"name": "Name",
"value": "Michael Smith",
"note": "Counselor",
"secondary": "MEDA"
},
{
"name": "Email",
"value": "michael.smith@gmail.com"
},
{
"name": "Phone",
"value": "415-876-5432"
},
{
"name": "Mailing Address",
"value": "456 Mission St <br> San Francisco, CA 94117"
}
]
},
{
"header": "Household Members",
"info-items": [
{
"name": "Name",
"value": "Michael Smith",
"note": "Child"
},
{
"name": "Date of Birth",
"value": "12/2/1980"
},
{
"divider": true
},
{
"name": "Name",
"value": "Michael Johnson",
"note": "Family Member"
},
{
"name": "Date of Birth",
"value": "12/2/1970"
},
{
"name": "Address",
"value": "700 Avalon St <br> San Francisco, CA 94117"
}
]
},
{
"header": "Household Details",
"info-items": [
{
"name": "Seniors in Household",
"value": "Yes"
},
{
"name": "Veterans in Household",
"value": "Yes"
},
{
"name": "People with Developmental Disabilities",
"value": "Yes"
}
]
}
]
}
There are no notes for this item.