Redesign

.github/workflows/crowdin.yml

@@ -1,6 +1,8 @@
 name: Crowdin Action
 
 on:
+  schedule:
+    - cron: "0 1 * * *" # every day at 1am UTC
   workflow_dispatch:
 
 concurrency: crowdin-dev
@@ -20,6 +22,22 @@ jobs:
           node-version: 18
           cache: yarn
 
+      - name: Set date environment variables
+        run: |
+          echo "YMDHM=$(date +%Y-%m-%d-%H-%M)" >> $GITHUB_ENV
+          echo "YMDH=$(date +%Y-%m-%d-%H)" >> $GITHUB_ENV
+          echo "YMD=$(date +%Y-%m-%d)" >> $GITHUB_ENV
+          echo "YM=$(date +%Y-%m)" >> $GITHUB_ENV
+
+      - name: Set Crowdin Source Folder
+        run: |
+          if [[ "${{ github.ref }}" == "refs/heads/production" ]]; then
+            echo "CW_SOURCE=dev" >> $GITHUB_ENV
+          else
+            echo "CW_SOURCE=test" >> $GITHUB_ENV
+          fi
+
+
       - name: Cache dependencies
         uses: actions/cache@v3
         with:
@@ -41,19 +59,25 @@ jobs:
         uses: actions/cache/restore@v3
         with:
           path: _crowdin
-          key: crowdin-cache-${{ github.ref_name }}
+          key: crowdin-cache-${{ env.CW_SOURCE }}-${{ env.YMDHM }}
+          restore-keys: |
+            crowdin-cache-${{ env.CW_SOURCE }}-${{ env.YMDHM }}
+            crowdin-cache-${{ env.CW_SOURCE }}-${{ env.YMDH }}
+            crowdin-cache-${{ env.CW_SOURCE }}-${{ env.YMD }}
+            crowdin-cache-${{ env.CW_SOURCE }}-${{ env.YM }}
+            crowdin-cache-${{ env.CW_SOURCE }}
 
       - name: Run pre-Crowdin script for file preparation
         run: yarn workspace @starknet-io/cms-scripts pre-crowdin
 
       - name: Upload source files to Crowdin project
-        run: yarn crowdin upload -b ${{ github.ref_name }}
+        run: yarn crowdin upload -b ${{ env.CW_SOURCE }}
         env:
           CROWDIN_PROJECT_ID: ${{ secrets.CROWDIN_PROJECT_ID }}
           CROWDIN_PERSONAL_TOKEN: ${{ secrets.CROWDIN_PERSONAL_TOKEN }}
 
       - name: Download approved translations from Crowdin
-        run: yarn crowdin download -b ${{ github.ref_name }} --export-only-approved --skip-untranslated-strings
+        run: yarn crowdin download -b ${{ env.CW_SOURCE }} --export-only-approved --skip-untranslated-strings
         env:
           CROWDIN_PROJECT_ID: ${{ secrets.CROWDIN_PROJECT_ID }}
           CROWDIN_PERSONAL_TOKEN: ${{ secrets.CROWDIN_PERSONAL_TOKEN }}
@@ -62,4 +86,4 @@ jobs:
         uses: actions/cache/save@v3
         with:
           path: _crowdin
-          key: crowdin-cache-${{ github.ref_name }}
+          key: crowdin-cache-${{ env.CW_SOURCE }}-${{ env.YMDHM }}

.github/workflows/social-media.yml

@@ -7,13 +7,14 @@ on:
 
 jobs:
   update-social-media-data:
-    runs-on: ubuntu-latest
+    runs-on: ubuntu-22.04
     steps:
       - name: Fetch Discord members data 
         uses: JamesIves/fetch-api-data-action@v2
         with:
           endpoint: https://discord.com/api/v9/invites/qypnmzkhbc?with_counts=true&with_expiration=true
           retry: true
+          save-location: _social-media
           save-name: discord
 
       - name: Fetch Twitter followers data
@@ -22,11 +23,12 @@ jobs:
           endpoint: https://api.twitter.com/1.1/users/show.json?screen_name=Starknet
           configuration: '{ "method": "GET", "headers": {"Authorization": "Bearer ${{ secrets.TW_BEARER_TOKEN }}"} }'
           retry: true
-          save-name: twitter	
+          save-location: _social-media
+          save-name: twitter
 
       - name: Set date environment variables
         run: |
-          echo "YMDHM=$(date +%Y-%m-%d%-H-%M)" >> $GITHUB_ENV
+          echo "YMDHM=$(date +%Y-%m-%d-%H-%M)" >> $GITHUB_ENV
 
       - name: Save social media data into cache
         uses: actions/cache/save@v3

.github/workflows/website.yml

@@ -36,11 +36,45 @@ jobs:
       - name: Install dependencies
         run: yarn
 
+      - name: Set Crowdin Environment
+        run: |
+          if [[ "${{ github.ref }}" == "refs/heads/production" ]]; then
+            echo "CW_SOURCE_ID=dev" >> $GITHUB_ENV
+          else
+            echo "CW_SOURCE_ID=test" >> $GITHUB_ENV
+          fi
+
+      - name: Set date environment variables
+        run: |
+          echo "YMDHM=$(date +%Y-%m-%d-%H-%M)" >> $GITHUB_ENV
+          echo "YMDH=$(date +%Y-%m-%d-%H)" >> $GITHUB_ENV
+          echo "YMD=$(date +%Y-%m-%d)" >> $GITHUB_ENV
+          echo "YM=$(date +%Y-%m)" >> $GITHUB_ENV
+
       - name: Restore Crowdin Cache
         uses: actions/cache/restore@v3
         with:
           path: _crowdin
-          key: crowdin-cache-dev
+          key: crowdin-cache-${{ env.CW_SOURCE_ID }}-${{ env.YMDHM }}
+          restore-keys: |
+            crowdin-cache-${{ env.CW_SOURCE_ID }}-${{ env.YMDHM }}
+            crowdin-cache-${{ env.CW_SOURCE_ID }}-${{ env.YMDH }}
+            crowdin-cache-${{ env.CW_SOURCE_ID }}-${{ env.YMD }}
+            crowdin-cache-${{ env.CW_SOURCE_ID }}-${{ env.YM }}
+            crowdin-cache-${{ env.CW_SOURCE_ID }}
+            crowdin-cache-
+
+      - name: Restore social media data
+        uses: actions/cache/restore@v3
+        with:
+          path: _social-media
+          key: sm-cache-${{ github.ref_name }}-${{ env.YMDHM }}
+          restore-keys: |
+            sm-cache-${{ github.ref_name }}-${{ env.YMDH }}
+            sm-cache-${{ github.ref_name }}-${{ env.YMD }}
+            sm-cache-${{ github.ref_name }}-${{ env.YM }}
+            sm-cache-${{ github.ref_name }}
+            sm-cache-
 
       - name: Update dynamic data
         run: yarn workspace @starknet-io/cms-scripts update-dynamic-data
@@ -67,7 +101,6 @@ jobs:
           projectName: starknet-website
           directory: dist/client
           workingDirectory: workspaces/website
-          wranglerVersion: '3'
+          wranglerVersion: "3"
           gitHubToken: ${{ secrets.GITHUB_TOKEN }}
           branch: ${{ github.ref_name == 'production' && 'main' || github.ref_name }}
-

_data/pages/block-explorers.yml

@@ -9,45 +9,59 @@ blocks:
     variant: block_explorers
     title: Block explorers & indexers
     description: Explore blocks, indexers, and other metrics of Starknet transactions.
-  - type: card_list
-    card_list_items:
-      - title: Starkscan
+    image: /assets/ecosystem/blockexplorers.svg
+  - type: flex_layout
+    blocks:
+      - type: asset_card
+        title: Starkscan
         description: "Block explorer and analytics for Starknet. "
         link_url: https://starkscan.co
         image: /assets/starkscan.jpg
         twitter: https://twitter.com/StarkscanCo
         website_url: https://starkscan.co/
-      - title: ViewBlock
-        description: "Block explorer and analytics for multiple networks including
+      - type: asset_card
+        title: ViewBlock
+        description:
+          "Block explorer and analytics for multiple networks including
           Starknet. "
         link_url: https://viewblock.io/starknet
         website_url: https://viewblock.io/starknet
         twitter: https://twitter.com/viewblock
         image: /assets/viewblock.jpg
-      - title: Voyager
+      - type: asset_card
+        title: Voyager
         description: "Block explorer and analytics for Starknet. "
         link_url: https://voyager.online
         website_url: https://voyager.online
         twitter: https://twitter.com/0xvoyageronline
         image: /assets/voyager.jpg
-    title: Block explorers
+    heading: Block explorers
     randomize: true
-  - type: card_list
+  - type: flex_layout
     randomize: true
-    title: Indexers
-    card_list_items:
-      - title: Apibara
+    heading: Indexers
+    blocks:
+      - type: asset_card
+        title: Apibara
         image: /assets/apibara-logo.png
+        img_bg_color: boreal-green
         website_url: https://www.apibara.com/
-        description: Apibara is an open-source data platform connecting Starknet to Web2
+        description:
+          Apibara is an open-source data platform connecting Starknet to Web2
           services
-      - title: Checkpoint
-        description: Checkpoint is a library for indexing data from Starknet events and
+      - type: asset_card
+        title: Checkpoint
+        description:
+          Checkpoint is a library for indexing data from Starknet events and
           making it accessible through a GraphQL API
         image: /assets/checkpoint-real-logo-blue.png
+        img_bg_color: boreal-green
         website_url: https://checkpoint.fyi/#/
-      - description: Token Flow provides fully decoded and contextualised on-chain data,
-          including storage information and L1 / L2 messaging.
+      - type: asset_card
         title: Token Flow
+        description:
+          Token Flow provides fully decoded and contextualised on-chain data,
+          including storage information and L1 / L2 messaging.
         image: /assets/token-flow-logo.jpg
+        img_bg_color: boreal-green
         website_url: https://tokenflow.live/

_data/pages/bridges-and-on-ramps.yml

@@ -8,48 +8,60 @@ blocks:
   - type: hero
     variant: bridges
     title: Bridges & on-ramps
-    description: Bridge tokens between Starknet and other chains or exchanges, or
+    description:
+      Bridge tokens between Starknet and other chains or exchanges, or
       exchange tokens with fiat through on-ramp services.
-  - type: card_list
-    title: What are bridges?
-    description: Bridges allow users to move assets between crypto ecosystems, such
+    image: /assets/ecosystem/bridges.svg
+  - type: flex_layout
+    heading: What are bridges?
+    description:
+      Bridges allow users to move assets between crypto ecosystems, such
       as blockchains or exchanges.
-    card_list_items:
-      - image: /assets/starkgate.jpg
+    blocks:
+      - type: asset_card
+        image: /assets/starkgate.jpg
         title: StarkGate
         description: StarkGate is the official bridge between Starknet and Ethereum.
         link_url: https://starkgate.starknet.io
         website_url: https://starkgate.starknet.io
         twitter: https://twitter.com/StarkWareLtd
-      - image: /assets/layerswap.jpg
+      - type: asset_card
+        image: /assets/layerswap.jpg
         title: Layerswap
         description: Layerswap allows users to move crypto between exchanges and layer 2s.
         link_url: https://www.layerswap.io
         website_url: https://www.layerswap.io
         twitter: https://twitter.com/layerswap
-      - title: Orbiter Finance
-        description: "Orbiter allows users to send funds across different layer 2
+      - type: asset_card
+        title: Orbiter Finance
+        description:
+          "Orbiter allows users to send funds across different layer 2
           networks. "
         link_url: https://www.orbiter.finance/?source=Ethereum&dest=Starknet
         website_url: https://www.orbiter.finance/?source=Ethereum&dest=Starknet
         image: /assets/orbiter.jpg
         twitter: https://twitter.com/Orbiter_Finance
     randomize: true
-  - type: card_list
-    title: What are fiat on-ramps?
-    description: Fiat on-ramps are service providers that allows for the exchange of
+  - type: flex_layout
+    heading: What are fiat on-ramps?
+    description:
+      Fiat on-ramps are service providers that allows for the exchange of
       fiat currencies for cryptocurrencies.
-    card_list_items:
-      - title: Banxa
+    blocks:
+      - type: asset_card
+        title: Banxa
         description: Banxa is a fiat to crypto on and off-ramp.
         link_url: https://banxa.com
         website_url: https://banxa.com
         twitter: https://twitter.com/BanxaOfficial
         image: /assets/banxa.jpg
-      - title: Ramp
+        img_bg_color: boreal-green
+      - type: asset_card
+        title: Ramp
         description: Non-custodial fiat to crypto on-ramp.
         image: /assets/ramp.jpg
         twitter: https://twitter.com/RampNetwork
         link_url: https://ramp.network
         website_url: https://ramp.network
+        img_bg_color: boreal-green
     randomize: true