Miwory/Widgets
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

donation goal hina gen 1

Browse Source
This commit is contained in:
Miwory
2025-08-18 18:10:15 +03:00
parent 7605543f39
commit bc790b6d10
3 changed files with 125 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

105
DonationGoals/hina/generation 1/style.css Normal file
View File

@ -0,0 +1,105 @@
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital@0;1&display=swap');
#widget {
display: flex;
align-items: center;
justify-content: center;
}
#donationgoal {
position: relative;
width: 100%;
display: flex;
flex-direction: column;
font-size: 40px;
justify-content: center;
font-family: 'Montserrat';
font-weight: 800;
}
#donationgoal::after {
position: absolute;
content: '';
width: 120px;
bottom: 15px;
right: 10px;
aspect-ratio: 87 / 49;
background-size: cover;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='87' height='49' fill='none'%3E%3Cpath stroke='%23F4A5D2' stroke-linecap='round' stroke-width='3' d='M32.98 22.923C24.848 16.676 20.794 11.55 14.525 4.197M32.98 25.02c-8.132 6.247-12.186 11.371-18.455 18.726M33.712 23.255s8.102-.635 12.072-3.016c3.017-1.81 5.191-4.39 4.217-7.85-.67-2.382-2.946-3.819-6.63-3.606-6.219.36-9.66 13.265-9.66 13.265'/%3E%3Cpath stroke='%23F4A5D2' stroke-linecap='round' stroke-width='3' d='M33.728 21.745s4.973-6.427 5.877-10.968c.687-3.45.236-6.794-2.982-8.398-2.213-1.103-5.243-.685-7.125 2.49-3.045 5.136 3.336 16.065 3.336 16.065M33.728 26.748s4.973 6.427 5.877 10.968c.687 3.45.236 6.794-2.982 8.398-2.213 1.103-5.243.686-7.125-2.489-3.045-5.137 3.336-16.066 3.336-16.066'/%3E%3Cpath stroke='%23F4A5D2' stroke-linecap='round' stroke-width='3' d='M34.192 24.836s8.102.635 12.073 3.016c3.017 1.81 5.19 4.39 4.216 7.85-.67 2.381-2.946 3.818-6.63 3.606-6.218-.36-9.659-13.265-9.659-13.265'/%3E%3Cg filter='url(%23a)'%3E%3Cpath fill='%23fff' d='M67.635 37.843a.436.436 0 0 0 .067-.421c-.029-.083-.653-1.809-2.146-3.14 3.461-.944 6.196-4.355 6.196-8v-.03c-.005-1.047-.122-2.098-.235-3.115-.07-.634-.14-1.268-.184-1.9a.795.795 0 0 1 .079-.28.86.86 0 0 1 .255.187c.273.36.522.74.773 1.118.32.483.649.981 1.024 1.445 1.056 1.305 2.305 2.188 3.712 2.625.567.177 1 .148 1.325-.087.326-.237.489-.647.499-1.255a5.825 5.825 0 0 0-.069-.724c-.336-2.126-1.46-3.952-3.434-5.583-.696-.576-1.026-1.078-1.102-1.681-.287-2.25-1.624-3.815-4.087-4.784-.769-.304-1.559-.268-2.224.098-.686.377-1.154 1.053-1.32 1.904-.01.052-.017.104-.026.156-.16.012-.32.024-.481.025-2.728.01-4.503 1.236-5.276 3.644-.048.152-.102.222-.102.222-.02-.003-.102-.038-.215-.173-.264-.31-.47-.702-.654-1.079-.143-.292-.58-1.182-1.589-1.073-.767.083-1.248.643-1.318 1.535-.042.516-.07 1.07.01 1.612.188 1.27 1 2.152 1.772 2.847l.141.128c.386.347.783.703 1.115 1.072-.364-.331-.94-.716-1.71-.51-1.107.298-1.254 1.395-1.302 1.756-.086.643-.129 1.278-.129 1.904 0 1.193.156 2.35.466 3.46.516 1.843 1.714 3.274 3.26 4.078.064.1.125.2.18.295.28.488.57.992 1.78 2.032 1.821 1.567 4.446 1.849 4.557 1.86a.44.44 0 0 0 .392-.168Zm2.406-21.767a.828.828 0 1 1 1.655 0 .828.828 0 1 1-1.655 0Z'/%3E%3C/g%3E%3Cg filter='url(%23b)'%3E%3Ccircle cx='6' cy='24' r='2' fill='%23BEE2C7' transform='rotate(90 6 24)'/%3E%3C/g%3E%3Cg filter='url(%23c)'%3E%3Cpath fill='%23BEE2C7' d='M17.94 19c-2.542 0-3.897 2.01-5.11 3.48C12.404 23 12 23.5 12 24s.403 1 .83 1.52c1.213 1.47 2.568 3.48 5.11 3.48 2.543 0 4.346-2.75 1.902-5 2.444-2.25.64-5-1.901-5Z'/%3E%3C/g%3E%3Cdefs%3E%3Cfilter id='a' width='38' height='42' x='49' y='4.013' color-interpolation-filters='sRGB' filterUnits='userSpaceOnUse'%3E%3CfeFlood flood-opacity='0' result='BackgroundImageFix'/%3E%3CfeColorMatrix in='SourceAlpha' result='hardAlpha' values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0'/%3E%3CfeOffset/%3E%3CfeGaussianBlur stdDeviation='4'/%3E%3CfeComposite in2='hardAlpha' operator='out'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 1 0'/%3E%3CfeBlend in2='BackgroundImageFix' result='effect1_dropShadow_2223_2'/%3E%3CfeBlend in='SourceGraphic' in2='effect1_dropShadow_2223_2' result='shape'/%3E%3C/filter%3E%3Cfilter id='b' width='12' height='12' x='0' y='18' color-interpolation-filters='sRGB' filterUnits='userSpaceOnUse'%3E%3CfeFlood flood-opacity='0' result='BackgroundImageFix'/%3E%3CfeColorMatrix in='SourceAlpha' result='hardAlpha' values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0'/%3E%3CfeOffset/%3E%3CfeGaussianBlur stdDeviation='2'/%3E%3CfeComposite in2='hardAlpha' operator='out'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 1 0'/%3E%3CfeBlend in2='BackgroundImageFix' result='effect1_dropShadow_2223_2'/%3E%3CfeBlend in='SourceGraphic' in2='effect1_dropShadow_2223_2' result='shape'/%3E%3C/filter%3E%3Cfilter id='c' width='17' height='18' x='8' y='15' color-interpolation-filters='sRGB' filterUnits='userSpaceOnUse'%3E%3CfeFlood flood-opacity='0' result='BackgroundImageFix'/%3E%3CfeColorMatrix in='SourceAlpha' result='hardAlpha' values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0'/%3E%3CfeOffset/%3E%3CfeGaussianBlur stdDeviation='2'/%3E%3CfeComposite in2='hardAlpha' operator='out'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 1 0'/%3E%3CfeBlend in2='BackgroundImageFix' result='effect1_dropShadow_2223_2'/%3E%3CfeBlend in='SourceGraphic' in2='effect1_dropShadow_2223_2' result='shape'/%3E%3C/filter%3E%3C/defs%3E%3C/svg%3E");
}
#name {
color: white;
margin-left: 50px;
margin-bottom: 15px;
font-size: 24px;
filter: drop-shadow(0 0 7.5px #FFC3E8) drop-shadow(0 0 10px #FFC3E8);
}
.bar {
position: relative;
display: flex;
align-items: center;
width: calc(100% - 100px);
height: 100px;
background-image: linear-gradient(to right, #FFC3E8, #F8EBFF 140%);
border-radius: 65px;
margin-left: 15px;
}
.bar::before {
position: absolute;
content: '';
inset: -12px;
border: 3px solid white;
border-radius: inherit;
z-index: -1;
-webkit-mask-image: linear-gradient(
to right,
rgba(0, 0, 0, 1) 0%,
rgba(0, 0, 0, 0) 75%);
}
.bar::after {
position: absolute;
content: '';
left: -19px;
width: 15px;
aspect-ratio: 11 / 12;
filter: drop-shadow(0 0 7.5px white);
background-size: cover;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='12' fill='none'%3E%3Cpath fill='%23fff' d='M7.26 0C4.154 0 2.499 2.412 1.016 4.177.492 4.8 0 5.4 0 6c0 .6.492 1.2 1.015 1.823C2.498 9.588 4.153 12 7.261 12c3.107 0 5.31-3.3 2.323-6 2.988-2.7.784-6-2.323-6Z'/%3E%3C/svg%3E");
}
.progress {
position: relative;
width: 100%;
height: 30px;
background-color: #FFFFFF;
margin-inline: 50px;
border-radius: 25px;
}
.progress::before {
position: absolute;
content: '';
inset: 0;
border-radius: inherit;
background-color: #F4A5D2;
max-width: var(--progress);
transition: max-width 1.2s ease-in-out;
}
.progress::after {
position: absolute;
content: '';
width: 65px;
top: 50%;
left: 0;
transform: translate(-20px, -50%);
transition: left 1.2s ease-in-out;
aspect-ratio: 46 / 50;
filter: drop-shadow(0 0 7.5px white);
background-size: cover;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='46' height='50' fill='none'%3E%3Cpath fill='%23A7D5B3' d='M39.243 31.057c3.668 4.695 2.79 13.985 2.39 16.989a.92.92 0 0 1-1.1.79c-2.942-.571-11.883-2.644-15.544-7.33-3.614-4.625-3.995-14.753-4.014-18.27a.936.936 0 0 1 1.199-.915c3.45.968 13.442 4.095 17.069 8.736Z'/%3E%3Cpath fill='%23A7D5B3' d='M21.015 40.845c-2.107 3.65-8.512 6.717-11.259 7.901a.93.93 0 0 1-1.31-.85c-.045-3.166.077-10.978 2.209-14.671 2.104-3.646 8.077-6.588 10.643-7.721a.926.926 0 0 1 1.309.786c.228 3.07.555 10.836-1.592 14.555Z'/%3E%3Cpath fill='%23fff' d='M28.001 32.332c-4.976-1.257-8.114-5.816-7.01-10.183 1.103-4.366 6.03-6.886 11.006-5.629 4.976 1.258 10.505 6.421 9.401 10.787-1.103 4.367-8.421 6.283-13.397 5.025Z'/%3E%3Cpath fill='%23fff' d='M18.76 13.174c4.976 1.257 8.115 5.816 7.012 10.183-1.104 4.366-6.032 6.886-11.008 5.628-4.975-1.257-10.504-6.42-9.4-10.786 1.103-4.367 8.421-6.283 13.397-5.025Z'/%3E%3Cpath fill='%23fff' d='M17.194 13.953c-1.258 4.975 1.263 9.903 5.629 11.007 4.366 1.103 8.925-2.035 10.183-7.011 1.257-4.976-.659-12.294-5.025-13.397-4.367-1.104-9.53 4.425-10.787 9.4Z'/%3E%3Cpath fill='%23fff' d='M13.802 27.373c1.257-4.976 5.816-8.114 10.183-7.01 4.366 1.103 6.886 6.03 5.628 11.006-1.257 4.976-6.42 10.505-10.787 9.401-4.366-1.103-6.282-8.421-5.024-13.397Z'/%3E%3Ccircle cx='23.52' cy='22.981' r='3.793' fill='%23F8EFD6' transform='rotate(104.184 23.52 22.981)'/%3E%3C/svg%3E");
}