@hmcts/ccd-case-ui-toolkit 5.0.4-angular11-upgrade → 5.0.6-angular11-upgrade

package/storybook/assets/sass/application.scss

@@ -1,214 +0,0 @@
-// Path to assets for use with the file-url function
-// in the govuk frontend toolkit"s url-helpers partial
-$path: "/public/images/";
-
-// global styles for <a> and <p> tags
-$govuk-global-styles: true;
-
-
-// Width of main container
-$hmcts-page-width: 1220px;
-
-
-// Import GOV.UK Frontend
-@import "~govuk-frontend/govuk/all";
-@import "~@hmcts/frontend/all";
-
-// Patterns that aren’t in Frontend
-@import "patterns/check-your-answers";
-@import "patterns/task-list";
-@import "patterns/related-items";
-@import "patterns/pba";
-
-// Components that aren’t in Frontend
-@import "components/cookie-banner";
-
-
-// JUI styles
-@import "jui/all";
-
-html {
-  background-color: govuk-colour("light-grey");
-}
-
-.js-enabled .js-hidden {
-  display: none !important;
-}
-
-.govuk-skip-link:focus {
-  outline-offset: 0;
-  text-decoration: underline;
-}
-
-#content {
-  outline: 0;
-}
-
-.jui-measure {
-  max-width: 833px;
-}
-
-
-.jui-case-action-alert {
-  background-color: govuk-colour("blue");
-  color: govuk-colour("white");
-  margin-bottom: govuk-spacing(6);
-  padding: govuk-spacing(4);
-}
-
-.jui-case-action-alert__heading {
-  color: inherit;
-}
-
-.jui-case-action-alert__content {
-  color: inherit;
-
-  p:last-child {
-    margin-bottom: 0;
-  }
-
-}
-
-.jui-case-action-alert__link:link,
-.jui-case-action-alert__link:visited {
-  color: govuk-colour("white");
-}
-
-
-// Case action alert
-
-.jui-case-action-alert {
-  background-color: govuk-colour("blue");
-  color: govuk-colour("white");
-  margin-bottom: govuk-spacing(6);
-  padding: govuk-spacing(4);
-}
-
-
-.jui-case-action-alert__heading {
-  @include govuk-font(
-    $size: 24,
-    $weight: bold
-  );
-  color: inherit;
-  margin-bottom: govuk-spacing(2);
-  margin-top: 0;
-}
-
-
-.jui-case-action-alert__content {
-  color: inherit;
-
-  p:last-child {
-    margin-bottom: 0;
-  }
-
-}
-
-
-.jui-case-action-alert__link:link {
-  color: govuk-colour("white");
-}
-
-
-.jui-case-action-alert__link:focus {
-  color: govuk-colour("black");
-}
-
-
-
-@include govuk-media-query($from: tablet) {
-
-  .hmcts-page-heading {
-    text-align: justify;
-    font-size: .1px; // Hide whitespace between elements
-
-    &:after {
-      content: "";
-      display: inline-block;
-      width: 100%;
-    }
-
-  }
-
-  .hmcts-page-heading__title-wrapper {
-    display: inline-block;
-    vertical-align: top;
-
-    .hmcts-page-heading__title {
-      text-align: left;
-      margin-right: govuk-spacing(4);
-    }
-
-  }
-
-  .hmcts-page-heading__actions-wrapper {
-    display: inline-block;
-    vertical-align: top;
-
-    .hmcts-page-heading__button:first-child  {
-      margin-left: 0;
-    }
-
-  }
-
-  .hmcts-page-heading__button {
-    margin-left: govuk-spacing(4);
-    margin-top: govuk-spacing(1);
-  }
-
-}
-
-
-
-// Panel (temp)
-
-.panel {
-  padding: govuk-spacing(6);
-
-  p:last-child {
-    margin-bottom: 0;
-  }
-
-}
-
-.panel--information {
-  background-color: rgb(238, 247, 255);
-}
-
-
-
-// Prose scope
-
-.jui-prose-scope ul,
-.jui-prose-scope ol {
-  @extend %govuk-list;
-}
-
-
-.jui-prose-scope ul {
-  @extend %govuk-list--bullet;
-}
-
-
-.jui-prose-scope ol {
-  @extend %govuk-list--number;
-}
-
-.delete-org-button {
-  margin-left: 10px;
-}
-
-// Pagination (temp)
-
-.pagination-top {
-  float: left;
-  margin-bottom: 10px;
-  font-family: "GDS Transport", Arial, sans-serif;
-}
-.hmcts-pagination {
-  padding-left: 0
-}
-.ngx-pagination {
-  padding-left: 0
-}

package/storybook/assets/sass/components/_cookie-banner.scss

@@ -1,24 +0,0 @@
-.app-cookie-banner {
-  @include govuk-font(16);
-  @include govuk-text-colour;
-
-  box-sizing: border-box;
-  width: 100%;
-
-  padding-top: govuk-spacing(3);
-  padding-right: govuk-spacing(3);
-  padding-bottom: govuk-spacing(3);
-  padding-left: govuk-spacing(3);
-  background-color: lighten(desaturate(govuk-colour("light-blue"), 8.46), 42.55);
-}
-
-.app-cookie-banner__message {
-  margin: 0;
-  @include hmcts-width-container;
-}
-
-@include govuk-media-query($media-type: print) {
-  .app-cookie-banner {
-    display: none !important;
-  }
-}

package/storybook/assets/sass/jui/all.scss

@@ -1,20 +0,0 @@
-@import "settings/manifest";
-@import "objects/manifest";
-
-// Reference to all components
-@import "../../components/all";
-
-
-// TODO REMOVE THIS WHEN UX VERSION GETS BUMPED UP OR WHEN MENU COMPONENT IS DONE INSTEAD
-// DOTO NEEDS TO BE REMOVED
-.hmcts-page-heading__title-wrapper {
-    @include mq($from: tablet) {
-        float: left;
-    }
-}
-
-.hmcts-page-heading__actions-wrapper {
-    @include mq($from: tablet) {
-        float: right;
-    }
-}

package/storybook/assets/sass/jui/objects/_manifest.scss

@@ -1,5 +0,0 @@
-/* ==========================================================================
-   #OBJECTS
-   ========================================================================== */
-
-@import "objects.container";

package/storybook/assets/sass/jui/objects/_objects.container.scss

@@ -1,7 +0,0 @@
-/* ==========================================================================
-   #CONTAINER
-   ========================================================================== */
-
-.jui-width-container {
-  @include jui-width-container;
-}

package/storybook/assets/sass/jui/settings/_manifest.scss

@@ -1,6 +0,0 @@
-/* ==========================================================================
-   #SETTINGS
-   ========================================================================== */
-
-@import "settings.general";
-@import "settings.aspect-ratio";

package/storybook/assets/sass/jui/settings/_settings.aspect-ratio.scss

@@ -1,9 +0,0 @@
-/* ==========================================================================
-   #ASPECT RATIO
-   ========================================================================== */
-
-@mixin aspect-ratio($ratio-or-width, $height: null) {
-  $padding: if($height, percentage($height/$ratio-or-width), percentage(1/$ratio-or-width));
-  &:before { content:''; float: left; padding-bottom: $padding;  }
-  &:after  { content:''; display: table; clear: both;  }
-}

package/storybook/assets/sass/jui/settings/_settings.general.scss

@@ -1,34 +0,0 @@
-/* ==========================================================================
-   #GENERAL CONFIGURATIONS
-   ========================================================================== */
-
-$jui-page-width: 1220px;
-$jui-gutter: govuk-spacing(6);
-$jui-gutter-half: $govuk-gutter / 2;
-
-// Assets path
-$jui-assets-path : "/public/images/";
-
-@mixin jui-width-container {
-  margin-left: auto;
-  margin-right: auto;
-  max-width: $jui-page-width;
-
-  @include govuk-if-ie8 {
-    width: $jui-page-width;
-  }
-
-  // On mobile, add half width gutters
-  margin: 0 $jui-gutter-half;
-
-  // On tablet, add full width gutters
-  @include mq($from: tablet) {
-    margin: 0 $jui-gutter;
-  }
-
-  // As soon as the viewport is greater than the width of the page plus the
-  // gutters, just centre the content instead of adding gutters.
-  @include mq($and: "(min-width: #{($jui-page-width + $jui-gutter * 2)})") {
-    margin: 0 auto;
-  }
-}

package/storybook/assets/sass/patterns/_check-your-answers.scss

@@ -1,86 +0,0 @@
-// Recommended - Use these styles for the check your answers pattern
-.govuk-check-your-answers {
-
-  @include govuk-font($size: 19);
-
-  @include mq($from: desktop) {
-    display: table;
-  }
-}
-
-.govuk-check-your-answers--short {
-  @include mq($from: desktop) {
-    // to make group of q&a line up horizontally (unless there is just one group)
-    width: 100%;
-    // recommended for mostly short questions
-    .govuk-check-your-answers__question {
-      width: 30%;
-    }
-  }
-}
-
-.govuk-check-your-answers--long {
-  @include mq($from: desktop) {
-    // to make group of q&a line up horizontally (unless there is just one group)
-    width: 100%;
-    // recommended for mostly long questions
-    .govuk-check-your-answers__question {
-      width: 50%;
-    }
-  }
-}
-
-.govuk-check-your-answers__contents {
-  position: relative;
-  border-bottom: 1px solid $govuk-border-colour;
-
-  @include mq($from: desktop) {
-    display: table-row;
-    border-bottom-width: 0;
-  }
-}
-
-.govuk-check-your-answers__contents:first-child .govuk-check-your-answers__question,
-.govuk-check-your-answers__contents:first-child .govuk-check-your-answers__answer,
-.govuk-check-your-answers__contents:first-child .govuk-check-your-answers__change {
-  @include mq($from: desktop) {
-    padding-top: 0;
-  }
-}
-
-.govuk-check-your-answers__question,
-.govuk-check-your-answers__answer,
-.govuk-check-your-answers__change {
-  display: block;
-  margin: 0;
-  @include mq($from: desktop) {
-    display: table-cell;
-    border-bottom: 1px solid $govuk-border-colour;
-    padding: govuk-em(12, 19) govuk-em(20, 19) govuk-em(9, 19) 0; // copied from Elements' td padding
-  }
-}
-
-.govuk-check-your-answers__question {
-  font-weight: bold;
-  margin: govuk-em(12, 19) 4em govuk-em(4,19) 0;
-  // top: from Elements' td
-  // right: due to length of "change" link (adjust if you change the link to be much longer)
-  // bottom: by eye
-  // using margin instead of padding because of easier absolutely positioning of .govuk-check-your-answers__change
-}
-
-.govuk-check-your-answers__answer {
-  padding-bottom: govuk-em(9, 19); // from Elements' td
-}
-
-.govuk-check-your-answers__change {
-  text-align: right;
-  position: absolute;
-  top: 0;
-  right: 0;
-
-  @include mq($from: desktop) {
-    position: static;
-    padding-right: 0;
-  }
-}

package/storybook/assets/sass/patterns/_pba.scss

@@ -1,278 +0,0 @@
-// This is a GOV.UK Publishing specific component that
-// can be seen at http://govuk-static.herokuapp.com/component-guide/related_items
-
-.govuk-grid-column-payment-one-quarter {
-  float: left;
-  padding-left: 15px;
-  width: 100%;
-
-
-
-  @media screen and (min-width: 650px) {
-    width: 18%;
-    // margin-right: -15;
-    padding-left: 15px;
-  }
-}
-
-.govuk-grid-column-three-quarters {
-  float: left;
-  width: 100%;
-
-  @media screen and (min-width: 650px) {
-    width: 80%;
-  }
-}
-
-.js-enabled .js-hidden {
-  display: none !important;
-}
-
-mark.comment {
-  background-color: govuk-colour("orange");
-}
-
-.medium-toolbar-arrow-under:after {
-  border-color: #2f1e07 transparent transparent;
-}
-
-.medium-toolbar-arrow-over:before {
-  border-color: transparent transparent #2f1e07 ;
-}
-
-// Search search-square
-
-.search-square{
-  background: #005ea5;
-  padding: 5px 10px 10px 10px;
-  width:20px;
-  height:20px;
-
-
-}
-
-
-/* Style buttons */
-.btn {
-  background-color: DodgerBlue; /* Blue background */
-  border: none; /* Remove borders */
-  color: white; /* White text */
-  padding: 12px 16px; /* Some padding */
-  font-size: 16px; /* Set a font size */
-  cursor: pointer; /* Mouse pointer on hover */
-}
-
-/* Darker background on mouse-over */
-.btn:hover {
-  background-color: RoyalBlue;
-}
-
-
-
-// Home office kit-icons
-
-.side-space {
-  margin-right: .5em;
-}
-.icon-medium {
-  font-size: 24px;
-  &:before {
-    vertical-align: bottom;
-    padding-bottom: 1em;
-  }
-}
-.icon-small {
-  font-size: 18px;
-  &:before {
-    vertical-align: middle;
-    padding-bottom: 1em;
-  }
-}
-
-.icon-medium-white {
-  font-size: 24px;
-  color: #fff;
-  &:before {
-    vertical-align: bottom;
-    padding-bottom: 1em;
-  }
-}
-
-.icon-small-white {
-  font-size: 18px;
-  color: #fff;
-  &:before {
-    vertical-align: middle;
-    padding-bottom: 1em;
-  }
-}
-
-.submenu{
-  background: 	#005ea5;
-  height: 10px;
-  width: 100%;
-}
-
-
-
-// RESPONSIVE table
-//
-// body {
-//   line-height: 1.25;
-// }
-//
-// table {
-//   border-bottom: 1px solid #fff;
-//   border-collapse: collapse;
-//   margin: 0;
-//   padding: 0;
-//   width: 100%;
-//
-//   table-layout: auto;
-// }
-//
-// table caption {
-//   font-size: 1.5em;
-//   margin: .5em 0 .75em;
-// }
-//
-// table tr {
-//   background-color: #fff;
-//   border-bottom: 1px solid #ddd;
-//   padding: .35em;
-// }
-//
-// table th,
-// table td {
-//   padding: .625em 0;
-//   text-align: left;
-//
-// }
-//
-// table th {
-//
-// }
-//
-// @media screen and (max-width: 650px) {
-//   table {
-//     border: 0;
-//   }
-//
-//   table caption {
-//     font-size: 1.3em;
-//   }
-//
-//   table thead {
-//     border: none;
-//     clip: rect(0 0 0 0);
-//     height: 1px;
-//     margin: -1px;
-//     overflow: hidden;
-//     padding: 0;
-//     position: absolute;
-//     width: 1px;
-//
-//   }
-//
-//   table tr {
-//     border-bottom: 5px solid #ddd;
-//     display: block;
-//     margin-bottom: .625em;
-//
-//   }
-//
-//   table td {
-//     border-bottom: 1px solid #ddd;
-//     display: block;
-//     font-size: .8em;
-//     text-align: right;
-//   }
-//
-//   table td::before {
-//     /*
-//     * aria-label has no advantage, it won't be read inside a table
-//     content: attr(aria-label);
-//     */
-//     content: attr(data-label);
-//     float: left;
-//     font-weight: bold;
-//   }
-//
-//   table td:last-child {
-//     border-bottom: 0;
-//
-//   }
-// }
-
-
-.no-border-bottom {
-  border-bottom: 0;
-}
-
-.linked-payment {
-  border-left: 6px solid #006435;
-  padding-left: 7px;
-}
-
-.linked-payment-ref {
-  padding-left: 0px;
-
-  @media screen and (min-width: 650px) {
-    padding-left: 7px;
-
-  }
-}
-
-.hidden-link {
-  color: #fff;
-}
-
-.hmcts-sub-navigation__item2 {
-  font-family: "nta", Arial, sans-serif;
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-  font-weight: 400;
-  font-size: 16px;
-  line-height: 20px;
-  box-shadow: inset 0 -1px 0 #bfc1c3;
-  display: block;
-  margin-top: -1px;
-}
-
-.accountright{
-
-  padding-right: 500px;
-}
-
-.transactions-checkboxes {
-  &__item {
-    display: inline-block;
-  }
-}
-
-// Check your answers PBA
-
-// Recommended - Use these styles for the check your answers pattern
-.govuk-check-your-answers {
-
-  @include govuk-font($size: 19);
-
-  @include mq($from: desktop) {
-    display: table;
-  }
-}
-
-.govuk-check-your-answers--pba-overview {
-  @include mq($from: desktop) {
-    // to make focusOn of q&a line up horizontally (unless there is just one focusOn)
-    width: 100%;
-    // recommended for mostly short questions
-    .govuk-check-your-answers__question {
-      width: 35%;
-    }
-  }
-}
-
-.pay-balance-button{
-  margin-bottom: 6px;
-}

package/storybook/assets/sass/patterns/_related-items.scss

@@ -1,11 +0,0 @@
-// This is a GOV.UK Publishing specific component that
-// can be seen at http://govuk-static.herokuapp.com/component-guide/related_items
-
-.app-related-items {
-  border-top: 10px solid govuk-colour("blue");
-  padding-top: govuk-spacing(2);
-}
-
-.app-related-items .govuk-list > li {
-  margin-bottom: govuk-spacing(2);
-}