.save { background-color: #008000 !important; } .cancel { background-color: #f00 !important; } .delete { color: #f00 !important; } .sub-nav dd a.has-tip:hover { color: $link-colour; } .sub-nav { margin-bottom: 0.8rem; dd { margin: 0; padding: 0; i { margin-right: .7rem; } } } .tooltip { background-color: rgba(92,92,92,0.9); border-radius: 0.5em; color: $white; font-size: 0.9rem; padding: 6px 8px; radius: 20px; } .tooltip > .nub { border-color: transparent transparent rgba(92, 92, 92, 0.8) transparent; margin-left: 0.5em; } #patient_search { width: 365px; } dd.patient-name { display: none; } [data-magellan-expedition], [data-magellan-expedition-clone] { padding: 5px 0; } .sub-nav.fixed { left: auto; } .page-navigation { margin: 5px 0; } .collapse-patient-menu .patient-side-nav { left: -$patient-side-nav-width; } .patient-side-nav { @media print { display: none; } background-color: $patient-menu-background-colour; min-width: $patient-side-nav-width; padding: 0.6rem 0 2rem 0.6rem; width: $patient-side-nav-width; hr { margin: 0.3rem 0 0.5rem; } ul.side-nav { margin: 0; padding: 0; li { margin: 0; padding: 0 0 .1rem 0.5rem; a { border-radius: 3px; color: $nhs-blue; padding: 0.1rem 0.5rem; text-decoration: underline; } span { padding: 0.2rem 0.5rem; } &.action { padding-right: 0.5rem; padding-right: .5rem; a { background-color: $light-grey; border-radius: 2px; border-radius: 3px; color: $dark-grey; margin-bottom: 0.2rem; margin-right: 1rem; margin-top: 0.1rem; padding: 0.2rem 0.5rem; text-align: left; text-decoration: none; transition: all 0.3s ease 0s; &:hover { background-color: $nhs-blue; box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.13), 0 1px 3px 0 rgba(0, 0, 0, 0.08); color: $off-white; } } } &.actions-heading { margin-bottom: 0.3rem; } } } } .patient-side-nav li:last-child { margin-bottom: 0; } .patient-side-nav li > a:hover, .patient-side-nav li > a:hover:first-child:not(.button) { background-color: $link-colour; border-bottom-right-radius: 0; border-top-right-radius: 0; color: $white; } .patient-side-nav li.active > a, .patient-side-nav li.active > a:first-child:not(.button) { background-color: $white; border-bottom-left-radius: 3px; border-bottom-right-radius: 0; border-top-left-radius: 3px; border-top-right-radius: 0; color: $dark-grey; margin-right: 0; text-decoration: none; } .patient-side-nav li a.active:hover { background-color: $white; color: $dark-grey; } .patient-side-nav li.heading { color: $dark-grey; font-size: .9rem; font-weight: normal; } .mdm-top-bar { height: 2.3rem; ul li.name { color: $white; font-size: 1rem; height: 2.2rem; padding-left: 0.5rem; padding-top: 0.4rem; a { color: $white; padding-left: 0.5rem; } } } @media only screen and (min-width: 830px) { .top-bar-section li:not(.has-form) a:not(.button) { padding: 0 0.6rem; } } .top-bar-section .dropdown li.info { color: rgba(255, 255, 255, 0.5); font-size: 0.8em; line-height: 45px; padding: 0 15px; } .dropdown.button { padding-right: 3rem; &::after { right: 1rem; } } .sub-nav { background-color: transparent; float: left; margin: 0 0 1rem; padding: 0; width: 100%; } .sub-nav dd { margin: 0 0.25rem 0 0; } // Used when tabs are local to an area of a page and not inside a page-heading // Adds a border under the tabs, and the tabs within must be offset down by 1px // so that the active one seems to have no bottom border. .tabs-container { border-bottom: 1px solid $tab-border-color; clear: both; float: left; margin-bottom: 1rem; width: 100%; .sub-nav { margin: 0; position: relative; top: 1px; } } .sub-nav dd a { background-color: transparent; border: solid transparent; border-radius: 3px 3px 0 0; border-width: 3px 1px 1px; color: $monsoon; display: block; padding: 0.3rem 1.3rem; text-decoration: none; white-space: nowrap; } .sub-nav dd a:hover { color: $dark-grey; } .sub-nav dd.active a { background-color: $white; border-color: $nhs-orange $tab-border-color transparent; color: $dark-grey; padding: 0.3rem 1.3rem; } .sub-nav dd.active { font-weight: bold; } .sub-nav dd.active a:hover { background-color: $white; color: $dark-grey; } .f-dropdown li { &.disabled { color: $mid-grey; cursor: default; display: block; padding: 0.5rem; &:hover { background-color: $white; } } }