TGTGInsightаналитика telegramLIVE / telegram public index
← Power BI Design
Power BI Design avatar

TGINSIGHT POST

Post #440

@Design_PowerBi

Power BI Design

Просмотры9,520Количество просмотров
Опубликован22 июн.22.06.2024, 22:33
Содержимое поста

Содержимое

Power BI + CSS + Figma Код ниже пихаем в меру, назначаем категорию = "URL-адрес изображения" и вставляем во внешний визуальный элемент HTML Content H_GifRing = " <!--ring div starts here--> <div class='ring'> <i style='--clr:#00ff0a;'></i> <i style='--clr:#ff0057;'></i> <i style='--clr:#fffd44;'></i> </div> <!--ring div ends here--> <style> * { margin: 20; padding: 20; box-sizing: border-box; } body { display: flex; justify-content: center; align-items: center; min-height: 100vh; background: #11111100; width: 100%; overflow: hidden; } .ring { position: relative; width: 100px; height: 100px; display: flex; justify-content: center; align-items: center; margin: 20px; } .ring i { position: absolute; inset: 0; border: 2px solid #fff; transition: 0.5s; } .ring i:nth-child(1) { border-radius: 38% 62% 63% 37% / 41% 44% 56% 59%; animation: animate 6s linear infinite; } .ring i:nth-child(2) { border-radius: 41% 44% 56% 59%/38% 62% 63% 37%; animation: animate 4s linear infinite; } .ring i:nth-child(3) { border-radius: 41% 44% 56% 59%/38% 62% 63% 37%; animation: animate2 10s linear infinite; } .ring:hover i { /* Изменение селектора */ border: 6px solid var(--clr); filter: drop-shadow(0 0 20px var(--clr)); } @keyframes animate { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } @keyframes animate2 { 0% { transform: rotate(360deg); } 100% { transform: rotate(0deg); } } </style> " Вы же соскучились по сумасшедшим идеям?)