Merge pull request #38 from Kusum4coding/develop

Made changes(added code with help of AI) in `article.html` and `article_row.html` file in order make the web view better of this page

library_management_system/library_management_system/doctype/article/templates/article.html

@@ -1,32 +1,46 @@
-{%  extends "templates/web.html" %}
+{% extends "templates/web.html" %}
 
 {% block page_content %}
-
 <div class="py-20 row">
-<div class="col-sm-2">
-<img alt="{{ title }}" src="{{ image }}"/>
+  <div class="col-sm-2">
+    <img 
+      alt="{{ title }}" 
+      src="{{ image }}" 
+      srcset="{{ image }} 1x, {{ image_large }} 2x" 
+      sizes="(max-width: 768px) 100vw, 50vw" 
+      loading="lazy" 
+    />
+  </div>
+  <div class="col">
+    <h1>{{ title }}</h1>
+    <p class="lead">By {{ author }}</p>
+    <div>
+      {%- if status == 'Available' -%}
+        <span class="badge badge-success">Available</span>
+      {%- elif status == 'Issued' -%}
+        <span class="badge badge-primary">Issued</span>
+      {%- endif -%}
+    </div>
+    <div class="mt-4">
+      <div>Publisher: <strong>{{ publisher }}</strong></div>
+      <div>ISBN: <strong>{{ isbn }}</strong></div>
+    </div>
+    <p>{{ description }}</p>
+  </div>
 </div>
-<div class="col">
-<h1>{{ title }}</h1>
-<p class="lead">By {{ author }}</p>
-<div>
-
-            {%- if status == 'Available' -%}
-
-            <span class="badge badge-success">Available</span>
-            {%- elif status == 'Issued' -%}
-
-            <span class="badge badge-primary">Issued</span>
 
-            {%- endif -%}
-
-        </div>
-<div class="mt-4">
-<div>Publisher: <strong>{{ publisher }}</strong></div>
-<div>ISBN: <strong>{{ isbn }}</strong></div>
-</div>
-<p>{{ description }}</p>
-</div>
-</div>
+<!-- Structured Data for SEO -->
+<script type="application/ld+json">
+{
+  "@context": "https://schema.org",
+  "@type": "Book",
+  "name": "{{ title }}",
+  "author": "{{ author }}",
+  "publisher": "{{ publisher }}",
+  "isbn": "{{ isbn }}",
+  "description": "{{ description }}",
+  "image": "{{ image }}"
+}
+</script>
 
 {% endblock %}

library_management_system/library_management_system/doctype/article/templates/article_row.html

@@ -1,9 +1,23 @@
 <div class="py-8 row">
-<div class="col-sm-1">
-<img alt="{{ doc.name }}" src="{{ doc.image }}"/>
-</div>
-<div class="col">
-<a class="font-size-lg" href="{{ doc.route }}">{{ doc.name }}</a>
-<p class="text-muted">By {{ doc.author }}</p>
-</div>
+  <div class="col-sm-1">
+    <img 
+      alt="{{ doc.name }}" 
+      src="{{ doc.image }}" 
+      srcset="{{ doc.image }} 1x, {{ doc.image_large }} 2x" 
+      sizes="(max-width: 768px) 100vw, 50vw" 
+      loading="lazy" 
+      class="img-thumbnail"
+    />
+  </div>
+  <div class="col">
+    <a 
+      class="font-size-lg" 
+      href="{{ doc.route }}" 
+      title="Read more about {{ doc.name }}"
+    >
+      {{ doc.name }}
+    </a>
+    <p class="text-muted">By {{ doc.author }}</p>
+  </div>
 </div>
+