$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;
}
Dive into all the components that come together to form the Axelar network, for a high-level understanding of the vision, mission and design.Go deeper and gain technical knowledge of how to get started with Axelar.
This AXL token FAQ covers tokenholders who acquired the AXL token via various paths, including the community sale conducted via CoinList in March.
AXL Token
September 20, 2022
Axelar Partners With LongHash Ventures for an Accelerator & a Grant Program
The Axelar Grant Program has become a focal point for investors, developers and partners interested in the cutting edge of Web3 interoperability and cross-chain development.
News
September 16, 2022
What Is wAXL? Identifying the Wrapped (ERC-20) AXL Token by Ticker
This post explains, briefly, how the AXL token is represented as an ERC-20 compatible token on Ethereum-Virtual-Machine (EVM) chains.
AXL Token
September 12, 2022
Anchorage Announces Custody Support for AXL Token
Anchorage Digital is seeing a growing demand among its institutional clients to expand their crypto portfolios to include new, promising protocols and view Axelar as a unique opportunity to do just that from day one.
No items found.
September 8, 2022
Security on Axelar Network
Security is a multidimensional problem with binary outcomes. Defining the security of a system is an incredibly complex task, but with rigorous models, designs and engineering practices, we can build systems that stand up to the worst attacks.
Technology
September 6, 2022
Axelar Implements Quadratic Voting With 'Maeve' Upgrade
The security benefits of quadratic voting have been discussed by blockchain industry leaders including Ethereum co-founder Vitalik Buterin. However, few have implemented it.
News
Technology
September 1, 2022
Axelar September update: August Was NFT (& Robot) Month
There are many upcoming events and opportunities to get connected with the Axelar community, beginning with Friday's Community Call, where we'll welcome a new ecosystem partner, Squid, that is emerging as a key enabler for deFi dApps on Axelr.
News
August 22, 2022
Axelar Newsletter — December Edition
As 2021 comes to a close, this month’s newsletter recaps key milestones from the year and shares some of the latest updates from the Axelar team.
No items found.
August 22, 2022
State of the Testnet — December 2021
Last week, a dozen members of the Axelar team traveled from across the globe to meet in Toronto, Canada for 10 days of intense development.
No items found.
August 22, 2022
Introducing the Axelar Academy
Axelar is excited to announce the launch of the Axelar Academy: a community driven and curated educational hub! The Axelar Academy was built to act as a knowledge base covering all aspects of the network.
No items found.
August 22, 2022
Axelar Partners with Metrika to Bring Operational Intelligence Tools to the Network
Axelar is excited to announce a partnership with Metrika to empower Axelar’s community with operational intelligence tools.
Over a year of hard work by the team and our partners has gone into developing the network. While we are just getting started, this is a major milestone that we are incredibly excited to share.
No items found.
August 22, 2022
Transfer Terra assets to EVM chains using Satellite
As we begin to bring greater cross-chain interoperability to the blockchain space, one of our early initiatives is the simple transfer of assets across chains.
No items found.
August 9, 2022
Axelar, Aurigami, and Trisolaris Join Forces to Bring Secure Cross-Chain Lending and Liquidity to NEAR Protocol’s Aurora
Axelar’s interoperability protocol will power a new cross-chain DEX and money market, unlocking new capabilities for AURORA, NEAR, and USN holders.
News
August 3, 2022
How to Build a Cross-Chain DApp: Interop Architecture 101
This article offers some initial architecture design choices when composing applications cross-chain and explores the kinds of functionality that can be built using each.
Technology
July 27, 2022
Axelar Adds BNB to Growing List of Connected Chains
Axelar takes BNB cross-chain.
News
July 15, 2022
Axelar Code: Build a DApp that Calls a Contract and Transfers Tokens on Chain B from Chain A
In this tutorial, we will show you how to use Axelar services and functions to build a dApp that calls a contract on chain B from chain A and transfer tokens, for example to purchase an NFT, to send an airdrop, or to distribute tokens from a DAO.
Tutorials
July 13, 2022
Axelar Network Integrates with Secret Network to Offer Private Cross-Chain Messaging and NFT Transfers
Axelar is committed to a vision of interconnected, specialized blockchains, building across Web3. In this specialized world, blockchain developers can focus on problems that are hard and support applications that solve them.
News
Axelar Connects Babylon Genesis’ BABY to Global Web3, Bringing Bitcoin Staking to 70+ Chains
Day 1 integration delivers Bitcoin staking everywhere via a secure, proof-of-stake interop protocol and a rich developer toolset
No items found.
Flow Integrates Axelar MDS for Blockchain Interoperability
First to integrate via Axelar's innovative developer kit, Flow unlocks multichain liquidity and new markets for Web3 consumer apps
