Skip to content

Commit

Permalink
بهبود نمایش لیست
Browse files Browse the repository at this point in the history
  • Loading branch information
@ircfspace
ircfspace committed Mar 26, 2024
1 parent 85009a0 commit f4be228
Show file tree
Hide file tree
Showing 3 changed files with 50 additions and 163 deletions.
38 changes: 38 additions & 0 deletions assets/css/style.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -315,6 +315,38 @@ img[alt="loader"] {
color: #ff7900;
}

.grid {
float: right;
width: 100%;
margin-bottom: 10px;
}
.box {
height: 100px;
width: calc(20% - 10px);
float: right;
border-radius: 7px;
margin: 0 5px;
}
.shimmerBG {
animation-duration: 2.2s;
animation-fill-mode: forwards;
animation-iteration-count: infinite;
animation-name: shimmer;
animation-timing-function: linear;
background: #ddd;
background: linear-gradient(to right, #f6f6f6 8%, #f0f0f0 18%, #f6f6f6 33%);
background-size: 1200px 100%;
}
@keyframes shimmer {
0% {
background-position: -1200px 0;
}

100% {
background-position: 1200px 0;
}
}

footer {
padding: 10px 0;
/*position: fixed;
Expand Down Expand Up @@ -350,6 +382,9 @@ footer p {
.slider a {
width: calc(100% / 5);
}
.box {
height: 70px;
}
}

@media(max-width:500px) {
Expand All @@ -367,4 +402,7 @@ footer p {
.slider a {
width: calc(100% / 4);
}
.box {
height: 50px;
}
}
5 changes: 4 additions & 1 deletion assets/js/script.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -47,6 +47,9 @@ window.addEventListener('load', function() {
html += '</a>';
});
$('#countryLoc').html(html);
})
.catch(error => {
let defList = '<a href="" data-loc="ir"><div class="slide"><img src="./assets/img/flags/ir.svg?v2" alt="IR" /><p dir="auto">ایران</p></div></a><a href="" data-loc="ae"><div class="slide"><img src="./assets/img/flags/ae.svg" alt="AE" /><p dir="auto">امارات</p></div></a><a href="" data-loc="at"><div class="slide"><img src="./assets/img/flags/at.svg" alt="AT" /><p dir="auto">اتریش</p></div></a><a href="" data-loc="us"><div class="slide"><img src="./assets/img/flags/us.svg" alt="US" /><p dir="auto">امریکا</p></div></a><a href="" data-loc="gb"><div class="slide"><img src="./assets/img/flags/gb.svg" alt="GB" /><p dir="auto">انگلیس</p></div></a><a href="" data-loc="ie"><div class="slide"><img src="./assets/img/flags/ie.svg" alt="IE" /><p dir="auto">ایرلند</p></div></a><a href="" data-loc="id"><div class="slide"><img src="./assets/img/flags/id.svg" alt="ID" /><p dir="auto">اندونزی</p></div></a><a href="" data-loc="il"><div class="slide"><img src="./assets/img/flags/il.svg" alt="IL" /><p dir="auto">اسرائیل</p></div></a><a href="" data-loc="za"><div class="slide"><img src="./assets/img/flags/za.svg" alt="ZA" /><p dir="auto">آفریقا</p></div></a><a href="" data-loc="de"><div class="slide"><img src="./assets/img/flags/de.svg" alt="DE" /><p dir="auto">آلمان</p></div></a><a href="" data-loc="bh"><div class="slide"><img src="./assets/img/flags/bh.svg" alt="BH" /><p dir="auto">بحرین</p></div></a><a href="" data-loc="tr"><div class="slide"><img src="./assets/img/flags/tr.svg" alt="TR" /><p dir="auto">ترکیه</p></div></a><a href="" data-loc="cz"><div class="slide"><img src="./assets/img/flags/cz.svg" alt="CZ" /><p dir="auto">جمهوری چک</p></div></a><a href="" data-loc="cn"><div class="slide"><img src="./assets/img/flags/cn.svg" alt="CN" /><p dir="auto">چین</p></div></a><a href="" data-loc="ru"><div class="slide"><img src="./assets/img/flags/ru.svg" alt="RU" /><p dir="auto">روسیه</p></div></a><a href="" data-loc="jp"><div class="slide"><img src="./assets/img/flags/jp.svg" alt="JP" /><p dir="auto">ژاپن</p></div></a><a href="" data-loc="ch"><div class="slide"><img src="./assets/img/flags/ch.svg" alt="CH" /><p dir="auto">سوئیس</p></div></a><a href="" data-loc="se"><div class="slide"><img src="./assets/img/flags/se.svg" alt="SE" /><p dir="auto">سوئد</p></div></a><a href="" data-loc="sg"><div class="slide"><img src="./assets/img/flags/sg.svg" alt="SG" /><p dir="auto">سنگاپور</p></div></a><a href="" data-loc="fi"><div class="slide"><img src="./assets/img/flags/fi.svg" alt="FI" /><p dir="auto">فنلاند</p></div></a><a href="" data-loc="fr"><div class="slide"><img src="./assets/img/flags/fr.svg" alt="FR" /><p dir="auto">فرانسه</p></div></a><a href="" data-loc="ca"><div class="slide"><img src="./assets/img/flags/ca.svg" alt="CA" /><p dir="auto">کانادا</p></div></a><a href="" data-loc="cr"><div class="slide"><img src="./assets/img/flags/cr.svg" alt="CR" /><p dir="auto">کاستاریکا</p></div></a><a href="" data-loc="pl"><div class="slide"><img src="./assets/img/flags/pl.svg" alt="PL" /><p dir="auto">لهستان</p></div></a><a href="" data-loc="hk"><div class="slide"><img src="./assets/img/flags/hk.svg" alt="HK" /><p dir="auto">هنگ کنگ</p></div></a><a href="" data-loc="nl"><div class="slide"><img src="./assets/img/flags/nl.svg" alt="NL" /><p dir="auto">هلند</p></div></a><a href="" data-loc="in"><div class="slide"><img src="./assets/img/flags/in.svg" alt="IN" /><p dir="auto">هند</p></div></a>';
$('#countryLoc').html(defList);
});

});
170 changes: 8 additions & 162 deletions index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -46,168 +46,14 @@ <h1>اینترنت برای همه؛ یا هیچ‌کس!</h1>
<p>توسط این‌ابزار می‌تونین به کانفیگ‌های رایگان گردآوری‌شده از طریق <a href="https://github.com/yebekhe/TVC" target="_blank">TVC</a> بر اساس لوکیشن دلخواه دسترسی داشته باشین. این‌کانفیگ‌ها به‌صورت خودکار و منظم، بدون دخل‌وتصرف از یه‌سری <a href="https://raw.githubusercontent.com/yebekhe/TVC/main/channelsData/channelsAssets.json" target="_blank">کانال تلگرامی</a> جمع‌آوری میشن و برای رعایت مسائل امنیتی توصیه میشه تنها برای مصارف عادی ازشون استفاده کنین.</p>
</div>
<div class="customer-logos slider" id="countryLoc">
<a href="" data-loc="ir">
<div class="slide">
<img src="./assets/img/flags/ir.svg?v2" alt="IR" />
<p dir="auto">ایران</p>
</div>
</a>
<a href="" data-loc="ae">
<div class="slide">
<img src="./assets/img/flags/ae.svg" alt="AE" />
<p dir="auto">امارات</p>
</div>
</a>
<a href="" data-loc="at">
<div class="slide">
<img src="./assets/img/flags/at.svg" alt="AT" />
<p dir="auto">اتریش</p>
</div>
</a>
<a href="" data-loc="us">
<div class="slide">
<img src="./assets/img/flags/us.svg" alt="US" />
<p dir="auto">امریکا</p>
</div>
</a>
<a href="" data-loc="gb">
<div class="slide">
<img src="./assets/img/flags/gb.svg" alt="GB" />
<p dir="auto">انگلیس</p>
</div>
</a>
<a href="" data-loc="ie">
<div class="slide">
<img src="./assets/img/flags/ie.svg" alt="IE" />
<p dir="auto">ایرلند</p>
</div>
</a>
<a href="" data-loc="id">
<div class="slide">
<img src="./assets/img/flags/id.svg" alt="ID" />
<p dir="auto">اندونزی</p>
</div>
</a>
<a href="" data-loc="il">
<div class="slide">
<img src="./assets/img/flags/il.svg" alt="IL" />
<p dir="auto">اسرائیل</p>
</div>
</a>
<a href="" data-loc="za">
<div class="slide">
<img src="./assets/img/flags/za.svg" alt="ZA" />
<p dir="auto">آفریقا</p>
</div>
</a>
<a href="" data-loc="de">
<div class="slide">
<img src="./assets/img/flags/de.svg" alt="DE" />
<p dir="auto">آلمان</p>
</div>
</a>
<a href="" data-loc="bh">
<div class="slide">
<img src="./assets/img/flags/bh.svg" alt="BH" />
<p dir="auto">بحرین</p>
</div>
</a>
<a href="" data-loc="tr">
<div class="slide">
<img src="./assets/img/flags/tr.svg" alt="TR" />
<p dir="auto">ترکیه</p>
</div>
</a>
<a href="" data-loc="cz">
<div class="slide">
<img src="./assets/img/flags/cz.svg" alt="CZ" />
<p dir="auto">جمهوری چک</p>
</div>
</a>
<a href="" data-loc="cn">
<div class="slide">
<img src="./assets/img/flags/cn.svg" alt="CN" />
<p dir="auto">چین</p>
</div>
</a>
<a href="" data-loc="ru">
<div class="slide">
<img src="./assets/img/flags/ru.svg" alt="RU" />
<p dir="auto">روسیه</p>
</div>
</a>
<a href="" data-loc="jp">
<div class="slide">
<img src="./assets/img/flags/jp.svg" alt="JP" />
<p dir="auto">ژاپن</p>
</div>
</a>
<a href="" data-loc="ch">
<div class="slide">
<img src="./assets/img/flags/ch.svg" alt="CH" />
<p dir="auto">سوئیس</p>
</div>
</a>
<a href="" data-loc="se">
<div class="slide">
<img src="./assets/img/flags/se.svg" alt="SE" />
<p dir="auto">سوئد</p>
</div>
</a>
<a href="" data-loc="sg">
<div class="slide">
<img src="./assets/img/flags/sg.svg" alt="SG" />
<p dir="auto">سنگاپور</p>
</div>
</a>
<a href="" data-loc="fi">
<div class="slide">
<img src="./assets/img/flags/fi.svg" alt="FI" />
<p dir="auto">فنلاند</p>
</div>
</a>
<a href="" data-loc="fr">
<div class="slide">
<img src="./assets/img/flags/fr.svg" alt="FR" />
<p dir="auto">فرانسه</p>
</div>
</a>
<a href="" data-loc="ca">
<div class="slide">
<img src="./assets/img/flags/ca.svg" alt="CA" />
<p dir="auto">کانادا</p>
</div>
</a>
<a href="" data-loc="cr">
<div class="slide">
<img src="./assets/img/flags/cr.svg" alt="CR" />
<p dir="auto">کاستاریکا</p>
</div>
</a>
<a href="" data-loc="pl">
<div class="slide">
<img src="./assets/img/flags/pl.svg" alt="PL" />
<p dir="auto">لهستان</p>
</div>
</a>
<a href="" data-loc="hk">
<div class="slide">
<img src="./assets/img/flags/hk.svg" alt="HK" />
<p dir="auto">هنگ کنگ</p>
</div>
</a>
<a href="" data-loc="nl">
<div class="slide">
<img src="./assets/img/flags/nl.svg" alt="NL" />
<p dir="auto">هلند</p>
</div>
</a>
<a href="" data-loc="in">
<div class="slide">
<img src="./assets/img/flags/in.svg" alt="IN" />
<p dir="auto">هند</p>
</div>
</a>
<div class="grid">
<div class="box shimmerBG"></div>
<div class="box shimmerBG"></div>
<div class="box shimmerBG"></div>
<div class="box shimmerBG"></div>
<div class="box shimmerBG"></div>
</div>
<p>درحال دریافت اطلاعات ...</p>
</div>
<div class="clearfix"></div>
<div id="donate" class="modal fade" role="dialog">
Expand Down

0 comments on commit f4be228

Please sign in to comment.