Merged PR 783: column sorting on results

Related work items: #7375
This commit is contained in:
Robert Bond
2022-02-01 09:06:36 +00:00
16 changed files with 343 additions and 43 deletions
+40 -8
View File
@@ -131,14 +131,23 @@ export const getBasicSearch = (searchString) => {
});
};
export const getBasicSearchPaged = (searchString, pageNumber) => {
export const getBasicSearchPaged = (
searchString,
pageNumber,
orderBy,
fieldSort
) => {
//console.log(queryUrl);
return axios
.get(
"/api/endpoint/getbasicsearchpaged_api?searchString=" +
searchString +
"&pageNumber=" +
pageNumber
pageNumber +
"&orderby=" +
orderBy +
"&fieldSort=" +
fieldSort
)
.then((res) => {
return res.data;
@@ -157,10 +166,15 @@ export const getBasicDNSSearch = (searchString) => {
});
};
export const getBasicDNSSearchPaged = (pageNumber) => {
export const getBasicDNSSearchPaged = (pageNumber, orderBy, fieldSort) => {
return axios
.get(
"/api/endpoint/getbasicdnssearchpaged_api?pageNumber=" + pageNumber
"/api/endpoint/getbasicdnssearchpaged_api?pageNumber=" +
pageNumber +
"&orderby=" +
orderBy +
"&fieldSort=" +
fieldSort
)
.then((res) => res.data)
.catch((error) => {
@@ -187,13 +201,22 @@ export const getAdvancedSearch = (searchString) => {
});
};
export const getAdvancedSearchPaged = (searchString, pageNumber) => {
export const getAdvancedSearchPaged = (
searchString,
pageNumber,
orderBy,
fieldSort
) => {
return axios
.get(
"/api/endpoint/getadvancedsearchpaged_api?searchstring=" +
JSON.stringify(searchString) +
"&pageNumber=" +
pageNumber
pageNumber +
"&orderby=" +
orderBy +
"&fieldSort=" +
fieldSort
)
.then((res) => res.data)
.catch((error) => {
@@ -264,13 +287,22 @@ export const getSearchDocumentDetails = (incidentID) => {
});
};
export const getSearchDocumentDetailsPaged = (incidentID, pageNumber) => {
export const getSearchDocumentDetailsPaged = (
incidentID,
pageNumber,
orderBy,
fieldSort
) => {
return axios
.get(
"/api/endpoint/getsearchdocumentdetailspaged_api?incidentid=" +
incidentID +
"&pageNumber=" +
pageNumber
pageNumber +
"&orderby=" +
orderBy +
"&fieldSort=" +
fieldSort
)
.then((res) => res.data)
.catch((error) => {
+59 -3
View File
@@ -67,9 +67,38 @@ const DocumentDetails = (props) => {
</dd>
<dd className="govuk-summary-list__key govuk-!-font-size-16">
{t("case:documents-doc-type-label")}
<button
type="button"
onClick={() =>
sortDataBy("pinswg_isharedocumentlocations")
}
className={
orderByState ==
"pinswg_isharedocumentlocations"
? fieldSortState == "asc"
? `govuk-link govuk-link--no-underline govuk-!-font-weight-bold govuk-!-font-size-16 sortAsc`
: `govuk-link govuk-link--no-underline govuk-!-font-weight-bold govuk-!-font-size-16 sortDesc`
: `govuk-link govuk-link--no-underline govuk-!-font-weight-bold govuk-!-font-size-16`
}
>
{t("case:documents-doc-type-label")}
</button>
</dd>
<dd className="govuk-summary-list__key govuk-!-font-size-16">
{t("case:documents-date-published-label")}
<button
type="button"
onClick={() => sortDataBy("createdon")}
className={
orderByState == "createdon"
? fieldSortState == "asc"
? `govuk-link govuk-link--no-underline govuk-!-font-weight-bold govuk-!-font-size-16 sortAsc`
: `govuk-link govuk-link--no-underline govuk-!-font-weight-bold govuk-!-font-size-16 sortDesc`
: `govuk-link govuk-link--no-underline govuk-!-font-weight-bold govuk-!-font-size-16`
}
>
{t("case:documents-date-published-label")}
</button>
</dd>
{/* <dd className="govuk-summary-list__key govuk-!-font-size-16">
{t("case:documents-size-label")}
@@ -199,6 +228,8 @@ const DocumentDetails = (props) => {
currentPage={currentPage}
searchResultsObj={documentDetailsObj}
spinnerState={spinnerState}
orderBy={orderByState}
fieldSort={fieldSortState}
getDocumentResults={getDocumentResults}
/>
</>
@@ -250,8 +281,13 @@ const DocumentDetails = (props) => {
const searchDocumentResultsObj = docDetailsObj();
}, [incidentid, setDocumentHistory, setDocumentDetails]);
const getDocumentResults = (pageNumber) => {
getSearchDocumentDetailsPaged(incidentid, pageNumber)
const getDocumentResults = (incidentid, pageNumber, orderBy, fieldSort) => {
getSearchDocumentDetailsPaged(
incidentid,
pageNumber,
orderBy,
fieldSort
)
.then((data) => data)
.then((data) => {
//console.log("getting details", data);
@@ -264,7 +300,12 @@ const DocumentDetails = (props) => {
};
const getDocumentDetails = async () => {
let docObj = await getSearchDocumentDetailsPaged(incidentid, pageNumber)
let docObj = await getSearchDocumentDetailsPaged(
incidentid,
pageNumber,
orderBy,
fieldSort
)
.then((data) => {
//console.log(data);
setDocumentDetails(data);
@@ -345,6 +386,8 @@ const DocumentDetails = (props) => {
};
const [showDocumentSearchState, setDocumentSearchState] = useState(false);
const [orderByState, setOrderbyState] = useState("createdon");
const [fieldSortState, setfieldSortState] = useState("asc");
let documentSearchState = () => {
showDocumentSearchState == true
@@ -352,6 +395,19 @@ const DocumentDetails = (props) => {
: setDocumentSearchState(true);
};
// const sortDataBy = (whichField) => {
// setOrderbyState(whichField);
// setfieldSortState("asc");
// getSearchPageResults(1, whichField, fieldSortState);
// whichField == orderByState
// ? fieldSortState == "desc"
// ? setfieldSortState("asc")
// : setfieldSortState("desc")
// : setfieldSortState("asc");
// setShowSpinnerState(true);
// };
return (
<>
<div>
+17 -4
View File
@@ -4,6 +4,8 @@ import useTranslation from "next-translate/useTranslation";
const PaginationControl = (props) => {
const {
orderBy,
fieldSort,
searchString,
searchResultsObj,
currentPage,
@@ -82,7 +84,11 @@ const PaginationControl = (props) => {
className="govuk-body govuk-link govuk-!-font-weight-bold govuk-link--no-underline activePaginationItem leftTextButton"
onClick={() => {
spinnerState(),
getDocumentResults(currentPage - 1);
getDocumentResults(
currentPage - 1,
orderBy,
fieldSort
);
}}
>
{t("common:previous-link-button")}
@@ -115,8 +121,11 @@ const PaginationControl = (props) => {
key={i}
onClick={() => {
spinnerState();
console.log(i + 1);
getDocumentResults(i + 1);
getDocumentResults(
i + 1,
orderBy,
fieldSort
);
}}
>
{e}
@@ -130,7 +139,11 @@ const PaginationControl = (props) => {
className="govuk-body govuk-link govuk-!-font-weight-bold govuk-link--no-underline activePaginationItem rightTextButton"
onClick={() => {
spinnerState(),
getDocumentResults(currentPage + 1);
getDocumentResults(
currentPage + 1,
orderBy,
fieldSort
);
}}
>
{t("common:next-link-button")}
+51 -4
View File
@@ -46,6 +46,9 @@ const DNSSearchResults = (props) => {
: setShowSpinnerState(true);
};
const [orderByState, setOrderbyState] = useState("createdon");
const [fieldSortState, setfieldSortState] = useState("asc");
const ResultsView = (resultsArr) => {
return (
<div className="govuk-grid-row govuk-!-margin-top-9">
@@ -62,11 +65,40 @@ const DNSSearchResults = (props) => {
{t("search:searchresults-applicant-label")}
</dd>
<dd className="govuk-summary-list__key govuk-!-font-size-16">
{t("search:searchresults-authority-label")}
<button
type="button"
onClick={() =>
sortDataBy(
"_pinswg_associatedlpa_value"
)
}
className={
orderByState ==
"_pinswg_associatedlpa_value"
? fieldSortState == "asc"
? `govuk-link govuk-link--no-underline govuk-!-font-weight-bold govuk-!-font-size-16 sortAsc`
: `govuk-link govuk-link--no-underline govuk-!-font-weight-bold govuk-!-font-size-16 sortDesc`
: `govuk-link govuk-link--no-underline govuk-!-font-weight-bold govuk-!-font-size-16`
}
>
{t("search:searchresults-authority-label")}
</button>
</dd>
<dd className="govuk-summary-list__key govuk-!-font-size-16">
{t("search:searchresults-status-label")}
<button
type="button"
onClick={() => sortDataBy("statuscode")}
className={
orderByState == "statuscode"
? fieldSortState == "asc"
? `govuk-link govuk-link--no-underline govuk-!-font-weight-bold govuk-!-font-size-16 sortAsc`
: `govuk-link govuk-link--no-underline govuk-!-font-weight-bold govuk-!-font-size-16 sortDesc`
: `govuk-link govuk-link--no-underline govuk-!-font-weight-bold govuk-!-font-size-16`
}
>
{t("search:searchresults-status-label")}
</button>
</dd>
</div>
@@ -243,6 +275,8 @@ const DNSSearchResults = (props) => {
<PaginationControl
currentPage={currentPage}
searchResultsObj={searchResultsObj}
orderBy={orderByState}
fieldSort={fieldSortState}
spinnerState={spinnerState}
getSearchPageResults={getSearchPageResults}
/>
@@ -272,10 +306,10 @@ const DNSSearchResults = (props) => {
)
: pagesCount;
const getSearchPageResults = (pageNumber) => {
const getSearchPageResults = (pageNumber, orderBy, fieldSort) => {
//console.log(advancedSearch, searchString, pageNumber);
getBasicDNSSearchPaged(pageNumber)
getBasicDNSSearchPaged(pageNumber, orderBy, fieldSort)
.then((data) => {
return data;
})
@@ -288,6 +322,19 @@ const DNSSearchResults = (props) => {
});
};
const sortDataBy = (whichField) => {
setOrderbyState(whichField);
setfieldSortState("asc");
getSearchPageResults(1, whichField, fieldSortState);
whichField == orderByState
? fieldSortState == "desc"
? setfieldSortState("asc")
: setfieldSortState("desc")
: setfieldSortState("asc");
setShowSpinnerState(true);
};
return (
<>
<div className="govuk-grid-row">
+18 -5
View File
@@ -4,6 +4,8 @@ import useTranslation from "next-translate/useTranslation";
const PaginationControl = (props) => {
const {
orderBy,
fieldSort,
searchString,
searchResultsObj,
currentPage,
@@ -82,7 +84,11 @@ const PaginationControl = (props) => {
className="govuk-body govuk-link govuk-!-font-weight-bold govuk-link--no-underline activePaginationItem leftTextButton"
onClick={() => {
spinnerState(),
getSearchPageResults(currentPage - 1);
getSearchPageResults(
currentPage - 1,
orderBy,
fieldSort
);
}}
>
{t("common:previous-link-button")}
@@ -114,9 +120,12 @@ const PaginationControl = (props) => {
className="govuk-body govuk-link govuk-!-padding-2 govuk-!-font-weight-bold govuk-link--no-underline activePaginationItem"
key={i}
onClick={() => {
spinnerState();
console.log(i + 1);
getSearchPageResults(i + 1);
spinnerState(),
getSearchPageResults(
i + 1,
orderBy,
fieldSort
);
}}
>
{e}
@@ -130,7 +139,11 @@ const PaginationControl = (props) => {
className="govuk-body govuk-link govuk-!-font-weight-bold govuk-link--no-underline activePaginationItem rightTextButton"
onClick={() => {
spinnerState(),
getSearchPageResults(currentPage + 1);
getSearchPageResults(
currentPage + 1,
orderBy,
fieldSort
);
}}
>
{t("common:next-link-button")}
+76 -11
View File
@@ -74,6 +74,9 @@ const SearchResults = (props) => {
: setShowSpinnerState(true);
};
const [orderByState, setOrderbyState] = useState("createdon");
const [fieldSortState, setfieldSortState] = useState("asc");
const cookies = parseCookies();
const selectWatchedCase = (loggedInUser, incidentID, appealType) => {
@@ -166,13 +169,57 @@ const SearchResults = (props) => {
{t("search:searchresults-applicant-label")}
</dd>
<dd className="govuk-summary-list__key govuk-!-font-size-16">
{t("search:searchresults-authority-label")}
{/* {t("search:searchresults-authority-label")} */}
<button
type="button"
onClick={() =>
sortDataBy("_pinswg_associatedlpa_value")
}
className={
orderByState ==
"_pinswg_associatedlpa_value"
? fieldSortState == "asc"
? `govuk-link govuk-link--no-underline govuk-!-font-weight-bold govuk-!-font-size-16 sortAsc`
: `govuk-link govuk-link--no-underline govuk-!-font-weight-bold govuk-!-font-size-16 sortDesc`
: `govuk-link govuk-link--no-underline govuk-!-font-weight-bold govuk-!-font-size-16`
}
>
{t("search:searchresults-authority-label")}
</button>
</dd>
<dd className="govuk-summary-list__key govuk-!-font-size-16">
{t("search:searchresults-case-type-label")}
{/* {t("search:searchresults-case-type-label")} */}
<button
type="button"
onClick={() =>
sortDataBy("pinswg_appealcasetype")
}
className={
orderByState == "pinswg_appealcasetype"
? fieldSortState == "asc"
? `govuk-link govuk-link--no-underline govuk-!-font-weight-bold govuk-!-font-size-16 sortAsc`
: `govuk-link govuk-link--no-underline govuk-!-font-weight-bold govuk-!-font-size-16 sortDesc`
: `govuk-link govuk-link--no-underline govuk-!-font-weight-bold govuk-!-font-size-16`
}
>
{t("search:searchresults-case-type-label")}
</button>
</dd>
<dd className="govuk-summary-list__key govuk-!-font-size-16">
{t("search:searchresults-status-label")}
{/* {t("search:searchresults-status-label")} */}
<button
type="button"
onClick={() => sortDataBy("statuscode")}
className={
orderByState == "statuscode"
? fieldSortState == "asc"
? `govuk-link govuk-link--no-underline govuk-!-font-weight-bold govuk-!-font-size-16 sortAsc`
: `govuk-link govuk-link--no-underline govuk-!-font-weight-bold govuk-!-font-size-16 sortDesc`
: `govuk-link govuk-link--no-underline govuk-!-font-weight-bold govuk-!-font-size-16`
}
>
{t("search:searchresults-status-label")}
</button>
</dd>
{myportal == true && (
<dd className="govuk-summary-list__key govuk-!-font-size-16 govuk-summary-list__action"></dd>
@@ -449,6 +496,8 @@ const SearchResults = (props) => {
<PaginationControl
currentPage={currentPage}
searchResultsObj={searchResultsObj}
orderBy={orderByState}
fieldSort={fieldSortState}
spinnerState={spinnerState}
getSearchPageResults={getSearchPageResults}
/>
@@ -477,7 +526,7 @@ const SearchResults = (props) => {
)
: pagesCount;
const getSearchPageResults = (pageNumber) => {
const getSearchPageResults = (pageNumber, orderBy, fieldSort) => {
//console.log(advancedSearch, searchString, pageNumber);
if (advancedSearch) {
@@ -485,7 +534,7 @@ const SearchResults = (props) => {
...searchString.map(([key, val]) => ({ [key]: val }))
);
getAdvancedSearchPaged(searchoObj, pageNumber)
getAdvancedSearchPaged(searchoObj, pageNumber, orderBy, fieldSort)
.then((data) => data)
.then((data) => {
//console.log("getting details", data);
@@ -496,14 +545,11 @@ const SearchResults = (props) => {
});
});
} else {
getBasicSearchPaged(searchString, pageNumber)
.then((data) => {
//console.log(data);
setSearchResults(data);
return data;
})
getBasicSearchPaged(searchString, pageNumber, orderBy, fieldSort)
.then((data) => data)
.then((data) => {
//console.log("getting details", data);
setSearchResults(data);
return getSearchDetailsPaged(data).then((data) => {
setSearchDetails(data);
setShowSpinnerState(false);
@@ -512,6 +558,25 @@ const SearchResults = (props) => {
}
};
const sortDataBy = (whichField) => {
setOrderbyState(whichField);
setfieldSortState("asc");
getSearchPageResults(1, whichField, fieldSortState);
whichField == orderByState
? fieldSortState == "desc"
? setfieldSortState("asc")
: setfieldSortState("desc")
: setfieldSortState("asc");
setShowSpinnerState(true);
};
// console.log(
// "page is here ",
// currentPage,
// orderByState + " " + fieldSortState
// );
return (
<>
<div className="govuk-grid-row">
-2
View File
@@ -58,8 +58,6 @@ export default async function ApiProxy(req, res) {
};
};
console.log(WEBAPI_URL + queryUrl);
return axios
.get(
WEBAPI_URL + queryUrl, // + hashAPIPath(queryUrl),
@@ -1,5 +1,6 @@
import axios from "axios";
import CryptoJS from "crypto-js";
import { query } from "jsonpath";
import _ from "lodash";
import { getToken, azureHeadersPaged } from "../../../actions";
@@ -26,6 +27,9 @@ export default async function ApiProxy(req, res) {
var pageNumber = req.query.pageNumber;
var token = await getToken();
var orderby = req.query.orderby;
var fieldSort = req.query.fieldSort;
searchString = _.isEmpty(searchString)
? searchString
: JSON.parse(decodeURI(searchString));
@@ -60,11 +64,17 @@ export default async function ApiProxy(req, res) {
var queryUrl =
"incidents?$select=description,numberofchildincidents,_accountid_value,_customerid_value,_pinswg_associatedlpa_value,_ownerid_value,pinswg_appealcasetype,statuscode,ticketnumber,title, _primarycontactid_value&$expand=primarycontactid($select=fullname)&$filter=" +
queryString +
" and pinswg_appealcasetype ne null and pinswg_publishtoweb eq true&$orderby=createdon desc&$count=true" +
" and pinswg_appealcasetype ne null and pinswg_publishtoweb eq true&$orderby=" +
orderby +
" " +
fieldSort +
"&$count=true" +
(typeof pageNumber != "undefined"
? "&$skiptoken=" + ('<cookie pagenumber="' + pageNumber + '" />')
: "");
console.log("adv qu: ", queryUrl);
var apiResponse = _.isEmpty(searchString)
? res.status(400).json()
: axios
@@ -27,6 +27,8 @@ export default async function ApiProxy(req, res) {
var queryUrl =
"incidents?$select=description,numberofchildincidents,_accountid_value,_customerid_value,_pinswg_associatedlpa_value,_ownerid_value,pinswg_appealcasetype,statuscode,ticketnumber,title, _primarycontactid_value&$expand=primarycontactid($select=fullname)&$filter=pinswg_appealcasetype eq 846040011 and pinswg_publishtoweb eq true&$orderby=createdon desc&$count=true";
console.log(queryUrl);
return axios
.get(
WEBAPI_URL + queryUrl + hashAPIPath(queryUrl),
@@ -25,8 +25,15 @@ export default async function ApiProxy(req, res) {
var pageNumber = req.query.pageNumber;
var token = await getToken();
var orderby = req.query.orderby;
var fieldSort = req.query.fieldSort;
var queryUrl =
"incidents?$select=description,numberofchildincidents,_accountid_value,_customerid_value,_pinswg_associatedlpa_value,_ownerid_value,pinswg_appealcasetype,statuscode,ticketnumber,title, _primarycontactid_value&$expand=primarycontactid($select=fullname)&$filter=pinswg_appealcasetype eq 846040011 and pinswg_publishtoweb eq true&$orderby=createdon desc&$count=true" +
"incidents?$select=description,numberofchildincidents,_accountid_value,_customerid_value,_pinswg_associatedlpa_value,_ownerid_value,pinswg_appealcasetype,statuscode,ticketnumber,title, _primarycontactid_value&$expand=primarycontactid($select=fullname)&$filter=pinswg_appealcasetype eq 846040011 and pinswg_publishtoweb eq true&$orderby=" +
orderby +
" " +
fieldSort +
"&$count=true" +
(typeof pageNumber != "undefined"
? "&$skiptoken=" + '<cookie pagenumber="' + pageNumber + '" />'
: "");
+2
View File
@@ -32,6 +32,8 @@ export default async function ApiProxy(req, res) {
searchString +
"')) and pinswg_appealcasetype ne null and pinswg_publishtoweb eq true&$orderby=createdon desc&$count=true";
// console.log("basic search ", queryUrl);
var apiResponse = _.isEmpty(req.query)
? res.status(400).json()
: searchString.length > 0
@@ -34,7 +34,7 @@ export default async function ApiProxy(req, res) {
queryUrl = queryUrl + getSelectQuery(appealTypeName);
console.log("query: ", queryUrl, "<<<<end query");
//console.log("query: ", queryUrl, "<<<<end query");
return axios
.get(
+10 -1
View File
@@ -24,16 +24,25 @@ export default async function ApiProxy(req, res) {
var pageNumber = req.query.pageNumber;
var token = await getToken();
var orderby = req.query.orderby;
var fieldSort = req.query.fieldSort;
var queryUrl =
"incidents?$select=description,numberofchildincidents,_accountid_value,_customerid_value,_pinswg_associatedlpa_value,_ownerid_value,pinswg_appealcasetype,statuscode,ticketnumber,title, _primarycontactid_value&$expand=primarycontactid($select=fullname)&$filter=(contains(title, '" +
searchString +
"') or contains(ticketnumber, '" +
searchString +
"')) and pinswg_appealcasetype ne null and pinswg_publishtoweb eq true&$orderby=createdon desc&$count=true" +
"')) and pinswg_appealcasetype ne null and pinswg_publishtoweb eq true&$orderby=" +
orderby +
" " +
fieldSort +
"&$count=true" +
(typeof pageNumber != "undefined"
? "&$skiptoken=" + '<cookie pagenumber="' + pageNumber + '" />'
: "");
//console.log("basic search paged:", queryUrl);
var apiResponse =
searchString.length > 0
? axios
@@ -43,6 +43,8 @@ export default async function ApiProxy(req, res) {
incidentID +
"&$select=pinswg_isharedocumentlocations,_pinswg_documentids_value,pinswg_isharelabelcasetype,pinswg_isharelabellpaname,pinswg_publishtoweb,pinswg_uploadstatus,pinswg_isharedocumentclassification,pinswg_isharedocumentreference";
console.log("docu: ", queryUrl);
return axios
.get(
WEBAPI_URL + queryUrl + hashAPIPath(queryUrl),
@@ -39,14 +39,23 @@ export default async function ApiProxy(req, res) {
var incidentID = req.query.incidentid;
var token = await getToken();
var orderby = req.query.orderby;
var fieldSort = req.query.fieldSort;
var queryUrl =
"pinswg_documents?$count=true&$filter=pinswg_publishtoweb eq true and _pinswg_documentids_value eq " +
incidentID +
"&$select=pinswg_isharedocumentlocations,_pinswg_documentids_value,pinswg_isharelabelcasetype,pinswg_isharelabellpaname,pinswg_publishtoweb,pinswg_uploadstatus,pinswg_isharedocumentclassification,pinswg_isharedocumentreference" +
"&$select=pinswg_isharedocumentlocations,_pinswg_documentids_value,pinswg_isharelabelcasetype,pinswg_isharelabellpaname,pinswg_publishtoweb,pinswg_uploadstatus,pinswg_isharedocumentclassification,pinswg_isharedocumentreference&$orderby=" +
orderby +
" " +
fieldSort +
"&$count=true" +
(typeof pageNumber != "undefined"
? "&$skiptoken=" + ('<cookie pagenumber="' + pageNumber + '" />')
: "");
console.log("docu: ", queryUrl);
return axios
.get(
WEBAPI_URL + queryUrl + hashAPIPath(queryUrl),
+36 -1
View File
@@ -806,7 +806,7 @@ textarea,
.documentList {
.govuk-summary-list__key:first-of-type {
width: 20%;
width: 40%;
}
.govuk-summary-list__key:last-of-type {
width: 20%;
@@ -829,6 +829,41 @@ textarea,
}
}
}
button {
border: none;
background: none;
padding-left: 0;
color: #0360a6;
&.sortDesc:after {
width: 0;
height: 0;
border-style: solid;
border-width: 12px 5px 0 5px;
border-color: #0360a6 transparent transparent transparent;
content: "";
top: 16px;
position: relative;
left: 10px;
}
&.sortAsc:after {
width: 0;
height: 0;
border-style: solid;
border-width: 0 5px 12px 5px;
border-color: transparent transparent #0360a6 transparent;
content: "";
top: -16px;
position: relative;
left: 10px;
}
&:focus {
border: none;
box-shadow: none;
}
}
}
.results_wider {