AmineTMIRI/frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

ui fixes

Browse Source
This commit is contained in:
MuslemRahimi 2024-12-07 23:55:37 +01:00
parent 32a2518518
commit 733184762b
3 changed files with 27 additions and 113 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
src/lib/components/Feedback.svelte
View File

@ -117,16 +117,13 @@
<!--Start Create Watchlist Modal-->
<input type="checkbox" id="feedbackInfo" class="modal-toggle" />
<dialog
id="feedbackInfo"
class="modal modal-bottom sm:modal-middle overflow-hidden"
>
<dialog id="feedbackInfo" class="modal overflow-hidden p-2 sm:p-0">
<label
for="feedbackInfo"
class="cursor-pointer modal-backdrop bg-[#000] bg-opacity-[0.9]"
class="cursor-pointer modal-backdrop bg-[#000] bg-opacity-[0.8]"
></label>
<div class="modal-box w-full bg-[#09090B] border border-gray-600">
<div class="modal-box rounded w-full bg-primary border border-gray-600">
<div class="flex flex-row items-center pt-5">
<h1 class="text-white text-xl sm:text-2xl font-bold">
Your Feedback matters!
@ -174,8 +171,8 @@
<li on:click={() => (rating = "Very Good")} class="cursor-pointer">
<div
class="rounded-full w-16 h-16 relative {rating === 'Very Good'
? 'bg-[#333333]'
: ''} hover:bg-[#333333] flex items-center justify-center"
? 'bg-secondary'
: ''} hover:bg-secondary flex items-center justify-center"
>
<img
class="w-8 h-8 sm:w-10 sm:h-10"
@ -187,8 +184,8 @@
<li on:click={() => (rating = "Good")} class="cursor-pointer">
<div
class="rounded-full w-16 h-16 relative {rating === 'Good'
? 'bg-[#333333]'
: ''} hover:bg-[#333333] flex items-center justify-center"
? 'bg-secondary'
: ''} hover:bg-secondary flex items-center justify-center"
>
<img
class="w-8 h-8 sm:w-10 sm:h-10"
@ -200,8 +197,8 @@
<li on:click={() => (rating = "Bad")} class="cursor-pointer">
<div
class="rounded-full w-16 h-16 relative {rating === 'Bad'
? 'bg-[#333333]'
: ''} hover:bg-[#333333] flex items-center justify-center"
? 'bg-secondary'
: ''} hover:bg-secondary flex items-center justify-center"
>
<img
class="w-8 h-8 sm:w-10 sm:h-10"
@ -213,8 +210,8 @@
<li on:click={() => (rating = "Very Bad")} class="cursor-pointer">
<div
class="rounded-full w-16 h-16 relative {rating === 'Very Bad'
? 'bg-[#333333]'
: ''} hover:bg-[#333333] flex items-center justify-center"
? 'bg-secondary'
: ''} hover:bg-secondary flex items-center justify-center"
>
<img
class="w-8 h-8 sm:w-10 sm:h-10"

111
src/routes/options-flow/+page.svelte
View File

@ -2282,20 +2282,19 @@ function sendMessage(message) {
<!-- Put this part before </body> tag -->
<input type="checkbox" id="optionDetailsDesktopModal" class="modal-toggle" />
<label
for="optionDetailsDesktopModal"
class="modal modal-bottom sm:modal-middle cursor-pointer"
>
<label for="optionDetailsDesktopModal" class="cursor-pointer modal-backdrop"
<label for="optionDetailsDesktopModal" class="modal p-2 sm:p-0">
<label
for="optionDetailsDesktopModal"
class="cursor-pointer modal-backdrop bg-[#000] bg-opacity-[0.8]"
></label>
<!-- svelte-ignore a11y-label-has-associated-control -->
<label
class="modal-box w-full relative bg-[#09090B] h-auto max-h-[900px] border border-gray-800 overflow-y-scroll"
class="modal-box rounded w-full relative bg-primary h-auto max-h-[900px] border border-gray-800 overflow-y-scroll"
>
<label
for="optionDetailsDesktopModal"
class="cursor-pointer absolute right-5 top-2 bg-[#09090B] text-2xl text-white"
class="cursor-pointer absolute right-5 top-2 bg-primary text-2xl text-white"
>
✕
</label>
@ -2305,48 +2304,48 @@ function sendMessage(message) {
<br />
{optionSymbol}
</p>
<p class="py-4 text-gray-200 bg-[#09090B] w-full">
<p class="py-4 text-gray-200 bg-primary w-full">
<span class="font-semibold text-white">Description:</span>
<br />
{optionDescription}
</p>
<table
class="table table-sm table-compact bg-[#09090B] w-full mt-5 mb-10 text-white"
class="table table-sm table-compact bg-primary w-full mt-5 mb-10 text-white"
>
<tbody>
<!-- row 1 -->
<tr class="border-b border-slate-700 odd:bg-[#2A2E39]">
<tr class="border-b border-slate-700 odd:bg-secondary">
<td class="font-semibold">Premium</td>
<td class="">{optionPremium}</td>
<td class="font-semibold">C/P</td>
<td class="">{optionContract}</td>
</tr>
<tr class="border-b border-slate-700 odd:bg-[#2A2E39]">
<tr class="border-b border-slate-700 odd:bg-secondary">
<td class="font-semibold">Expiry</td>
<td class="">{optionExpiry}</td>
<td class="font-semibold">Type</td>
<td class="">{optionType}</td>
</tr>
<tr class="border-b border-slate-700 odd:bg-[#2A2E39]">
<tr class="border-b border-slate-700 odd:bg-secondary">
<td class="font-semibold">Strike</td>
<td class="">${optionStrike}</td>
<td class="font-semibold">Volume</td>
<td class="">{optionVolume}</td>
</tr>
<tr class="border-b border-slate-700 odd:bg-[#2A2E39]">
<tr class="border-b border-slate-700 odd:bg-secondary">
<td class="font-semibold">Spot</td>
<td class="">${optionSpot}</td>
<td class="font-semibold">Open Interest</td>
<td class="">{optionOpenInterest}</td>
</tr>
<tr class="border-b border-slate-700 odd:bg-[#2A2E39]">
<tr class="border-b border-slate-700 odd:bg-secondary">
<td class="font-semibold">Price</td>
<td class="">${optionPrice}</td>
<td class="font-semibold">Sentiment</td>
<td class="">{optionSentiment}</td>
</tr>
<tr class="border-b border-slate-700 odd:bg-[#2A2E39]">
<tr class="border-b border-slate-700 odd:bg-secondary">
<td class="font-semibold">Execution Estimate</td>
<td class="">{optionexecution_estimate}</td>
<td class="font-semibold"></td>
@ -2359,88 +2358,6 @@ function sendMessage(message) {
<!--End Options Detial Desktop Modal-->
<!--Start Options Detail Modal-->
<!--
<div class="hidden drawer drawer-end z-[999] w-full overflow-hidden">
<input id="optionDetailsMobileModal" type="checkbox" class="drawer-toggle"/>
<div class="drawer-side overflow-hidden z-[999]">
<div class="bg-[#000] min-h-screen w-full border pb-20 overflow-hidden">
<label for="optionDetailsMobileModal" class="absolute left-6 top-6">
<svg class="w-6 h-6 inline-block mb-0.5" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="#fff" d="M9.125 21.1L.7 12.7q-.15-.15-.213-.325T.425 12q0-.2.063-.375T.7 11.3l8.425-8.425q.35-.35.875-.35t.9.375q.375.375.375.875t-.375.875L3.55 12l7.35 7.35q.35.35.35.863t-.375.887q-.375.375-.875.375t-.875-.375Z"/></svg>
</label>
<div class="w-fit border overflow-hidden p-2">
<p class="text-xl font-semibold text-white mt-16 p-3">
<span class="text-xl font-semibold">Order Details:</span>
<br>
{optionSymbol}
</p>
<p class="py-4 text-gray-200 w-full p-3">
<span class="font-semibold text-white">Description:</span>
{optionDescription}
</p>
<table class="table table-sm table-compact w-full mt-5 mb-10 text-white">
<tbody>
<tr class="border-b border-slate-700 odd:bg-[#2A2E39]">
<td class="font-semibold">Premium</td>
<td class="">{optionPremium}</td>
<td class="font-semibold">C/P</td>
<td class="">{optionContract}</td>
</tr>
<tr class="border-b border-slate-700 odd:bg-[#2A2E39]">
<td class="font-semibold">Expiry</td>
<td class="">{optionExpiry}</td>
<td class="font-semibold">Type</td>
<td class="">{optionType}</td>
</tr>
<tr class="border-b border-slate-700 odd:bg-[#2A2E39]">
<td class="font-semibold">Strike</td>
<td class="">${optionStrike}</td>
<td class="font-semibold">Volume</td>
<td class="">{optionVolume}</td>
</tr>
<tr class="border-b border-slate-700 odd:bg-[#2A2E39]">
<td class="font-semibold">Spot</td>
<td class="">${optionSpot}</td>
<td class="font-semibold">Open Interest</td>
<td class="">{optionOpenInterest}</td>
</tr>
<tr class="border-b border-slate-700 odd:bg-[#2A2E39]">
<td class="font-semibold">Price</td>
<td class="">${optionPrice}</td>
<td class="font-semibold">Sentiment</td>
<td class="">{optionSentiment}</td>
</tr>
<tr class="odd:bg-[#2A2E39]">
<td class="font-semibold">Trade Count</td>
<td class="">{optionTradeCount}</td>
<td class="font-semibold">Exchange</td>
<td class="">{optionExchange}</td>
</tr>
<tr class="border-b border-slate-700 odd:bg-[#2A2E39]">
<td class="font-semibold">Execution Est.</td>
<td class="">{optionexecution_estimate}</td>
<td class="font-semibold"></td>
<td class=""></td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
-->
<!--End Options Detail Modal-->
<style>
.table-container {
width: 100%;

4
src/routes/stock-screener/+page.svelte
View File

@ -2455,7 +2455,7 @@ const handleKeyDown = (event) => {
</div>
</div>
<div class="rounded-md border border-gray-700 bg-[#262626] p-2">
<div class="rounded-md border border-gray-700 bg-primary p-2">
<div class="items-end border-b border-gray-600">
<div
class="mr-1 flex items-center justify-between lg:mr-2 pb-1.5 border-b border-gray-600 mt-1.5"
@ -3205,7 +3205,7 @@ const handleKeyDown = (event) => {
<div class="flex justify-center items-center h-80">
<div class="relative">
<label
class="bg-[#262626] rounded-xl h-14 w-14 flex justify-center items-center absolute top-1/2 left-1/2 transform -translate-x-1/2 -translate-y-1/2"
class="bg-primary rounded-xl h-14 w-14 flex justify-center items-center absolute top-1/2 left-1/2 transform -translate-x-1/2 -translate-y-1/2"
>
<span class="loading loading-spinner loading-md text-gray-400"></span>
</label>