Skip to content

Health-Informatics-UoN/CaRROT-Mapper

Repository files navigation

Table of Contents

  1. Introduction
  2. Getting Started
  3. Custom Styling
    1. CSS
    2. JavaScript

Introduction

This repository contains information and code for the CaRROT-Mapper system. This is a containerised Django/React webapp and associated Azure Functions which facilitates the generation of rules mapping datasets to the OMOP standard through manual and automated means.

Getting Started

See the Developer Quickstart at the CaRROT documentation.

Custom Styling

The folder api/static/ contains static folders that can be used to store custom css and javascript. Files contained within are then made publically accessable, i.e. viewable by the frontend code, for example:

<img src="{% static 'images/coconnect-logo.png' %}"...>

CSS

Styling of elements and the modification of Bootstrap elements can be made in api/static/style/custom.css.

For example, to change the background style of the navbar..:

/* make some snazy 90s-like theme for the nav bar */
.bg-co-connect {
    background:  linear-gradient(180deg,rgba(0,0,0,0) 0 96px, var(--co-connect-tertiary) 96px 100%),
		 linear-gradient(110deg,white 0 90px, var(--co-connect-primary-light) 150px , var(--co-connect-primary) 400px 80%,var(--co-connect-secondary));
}

/* change the navbar link colors  and mouse-over actions */
.nav-link{
	color:white !important;
    }
.nav-link:hover{
    color:rgba(256,256,256,0.5) !important;
}

JavaScript

Any js, e.g. jquery ajax calls can be inserted in api/static/javascript/custom.js.