diff --git a/src/Assets/Styles/components/_map.scss b/src/Assets/Styles/components/_map.scss new file mode 100644 index 00000000..e35e577a --- /dev/null +++ b/src/Assets/Styles/components/_map.scss @@ -0,0 +1,118 @@ +.found-heading { + border-bottom: 1px solid lightgrey; + position: relative; + clear: both; + min-height: 48px; + margin-bottom: 10px; +} + +.map-results-list { + margin-left: 30px; +} + +.resultsmap { + position: relative; + text-align: center; +} + +.mapimage::before { + content: "Loading..."; + position: absolute; + z-index: 1; + top: 50%; + left: 0; + right: 0; + font-size: 18px; + margin-top: -9px; +} + +.mapimage { + z-index: 2; + position: relative; +} + +.mapimage img { + z-index: 2; + position: relative; +} + +.mapcontrols { + z-index: 3; + position: absolute; + right: 10px; + bottom: 38px; + width: 28px; + height: 55px; + user-select: none; + -webkit-user-select: none; + -webkit-box-shadow: rgba(0, 0, 0, 0.298039) 0px 1px 4px -1px; + box-shadow: rgba(0, 0, 0, 0.298039) 0px 1px 4px -1px; + border-top-left-radius: 2px; + border-top-right-radius: 2px; + border-bottom-right-radius: 2px; + border-bottom-left-radius: 2px; + cursor: pointer; + background-color: rgb(255, 255, 255); + width: 28px; + height: 55px; +} + +.mapzoombutton { + background-color: transparent; + background-image: none; + display: block; + border: 0px; + margin: 0px; + padding: 0px; + position: relative; + cursor: pointer; + user-select: none; + -webkit-user-select: none; + width: 27px; + height: 27px; + top: 0px; + left: 0px; + background-position: initial initial; + background-repeat: initial initial; +} + +.mapzoomdivider { + position: relative; + overflow: hidden; + width: 67%; + height: 1px; + left: 16%; + background-color: rgb(230, 230, 230); + top: 0px; +} + +.view-list-link, +.view-map-link { + position: relative; + background: transparent; + display: inline-block; + line-height: 35px; + margin-left: 30px; +} + +.view-list-link::before { + position: absolute; + content: ""; + background: transparent url("/images/maps/icon-burger.png") no-repeat 0 0; + width: 71px; + height: 56px; + background-size: 30%; + left: -30px; + top: 6px; +} + +.view-map-link::before { + position: absolute; + content: ""; + background: transparent url("/images/maps/icon-map.png") no-repeat 0 0; + width: 75px; + height: 56px; + background-size: 30%; + left: -30px; + top: 0 +} \ No newline at end of file diff --git a/src/Assets/Styles/components/_typahead.scss b/src/Assets/Styles/components/_typahead.scss new file mode 100644 index 00000000..c6f83d3c --- /dev/null +++ b/src/Assets/Styles/components/_typahead.scss @@ -0,0 +1,39 @@ +.twitter-typeahead { + width: 100%; +} + +.tt-suggestion { + font-family: "nta", Arial, sans-serif; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; + font-weight: 400; + font-size: 16px; + padding: 7.5px; + cursor: pointer; +} + +.tt-suggestion:hover, +.tt-cursor { + background-color: #d5e8f3; +} + +.tt-menu { + width: 100%; + background-color: white; + border: #bfc1c3 2px solid; + box-shadow: 0 3px 2px #bfc1c3; +} + +.tt-hint { + visibility: hidden !important; +} + +@media screen and (min-width: 641px) { + .panel .tt-menu { + width: 50%; + } +} + +.tt-highlight { + font-weight: bold; +} diff --git a/src/Assets/Styles/patterns/_course-parts.scss b/src/Assets/Styles/patterns/_course-parts.scss index 781158a4..af3ff99e 100644 --- a/src/Assets/Styles/patterns/_course-parts.scss +++ b/src/Assets/Styles/patterns/_course-parts.scss @@ -12,97 +12,94 @@ $course-parts-indent: 35px; } .course-parts-section { - display: table; - @include govuk-font($size: 19); - margin-bottom: 15px; - padding-bottom: (govuk-spacing(2) / 6); + display: table; + @include govuk-font($size: 19); + margin-bottom: 15px; + padding-bottom: (govuk-spacing(2) / 6); } .course-parts-items { - margin-bottom: govuk-spacing(2); + margin-bottom: govuk-spacing(2); - @include govuk-media-query($from: tablet) { - margin-bottom: (govuk-spacing(2) * 2); - } + @include govuk-media-query($from: tablet) { + margin-bottom: (govuk-spacing(2) * 2); + } } .course-parts-item { - padding-top: govuk-spacing(2); - padding-bottom: govuk-spacing(2); - @include govuk-clearfix; + padding-top: govuk-spacing(2); + padding-bottom: govuk-spacing(2); + @include govuk-clearfix; } .course-parts-item:first-child { - border-top: 1px solid $govuk-input-border-colour; + border-top: 1px solid $govuk-input-border-colour; } .course-part-task { - @include govuk-grid-column(two-thirds); - float: left; - @include govuk-font($size: 24); - margin: 0; + @include govuk-grid-column(two-thirds); + float: left; + @include govuk-font($size: 24); + margin: 0; } .course-part-task-action { - float: right; - margin-right: 0; - padding-top: 3px; + float: right; + margin-right: 0; + padding-top: 3px; } .course-part-tasks { - margin-top: 60px; + margin-top: 60px; + + @include govuk-media-query($from: desktop) { + display: table; + width: 100%; + } + + > * { + position: relative; @include govuk-media-query($from: desktop) { - display: table; - width: 100%; + display: table-row; } > * { - position: relative; - - @include govuk-media-query($from: desktop) { - display: table-row; - } - - > * { - display: block; - - @include govuk-media-query($from: desktop) { - display: table-cell; - padding: em(12, 19) em(20, 19) em(9, 19) 0; // copied from Elements' td padding - margin: 0; - } - } - - @include govuk-media-query($from: desktop) { - &:first-child > * { - padding-top: 0; - } - } - } + display: block; - .course-part-label { - float: none; - display: block; - font-weight: bold; - padding-bottom: 5px; - // @include media(desktop) { - // width: 30%; - // } + @include govuk-media-query($from: desktop) { + display: table-cell; + padding: em(12, 19) em(20, 19) em(9, 19) 0; // copied from Elements' td padding + margin: 0; + } } - > *:first-child .course-part-label { - margin-top: 0; + @include govuk-media-query($from: desktop) { + &:first-child > * { + padding-top: 0; + } } + } + + .course-part-label { + float: none; + display: block; + font-weight: bold; + padding-bottom: 5px; + } + + > *:first-child .course-part-label { + margin-top: 0; + } - .course-part-value { - float: none; - display: block; - padding: 0; - margin-bottom: 10px; + .course-part-value { + float: none; + display: block; + padding: 0; + margin-bottom: 10px; - &--empty { - color: govuk-colour("grey-1"); - } + &--empty { + color: govuk-colour("grey-1"); } + } } diff --git a/src/Assets/Styles/patterns/_definition-list.scss b/src/Assets/Styles/patterns/_definition-list.scss index f5ab055b..9b587e5d 100644 --- a/src/Assets/Styles/patterns/_definition-list.scss +++ b/src/Assets/Styles/patterns/_definition-list.scss @@ -1,38 +1,38 @@ %govuk-list--description { - @include govuk-clearfix; - margin-top: 0; + @include govuk-clearfix; + margin-top: 0; } %govuk-list--description > dt { - @include govuk-font($size: 19, $weight: normal); - vertical-align: top; + @include govuk-font($size: 19, $weight: normal); + vertical-align: top; - @include mq ($from: desktop) { - float: left; - width: 33.33%; - } + @include mq ($from: desktop) { + float: left; + width: 33.33%; + } } %govuk-list--description > dd { - @include govuk-font($size: 19, $weight: normal); - vertical-align: top; - margin: 0; - - @include mq ($from: desktop) { - float: left; - width: 66.66%; - } + @include govuk-font($size: 19, $weight: normal); + vertical-align: top; + margin: 0; - .govuk-details { - margin-bottom: 0; - } + @include mq ($from: desktop) { + float: left; + width: 66.66%; + } + + .govuk-details { + margin-bottom: 0; + } } .govuk-list--description { - @extend %govuk-list--description; + @extend %govuk-list--description; - &__label:after { - content: ":"; - display: inline-block; - } + &__label:after { + content: ":"; + display: inline-block; + } } diff --git a/src/Assets/Styles/patterns/_filters.scss b/src/Assets/Styles/patterns/_filters.scss index e4a0183d..d38b1b9e 100644 --- a/src/Assets/Styles/patterns/_filters.scss +++ b/src/Assets/Styles/patterns/_filters.scss @@ -1,46 +1,46 @@ .filter-form { - @include govuk-font($size: 19); - @include govuk-responsive-margin(4, "bottom"); - background-color: govuk-colour("grey-3"); + @include govuk-font($size: 19); + @include govuk-responsive-margin(4, "bottom"); + background-color: govuk-colour("grey-3"); + padding: 8px; + + &__title { + margin-bottom: 8px; + } + + &__value { + background-color: govuk-colour("white"); + margin-bottom: 8px; padding: 8px; - - &__title { - margin-bottom: 8px; - } - - &__value { - background-color: govuk-colour("white"); - margin-bottom: 8px; - padding: 8px; - padding-bottom: 5px; - } - - &__value--list { - @extend %govuk-list; - margin-bottom: 8px; - - li { - background-color: govuk-colour("white"); - border-bottom: 1px solid $govuk-border-colour; - margin: 0; - padding: 8px; - - &:last-child { - border: none; - } - } + padding-bottom: 5px; + } + + &__value--list { + @extend %govuk-list; + margin-bottom: 8px; + + li { + background-color: govuk-colour("white"); + border-bottom: 1px solid $govuk-border-colour; + margin: 0; + padding: 8px; + + &:last-child { + border: none; + } } + } - .govuk-input { - background: govuk-colour("white"); - margin-bottom: 8px; - } + .govuk-input { + background: govuk-colour("white"); + margin-bottom: 8px; + } - .govuk-button { - margin-bottom: 3px; - } + .govuk-button { + margin-bottom: 3px; + } - .govuk-list li:last-child { - margin-bottom: 0; - } + .govuk-list li:last-child { + margin-bottom: 0; + } } diff --git a/src/Assets/Styles/patterns/_pagination.scss b/src/Assets/Styles/patterns/_pagination.scss index 1b6fd544..2494fb60 100644 --- a/src/Assets/Styles/patterns/_pagination.scss +++ b/src/Assets/Styles/patterns/_pagination.scss @@ -1,107 +1,107 @@ .pub-c-pagination { - display: block; - margin-top: 30px; - margin-bottom: 30px; - margin-left: -15px; - margin-right: -15px + display: block; + margin-top: 30px; + margin-bottom: 30px; + margin-left: -15px; + margin-right: -15px } .pub-c-pagination__list { - margin: 0; - padding: 0 + margin: 0; + padding: 0 } .pub-c-pagination__list:after { - content: ""; - display: block; - clear: both + content: ""; + display: block; + clear: both } .pub-c-pagination__item { - font-family: "nta", Arial, sans-serif; - font-weight: 400; - text-transform: none; - font-size: 14px; - line-height: 1.1428571429; - float: left; - list-style: none; - text-align: right; - margin: 0; - padding: 0; - width: 50% + font-family: "nta", Arial, sans-serif; + font-weight: 400; + text-transform: none; + font-size: 14px; + line-height: 1.1428571429; + float: left; + list-style: none; + text-align: right; + margin: 0; + padding: 0; + width: 50% } @media (min-width: 641px) { - .pub-c-pagination__item { - font-size: 16px; - line-height: 1.25 - } + .pub-c-pagination__item { + font-size: 16px; + line-height: 1.25 + } } .pub-c-pagination__link { - display: block; - padding: 15px; - text-decoration: none + display: block; + padding: 15px; + text-decoration: none } .pub-c-pagination__link:visited { - color: #005ea5 + color: #005ea5 } .pub-c-pagination__link:hover, .pub-c-pagination__link:active { - background-color: #f8f8f8 + background-color: #f8f8f8 } .pub-c-pagination__link-title { - font-family: "nta", Arial, sans-serif; - font-weight: 400; - text-transform: none; - font-size: 20px; - line-height: 1.1111111111; - display: block + font-family: "nta", Arial, sans-serif; + font-weight: 400; + text-transform: none; + font-size: 20px; + line-height: 1.1111111111; + display: block } @media (min-width: 641px) { - .pub-c-pagination__link-title { - font-size: 27px; - line-height: 1.25 - } + .pub-c-pagination__link-title { + font-size: 27px; + line-height: 1.25 + } } .pub-c-pagination__item--previous { - float: left; - text-align: left + float: left; + text-align: left } @media (max-width: 640px) { - .pub-c-pagination__item--previous { - float: none; - width: 100% - } + .pub-c-pagination__item--previous { + float: none; + width: 100% + } } .pub-c-pagination__item--next { - float: right; - text-align: right + float: right; + text-align: right } @media (max-width: 640px) { - .pub-c-pagination__item--next { - float: none; - width: 100% - } + .pub-c-pagination__item--next { + float: none; + width: 100% + } } .pub-c-pagination__link-icon { - display: inline-block; - margin-bottom: 1px; - height: .482em; - width: .63em + display: inline-block; + margin-bottom: 1px; + height: .482em; + width: .63em } .pub-c-pagination__link-label { - display: inline-block; - margin-top: 0.1em; - text-decoration: underline + display: inline-block; + margin-top: 0.1em; + text-decoration: underline } diff --git a/src/Assets/Styles/site.scss b/src/Assets/Styles/site.scss index 20bfcba7..e3bfa701 100644 --- a/src/Assets/Styles/site.scss +++ b/src/Assets/Styles/site.scss @@ -5,540 +5,103 @@ $govuk-global-styles: true; @import "node_modules/govuk-frontend/all"; @import "components/cookie-banner"; +@import "components/map"; +@import "components/typahead"; @import "patterns/course-parts"; @import "patterns/success-summary"; @import "patterns/definition-list"; @import "patterns/filters"; @import "patterns/pagination"; +// Add brackets around user name in header .govuk-header__link--profile { - @extend .govuk-header__link; + @extend .govuk-header__link; - &:after { - content: ")"; - } + &:after { + content: ")"; + } - &:before { - content: "("; - margin-left: govuk-spacing(1); - } + &:before { + content: "("; + margin-left: govuk-spacing(1); + } } +// Custom list style .govuk-list--dash { - padding-left: govuk-spacing(4); - list-style-image: url('/images/dash.png'); - margin-bottom: govuk-spacing(8); + padding-left: govuk-spacing(4); + list-style-image: url('/images/dash.png'); + margin-bottom: govuk-spacing(8); } +// Add context to checkbox labels .govuk-checkboxes__label .govuk-\!-font-weight-bold { - display: block; + display: block; } // Add a red border to .form-control-group if validation fails .input-validation-error { - border: 4px solid govuk-color("red"); -} - -.phase-banner-wrapper { - max-width: 960px; - margin: 0 15px; - margin: 0 30px; - margin: 0 auto; - padding: 0 15px 10px; - outline: none; - - @include govuk-media-query($from: tablet) { - margin: 0 30px; - padding: 0 10px; - } - - @include govuk-media-query($from: desktop) { - margin: 0 auto; - width: 960px; - } -} - -// Add extra styles here, or re-organise the Sass files in whichever way makes most sense to you - -.add-double-bottom-margin { - margin-bottom: govuk-spacing(2); -} - -.form-control-full { - width: 100%; -} - -.results-item { - margin-bottom: govuk-spacing(2); -} - -.metadata dt, -.metadata dd { - display: inline-block; -} - -.metadata dt { - width: 20%; -} - -.metadata dd { - width: 79%; - margin-left: 0; -} - -.filter-category { - background-color: govuk-color("grey-3"); - padding: 12px; - margin-bottom: 10px; -} - -.filters { - background-color: govuk-colour("white"); - padding: 10px; -} - -.filter-heading { - margin-top: 3px; -} - -.filter-link { - padding-top: 10px; -} - -.tabs { - padding-left: 0; - border-bottom: 1px solid $govuk-input-border-colour; - font-size: 19px; - margin-bottom: govuk-spacing(2); - - li { - margin-bottom: -1px; - display: inline-block; - } - - a { - display: block; - padding: 15px 20px; - } - - .active a { - border: 1px solid $govuk-input-border-colour; - border-bottom-color: govuk-colour("white"); - text-decoration: none; - - &:link, - &:visited { - color: govuk-color("black"); - } - } -} - -.form-control-xsmall { - width: 120px; -} - -.form-control-small { - width: 200px; -} - -.tabs { - padding-left: 0; - border-bottom: 1px solid $govuk-input-border-colour; - font-size: 19px; - - li { - margin-bottom: -1px; - display: inline-block; - } - - a { - display: block; - padding: 15px 20px; - } - - .active a { - border: 1px solid $govuk-input-border-colour; - border-bottom-color: govuk-colour("white"); - text-decoration: none; - - &:link, - &:visited { - color: govuk-color("black"); - } - } -} - -.study-options-table-code { - width: 120px; -} - -.study-options-table-vacancies { - width: 120px; -} - -.multiple-options li { - margin-bottom: 5px; - border-bottom: 1px solid #ccc; -} - -.fake-email { - margin-left: 15px; - margin-top: 20px; - border: 5px solid $govuk-input-border-colour; - padding: 60px; -} - -.ucas-info-table tr:last-child td { - border-bottom: 0; -} - -.ucas-info-table .ucas-view-link { - text-align: right; -} - -.missing-section { - border: 5px solid $govuk-input-border-colour; - padding: govuk-spacing(2); -} - -.preview-pre { - white-space: pre-wrap; -} - -.heading-medium .heading-secondary { - color: govuk-colour("grey-1"); - font-weight: normal; - display: block; -} - -.ucas-info-table { - .subject-col { - width: 30%; - } - - .code-col { - width: 20%; - } - - .ucas-view-link { - text-align: right; - } -} - -.govuk-phase-banner:first-child { - background: #fff8c4; - padding-left: 10px; + border: 4px solid govuk-color("red"); } +// Custom divider to spilt radio buttons options i.e. "or" .govuk-radios__divider { - font-family: "nta", Arial, sans-serif; - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; - font-weight: 400; - font-size: 16px; - line-height: 1.25; - width: 40px; - margin-bottom: 10px; - text-align: center; + @include govuk-font($size: 19, $weight: normal); + width: 40px; + margin-bottom: 10px; + text-align: center; } -@media (min-width: 40.0625em) { - .govuk-radios__divider { - font-size: 19px; - line-height: 1.31579; - } -} - -.button.button-secondary { - background-color: #cccccc; - color: black; -} - -.found-heading { - border-bottom: 1px solid lightgrey; - position: relative; - clear: both; - min-height: 48px; - margin-bottom: 10px; -} - -.search-results-header { - &__count { - @include mq ($from: desktop) { - float: left; - } - } - - &__new-search { - @include mq ($from: desktop) { - float: right; - } - } - - .govuk-form-group { - border-bottom: 1px solid lightgrey; - border-top: 1px solid lightgrey; - clear: both; - margin-bottom: 0; - padding-bottom: 10px; - padding-top: 10px; - - @include mq ($from: desktop) { - text-align: right; - } - } - - select { - width: 180px; - } - - .sortedby-label { - @include mq ($from: desktop) { - display: inline; - margin-right: 0.5em; - } - } +// Custom phase banner for private beta +.govuk-phase-banner:first-child { + background: #fff8c4; + padding-left: 10px; } +// Search results view .search-results { - li { - @include govuk-responsive-padding(6, "bottom"); - @include govuk-responsive-padding(6, "top"); - border-bottom: 1px solid $govuk-border-colour; - margin: 0; - } + li { + @include govuk-responsive-padding(6, "bottom"); + @include govuk-responsive-padding(6, "top"); + border-bottom: 1px solid $govuk-border-colour; + margin: 0; + } } -.filter-apply-button { - padding-top: 30px; - padding-bottom: 20px; -} - -.filter-apply-button-inline { - padding-top: 15px; -} - -.panel .filter-apply-button { - padding-bottom: 0; -} - -.checkbox-filter .checkbox-container.checkbox-container-noscroll { - height: auto; - scroll-behavior: initial; -} - -table.alt th, -table.alt td { - padding-left: 10px; - padding-right: 10px; -} - -table.alt th { - border: none; - background-color: #cccccc; - font-weight: bold; -} - -.heading-xlarge-bat { - margin-top: 0.125em; - margin-bottom: 0.65em; -} - -.phase-banner-wrapper { - max-width: 960px; - margin: 0 15px; - margin: 0 30px; - margin: 0 auto; - padding: 0 15px 10px; - outline: none; -} - -@media screen and (min-width: 641px) { - .phase-banner-wrapper { - margin: 0 30px; - padding: 0 0 10px; +.search-results-header { + &__count { + @include mq ($from: desktop) { + float: left; } -} + } -@media screen and (min-width: 1020px) { - .phase-banner-wrapper { - margin: 0 auto; - width: 960px; + &__new-search { + @include mq ($from: desktop) { + float: right; } -} - -.course-details-section { - float: left; - width: 100%; -} + } -.subject-details-wrapper { + .govuk-form-group { + border-bottom: 1px solid lightgrey; + border-top: 1px solid lightgrey; clear: both; - padding-left: 12px; -} - -.subject-details-wrapper p { - margin-bottom: 10px; -} - -.multiple-choice-subject { - width: 100%; - border-bottom: solid 1px #cccccc; + margin-bottom: 0; padding-bottom: 10px; - margin-bottom: 10px; -} - -.multiple-choice-subject label { - margin-bottom: 10px; -} - -.twitter-typeahead { - width: 100%; -} - -.tt-suggestion { - font-family: "nta", Arial, sans-serif; - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; - font-weight: 400; - font-size: 16px; - padding: 7.5px; - cursor: pointer; -} - -.tt-suggestion:hover, -.tt-cursor { - background-color: #d5e8f3; -} - -.tt-menu { - width: 100%; - background-color: white; - border: #bfc1c3 2px solid; - box-shadow: 0 3px 2px #bfc1c3; -} - -.tt-hint { - visibility: hidden !important; -} + padding-top: 10px; -@media screen and (min-width: 641px) { - .panel .tt-menu { - width: 50%; + @include mq ($from: desktop) { + text-align: right; } -} - -.map-results-list { - margin-left: 30px; -} + } -.resultsmap { - position: relative; - text-align: center; -} - -.mapimage::before { - content: "Loading..."; - position: absolute; - z-index: 1; - top: 50%; - left: 0; - right: 0; - font-size: 18px; - margin-top: -9px; -} - -.mapimage { - z-index: 2; - position: relative; -} - -.mapimage img { - z-index: 2; - position: relative; -} - -.mapcontrols { - z-index: 3; - position: absolute; - right: 10px; - bottom: 38px; - width: 28px; - height: 55px; - user-select: none; - -webkit-user-select: none; - -webkit-box-shadow: rgba(0, 0, 0, 0.298039) 0px 1px 4px -1px; - box-shadow: rgba(0, 0, 0, 0.298039) 0px 1px 4px -1px; - border-top-left-radius: 2px; - border-top-right-radius: 2px; - border-bottom-right-radius: 2px; - border-bottom-left-radius: 2px; - cursor: pointer; - background-color: rgb(255, 255, 255); - width: 28px; - height: 55px; -} - -.mapzoombutton { - background-color: transparent; - background-image: none; - display: block; - border: 0px; - margin: 0px; - padding: 0px; - position: relative; - cursor: pointer; - user-select: none; - -webkit-user-select: none; - width: 27px; - height: 27px; - top: 0px; - left: 0px; - background-position: initial initial; - background-repeat: initial initial; -} - -.mapzoomdivider { - position: relative; - overflow: hidden; - width: 67%; - height: 1px; - left: 16%; - background-color: rgb(230, 230, 230); - top: 0px; -} - -.view-list-link, -.view-map-link { - position: relative; - background: transparent; - display: inline-block; - line-height: 35px; - margin-left: 30px; -} + select { + width: 180px; + } -.view-list-link::before { - position: absolute; - content: ""; - background: transparent url("/images/maps/icon-burger.png") no-repeat 0 0; - width: 71px; - height: 56px; - background-size: 30%; - left: -30px; - top: 6px; -} - -.view-map-link::before { - position: absolute; - content: ""; - background: transparent url("/images/maps/icon-map.png") no-repeat 0 0; - width: 75px; - height: 56px; - background-size: 30%; - left: -30px; - top: 0 -} - -.tt-highlight { - font-weight: bold; + .sortedby-label { + @include mq ($from: desktop) { + display: inline; + margin-right: 0.5em; + } + } } diff --git a/src/Views/Course/Index.cshtml b/src/Views/Course/Index.cshtml index 29329bec..c38cc73d 100644 --- a/src/Views/Course/Index.cshtml +++ b/src/Views/Course/Index.cshtml @@ -131,7 +131,7 @@ @if (Model.HasSection("about this training programme")) { -