feat(restricted): bump bootstrap 5

ref: MANAGER-15385 Signed-off-by: David Arsène <[email protected]>
ovh · Oct 21, 2024 · b59f23b · b59f23b
1 parent e243064
commit b59f23b
Show file tree

Hide file tree

Showing 6 changed files with 17 additions and 5 deletions.
diff --git a/packages/manager/apps/restricted/package.json b/packages/manager/apps/restricted/package.json
@@ -24,7 +24,7 @@
     "@ovh-ux/manager-vite-config": "^0.8.0",
     "@ovh-ux/request-tagger": "^0.3.0",
     "@ovh-ux/ui-kit": "^6.10.5",
-    "bootstrap": "4.6.0",
+    "bootstrap": "5.0.0",
     "font-awesome": "^4.7.0",
     "i18next": "^23.8.2",
     "i18next-http-backend": "^1.3.0",

diff --git a/packages/manager/apps/restricted/src/restricted/ErrorJumbotron/error-jumbotron.styles.scss b/packages/manager/apps/restricted/src/restricted/ErrorJumbotron/error-jumbotron.styles.scss
@@ -5,4 +5,8 @@
     border-radius: 0 !important;
     color: rgb(193, 27, 27);
   }
+
+  ul {
+    padding-inline-start: 2.5rem;
+  }
 }
diff --git a/packages/manager/apps/restricted/src/restricted/GuideCard/GuideCard.tsx b/packages/manager/apps/restricted/src/restricted/GuideCard/GuideCard.tsx
@@ -12,15 +12,15 @@ const GuideCard = ({ id, link }: Guide) => {
   const translationPrefix = `restricted_guide_card_${id}`;
   return (
     <a
-      className="guide-card py-2 oui-tile d-flex flex-column align-items-start p-3"
+      className="guide-card p-3 oui-tile d-flex flex-column align-items-start"
       target="_blank"
       rel="noreferrer noopener"
       href={region === 'US' ? US_GUIDE : link[locale] ?? link.default}
     >
       <h5 className="guide-title">{t('restricted_guide_card_title')}</h5>
-      <h3 className="font-weight-bold">{t(`${translationPrefix}_title`)}</h3>
+      <h3 className="fw-bold">{t(`${translationPrefix}_title`)}</h3>
       <div className="oui-tile__body mt-3">
-        <p className="oui-tile__description font-weight-normal">
+        <p className="oui-tile__description fw-normal">
           {t(`${translationPrefix}_description`)}
         </p>
         <span className="oui-link oui-link_icon">

diff --git a/packages/manager/apps/restricted/src/restricted/Restricted.tsx b/packages/manager/apps/restricted/src/restricted/Restricted.tsx
@@ -13,7 +13,7 @@ const Restricted = (): JSX.Element => (
   <div className="restricted d-flex flex-column h-100">
     <Navbar />
     <Sidebar />
-    <div className="restricted-main d-flex flex-column mx-auto px-5">
+    <div className="restricted-main d-flex flex-column px-5">
       <ErrorJumbotron />
       <div className="restricted-guides mb-4 d-flex flex-column flex-md-row">
         {GUIDES.map((guide) => (

diff --git a/packages/manager/apps/restricted/src/restricted/restricted.styles.scss b/packages/manager/apps/restricted/src/restricted/restricted.styles.scss
@@ -1,3 +1,5 @@
+@import 'bootstrap/scss/bootstrap';
+
 .restricted {
   background-color: rgb(241, 249, 253);
 
@@ -10,6 +12,7 @@
   }
 
   .restricted-main {
+    @extend .mx-auto;
     box-sizing: border-box;
     background-color: white;
     max-width: 62rem;

diff --git a/yarn.lock b/yarn.lock
@@ -11504,6 +11504,11 @@ [email protected]:
   resolved "https://registry.yarnpkg.com/bootstrap/-/bootstrap-4.6.0.tgz#97b9f29ac98f98dfa43bf7468262d84392552fd7"
   integrity sha512-Io55IuQY3kydzHtbGvQya3H+KorS/M9rSNyfCGCg9WZ4pyT/lCxIlpJgG1GXW/PswzC84Tr2fBYi+7+jFVQQBw==
 
+[email protected]:
+  version "5.0.0"
+  resolved "https://registry.yarnpkg.com/bootstrap/-/bootstrap-5.0.0.tgz#97635ac0e0d6cb466700ebf0fd266bfabf352ed2"
+  integrity sha512-tmhPET9B9qCl8dCofvHeiIhi49iBt0EehmIsziZib65k1erBW1rHhj2s/2JsuQh5Pq+xz2E9bEbzp9B7xHG+VA==
+
 bootstrap@^3.3.6, bootstrap@^3.3.7, bootstrap@^3.4.1, bootstrap@~3.4.1:
   version "3.4.1"
   resolved "https://registry.yarnpkg.com/bootstrap/-/bootstrap-3.4.1.tgz#c3a347d419e289ad11f4033e3c4132b87c081d72"