feat(Ratio): add support for portrait size ratios (#6501)

* Added support for portrait size ratios * removed the 100% cap on the aspect ratio to allow portrait style size ratios * modified RatioSpec to allow aspect ratio greater than 100%
react-bootstrap · Dec 1, 2022 · 3cfdab1 · 3cfdab1
1 parent eaa4bb9
commit 3cfdab1
Show file tree

Hide file tree

Showing 2 changed files with 3 additions and 3 deletions.
diff --git a/src/Ratio.tsx b/src/Ratio.tsx
@@ -37,7 +37,7 @@ const defaultProps = {
 };
 
 function toPercent(num: number): string {
-  if (num <= 0 || num > 100) return '100%';
+  if (num <= 0) return '100%';
   if (num < 1) return `${num * 100}%`;
   return `${num}%`;
 }

diff --git a/test/RatioSpec.tsx b/test/RatioSpec.tsx
@@ -49,14 +49,14 @@ describe('Ratio', () => {
     styleAttr.should.match(/--bs-aspect-ratio:[ ]*100%;/);
   });
 
-  it('should support use 100% as custom ratio if aspectRatio is greater than 100', () => {
+  it('should support aspectRatio greater than 100', () => {
     const { getByTestId } = render(
       <Ratio data-testid="test" aspectRatio={200}>
         <div />
       </Ratio>,
     );
     const ratioElem = getByTestId('test');
     const styleAttr = ratioElem.getAttribute('style')!;
-    styleAttr.should.match(/--bs-aspect-ratio:[ ]*100%;/);
+    styleAttr.should.match(/--bs-aspect-ratio:[ ]*200%;/);
   });
 });