Skip to content

Commit

Permalink
mobile view
Browse files Browse the repository at this point in the history
  • Loading branch information
@kaplanelad
kaplanelad committed Sep 12, 2024
1 parent 82784b6 commit 0abe98c
Show file tree
Hide file tree
Showing 4 changed files with 129 additions and 19 deletions.
112 changes: 108 additions & 4 deletions docs-site/static/styles/styles.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -1176,6 +1176,10 @@ a.active {
position: sticky;
}

.inset-0 {
inset: 0px;
}

.bottom-0 {
bottom: 0px;
}
Expand Down Expand Up @@ -1204,6 +1208,10 @@ a.active {
z-index: 50;
}

.z-0 {
z-index: 0;
}

.order-2 {
order: 2;
}
Expand Down Expand Up @@ -1362,6 +1370,14 @@ a.active {
height: 2.25rem;
}

.h-full {
height: 100%;
}

.max-h-\[600px\] {
max-height: 600px;
}

.min-h-screen {
min-height: 100vh;
}
Expand Down Expand Up @@ -1406,6 +1422,14 @@ a.active {
max-width: 28rem;
}

.max-w-3xl {
max-width: 48rem;
}

.max-w-xs {
max-width: 20rem;
}

.flex-1 {
flex: 1 1 0%;
}
Expand Down Expand Up @@ -1574,6 +1598,14 @@ a.active {
padding: 2rem;
}

.p-10 {
padding: 2.5rem;
}

.p-0 {
padding: 0px;
}

.px-0 {
padding-left: 0px;
padding-right: 0px;
Expand Down Expand Up @@ -1614,6 +1646,16 @@ a.active {
padding-bottom: 2rem;
}

.px-1\.5 {
padding-left: 0.375rem;
padding-right: 0.375rem;
}

.px-5 {
padding-left: 1.25rem;
padding-right: 1.25rem;
}

.pb-12 {
padding-bottom: 3rem;
}
Expand All @@ -1630,10 +1672,6 @@ a.active {
padding-left: 1.25rem;
}

.pr-12 {
padding-right: 3rem;
}

.pt-20 {
padding-top: 5rem;
}
Expand All @@ -1646,6 +1684,14 @@ a.active {
padding-top: 2rem;
}

.pb-\[56\.25\%\] {
padding-bottom: 56.25%;
}

.pb-\[100\%\] {
padding-bottom: 100%;
}

.text-left {
text-align: left;
}
Expand Down Expand Up @@ -1679,6 +1725,30 @@ a.active {
line-height: 1.75rem;
}

.text-\[13px\] {
font-size: 13px;
}

.text-\[1px\] {
font-size: 1px;
}

.text-\[11px\] {
font-size: 11px;
}

.text-\[8px\] {
font-size: 8px;
}

.text-\[9px\] {
font-size: 9px;
}

.text-\[10px\] {
font-size: 10px;
}

.font-medium {
font-weight: 500;
}
Expand Down Expand Up @@ -2025,9 +2095,35 @@ html.dark .toggle-dark {
}

@media (min-width: 640px) {
.sm\:w-7\/12 {
width: 58.333333%;
}

.sm\:p-10 {
padding: 2.5rem;
}

.sm\:px-0 {
padding-left: 0px;
padding-right: 0px;
}

.sm\:pr-0 {
padding-right: 0px;
}

.sm\:pr-12 {
padding-right: 3rem;
}

.sm\:text-base {
font-size: 1rem;
line-height: 1.5rem;
}

.sm\:text-\[16px\] {
font-size: 16px;
}
}

@media (min-width: 768px) {
Expand Down Expand Up @@ -2092,6 +2188,14 @@ html.dark .toggle-dark {
background-color: transparent;
}

.md\:p-10 {
padding: 2.5rem;
}

.md\:pr-12 {
padding-right: 3rem;
}

.md\:pt-0 {
padding-top: 0px;
}
Expand Down
4 changes: 2 additions & 2 deletions docs-site/templates/docs/page.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -20,10 +20,10 @@
</div>
</div>
<div
class="container flex-1 items-start md:grid md:grid-cols-[minmax(0,1fr)_220px] lg:grid-cols-[minmax(0,1fr)_240px]">
class="container flex-1 items-start md:grid-cols-[minmax(0,1fr)_220px] lg:grid-cols-[minmax(0,1fr)_240px]">
<main class="py-6 xl:grid xl:grid-cols-[1fr_300px]">
<div class="mx-auto w-full min-w-0">
<div class="markdown prose dark:prose-invert max-w-full pr-12">
<div class="markdown prose dark:prose-invert max-w-full md:pr-12 sm:pr-0">
<h1 class="mb-10 mt-[9px]">{{ page.title | safe }}</h1>
{% if page.extra.lead %}<p class="lead">{{ page.extra.lead | safe }}</p>{% endif %}

Expand Down
28 changes: 17 additions & 11 deletions docs-site/templates/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -40,10 +40,14 @@ <h2>
</h2>
</div>
<div class="flex items-center justify-center ">
<div class="rounded-md shadow-xl overflow-clip"><iframe width="1016" height="569" src="https://www.youtube.com/embed/EircfwF8c0E?si=jv_PZuWZIJ59Qz3O&rel=0"
title="Loco.rs" frameborder="0"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe></div>
<div class="relative w-full max-w-3xl max-h-[600px] mx-auto px-5 sm:px-0">
<div class="relative" style="padding-top: 56.25%">
<iframe class="absolute inset-0 w-full h-full"
src="https://www.youtube.com/embed/EircfwF8c0E?si=jv_PZuWZIJ59Qz3O&rel=0" title="Loco.rs" frameborder="0"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
</div>
</div>


</div>
Expand All @@ -61,15 +65,17 @@ <h2>
</h2>
</div>

<div class="container">
<div class="container">
<div class="flex items-center justify-center relative z-1 ">
<div class="rounded-lg border bg-card text-card-foreground shadow-sm mb-5 w-7/12 z-10">
<div class="p-6">
<pre class="text-lg bg-inherit text-inherit"><div class="text-red-100 font-semibold py-0">$ cargo loco generate scaffold post title:string content:text</div>added: "src/controllers/post.rs"
<div
class="rounded-lg border bg-card text-card-foreground shadow-sm mb-5 w-full sm:w-7/12 z-10 ">

<div class="p-6 ">
<pre class="text-lg bg-inherit text-inherit text-[11px] sm:text-[16px]"><div class="text-red-100 font-semibold py-0">$ cargo loco generate scaffold post title:string content:text</div>added: "src/controllers/post.rs"
injected: "src/controllers/mod.rs"
injected: "src/app.rs"
...<div class="text-red-100 font-semibold py-0">$ cargo loco start</div>
<div style="line-height: 16px;">
...<div class="text-red-100 font-semibold py-0 ">$ cargo loco start</div>
<div style="line-height: 16px;" class="text-[9px] sm:text-[16px]">
▄ ▀
▀ ▄
▄ ▀ ▄ ▄ ▄▀
Expand Down Expand Up @@ -99,7 +105,7 @@ <h2>


</div>
<div class="flex items-center justify-center py-6">
<div class="flex items-center justify-center py-6 z-10 relative">
<div class="flex items-center justify-center">
<a class="fatbtn" href="/docs/getting-started/tour/">Get started</a>
</div>
Expand Down
4 changes: 2 additions & 2 deletions docs-site/templates/macros/header.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,11 +2,11 @@
<header
class=" sticky top-0 z-50 w-full border-border/40 backdrop-blur bg-background">
<div class="container flex h-14 items-center md:grid md:grid-cols-[220px_minmax(0,1fr)] lg:grid-cols-[240px_minmax(0,1fr)]">
<div id="" class="mr-4 md:flex">
<div class="mr-4 md:flex">
<a class="mr-4 flex items-center space-x-2 lg:mr-6" href="/">
<img src="/icon.svg" width="30px" />
</a>
<nav class="flex items-center gap-4 text-sm lg:gap-6 hidden md:flex absolute md:relative md:mt-0 md:pt-0 pt-5 md:flex w-full md:bg-transparent" id="menu-toggle">
<nav class="items-center gap-4 text-sm lg:gap-6 hidden absolute md:relative md:mt-0 md:pt-0 pt-5 md:flex w-full md:bg-transparent" id="menu-toggle">
{% if lang == config.default_language %}
{% set rootsectionpath = "_index.md" %}
{% else %}
Expand Down

0 comments on commit 0abe98c

Please sign in to comment.