{{template "base" .}} {{define "title"}}Settings{{end}} {{define "header"}} <a href="./settings">Settings</a> {{end}} {{define "content"}} <div class="w-full flex flex-col md:flex-row gap-4"> <div> <div class="flex flex-col p-4 items-center rounded shadow-lg md:w-60 lg:w-80 bg-white dark:bg-gray-700 text-gray-500 dark:text-white" > {{ template "svg/user" (dict "Size" 60) }} <p class="text-lg">{{ .User }}</p> </div> </div> <div class="flex flex-col gap-4 grow"> <div class="flex flex-col gap-2 grow p-4 rounded shadow-lg bg-white dark:bg-gray-700 text-gray-500 dark:text-white" > <p class="text-lg font-semibold mb-2">Change Password</p> <form class="flex gap-4 flex-col lg:flex-row" action="./settings" method="POST" > <div class="flex flex-col grow"> <div class="flex relative"> <span class="inline-flex items-center px-3 border-t bg-white border-l border-b border-gray-300 text-gray-500 shadow-sm text-sm" > {{ template "svg/password" (dict "Size" 15) }} </span> <input type="password" id="password" name="password" class="flex-1 appearance-none rounded-none border border-gray-300 w-full py-2 px-4 bg-white text-gray-700 placeholder-gray-400 shadow-sm text-base focus:outline-none focus:ring-2 focus:ring-purple-600 focus:border-transparent" placeholder="Password" /> </div> </div> <div class="flex flex-col grow"> <div class="flex relative"> <span class="inline-flex items-center px-3 border-t bg-white border-l border-b border-gray-300 text-gray-500 shadow-sm text-sm" > {{ template "svg/password" (dict "Size" 15) }} </span> <input type="password" id="new_password" name="new_password" class="flex-1 appearance-none rounded-none border border-gray-300 w-full py-2 px-4 bg-white text-gray-700 placeholder-gray-400 shadow-sm text-base focus:outline-none focus:ring-2 focus:ring-purple-600 focus:border-transparent" placeholder="New Password" /> </div> </div> <button type="submit" class="px-10 py-2 text-base font-semibold text-center text-white transition duration-200 ease-in bg-black shadow-md hover:text-black hover:bg-white focus:outline-none focus:ring-2" > <span class="w-full">Submit</span> </button> </form> {{ if .PasswordErrorMessage }} <span class="text-red-400 text-xs">{{ .PasswordErrorMessage }}</span> {{ else if .PasswordMessage }} <span class="text-green-400 text-xs">{{ .PasswordMessage }}</span> {{ end }} </div> <div class="flex flex-col grow gap-2 p-4 rounded shadow-lg bg-white dark:bg-gray-700 text-gray-500 dark:text-white" > <p class="text-lg font-semibold mb-2">Change Time Offset</p> <form class="flex gap-4 flex-col lg:flex-row" action="./settings" method="POST" > <div class="flex relative grow"> <span class="inline-flex items-center px-3 border-t bg-white border-l border-b border-gray-300 text-gray-500 shadow-sm text-sm" > {{ template "svg/clock" (dict "Size" 15) }} </span> <select class="flex-1 appearance-none rounded-none border border-gray-300 w-full py-2 px-4 bg-white text-gray-700 placeholder-gray-400 shadow-sm text-base focus:outline-none focus:ring-2 focus:ring-purple-600 focus:border-transparent" id="time_offset" name="time_offset" > {{ range $item := GetUTCOffsets }} <option {{ if (eq $item.Value $.Data.Settings.TimeOffset) }}selected{{ end }} value="{{ $item.Value }}" > {{ $item.Name }} </option> {{ end }} </select> </div> <button type="submit" class="px-10 py-2 text-base font-semibold text-center text-white transition duration-200 ease-in bg-black shadow-md hover:text-black hover:bg-white focus:outline-none focus:ring-2" > <span class="w-full">Submit</span> </button> </form> {{ if .TimeOffsetErrorMessage }} <span class="text-red-400 text-xs">{{ .TimeOffsetErrorMessage }}</span> {{ else if .TimeOffsetMessage }} <span class="text-green-400 text-xs">{{ .TimeOffsetMessage }}</span> {{ end }} </div> <div class="flex flex-col grow p-4 rounded shadow-lg bg-white dark:bg-gray-700 text-gray-500 dark:text-white" > <p class="text-lg font-semibold">Devices</p> <table class="min-w-full bg-white dark:bg-gray-700 text-sm"> <thead class="text-gray-800 dark:text-gray-400"> <tr> <th scope="col" class="p-3 pl-0 font-normal text-left uppercase border-b border-gray-200 dark:border-gray-800" > Name </th> <th scope="col" class="p-3 font-normal text-left uppercase border-b border-gray-200 dark:border-gray-800" > Last Sync </th> <th scope="col" class="p-3 font-normal text-left uppercase border-b border-gray-200 dark:border-gray-800" > Created </th> </tr> </thead> <tbody class="text-black dark:text-white"> {{ if not .Data.Devices }} <tr> <td class="text-center p-3" colspan="3">No Results</td> </tr> {{ end }} {{ range $device := .Data.Devices }} <tr> <td class="p-3 pl-0"> <p>{{ $device.DeviceName }}</p> </td> <td class="p-3"> <p>{{ $device.LastSynced }}</p> </td> <td class="p-3"> <p>{{ $device.CreatedAt }}</p> </td> </tr> {{ end }} </tbody> </table> </div> </div> </div> {{end}}