$circleDiameter: 30rem; // Replace X with the desired diameter in rem
$circleRadius: $circleDiameter / 2;
$totalElements: 11;
$angleIncrement: 360deg / $totalElements; // Equal angle increment in degrees
$animationDuration: 12.5s;
@keyframes circle-motion {
from {
transform: rotate(-90deg) translate($circleRadius) rotate(90deg);
}
to {
transform: rotate(270deg) translate($circleRadius) rotate(-270deg);
}
}
@media (max-width:767px){
$circleDiameter: 24rem; // Replace X with the desired diameter in rem
$circleRadius: $circleDiameter / 2;
@keyframes circle-motion {
from {
transform: rotate(-90deg) translate($circleRadius) rotate(90deg);
}
to {
transform: rotate(270deg) translate($circleRadius) rotate(-270deg);
}
}
}
.section.section--proof .dot--large, .circle__icon {
animation: circle-motion $animationDuration linear infinite;
}
@keyframes circle-motion-small {
from {
transform: rotate(-90deg) translate(1.75em) rotate(90deg);
}
to {
transform: rotate(270deg) translate(1.75em) rotate(-270deg);
}
}
.circle__icon {
animation: circle-motion-small $animationDuration linear infinite paused;
}
.statement--wrapper{
.circle__icon{
animation-delay:var(--anim-delay);
}
}
@keyframes element-blur {
0%, 100% {
filter: blur(3px);
opacity:.2;
}
25% {
filter: blur(0px);
opacity:1;
}
50% {
filter: blur(3px);
opacity:.2;
}
}
.logo__item {
@for $i from 1 through $totalElements {
&:nth-child(#{$i}) {
// Calculate the angle for the current element
$angle: $angleIncrement * ($i - 1);
$randomDistanceX: random($circleDiameter+2) + 15; // Generates a number between 10 and 40
$randomDistanceY: random($circleDiameter+2) + 10;
// Generate a random distance from the center
// Calculate the X and Y positions using trigonometry
$xPosition: $randomDistanceX * cos($angle);
$yPosition: $randomDistanceY * sin($angle);
// Apply the translation
transform: translate(
#{$xPosition}rem,
#{$yPosition}rem
);
//transform: rotate($angle) translate($circleRadius) rotate(-$angle);
$animationDelay: ($angle / 360deg) * $animationDuration * 1;
// Apply the blur animation with the calculated delay
animation: element-blur $animationDuration * 1 linear infinite $animationDelay;
}
}
}
@media (max-width:767px){
.logo__item {
@for $i from 1 through $totalElements {
&:nth-child(#{$i}) {
// Calculate the angle for the current element
$angle: $angleIncrement * ($i - 1);
$randomDistanceX: random($circleDiameter+2) + 15; // Generates a number between 10 and 40
$randomDistanceY: random($circleDiameter+2) + 10;
// Generate a random distance from the center
// Calculate the X and Y positions using trigonometry
$xPosition: $randomDistanceX * cos($angle);
$yPosition: $randomDistanceY * sin($angle);
// Change values for mobile screens
$randomDistanceX: random($circleDiameter+2) + 2; // New value for X on mobile
$randomDistanceY: random($circleDiameter+1) + 25; // New value for Y on mobile
transform: translate(
#{$xPosition}rem,
#{$yPosition}rem
);
//transform: rotate($angle) translate($circleRadius) rotate(-$angle);
$animationDelay: ($angle / 360deg) * $animationDuration * 1;
// Apply the blur animation with the calculated delay
animation: element-blur $animationDuration * 1 linear infinite $animationDelay;
}
}
}
}
//counter
.section {
counter-reset: dotCounter;
}
.section .m--card-wrapper {
counter-increment: dotCounter;
}
.section .m--card-wrapper .dot--large::before {
content: counter(dotCounter);
display:block;
color:var(--color--main);
text-align:center;
}
Axelar network is already the largest cross-chain platform, serving Web3 with more connected blockchains.
Technology
Ecosystem
December 20, 2023
🔔 Axelar 2023 Year in Review 🔔
The year 2023 has been a remarkable year for the Axelar network, brimming with numerous network updates, new features, new integrations, live events, groundbreaking ideas and significant improvements
Ecosystem
Technology
November 15, 2023
J.P. Morgan & Apollo Deliver ‘Project Guardian’ With Help from Axelar & Others
Next-generation proof-of-concept uses cross-chain infrastructure to advance the $5.5T portfolio management industry
News
Ecosystem
November 14, 2023
Bridging Uniswap & Filecoin: A Cross-Chain Governance Case Study
How Uniswap used Axelar to deploy securely on Filecoin Virtual Machine
Ecosystem
October 27, 2023
Axelar AMA: Sergey Gorbunov + Jack Zampolin Talk Cosmos-EVM Cross-Chain, Interop Infrastructure & More
Axelar works closely with various Cosmos chains to provide Cosmos-EVM cross-chain capabilities and link other
Ecosystem
October 27, 2023
Developer AMA: Building the World’s First Cross-Chain NFT Marketplace
As we’ve been going through applications to the Axelerator Grant Challenge, Axelar’s cross-chain developer grant
Ecosystem
October 15, 2023
Cross-Chain Case Study: How Sommelier Combines Arbitrum DeFi & Cosmos Capability
Axelar GMP facilitates cross-chain asset transfers and aligns with Sommelier's mission, enabling Sommelier to expand its DeFi strategies to Arbitrum and 48 other networks
Ecosystem
October 13, 2023
Case Study: Examining dYdX’s Path to Profitable DeFi
How DeFi's largest perp-swap DEX found product-market fit, built a dedicated application chain and is connecting it to the world
Ecosystem
September 4, 2023
Meet the Axelar Bounty Winners From the HDGames Hackathon
The hackathon was focused on game development and helped match participants with fellow builders, mentors and investors
Ecosystem
August 28, 2023
Meet the Axelar Bounty Winners From Lagos OSCAFEST
Axelar sponsored a $5,000 bounty for teams building dApps sending cross-chain messages or tokens using Axelar General Message Passing (GMP)
Ecosystem
August 10, 2023
FVM Dataverse Axelar Hackathon Winners
There were some fantastic use cases and MVPs submitted, however only three projects could win the top prize.
Ecosystem
July 12, 2023
Case Study: GMP Enables MintDAO’s Cross-Chain NFT Solution
The evolving landscape of NFTs is fraught with challenges to both users and developers. By leveraging GMP, MintDAO addresses key pain points in the NFT space and sets the foundation for a more connected and fluid ecosystem.
Ecosystem
June 29, 2023
Axelar & BNB Chain Congratulate the Zero 2 Hero Hackathon Winners
Axelar's bounties challenged developers to use Axelar network in their projects and build a decentralized application that takes advantage of the ability to interact with contracts across multiple chains using Axelar General Message Passing (GMP).
Ecosystem
June 5, 2023
Behold: The Axelar Ecosystem Map
Check out the growing universe of interchain-native applications that use Axelar as a programmable interoperability layer
Ecosystem
June 1, 2023
Axelar Congratulates Inaugural U Waterloo `Olympihacks` Winners
Axelar’s track challenged hackers to use General Message Passing (GMP) to build an interchain-native application
Ecosystem
May 9, 2023
Case Study: Prime Protocol Pioneers Multichain DeFi Beyond Bridges
Prime Protocol does cross-chain DeFi lending with native assets, using Axelar GMP, allowing users to aggregate all their assets as collateral.
Ecosystem
April 9, 2023
Five Projects Graduate from the LongHashX 'Axelerator' Cohort
Five projects graduated from the world’s first cross-chain accelerator, run by LongHashX in partnership with Axelar, after 12 intense weeks of venture building and mentorship.
Ecosystem
April 6, 2023
Case Study: Junkyard is a Cross-Chain Game Played With NFTs you Hate to Own
Junkyard players throw their worthless NFTs into a smart contract on Ethereum. Junkyard uses Polygon to run a game that lets them "fish" the pile for rare NFTs. Axelar provides the secure connector.
Ecosystem
October 7, 2022
Partner Case Study: Squid Is Cross-Chain Liquidity for Everyone
Squid is a protocol that enables cross-chain liquidity routing and swaps through a single Javascript software development kit (SDK).
