Make mobile more bearable for blogs.

This commit is contained in:
Midou36O 2024-02-10 13:09:49 +01:00
parent dfc9c8e4fa
commit 5a61dbb4d8
Signed by: midou
GPG Key ID: 1D134A95FE521A7A
3 changed files with 15 additions and 9 deletions

View File

@ -3,7 +3,9 @@
export { Components }; export { Components };
</script> </script>
<div class="blog mt-8 leading-loose text-lg text-gray-700 dark:text-gray-300"> <div
class="blog pl-50 w-70% md:pl-30 md:w-80% lg:pl-0 lg:w-100% beak-normal mt-8 leading-loose text-lg text-gray-700 dark:text-gray-300"
>
<slot /> <slot />
</div> </div>
@ -78,7 +80,7 @@
background-color: #282a36; background-color: #282a36;
} }
.blog :global(code) { .blog :global(code) {
@apply rounded-1 p-2; @apply rounded-1 'md:p-2' p-0 text-left;
} }
.blog :global(kbd) { .blog :global(kbd) {
@apply rounded-1 p-2; @apply rounded-1 p-2;
@ -87,7 +89,7 @@
@apply rounded-1 p-2; @apply rounded-1 p-2;
} }
.blog :global(pre) { .blog :global(pre) {
@apply rounded-1 p-2; @apply rounded-1 'md:p-2' text-left p-0 'w-100%' overflow-x-auto;
} }
.blog :global(.prose) { .blog :global(.prose) {
@apply prose; @apply prose;

View File

@ -26,11 +26,15 @@
out:fly={{ duration: 300, y: -50, easing: quintOut }} out:fly={{ duration: 300, y: -50, easing: quintOut }}
class="flex flex-col pr-3" class="flex flex-col pr-3"
> >
<div class="flex flex-col md:flex-row"> <div class="flex flex-col md:flex-col">
<div <div
class="i-gridicons-info dark:text-white place-content-center place-self-center justify-center content-center text-center pl-0 md:pl-3 text-black text-5xl" class="i-ph-book-bold dark:text-white place-content-center place-self-center justify-center content-center text-center pl-0 md:pl-3 text-black text-5xl"
/> />
<h1 class="text-black dark:text-white font-bold text-4xl md:px-2">{data.meta.title}</h1> <h1
class="text-black dark:text-white md:break-normal md:w-60 md:text-center font-bold text-4xl md:px-2"
>
{data.meta.title}
</h1>
</div> </div>
<p class="block text-gray-600 dark:text-gray-500 p-3 py-1"> <p class="block text-gray-600 dark:text-gray-500 p-3 py-1">
Tags: Tags:

View File

@ -20,7 +20,7 @@ to work on Hyprland.
so you might want to actually be a little bit careful as it could crash or have breaking changes at some point. But it's recently stabilized a bit so there is little to no crashes so you might want to actually be a little bit careful as it could crash or have breaking changes at some point. But it's recently stabilized a bit so there is little to no crashes
if you don't do anything _stupid_ if you don't do anything _stupid_
![Image of an Hyprland ricing taken from the github repo.](https://camo.githubusercontent.com/b40ca85d8d3b15b50b35e55806149a8591e387ebf977d989ddc98f18cc79fdbf/68747470733a2f2f63646e2e646973636f72646170702e636f6d2f6174746163686d656e74732f313039313536393837323533353831343138352f313130373637353836363130313732333237372f73637265656e73686f742d73756d6d65722e706e67) [![Image of an Hyprland ricing taken from the github repo.](https://camo.githubusercontent.com/b40ca85d8d3b15b50b35e55806149a8591e387ebf977d989ddc98f18cc79fdbf/68747470733a2f2f63646e2e646973636f72646170702e636f6d2f6174746163686d656e74732f313039313536393837323533353831343138352f313130373637353836363130313732333237372f73637265656e73686f742d73756d6d65722e706e67)](https://camo.githubusercontent.com/b40ca85d8d3b15b50b35e55806149a8591e387ebf977d989ddc98f18cc79fdbf/68747470733a2f2f63646e2e646973636f72646170702e636f6d2f6174746163686d656e74732f313039313536393837323533353831343138352f313130373637353836363130313732333237372f73637265656e73686f742d73756d6d65722e706e67)
## And sway? ## And sway?
@ -38,7 +38,7 @@ sudo pacman -S hyprland -y
``` ```
And now, time to open it from the terminal! And now, time to open it from the terminal!
![First experience](/blog/images/hyprland/firstexperience.png) [![First experience](/blog/images/hyprland/firstexperience.png)](https://midou.dev/blog/images/hyprland/firstexperience.png)
...Great. Some anime weaboo made this thing. ...Great. Some anime weaboo made this thing.
So what would be the first thing that anyone should do? So what would be the first thing that anyone should do?
@ -230,6 +230,6 @@ Congratulations, you now know how to (roughly) setup hyprland!
Now what? Now what?
Well you can start ricing your TWM like a madman in [r/unixporn](https://lr.psf.lt/r/unixporn) or snatch the dotfiles and adapt it to your liking. But i'm not that type of guy, my desktop is simple. Well you can start ricing your TWM like a madman in [r/unixporn](https://lr.psf.lt/r/unixporn) or snatch the dotfiles and adapt it to your liking. But i'm not that type of guy, my desktop is simple.
![My desktop](/blog/images/hyprland/desktop.png) [![My desktop](/blog/images/hyprland/desktop.png)](https://midou.dev/blog/images/hyprland/desktop.png)
Have fun, and see you later! Have fun, and see you later!