diff options
author | Stas Medvedev <medvedevsa97@gmail.com> | 2024-06-11 02:58:35 +0300 |
---|---|---|
committer | Stas Medvedev <medvedevsa97@gmail.com> | 2024-06-11 02:58:35 +0300 |
commit | 888de0a90ae0e04ea9e20063d9a6cbfa9a20e9e0 (patch) | |
tree | ec270ebbc4e6b2cb8b59e0c3d830881bd9b3f2f4 /templates/partials | |
parent | fc29744db8eba827802bdb5c5932f91ae79ea152 (diff) |
Адаптивка, поиграл с дизайном
Diffstat (limited to 'templates/partials')
-rw-r--r-- | templates/partials/about.html | 29 | ||||
-rw-r--r-- | templates/partials/avatars.html | 9 | ||||
-rw-r--r-- | templates/partials/palette.html | 12 |
3 files changed, 25 insertions, 25 deletions
diff --git a/templates/partials/about.html b/templates/partials/about.html index b53a127..e077043 100644 --- a/templates/partials/about.html +++ b/templates/partials/about.html @@ -1,4 +1,4 @@ -<div class="about relative"> +<div class="about relative text-center"> <p>Привет, меня зовут Стас</p> <p> Я @@ -22,15 +22,22 @@ В основном пишу на <a href="https://python.org" class="text-interactive">python</a> </p> - <p>Вычислил тебя по ip: {{client_geo['query']}}</p> + <div class="gap-2 flex flex-wrap text-2xl my-2"> + <p class="w-full "> + Уже вычислил тебя по ip: + </p> + <div class="w-full flex flex-row justify-around"> + <span>😎</span> + <a class="block text-center underline decoration-primary-300" href="https://ip-api.com"> + {{client_geo['query']}} + </a> + <span>😎</span> + {% if 'city' in client_geo %} + <p>{{client_geo['country']}}</p> + <p>{{client_geo['city']}}</p> + {% endif %} + </div> + + </div> - {% if 'city' in client_geo %} - <p>{{client_geo['country']}}</p> - <p>{{client_geo['city']}}</p> - {% endif %} - <p> - <span class="text-sm" - >(Шутка в том что такая возможность есть у любого сайта)</span - > - </p> </div> diff --git a/templates/partials/avatars.html b/templates/partials/avatars.html index fd2c247..a6f84ff 100644 --- a/templates/partials/avatars.html +++ b/templates/partials/avatars.html @@ -1,5 +1,4 @@ -<div class="flex justify-around"> - <div class="swiper"> + <div class="swiper h-full"> <div class="swiper-wrapper"> {% for url in avatar_urls %} <img src="{{url}}" alt="" class="swiper-slide"/> @@ -9,7 +8,6 @@ <div class="swiper-button-prev"></div> <div class="swiper-button-next"></div> </div> -</div> <script> const swiper = new Swiper(".swiper", { @@ -22,8 +20,3 @@ }, }); </script> -<style> - .swiper { - width: 30%; - } -</style> diff --git a/templates/partials/palette.html b/templates/partials/palette.html index 6efa551..09f77bc 100644 --- a/templates/partials/palette.html +++ b/templates/partials/palette.html @@ -1,7 +1,7 @@ -<div> - <div class="primary color-box"></div> - <div class="secondary color-box"></div> - <div class="complementary-yellow color-box"></div> - <div class="complementary-rose color-box"></div> - <div class="complementary-blue color-box"></div> +<div class="flex w-full h-24 gap-4 p-2"> + <div class="primary grow"></div> + <div class="secondary grow"></div> + <div class="complementary-yellow grow"></div> + <div class="complementary-rose grow"></div> + <div class="complementary-blue grow"></div> </div>
\ No newline at end of file |