diff --git a/src/components/Bubbles.jsx b/src/components/Bubbles.jsx index d6b7e53..c31722e 100644 --- a/src/components/Bubbles.jsx +++ b/src/components/Bubbles.jsx @@ -1,26 +1,40 @@ import React from 'react'; import {motion} from 'framer-motion'; -export const Bubbles = () => ( -
- {Array.from({length: 15}).map((_, i) => ( - { + const sizes = [20, 40, 60, 80]; + + return ( +
+ {Array.from({length: 15}).map((_, i) => { + const size = sizes[i % sizes.length]; + + return ( + - ))} -
-); + style={{ + width: `${size}px`, + height: `${size}px`, + aspectRatio: '1/1', + boxSizing: 'border-box', + border: `${size / 5}px solid rgba(0, 163, 255, 0.6)` + }} + /> + ); + })} +
+ ); +};