Skip to content

Commit e0ecb86

Browse files
igennovaigennova
authored
1 parent c6beab1 commit e0ecb86

File tree

1 file changed

+113
-134
lines changed

1 file changed

+113
-134
lines changed

‎website/templates/trademark_detailview.html

+113-134
Original file line numberDiff line numberDiff line change
@@ -17,138 +17,117 @@
1717
{% endblock og_description %}
1818
{% block content %}
1919
{% include "includes/sidenav.html" %}
20-
<style>
21-
.table-auto{
22-
margin-right:70px ;
23-
}
24-
.status_label {
25-
border-radius: 30px;
26-
text-align: center;
27-
color: white;
28-
}
29-
.type_label{
30-
color: blueviolet;
31-
}
32-
.tm-wrapper{
33-
position: relative;
34-
left : 350px;
35-
top : 80px;
36-
height: 470px;
37-
width: 500px;
38-
background-color: #FFFFFF;
39-
border-radius: 30px;
40-
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
41-
font-weight: 400;
42-
font-style: normal;
43-
}
44-
#tm-logo{
45-
height: 175px;
46-
width: 196px;
47-
position: absolute;
48-
left: 152px;
49-
top: 71px;
50-
}
51-
.tm-wrapper p{
52-
position: absolute;
53-
left: 194px;
54-
top: 252px;
55-
font-size: 30px;
56-
font-weight: 1000;
57-
}
58-
#tm-text{
59-
position: absolute;
60-
left: 88px;
61-
top: 313px;
62-
font-size: 20px;
63-
opacity: 80%;
64-
text-align: center;
65-
}
66-
#back-button{
67-
background-color: #FF9191;
68-
height: 70px;
69-
width: 250px;
70-
border-radius: 0px 0px 0px 30px;
71-
position: absolute;
72-
left: 0px;
73-
top: 400px;
74-
font-weight: 1000;
75-
}
76-
#more-button{
77-
background-color: #D92D2D;
78-
height: 70px;
79-
width: 250px;
80-
border-radius: 0px 0px 30px 0px;
81-
position: absolute;
82-
right: 0px;
83-
top: 400px;
84-
font-weight: 1000;
85-
}
86-
87-
</style>
88-
{% if available %}
89-
<div class="tm-wrapper">
90-
<img id="tm-logo"
91-
height="175px"
92-
width="196px"
93-
alt="Trademark available Image"
94-
src="{% static 'img/TM.png' %}">
95-
<p>Available !</p>
96-
<div id="tm-text">Trademark is available for Registration</div>
97-
<button id="back-button">
98-
<a href="{% url 'home' %}">Back</a>
99-
</button>
100-
<button id="more-button">
101-
<a href="{% url 'trademark_search' %}">Search More</a>
102-
</button>
103-
</div>
104-
{% else %}
105-
<p class="text-gray-300 my-6 font-satoshi font-bold text-[25px]">{{ count }} results found for {{ query }}</p>
106-
<table class="table-auto border-collapse w-full">
107-
<thead class="font-bold italic text-opacity-25 bg-gray-200">
108-
<tr>
109-
<th class="px-4 py-2">Name</th>
110-
<th class="px-4 py-2">Registration No</th>
111-
<th class="px-4 py-2">Serial No</th>
112-
<th class="px-4 py-2">Filing Date</th>
113-
<th class="px-4 py-2">Registration Date</th>
114-
<th class="px-4 py-2">Expiry Date</th>
115-
<th class="px-4 py-2">Owner Label</th>
116-
<th class="px-4 py-2">Owner Name</th>
117-
<th class="px-4 py-2">Owner Address</th>
118-
<th class="px-4 py-2">Labels</th>
119-
</tr>
120-
</thead>
121-
<tbody>
122-
{% for item in items %}
123-
{% for owner in item.owners %}
124-
<tr class="border">
125-
<td class="px-4 py-2 font-bold ">{{ item.keyword }}</td>
126-
<td class="px-4 py-2">{{ item.registration_number }}</td>
127-
<td class="px-4 py-2">{{ item.serial_number }}</td>
128-
<td class="px-4 py-2 min-h-2">{{ item.filing_date }}</td>
129-
<td class="px-4 py-2">{{ item.registration_date }}</td>
130-
<td class="px-4 py-2">{{ item.expiration_date }}</td>
131-
<td class="px-4 py-2">{{ owner.owner_label }}</td>
132-
<td class="px-4 py-2">{{ owner.name }}</td>
133-
<td class="px-4 py-2">
134-
{{ owner.address1 }}
135-
{{ owner.address2 }},
136-
{{ owner.city }},
137-
{{ owner.state }},
138-
{{ owner.country }},
139-
{{ owner.postcode }}
140-
</td>
141-
<td class="px-4 py-2">
142-
<div class="status_label {% if item.status_label == 'Live/Pending' %} bg-yellow-600 {% elif item.status_label == 'Live/Registered' %} bg-green-600 {% elif item.status_label == 'Dead/Abandoned' %} bg-red-600 {% else %} bg-sky-600 {% endif %} ">
143-
{{ item.status_label }}
144-
</div>
145-
<br>
146-
<div class="type_label">{{ owner.legal_entity_type_label }}</div>
147-
</td>
148-
</tr>
149-
{% endfor %}
150-
{% endfor %}
151-
</tbody>
152-
</table>
153-
{% endif %}
20+
<div class="min-h-screen bg-gray-50 p-4 sm:p-6 lg:p-8">
21+
{% if available %}
22+
<div class="max-w-lg mx-auto bg-white rounded-2xl shadow-lg overflow-hidden">
23+
<div class="relative p-8 text-center">
24+
<img class="mx-auto h-32 w-32 mb-6"
25+
height="128"
26+
width="128"
27+
alt="Trademark available Image"
28+
src="{% static 'img/TM.png' %}">
29+
<h2 class="text-3xl font-bold text-gray-900 mb-2">Available!</h2>
30+
<p class="text-lg text-gray-600 mb-8">Trademark is available for Registration</p>
31+
<div class="flex gap-4 justify-center">
32+
<a href="{% url 'home' %}"
33+
class="inline-flex items-center px-6 py-3 bg-[#e74c3c] text-white font-semibold rounded-lg hover:bg-opacity-90 transition-colors">
34+
<svg class="w-5 h-5 mr-2"
35+
fill="none"
36+
stroke="currentColor"
37+
viewBox="0 0 24 24">
38+
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 19l-7-7m0 0l7-7m-7 7h18" />
39+
</svg>
40+
Back
41+
</a>
42+
<a href="{% url 'trademark_search' %}"
43+
class="inline-flex items-center px-6 py-3 bg-[#e74c3c] text-white font-semibold rounded-lg hover:bg-opacity-90 transition-colors">
44+
<svg class="w-5 h-5 mr-2"
45+
fill="none"
46+
stroke="currentColor"
47+
viewBox="0 0 24 24">
48+
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z" />
49+
</svg>
50+
Search More
51+
</a>
52+
</div>
53+
</div>
54+
</div>
55+
{% else %}
56+
<div class="max-w-[95%] mx-auto">
57+
<div class="flex items-center justify-between mb-6">
58+
<h1 class="text-2xl sm:text-3xl font-bold text-gray-900">
59+
Search Results
60+
<span class="ml-2 text-lg text-gray-500">{{ count }} results found for "{{ query }}"</span>
61+
</h1>
62+
<a href="{% url 'trademark_search' %}"
63+
class="inline-flex items-center px-4 py-2 bg-[#e74c3c] text-white font-semibold rounded-lg hover:bg-opacity-90 transition-colors">
64+
<svg class="w-5 h-5 mr-2"
65+
fill="none"
66+
stroke="currentColor"
67+
viewBox="0 0 24 24">
68+
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z" />
69+
</svg>
70+
New Search
71+
</a>
72+
</div>
73+
<div class="overflow-x-auto bg-white rounded-xl shadow-md">
74+
<table class="min-w-full divide-y divide-gray-200">
75+
<thead class="bg-gray-50">
76+
<tr>
77+
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Name</th>
78+
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Registration Info</th>
79+
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Dates</th>
80+
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Owner Details</th>
81+
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Status</th>
82+
</tr>
83+
</thead>
84+
<tbody class="bg-white divide-y divide-gray-200">
85+
{% for item in items %}
86+
{% for owner in item.owners %}
87+
<tr class="hover:bg-gray-50 cursor-pointer transition-colors"
88+
onclick="window.open('https://tsdr.uspto.gov/#caseNumber={{ item.serial_number }}&caseType=SERIAL_NO&searchType=statusSearch', '_blank')">
89+
<td class="px-6 py-4">
90+
<div class="text-lg font-semibold text-[#e74c3c] hover:underline">{{ item.keyword }}</div>
91+
</td>
92+
<td class="px-6 py-4">
93+
<div class="text-sm">
94+
<div class="font-medium text-gray-900">Reg #: {{ item.registration_number }}</div>
95+
<div class="text-gray-500">Serial #: {{ item.serial_number }}</div>
96+
</div>
97+
</td>
98+
<td class="px-6 py-4">
99+
<div class="text-sm">
100+
<div class="text-gray-900">Filed: {{ item.filing_date }}</div>
101+
<div class="text-gray-500">Registered: {{ item.registration_date }}</div>
102+
<div class="text-gray-500">Expires: {{ item.expiration_date }}</div>
103+
</div>
104+
</td>
105+
<td class="px-6 py-4">
106+
<div class="text-sm">
107+
<div class="font-medium text-gray-900">{{ owner.name }}</div>
108+
<div class="text-gray-500">
109+
{{ owner.address1 }}
110+
{% if owner.address2 %}{{ owner.address2 }},{% endif %}
111+
{{ owner.city }}, {{ owner.state }}
112+
{% if owner.country %}, {{ owner.country }}{% endif %}
113+
{% if owner.postcode %}{{ owner.postcode }}{% endif %}
114+
</div>
115+
<div class="text-gray-500">{{ owner.owner_label }}</div>
116+
</div>
117+
</td>
118+
<td class="px-6 py-4">
119+
<span class="px-3 py-1 inline-flex text-sm leading-5 font-semibold rounded-full {% if item.status_label == 'Live/Pending' %} bg-yellow-100 text-yellow-800 {% elif item.status_label == 'Live/Registered' %} bg-green-100 text-green-800 {% elif item.status_label == 'Dead/Abandoned' %} bg-red-100 text-red-800 {% else %} bg-blue-100 text-blue-800{% endif %}">
120+
{{ item.status_label }}
121+
</span>
122+
<div class="mt-2 text-sm text-violet-600 font-medium">{{ owner.legal_entity_type_label }}</div>
123+
</td>
124+
</tr>
125+
{% endfor %}
126+
{% endfor %}
127+
</tbody>
128+
</table>
129+
</div>
130+
</div>
131+
{% endif %}
132+
</div>
154133
{% endblock content %}

0 commit comments

Comments
 (0)