Adjust css for medical info

- Rename card-with-status rules to use app- prefix
- Remove unnecessary position: relative rule for app-card-with-status (the card
  component that gets rendered inside this component has its own
  position rule specified)

Author: malcolmbaig

manage_breast_screening/assets/sass/components/_card-with-status.scss

@@ -1,10 +1,6 @@
 @use "../vendor/nhsuk-frontend/base" as *;
 
-.card-with-status {
-  position: relative;
-}
-
-.card-with-status__tag {
+.app-card-with-status__tag {
   position: absolute;
   top: nhsuk-spacing(3);
   right: nhsuk-spacing(3);

manage_breast_screening/mammograms/jinja2/mammograms/components/card_with_status.jinja

@@ -3,11 +3,11 @@
 
 {% macro card_with_status(section, anchor, status_tag_properties, action_button_properties=None, csrf_input=None) %}
   {% set outer_caller = caller if caller is defined else none %}
-  <div id="{{ anchor }}" class="card-with-status">
+  <div id="{{ anchor }}" class="app-card-with-status">
     {% call card({
       "heading": section.label
     }) %}
-      <div class="card-with-status__tag">
+      <div class="app-card-with-status__tag">
         {{ tag(status_tag_properties) }}
       </div>
 

manage_breast_screening/tests/system/clinical/test_reviewing_medical_information.py

@@ -50,15 +50,15 @@ def and_i_am_on_the_record_medical_information_page(self):
 
     def then_section_has_to_review_tag(self, section_heading: str):
         card = self._medical_information_card(section_heading)
-        expect(card.locator(".card-with-status__tag")).to_contain_text("To review")
+        expect(card.locator(".app-card-with-status__tag")).to_contain_text("To review")
 
     def when_i_mark_section_as_reviewed(self, section_heading: str):
         card = self._medical_information_card(section_heading)
         card.get_by_role("button", name="Mark as reviewed").click()
 
     def then_section_has_reviewed_tag(self, section_heading: str):
         card = self._medical_information_card(section_heading)
-        expect(card.locator(".card-with-status__tag")).to_contain_text("Reviewed")
+        expect(card.locator(".app-card-with-status__tag")).to_contain_text("Reviewed")
 
     def when_i_click_next_section(self, section_heading: str):
         card = self._medical_information_card(section_heading)
@@ -88,5 +88,5 @@ def _medical_information_sections(self):
     def _medical_information_card(self, heading: str):
         section_heading = self.page.get_by_role("heading", level=2, name=heading)
         return section_heading.locator(
-            "xpath=ancestor::div[contains(@class,'card-with-status')][1]"
+            "xpath=ancestor::div[contains(@class,'app-card-with-status')][1]"
         )