Fixed some mobile styling issues

This commit is contained in:
Chris Kankiewicz
2020-01-07 21:54:20 -07:00
parent cd89500314
commit d2e7a4eb20
2 changed files with 16 additions and 20 deletions

View File

@@ -3,7 +3,7 @@
class="flex flex-col items-center rounded-lg group hover:bg-gray-200 hover:shadow"
>
<div class="flex justify-between items-center p-4 w-full">
<div class="flex-shrink pr-2">
<div class="pr-2">
{% if parentDir %}
<i class="fas fa-level-up-alt fa-fw fa-lg"></i>
{% else %}
@@ -11,26 +11,22 @@
{% endif %}
</div>
<div class="flex-grow sm:mr-2">
<div class="flex justify-between items-center">
<div class="truncate">
{{ parentDir ? '..' : file.getRelativePathname }}
</div>
{% if file.isFile %}
<div class="ml-2">
<button
title="File Info"
class="flex justify-center items-center rounded-full p-2 -m-1 invisible hover:bg-gray-400 hover:shadow group-hover:visible"
v-on:click.prevent="showFileInfo('{{ file.getRelativePathname }}')"
>
<i class="fas fa-info-circle"></i>
</button>
</div>
{% endif %}
</div>
<div class="flex-1 truncate">
{{ parentDir ? '..' : file.getRelativePathname }}
</div>
{% if file.isFile %}
<div class="ml-2">
<button
title="File Info"
class="flex justify-center items-center rounded-full p-2 -m-1 md:invisible hover:bg-gray-400 hover:shadow group-hover:visible"
v-on:click.prevent="showFileInfo('{{ file.getRelativePathname }}')"
>
<i class="fas fa-info-circle"></i>
</button>
</div>
{% endif %}
<div class="hidden whitespace-no-wrap text-right mx-2 w-1/6 sm:block">
{% if parentDir or file.isDir %}

View File

@@ -1,6 +1,6 @@
<header id="header" class="bg-blue-600 shadow sticky top-0">
<div class="container flex flex-col justify-between items-center mx-auto p-4 md:flex-row">
<div class="text-white text-sm tracking-tight my-2">
<div class="text-white text-sm tracking-tight mb-2 md:my-2">
<a href="/" class="hover:underline">Home</a>
{% for name, path in breadcrumbs %}