Add conditional rendering for layout change based on screen size

explorer/CHANGELOG.md

@@ -9,6 +9,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ### Added
 
+- Add conditional rendering for layout changes based on screen size [#2061]
 - Add accessible name to the gas used progress bar [#2037]
 - Add accessible name to the nav bar button on mobile [#2036]
 - Implement warning for stale market data [#1892]
@@ -39,6 +40,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 [#2037]: https://github.com/dusk-network/rusk/issues/2037
 [#2039]: https://github.com/dusk-network/rusk/issues/2039
 [#2056]: https://github.com/dusk-network/rusk/issues/2056
+[#2061]: https://github.com/dusk-network/rusk/issues/2061
 
 <!-- VERSIONS -->
 

explorer/src/lib/components/__tests__/BlocksCard.spec.js

@@ -4,7 +4,6 @@ import { compose, mapWith, take } from "lamb";
 
 import { gqlBlocks } from "$lib/mock-data";
 import { transformBlock } from "$lib/chain-info";
-
 import { BlocksCard } from "..";
 
 describe("Blocks Card", () => {
@@ -17,6 +16,7 @@ describe("Blocks Card", () => {
   const baseProps = {
     blocks: null,
     error: null,
+    isSmallScreen: false,
     loading: false,
   };
   const baseOptions = {

explorer/src/lib/components/__tests__/TransactionsCard.spec.js

@@ -16,6 +16,7 @@ describe("Transactions Card", () => {
 
   const baseProps = {
     error: null,
+    isSmallScreen: false,
     loading: false,
     txns: null,
   };