Use this collection of interface elements to repurpose and help build applications. The purpose is to work as efficiently as possible to allow you to focus on solving challenges. If there is a component you need and isn’t listed, please submit your request to Web. The ticket will be reviewed for design/implementation.
The EPTX Application Components are built on Semantic-Ui, a development framework that helps create beautiful, responsive layouts.
Let's get started adding these components to your application. You'll add the following JavaScript and CSS.
First add this javascript to your footer.
https://cdn.jsdelivr.net/npm/[email protected]/dist/semantic.min.js
Add the following CSS links to your Head.
https://design.elpasotexas.gov/apps/components-css/symantic-css/symantic.css
https://design.elpasotexas.gov/apps/components-css/symantic-css/overrides.css
https://design.elpasotexas.gov/apps/components-css/elpaso-css/app-styles.css
The City of El Paso uses the Proxima Nova font. This font is a licensed font, but an acceptable free alternative is Montserrat, which can be obtained from Google Fonts.
For icons, the City uses FontAwesome and Google Icons as the icon repository, the repository provides free icons to use.
Use this sample file to get started.
<!DOCTYPE html>
<html>
<head>
Page Title
</head>
<body>
This is a Heading
This is a paragraph.
<script src="https://code.jquery.com/jquery-3.6.0.min.js" integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/semantic.min.js"></script>
</body>
</html>