Small responsive UI change

This commit is contained in:
Thomas Miceli 2023-04-08 00:21:22 +02:00
parent 31bec62834
commit 8cfeab6dbc
No known key found for this signature in database
GPG key ID: D86C6F6390AF050F
2 changed files with 6 additions and 6 deletions

View file

@ -10,12 +10,12 @@
<main class="mt-4"> <main class="mt-4">
<form id="create" class="space-y-4" method="post" action="/"> <form id="create" class="space-y-4" method="post" action="/">
<div class="grid grid-cols-12 gap-x-4"> <div class="grid grid-cols-12 gap-x-4">
<div class="col-span-4"> <div class="col-span-8 sm:col-span-4">
<div class="mt-1"> <div class="mt-1">
<input type="text" placeholder="Title" name="title" id="title" class="bg-black shadow-sm focus:ring-primary-500 focus:border-primary-500 block w-full sm:text-sm border-gray-700 rounded-md"> <input type="text" placeholder="Title" name="title" id="title" class="bg-black shadow-sm focus:ring-primary-500 focus:border-primary-500 block w-full sm:text-sm border-gray-700 rounded-md">
</div> </div>
</div> </div>
<div class="col-span-8"> <div class="col-span-12 sm:col-span-8">
<div class="mt-1"> <div class="mt-1">
<input type="text" placeholder="Description" name="description" id="description" class="bg-black shadow-sm focus:ring-primary-500 focus:border-primary-500 block w-full sm:text-sm border-gray-700 rounded-md"> <input type="text" placeholder="Description" name="description" id="description" class="bg-black shadow-sm focus:ring-primary-500 focus:border-primary-500 block w-full sm:text-sm border-gray-700 rounded-md">
</div> </div>
@ -28,7 +28,7 @@
<p class="mx-2 my-2 inline-flex"> <p class="mx-2 my-2 inline-flex">
<input type="text" name="name" placeholder="Filename with extension" style="line-height: 0.05em" class="form-filename bg-gray-900 shadow-sm focus:ring-primary-500 focus:border-primary-500 block w-full sm:text-sm border-gray-700 rounded-md"> <input type="text" name="name" placeholder="Filename with extension" style="line-height: 0.05em" class="form-filename bg-gray-900 shadow-sm focus:ring-primary-500 focus:border-primary-500 block w-full sm:text-sm border-gray-700 rounded-md">
</p> </p>
<div class="mx-2 my-2 inline-flex ml-auto space-x-2"> <div class="hidden mx-2 my-2 sm:inline-flex ml-auto space-x-2">
<select class="editor-indent-type whitespace-nowrap text-slate-300 rounded border border-gray-600 bg-gray-900 pr-8 text-xs font-medium shadow-sm hover:bg-gray-700 hover:border-gray-500 hover:text-slate-300 focus:outline-none focus:ring-1 focus:border-primary-500 focus:ring-primary-500"> <select class="editor-indent-type whitespace-nowrap text-slate-300 rounded border border-gray-600 bg-gray-900 pr-8 text-xs font-medium shadow-sm hover:bg-gray-700 hover:border-gray-500 hover:text-slate-300 focus:outline-none focus:ring-1 focus:border-primary-500 focus:ring-primary-500">
<optgroup label="Indent mode"> <optgroup label="Indent mode">
<option value="space">Space</option> <option value="space">Space</option>

View file

@ -40,12 +40,12 @@
<main class="mt-4"> <main class="mt-4">
<form id="create" class="space-y-4" method="post" action="/{{ .gist.User.Username }}/{{ .gist.Uuid }}/edit"> <form id="create" class="space-y-4" method="post" action="/{{ .gist.User.Username }}/{{ .gist.Uuid }}/edit">
<div class="grid grid-cols-12 gap-x-4"> <div class="grid grid-cols-12 gap-x-4">
<div class="col-span-4"> <div class="col-span-8 sm:col-span-4">
<div class="mt-1"> <div class="mt-1">
<input type="text" value="{{ .gist.Title }}" placeholder="Title" name="title" id="title" class="bg-black shadow-sm focus:ring-primary-500 focus:border-primary-500 block w-full sm:text-sm border-gray-700 rounded-md"> <input type="text" value="{{ .gist.Title }}" placeholder="Title" name="title" id="title" class="bg-black shadow-sm focus:ring-primary-500 focus:border-primary-500 block w-full sm:text-sm border-gray-700 rounded-md">
</div> </div>
</div> </div>
<div class="col-span-8"> <div class="col-span-12 sm:col-span-8">
<div class="mt-1"> <div class="mt-1">
<input type="text" value="{{ .gist.Description }}" placeholder="Description" name="description" id="description" class="bg-black shadow-sm focus:ring-primary-500 focus:border-primary-500 block w-full sm:text-sm border-gray-700 rounded-md"> <input type="text" value="{{ .gist.Description }}" placeholder="Description" name="description" id="description" class="bg-black shadow-sm focus:ring-primary-500 focus:border-primary-500 block w-full sm:text-sm border-gray-700 rounded-md">
</div> </div>
@ -64,7 +64,7 @@
</svg> </svg>
</button> </button>
</p> </p>
<div class="mx-2 my-2 inline-flex ml-auto space-x-2"> <div class="hidden mx-2 my-2 sm:inline-flex ml-auto space-x-2">
<select class="editor-indent-type whitespace-nowrap text-slate-300 rounded border border-gray-600 bg-gray-900 pr-8 text-xs font-medium shadow-sm hover:bg-gray-700 hover:border-gray-500 hover:text-slate-300 focus:outline-none focus:ring-1 focus:border-primary-500 focus:ring-primary-500"> <select class="editor-indent-type whitespace-nowrap text-slate-300 rounded border border-gray-600 bg-gray-900 pr-8 text-xs font-medium shadow-sm hover:bg-gray-700 hover:border-gray-500 hover:text-slate-300 focus:outline-none focus:ring-1 focus:border-primary-500 focus:ring-primary-500">
<optgroup label="Indent mode"> <optgroup label="Indent mode">
<option value="space">Space</option> <option value="space">Space</option>