@infect/frontend
Version:
infect frontend
156 lines (138 loc) • 14.6 kB
HTML
<head>
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-108372802-1"></script>
<meta charset="utf-8" />
<title>INFECT – INterface For Empirical antimicrobial ChemoTherapy</title>
<meta name="description" content="INFECT provides a fast and intuitive access to the latest antimicrobial resistance data. Thereby it assists health professionals with empirical treatment choices tailored to the resistance epidemiology in the patients' geographical region." />
<meta name="MobileOptimized" content="width" />
<meta name="HandheldFriendly" content="true" />
<meta name="viewport" content="width=1024">
<meta property="og:title" content="INFECT – INterface For Empirical antimicrobial ChemoTherapy" />
<meta property="og:url" content="https://www.infect.info" />
<meta property="og:description" content="INFECT provides a fast and intuitive access to the latest antimicrobial resistance data. Thereby it assists health professionals with empirical treatment choices tailored to the resistance epidemiology in the patients' geographical region." />
<meta property="og:image" content="https://www.infect.info/img/og-image.jpg" />
<meta property="og:image:type" content="image/jpeg" />
<meta property="og:image:width" content="1200" />
<meta property="og:image:height" content="630" />
<meta name="apple-itunes-app" content="app-id=1422829703">
<meta name="apple-mobile-web-app-capable" content="yes" />
<!-- IE 11 to display SVG -->
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<!-- Load Fonts -->
<script src="https://use.typekit.net/uac3uao.js"></script>
<script>/* global Typekit */ try{Typekit.load();}catch(e){}</script>
<link rel="stylesheet" type="text/css" href="css/main.css">
<!-- Favicons -->
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
<link rel="manifest" href="/site.webmanifest">
<link rel="mask-icon" href="/safari-pinned-tab.svg" color="#5bbad5">
<meta name="msapplication-TileColor" content="#da532c">
<meta name="theme-color" content="#ffffff">
<script async src="js/main.js"></script>
</head>
<body>
<AppBanner></AppBanner>
<Notifications></Notifications>
<!--icons -->
<svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" style="display:none">
<symbol id="icon_bacteria" viewBox="0 0 45 43.2">
<g id="icon_bacteria">
<ellipse cx="23.02" cy="21.64" rx="10.12" ry="9.85"/>
<ellipse cx="22.88" cy="5.44" rx="3.04" ry="2.96"/>
<path d="M21.9,10a.93.93,0,0,1,.94-.91h0a.93.93,0,0,1,.94.91h0a.93.93,0,0,1-.94.91h0A.93.93,0,0,1,21.9,10Zm-3-.68a.9.9,0,0,1,0-1.29h0A1,1,0,0,1,20.2,8h0a.9.9,0,0,1,0,1.29h0a1,1,0,0,1-.67.28h0a1,1,0,0,1-.61-.3Zm6.61,0a.9.9,0,0,1,0-1.29h0a1,1,0,0,1,1.33,0h0a.9.9,0,0,1,0,1.29h0a1,1,0,0,1-.67.26h0a1,1,0,0,1-.61-.28ZM17.33,5.46a.93.93,0,0,1,.94-.91h0a.93.93,0,0,1,.94.91h0a.93.93,0,0,1-.94.91h0a.93.93,0,0,1-1-.85s0-.05,0-.08Zm9.35,0h0a.93.93,0,0,1,.94-.91h0a.93.93,0,0,1,.94.91h0a.93.93,0,0,1-.94.91h0a.93.93,0,0,1-1-.85s0-.05,0-.08ZM19,2.9a.9.9,0,0,1,0-1.29h0a1,1,0,0,1,1.33,0h0a.9.9,0,0,1,0,1.29h0a1,1,0,0,1-.67.28h0a1,1,0,0,1-.69-.32Zm6.61,0h0a.9.9,0,0,1,0-1.29h0a1,1,0,0,1,1.33,0h0a.9.9,0,0,1,0,1.29h0a1,1,0,0,1-.67.28h0a1,1,0,0,1-.69-.32ZM22,.91A.93.93,0,0,1,22.92,0h0a.93.93,0,0,1,.94.91h0a.93.93,0,0,1-.94.91h0a.93.93,0,0,1-1-.83.89.89,0,0,1,0-.1Z"/>
<ellipse cx="34.53" cy="10.38" rx="3.04" ry="2.96"/>
<path d="M33.59,14.93a.93.93,0,0,1,.94-.91h0a.93.93,0,0,1,.94.91h0a.93.93,0,0,1-.94.91h0a.93.93,0,0,1-.94-.91Zm-3-.68a.9.9,0,0,1,0-1.29h0a1,1,0,0,1,1.33,0h0a.9.9,0,0,1,0,1.29h0a1,1,0,0,1-.67.28h0A1,1,0,0,1,30.57,14.25Zm6.61,0a.9.9,0,0,1,0-1.29h0a1,1,0,0,1,1.33,0h0a.9.9,0,0,1,0,1.29h0a1,1,0,0,1-.67.26h0a1,1,0,0,1-.65-.28ZM29,10.4A.93.93,0,0,1,30,9.49h0a.93.93,0,0,1,.94.91h0a.93.93,0,0,1-.94.91h0a.93.93,0,0,1-1-.81.89.89,0,0,1,0-.12Zm9.35,0h0a.93.93,0,0,1,.94-.91h0a.93.93,0,0,1,.94.91h0a.93.93,0,0,1-.94.91h0a.94.94,0,0,1-1.07-.76.89.89,0,0,1,0-.17ZM30.65,7.84a.9.9,0,0,1,0-1.29h0a1,1,0,0,1,1.33,0h0a.9.9,0,0,1,0,1.29h0a1,1,0,0,1-.67.28h0a1,1,0,0,1-.73-.3Zm6.61,0h0a.9.9,0,0,1,0-1.29h0a1,1,0,0,1,1.33,0h0a.9.9,0,0,1,0,1.29h0a1,1,0,0,1-.67.28h0a1,1,0,0,1-.76-.32Zm-3.59-2a.93.93,0,0,1,.94-.91h0a.93.93,0,0,1,.94.91h0a.93.93,0,0,1-.94.91h0a.93.93,0,0,1-1-.83.89.89,0,0,1,0-.1Z"/>
<ellipse cx="39.29" cy="21.66" rx="3.04" ry="2.96"/>
<path d="M38.35,26.21a.93.93,0,0,1,.94-.91h0a.93.93,0,0,1,.94.91h0a.93.93,0,0,1-.94.91h0a.93.93,0,0,1-.94-.91Zm-3-.68a.9.9,0,0,1,0-1.29h0a1,1,0,0,1,1.33,0h0a.9.9,0,0,1,0,1.29h0a1,1,0,0,1-.67.28h0a1,1,0,0,1-.65-.3Zm6.61,0a.9.9,0,0,1,0-1.29h0a1,1,0,0,1,1.33,0h0a.9.9,0,0,1,0,1.29h0a1,1,0,0,1-.67.26h0a1,1,0,0,1-.65-.28Zm-8.16-3.85a.93.93,0,0,1,.94-.91h0a.93.93,0,0,1,.94.91h0a.93.93,0,0,1-.94.91h0a.93.93,0,0,1-1-.81.89.89,0,0,1,0-.12Zm9.35,0h0a.93.93,0,0,1,.94-.91h0a.93.93,0,0,1,.94.91h0a.93.93,0,0,1-.94.91h0a.93.93,0,0,1-1-.81.89.89,0,0,1,0-.12Zm-7.71-2.56a.9.9,0,0,1,0-1.29h0a1,1,0,0,1,1.33,0h0a.9.9,0,0,1,0,1.29h0a1,1,0,0,1-.67.28h0a1,1,0,0,1-.73-.32Zm6.61,0h0a.9.9,0,0,1,0-1.29h0a1,1,0,0,1,1.33,0h0a.9.9,0,0,1,0,1.29h0a1,1,0,0,1-.67.28h0a1,1,0,0,1-.76-.32Zm-3.59-2a.93.93,0,0,1,.94-.91h0a.93.93,0,0,1,.94.91h0a.93.93,0,0,1-.94.91h0a.93.93,0,0,1-1-.83.89.89,0,0,1,0-.1Z"/>
<ellipse cx="23.29" cy="37.74" rx="3.04" ry="2.96"/>
<path d="M22.35,42.29a.93.93,0,0,1,.94-.91h0a.93.93,0,0,1,.94.91h0a.93.93,0,0,1-.94.91h0a.93.93,0,0,1-.94-.91Zm-3-.68a.9.9,0,0,1,0-1.29h0a1,1,0,0,1,1.33,0h0a.9.9,0,0,1,0,1.29h0a1,1,0,0,1-.67.28h0a1,1,0,0,1-.65-.3Zm6.61,0a.9.9,0,0,1,0-1.29h0a1,1,0,0,1,1.33,0h0a.9.9,0,0,1,0,1.29h0a1,1,0,0,1-.67.26h0a1,1,0,0,1-.61-.28Zm-8.16-3.85a.93.93,0,0,1,.94-.91h0a.93.93,0,0,1,.94.91h0a.93.93,0,0,1-.94.91h0a.93.93,0,0,1-1-.81.89.89,0,0,1,0-.12Zm9.35,0h0a.93.93,0,0,1,.94-.91h0a.93.93,0,0,1,.94.91h0a.93.93,0,0,1-.94.91h0a.93.93,0,0,1-1-.81.89.89,0,0,1,0-.12ZM19.41,35.2a.9.9,0,0,1,0-1.29h0a1,1,0,0,1,1.33,0h0a.9.9,0,0,1,0,1.29h0a1,1,0,0,1-.67.28h0a1,1,0,0,1-.76-.3Zm6.61,0h0a.9.9,0,0,1,0-1.29h0a1,1,0,0,1,1.33,0h0a.9.9,0,0,1,0,1.29h0a1,1,0,0,1-.67.28h0a1,1,0,0,1-.69-.32Zm-3.59-2a.93.93,0,0,1,.94-.91h0a.93.93,0,0,1,.94.91h0a.93.93,0,0,1-.94.91h0a.93.93,0,0,1-1-.83.89.89,0,0,1,0-.1Z"/>
<ellipse cx="5.61" cy="21.72" rx="3.04" ry="2.96"/>
<path d="M4.67,26.27a.93.93,0,0,1,.94-.91h0a.93.93,0,0,1,.94.91h0a.93.93,0,0,1-.94.91h0a.93.93,0,0,1-.94-.91Zm-3-.68a.9.9,0,0,1,0-1.29h0A1,1,0,0,1,3,24.3H3a.9.9,0,0,1,0,1.29H3a1,1,0,0,1-.67.28h0a1,1,0,0,1-.65-.3Zm6.61,0a.9.9,0,0,1,0-1.29h0a1,1,0,0,1,1.33,0h0a.9.9,0,0,1,0,1.29h0a1,1,0,0,1-.67.26h0a1,1,0,0,1-.67-.28ZM.1,21.74A.93.93,0,0,1,1,20.83H1a.93.93,0,0,1,.94.91H2a.93.93,0,0,1-.94.91H1a.93.93,0,0,1-1-.81.89.89,0,0,1,0-.12Zm9.35,0h0a.93.93,0,0,1,.94-.91h0a.93.93,0,0,1,.94.91h0a.93.93,0,0,1-.94.91h0a.93.93,0,0,1-1-.81.89.89,0,0,1,0-.12ZM1.74,19.18a.9.9,0,0,1,0-1.29h0a1,1,0,0,1,1.33,0h0a.9.9,0,0,1,0,1.29h0a1,1,0,0,1-.67.28h0a1,1,0,0,1-.76-.3Zm6.61,0h0a.9.9,0,0,1,0-1.29h0a1,1,0,0,1,1.33,0h0a.9.9,0,0,1,0,1.29h0a1,1,0,0,1-.67.28H9a1,1,0,0,1-.76-.32Zm-3.59-2a.93.93,0,0,1,.94-.91h0a.93.93,0,0,1,.94.91h0a.93.93,0,0,1-.94.91h0a.93.93,0,0,1-1-.83.89.89,0,0,1,0-.1Z"/>
<ellipse cx="11.04" cy="9.87" rx="3.04" ry="2.96"/>
<path d="M10.1,14.41A.93.93,0,0,1,11,13.5h0a.93.93,0,0,1,.94.91h0a.93.93,0,0,1-.94.91h0a.93.93,0,0,1-.94-.91Zm-3-.68a.9.9,0,0,1,0-1.29h0a1,1,0,0,1,1.33,0h0a.9.9,0,0,1,0,1.29h0a1,1,0,0,1-.67.28h0a1,1,0,0,1-.67-.3Zm6.61,0a.9.9,0,0,1,0-1.29h0a1,1,0,0,1,1.33,0h0a.9.9,0,0,1,0,1.29h0a1,1,0,0,1-.67.26h0a1,1,0,0,1-.61-.28ZM5.53,9.89A.93.93,0,0,1,6.47,9h0a.93.93,0,0,1,.94.91h0a.93.93,0,0,1-.94.91h0a.93.93,0,0,1-1-.81.89.89,0,0,1,0-.12Zm9.35,0h0A.93.93,0,0,1,15.82,9h0a.93.93,0,0,1,.94.91h0a.93.93,0,0,1-.94.91h0a.93.93,0,0,1-1-.81.89.89,0,0,1,0-.12ZM7.16,7.33A.9.9,0,0,1,7.16,6h0A1,1,0,0,1,8.49,6h0a.9.9,0,0,1,0,1.29h0a1,1,0,0,1-.67.28h0a1,1,0,0,1-.76-.3Zm6.61,0h0a.9.9,0,0,1,0-1.29h0A1,1,0,0,1,15.1,6h0a.9.9,0,0,1,0,1.29h0a1,1,0,0,1-.67.28h0a1,1,0,0,1-.69-.32Zm-3.59-2a.93.93,0,0,1,.94-.91h0a.93.93,0,0,1,.94.91h0a.93.93,0,0,1-.94.91h0a.93.93,0,0,1-1-.81.89.89,0,0,1,0-.12Z"/>
<ellipse cx="34.73" cy="33.06" rx="3.04" ry="2.96"/>
<path d="M33.8,37.6a.93.93,0,0,1,.94-.91h0a.93.93,0,0,1,.94.91h0a.93.93,0,0,1-.94.91h0a.93.93,0,0,1-.94-.91Zm-3-.68a.9.9,0,0,1,0-1.29h0a1,1,0,0,1,1.33,0h0a.9.9,0,0,1,0,1.29h0a1,1,0,0,1-.67.28h0a1,1,0,0,1-.65-.3Zm6.61,0a.9.9,0,0,1,0-1.29h0a1,1,0,0,1,1.33,0h0a.9.9,0,0,1,0,1.29h0a1,1,0,0,1-.67.26h0a1,1,0,0,1-.65-.28Zm-8.16-3.85a.93.93,0,0,1,.94-.91h0a.93.93,0,0,1,.94.91h0a.93.93,0,0,1-.94.91h0a.93.93,0,0,1-1-.81.89.89,0,0,1,0-.12Zm9.35,0h0a.93.93,0,0,1,.94-.91h0a.93.93,0,0,1,.94.91h0a.93.93,0,0,1-.94.91h0a.93.93,0,0,1-1-.81.89.89,0,0,1,0-.12Zm-7.71-2.56a.9.9,0,0,1,0-1.29h0a1,1,0,0,1,1.33,0h0a.9.9,0,0,1,0,1.29h0a1,1,0,0,1-.67.28h0a1,1,0,0,1-.76-.28Zm6.61,0h0a.9.9,0,0,1,0-1.29h0a1,1,0,0,1,1.33,0h0a.9.9,0,0,1,0,1.29h0a1,1,0,0,1-.67.28h0a1,1,0,0,1-.76-.28Zm-3.59-2a.93.93,0,0,1,.94-.91h0a.93.93,0,0,1,.94.91h0a.93.93,0,0,1-.94.91h0a.93.93,0,0,1-1-.83s0-.06,0-.08Z"/>
<ellipse cx="11.04" cy="33.45" rx="3.04" ry="2.96"/>
<path d="M10.1,38a.93.93,0,0,1,.94-.91h0A.93.93,0,0,1,12,38h0a.93.93,0,0,1-.94.91h0A.93.93,0,0,1,10.1,38Zm-3-.68a.9.9,0,0,1,0-1.29h0a1,1,0,0,1,1.33,0h0a.9.9,0,0,1,0,1.29h0a1,1,0,0,1-.67.28h0a1,1,0,0,1-.67-.28Zm6.61,0a.9.9,0,0,1,0-1.29h0A1,1,0,0,1,15,36h0a.9.9,0,0,1,0,1.29h0a1,1,0,0,1-.67.26h0a1,1,0,0,1-.61-.26ZM5.53,33.45a.93.93,0,0,1,.94-.91h0a.93.93,0,0,1,.94.91h0a.93.93,0,0,1-.94.91h0a.93.93,0,0,1-1-.81.89.89,0,0,1,0-.1Zm9.35,0h0a.92.92,0,0,1,.9-1h0a.93.93,0,0,1,.94.91h0a.93.93,0,0,1-.94.91h0a.93.93,0,0,1-1-.85v0ZM7.16,30.89a.9.9,0,0,1,0-1.29h0a1,1,0,0,1,1.33,0h0a.9.9,0,0,1,0,1.29h0a1,1,0,0,1-.67.28h0a1,1,0,0,1-.76-.3Zm6.61,0h0a.9.9,0,0,1,0-1.29h0a1,1,0,0,1,1.33,0h0a.9.9,0,0,1,0,1.29h0a1,1,0,0,1-.67.28h0a1,1,0,0,1-.69-.3Zm-3.59-2a.93.93,0,0,1,.94-.91h0a.93.93,0,0,1,.94.91h0a.93.93,0,0,1-.94.91h0a.93.93,0,0,1-1-.81.89.89,0,0,1,0-.12Z"/>
</g>
</symbol>
<symbol id="icon_antibiotics" viewBox="0 0 48 17.85">
<g id="icon_antibiotics">
<path d="M8.92,17.85A8.92,8.92,0,1,1,8.92,0H23V17.85Z"/>
<path d="M39.08,17.85A8.92,8.92,0,0,0,39.08,0H25.3V17.85Z"/>
</g>
</symbol>
<symbol id="icon_mostUsed" viewBox="0 0 45 41.4">
<g id="icon_favorite">
<polygon points="21.79 30.64 8.47 41.4 14.32 25.37 0 15.83 17.15 16.64 21.79 0 26.43 16.64 43.58 15.83 29.25 25.37 35.1 41.4 21.79 30.64"/>
</g>
</symbol>
<symbol id="icon_guidelines" viewBox="0 0 25.9 21.4">
<g id="icon_guidelines">
<path class="st0" d="M21.3,6.6c-2.5,0-4.6,2-4.6,4.6c0,0.5,0.1,0.9,0.2,1.4c-1.1,1-1.8,2.3-2.2,3.7c-0.7,2.7-1.6,3.6-3.7,3.6
c-0.9,0-1.6-0.3-2.1-0.8c-1-1-1-2.6-1-2.7v-3.3c4-0.4,6.4-3.5,6.4-5.8V0h-0.7h-0.8h-2.3v4.2h2.3v3.2c0,1.5-2,4.4-5.7,4.4
S1.5,8.9,1.5,7.4V4.2h2.3V0H1.5H0.8H0v7.4c0,2.3,2.4,5.5,6.4,5.8v3.3c0,0.1,0,2.3,1.4,3.7c0.8,0.8,1.9,1.2,3.2,1.2
c3.5,0,4.5-2.3,5.2-4.7c0.3-1,0.8-1.9,1.5-2.7c0.8,1.1,2.1,1.8,3.6,1.8c2.5,0,4.6-2,4.6-4.6S23.8,6.6,21.3,6.6z M21.3,12.8
c-0.9,0-1.6-0.7-1.6-1.6s0.7-1.6,1.6-1.6s1.6,0.7,1.6,1.6S22.2,12.8,21.3,12.8z"/>
</g>
</symbol>
<symbol id="icon_population" viewBox="0 0 50 50">
<g>
<rect class="cls-1" y="30" width="11" height="16"/><rect class="cls-1" x="14" y="10" width="11" height="36"/><rect class="cls-1" x="28" y="18" width="11" height="28"/>
</g>
</symbol>
</svg>
<div class="container">
<div class="container__side-navigation side-navigation js-side-navigation">
<div class="side-navigation__header header">
<div class="header__logo c-logo">
<a href="/" class="c-logo__link">
<TenantLogo />
</a>
</div>
<div class="header__search js-filter-search-container">
<div class="filters__search">
<FilterSearch/>
</div>
<div class="filters__menu">
<FilterListMenu/>
</div>
<hr class="divider divider--lead"/>
</div>
</div>
<div class="side-navigation__filters">
<div>
<FilterList/>
</div>
</div>
</div>
<div class="container__main main">
<div class="main__header">
<div class="top-navigation">
<SelectedDiagnosisFilter></SelectedDiagnosisFilter>
<SelectedFiltersList></SelectedFiltersList>
<OpenDiagnosisDrawerButton></OpenDiagnosisDrawerButton>
<div class="top-navigation__info info">
<InfoOverlayButton></InfoOverlayButton>
</div>
</div>
</div>
<div class="main__matrix resistanceMatrix">
<!-- We cannot have the body and header in one single SVG as fixing the header would require a transformation
which is very imperformant -->
<MatrixHeader></MatrixHeader>
<Matrix></Matrix>
<MatrixLoadingOverlay></MatrixLoadingOverlay>
</div>
<GuidedTour></GuidedTour>
</div>
</div>
<Drawer></Drawer>
<InfoOverlay></InfoOverlay>
<Disclaimer></Disclaimer>
<TenantRunner></TenantRunner>
</body>
</html>