Skip to content

Commit

Permalink
Merge pull request nhsuk-archive#49 from nhsuk/revert-48-CSSE-tool
Browse files Browse the repository at this point in the history
Revert "Csse tool"
  • Loading branch information
beccagorton182 authored Feb 10, 2022
2 parents 03ac4db + 7595372 commit ac5a085
Show file tree
Hide file tree
Showing 17 changed files with 1,730 additions and 2,177 deletions.
6 changes: 3 additions & 3 deletions app/assets/javascript/add-letter-code-list.js
Original file line number Diff line number Diff line change
Expand Up @@ -14,11 +14,11 @@ letterCodeButton.addEventListener('click', addNumberTolist);

//Function to save the nhs number and spit it back out above
function addNumberTolist() {
if(document.getElementById('letter-codes-autocomplete').value != "") {
var number = document.getElementById('letter-codes-autocomplete').value; // get value of whats inside the box
if(document.getElementById('autocomplete-customTemplates').value != "") {
var number = document.getElementById('autocomplete-customTemplates').value; // get value of whats inside the box
var letterCodelength = letterCodes.push(number) //adds it to the array + adds to new variable
letterCodelist.innerHTML+="<li id='letter-code-"+letterCodelength+"'name='letter-code-data' value='{{ data['letter-code-data'] }}'><strong>"+number+"</strong> <span class='nhsuk-body-s' style='display: inline; text-decoration: underline; margin-left:6px'><a class='remove-link' href='javascript:removeNumberFromList("+letterCodelength+")'> Remove </a> </span> </li>" //spit it back out (with some added extras)
document.getElementById('letter-codes-autocomplete').value="" // clears the box for the next input
document.getElementById('autocomplete-customTemplates').value="" // clears the box for the next input
}

}
Expand Down
6 changes: 3 additions & 3 deletions app/assets/javascript/add-result-code-list.js
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,9 @@
//Define empty array where NHS numbers will live when entered
var resultCode = []
//Define variables and helps the html talk to the javascript
var resultCodeinput = document.getElementById('result-code-result')
var hpvCodeinput = document.getElementById('result-code-hpv')
var actionCodeinput = document.getElementById('result-code-action')
var resultCodelist = document.getElementById('result-code-list')
var resultCodeButton = document.getElementById('add-result-code')

Expand All @@ -15,9 +18,6 @@ resultCodeButton.addEventListener('click', addNumberTolist);

//Function to save the nhs number and spit it back out above
function addNumberTolist() {
var resultCodeinput = document.getElementById('result-code-result-autocomplete')
var hpvCodeinput = document.getElementById('result-code-hpv-autocomplete')
var actionCodeinput = document.getElementById('result-code-action-autocomplete')
var rCode = resultCodeinput.value; // get value of whats inside the box of Result input
var hCode = hpvCodeinput.value; // get value of whats inside the box of HPV input
var aCode = actionCodeinput.value; // get value of whats inside the box of result input
Expand Down
2 changes: 1 addition & 1 deletion app/assets/javascript/add-sender-code-list.js
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,7 @@
//Define empty array where NHS numbers will live when entered
var senderCodes = []
//Define variables and helps the html talk to the javascript
var senderCodeinput = document.getElementById('sender-code-input')
var senderCodelist = document.getElementById('sender-code-list')
var senderCodeButton = document.getElementById('add-sender-code')

Expand All @@ -15,7 +16,6 @@ senderCodeButton.addEventListener('click', addNumberTolist);

//Function to save the nhs number and spit it back out above
function addNumberTolist() {
var senderCodeinput = document.getElementById('sender-code-input-autocomplete')
var number = senderCodeinput.value; // get value of whats inside the box
var senderCodelength = senderCodes.push(number) //adds it to the array
senderCodelist.innerHTML+="<li id='sender-code-"+senderCodelength+"'><strong>"+number+"</strong> <span class='nhsuk-body-s' style='display: inline; text-decoration: underline; margin-left:6px'><a class='remove-link' href='javascript:removeNumberFromList("+senderCodelength+")'> Remove </a> </span> </li>" //spit it back out (with some added extras)
Expand Down
39 changes: 0 additions & 39 deletions app/assets/javascript/suggestionDropdown.js

This file was deleted.

279 changes: 150 additions & 129 deletions app/assets/sass/components/_autocomplete.scss
Original file line number Diff line number Diff line change
Expand Up @@ -2,145 +2,166 @@
// COMPONENTS / AUTOCOMPLETE
// ==========================================================================

// needed to add a further wrapper as this
// needed to add a further wrapper as this

.autocomplete__wrapper {
position: relative;
}
.autocomplete__hint,
.autocomplete__input {
@extend .nhsuk-input;
@extend .nhsuk-input--width-10;
}
.autocomplete__input {
background-color: white;
position: relative;
}
.autocomplete__hint {
color: #b1b4b6;
position: absolute;
}
.autocomplete__input--default {
padding: 5px;
}
.autocomplete__input--show-all-values {
padding: 5px 34px 5px 5px;
cursor: pointer;
}
.autocomplete__dropdown-arrow-down {
z-index: -1;
display: inline-block;
position: absolute;
right: 8px;
width: 24px;
height: 24px;
top: 10px;
}
.autocomplete__menu {
background-color: #fff;
border: 2px solid #0b0c0c;
border-top: 0;
color: #0b0c0c;
margin: 0;
max-height: 342px;
overflow-x: hidden;
padding: 0;
width: 100%;
width: calc(100% - 4px);
}
.autocomplete__menu--visible {
display: block;
}
.autocomplete__menu--hidden {
display: none;
}
.autocomplete__menu--overlay {
box-shadow: rgba(0, 0, 0, 0.256863) 0 2px 6px;
left: 0;
position: absolute;
top: 100%;
z-index: 100;
min-width: 500px;
}
.autocomplete__menu--inline {
position: relative;
}
.autocomplete__option {
border-bottom: solid #b1b4b6;
border-width: 1px 0;
cursor: pointer;
display: flex;
position: relative;
}
.autocomplete__option > * {
pointer-events: none;
}
.autocomplete__option:first-of-type {
border-top-width: 0;
}
.autocomplete__option:last-of-type {
border-bottom-width: 0;
}
.autocomplete__option--odd {
background-color: #fafafa;
}
.autocomplete__option--focused,
.autocomplete__option:hover {
background-color: #1d70b8;
border-color: #1d70b8;
color: #fff;
outline: 0;
}
.autocomplete__option--focused .autocomplete__option-name,
.autocomplete__option:hover .autocomplete__option-name {
color:#fff;

}
.autocomplete__multiple-input {
display: flex;
}
@media (-ms-high-contrast: active), (forced-colors: active) {
.codecomplete {
.autocomplete__wrapper {
position: relative;
border-radius: 4px;
background-color: $color_nhsuk-white;
}

.autocomplete__hint,
.autocomplete__input {
background-color: $color_nhsuk-white;
border-radius: 4px;
height: 40px;
font-size: 17px;
line-height: 1.5;
-webkit-appearance: none;
border: 2px solid #4c6272;
border-radius: 0;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
margin-bottom: 0;
width: 100%;
}

.autocomplete__input {
background-color: transparent;
position: relative;
}

.autocomplete__hint {
color: #bfc1c3;
position: absolute;
}

.autocomplete__input--default {
padding: 8px;
}

.autocomplete__input--focused {
outline-offset: 0;
outline: 3px solid #ffeb3b;
}

.autocomplete__input--show-all-values {
padding: 4px 34px 4px 4px;
cursor: pointer;
}

.autocomplete__dropdown-arrow-down {
z-index: -1;
display: inline-block;
position: absolute;
right: 8px;
width: 24px;
height: 24px;
top: 10px;
}

.autocomplete__menu {
border-color: FieldText;
background-color: #fff;
border: 4px solid #0b0c0c;
border-top: 0;
color: #34384b;
margin: 0;
max-height: 342px;
overflow-x: hidden;
padding: 0;
width: 100%;
width: calc(100% - 4px);
}

.autocomplete__menu--visible {
display: block;
}

.autocomplete__menu--hidden {
display: none;
}

.autocomplete__menu--overlay {
box-shadow: rgba(0,0,0,.256863) 0 2px 6px;
left: 0;
position: absolute;
top: 100%;
z-index: 100;
}

.autocomplete__menu--inline {
position: relative;
}

.autocomplete__option {
background-color: Field;
color: FieldText;
border-bottom: solid #bfc1c3;
border-width: 1px 0;
cursor: pointer;
display: block;
position: relative;
}

.autocomplete__option > * {
pointer-events: none;
}

.autocomplete__option:first-of-type {
border-top-width: 0;
}

.autocomplete__option:last-of-type {
border-bottom-width: 0;
}

.autocomplete__option--odd {
background-color: #fafafa;
}

.autocomplete__option--focused,
.autocomplete__option:hover {
forced-color-adjust: none;
background-color: SelectedItem;
border-color: SelectedItem;
color: SelectedItemText;
outline-color: SelectedItemText;
background-color: #005ea5;
border-color: #005ea5;
color: #fff;
outline: 0;
}
}
.autocomplete__option--no-results {
background-color: #fafafa;
color: #646b6f;
cursor: not-allowed;
}
.autocomplete__hint,
.autocomplete__input,
.autocomplete__option {
font-size: 16px;
line-height: 1.25;
margin-bottom: 0;
}
.autocomplete__hint,
.autocomplete__option {
padding: 5px;
}
.autocomplete__option-name {
margin-left: 1em;
color: #4C6272;
}
@media (min-width: 641px) {

.autocomplete__option--no-results {
background-color: #fafafa;
color: #646b6f;
cursor: not-allowed;
}

.autocomplete__hint,
.autocomplete__input,
.autocomplete__option {
font-size: 19px;
line-height: 1.31579;
font-size: 17px;
line-height: 1.5;
}

.autocomplete__hint,
.autocomplete__option {
padding: 8px;
}
@media (min-width:641px) {
.autocomplete__hint,
.autocomplete__input,
.autocomplete__option {
font-size: 17px;
line-height: 1.5;
}
}


.autocomplete__input {
&:focus {
box-shadow: 0 0 0 4px #ffeb3b;
outline: 4px solid transparent;
outline-offset: 4px;
border: 4px solid black;
}
}

}

Loading

0 comments on commit ac5a085

Please sign in to comment.