Analyze page size and fix frontend tests

1 files changed, 133 insertions, 25 deletions

diff --git a/frontend/coverage/src/components/FeedItem.css.html b/frontend/coverage/src/components/FeedItem.css.html
index aa1f94f..dd239a3 100644
--- a/frontend/coverage/src/components/FeedItem.css.html
+++ b/frontend/coverage/src/components/FeedItem.css.html
@@ -143,7 +143,79 @@
 <a name='L78'></a><a href='#L78'>78</a>
 <a name='L79'></a><a href='#L79'>79</a>
 <a name='L80'></a><a href='#L80'>80</a>
-<a name='L81'></a><a href='#L81'>81</a></td><td class="line-coverage quiet"><span class="cline-any cline-neutral">&nbsp;</span>
+<a name='L81'></a><a href='#L81'>81</a>
+<a name='L82'></a><a href='#L82'>82</a>
+<a name='L83'></a><a href='#L83'>83</a>
+<a name='L84'></a><a href='#L84'>84</a>
+<a name='L85'></a><a href='#L85'>85</a>
+<a name='L86'></a><a href='#L86'>86</a>
+<a name='L87'></a><a href='#L87'>87</a>
+<a name='L88'></a><a href='#L88'>88</a>
+<a name='L89'></a><a href='#L89'>89</a>
+<a name='L90'></a><a href='#L90'>90</a>
+<a name='L91'></a><a href='#L91'>91</a>
+<a name='L92'></a><a href='#L92'>92</a>
+<a name='L93'></a><a href='#L93'>93</a>
+<a name='L94'></a><a href='#L94'>94</a>
+<a name='L95'></a><a href='#L95'>95</a>
+<a name='L96'></a><a href='#L96'>96</a>
+<a name='L97'></a><a href='#L97'>97</a>
+<a name='L98'></a><a href='#L98'>98</a>
+<a name='L99'></a><a href='#L99'>99</a>
+<a name='L100'></a><a href='#L100'>100</a>
+<a name='L101'></a><a href='#L101'>101</a>
+<a name='L102'></a><a href='#L102'>102</a>
+<a name='L103'></a><a href='#L103'>103</a>
+<a name='L104'></a><a href='#L104'>104</a>
+<a name='L105'></a><a href='#L105'>105</a>
+<a name='L106'></a><a href='#L106'>106</a>
+<a name='L107'></a><a href='#L107'>107</a>
+<a name='L108'></a><a href='#L108'>108</a>
+<a name='L109'></a><a href='#L109'>109</a>
+<a name='L110'></a><a href='#L110'>110</a>
+<a name='L111'></a><a href='#L111'>111</a>
+<a name='L112'></a><a href='#L112'>112</a>
+<a name='L113'></a><a href='#L113'>113</a>
+<a name='L114'></a><a href='#L114'>114</a>
+<a name='L115'></a><a href='#L115'>115</a>
+<a name='L116'></a><a href='#L116'>116</a>
+<a name='L117'></a><a href='#L117'>117</a></td><td class="line-coverage quiet"><span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
@@ -224,10 +296,10 @@
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span></td><td class="text"><pre class="prettyprint lang-js">.feed-item {
-    border-bottom: 1px solid #f0f0f0;
-    padding: 1rem 0;
+    padding: 1rem;
+    margin-top: 5rem;
     list-style: none;
-    /* Ensure no bullets if used in ul */
+    border-bottom: none;
 }
 &nbsp;
 .feed-item.read .item-title {
@@ -243,21 +315,23 @@
     display: flex;
     justify-content: space-between;
     align-items: flex-start;
+    margin-bottom: 0.5rem;
 }
 &nbsp;
 .item-title {
-    font-size: 1.2rem;
+    font-size: 1.25rem;
+    font-weight: bold;
+    /* Legacy headers were bold */
     text-decoration: none;
     color: #333;
     display: block;
-    margin-bottom: 0.5rem;
     flex: 1;
-    /* Take up remaining space */
 }
 &nbsp;
 .item-title:hover {
-    text-decoration: underline;
-    color: #007bff;
+    text-decoration: none;
+    color: blue;
+    /* Legacy link color */
 }
 &nbsp;
 .item-actions {
@@ -266,36 +340,63 @@
     margin-left: 1rem;
 }
 &nbsp;
-.action-btn {
+/* Legacy controls were simple text/links, but buttons are fine if minimal */
+.star-btn {
     background: none;
-    border: 1px solid #ddd;
-    border-radius: 4px;
+    border: none;
+    cursor: pointer;
+    font-size: 1.2rem;
+    padding: 0 0.5rem 0 0;
+    vertical-align: middle;
+    transition: color 0.2s;
+    line-height: 1;
+}
+&nbsp;
+.star-btn.is-starred {
+    color: #ffd700;
+    /* Gold */
+}
+&nbsp;
+.star-btn.is-unstarred {
+    color: #ccc;
+}
+&nbsp;
+.star-btn:hover {
+    color: #ffeb3b;
+}
+&nbsp;
+.action-btn {
+    background: whitesmoke;
+    border: none;
     cursor: pointer;
     padding: 2px 6px;
     font-size: 1rem;
-    line-height: 1;
+    color: blue;
+    font-weight: bold;
 }
 &nbsp;
 .action-btn:hover {
-    background-color: #f8f9fa;
-    border-color: #ccc;
+    background-color: #eee;
 }
 &nbsp;
-.action-btn.is-starred {
-    color: gold;
-    border-color: gold;
+.dateline {
+    margin-top: 0;
+    font-weight: normal;
+    font-size: .75em;
+    color: #ccc;
+    margin-bottom: 1rem;
 }
 &nbsp;
-.item-meta {
-    font-size: 0.85rem;
-    color: #666;
-    margin-bottom: 0.5rem;
+.dateline a {
+    color: #ccc;
+    text-decoration: none;
 }
 &nbsp;
 .item-description {
-    color: #444;
+    color: #000;
     line-height: 1.5;
-    font-size: 0.95rem;
+    font-size: 1rem;
+    margin-top: 1rem;
 }
 &nbsp;
 .item-description img {
@@ -303,6 +404,13 @@
     height: auto;
     display: block;
     margin: 1rem 0;
+}
+&nbsp;
+.item-description blockquote {
+    padding: 1rem 1rem 0 1rem;
+    border-left: 4px solid #ddd;
+    color: #666;
+    margin-left: 0;
 }</pre></td></tr></table></pre>
 
                 <div class='push'></div><!-- for sticky footer -->
@@ -310,7 +418,7 @@
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2026-02-13T15:03:42.999Z
+                at 2026-02-13T21:49:58.924Z
             </div>
         <script src="../../prettify.js"></script>
         <script>