Platform tag is created only if content has one platform. Adjusted css: deleted animation. Div should handle multiple signatures.

2 files changed, 17 insertions, 33 deletions

diff --git a/plugins/base/src/test/resources/expect/functionWithReceiver/out/html/root/[jvm root]/index.html b/plugins/base/src/test/resources/expect/functionWithReceiver/out/html/root/[jvm root]/index.html
index 51da56c2..b946084e 100644
--- a/plugins/base/src/test/resources/expect/functionWithReceiver/out/html/root/[jvm root]/index.html
+++ b/plugins/base/src/test/resources/expect/functionWithReceiver/out/html/root/[jvm root]/index.html
@@ -36,7 +36,7 @@
                 </div>
               </div>
               <div class="signature-subrow">
-                <div class="signature">
+                <div class="signatures">
                   <div class="platform-hinted" data-platform-hinted="data-platform-hinted"><div class="content" data-active="" data-togglable="jvm"><div class="symbol "><div class="symbol monospace">final fun <a href="">String</a>.<a href="fn.html">fn</a>()</div></div></div></div>
                 </div>
               </div>
@@ -52,7 +52,7 @@
                 </div>
               </div>
               <div class="signature-subrow">
-                <div class="signature">
+                <div class="signatures">
                   <div class="platform-hinted" data-platform-hinted="data-platform-hinted"><div class="content" data-active="" data-togglable="jvm"><div class="symbol "><div class="symbol monospace">final fun <a href="">String</a>.<a href="fn.html">fn</a>(x: <a href="">Int</a>)</div></div></div></div>
                 </div>
               </div>
diff --git a/plugins/base/src/test/resources/expect/functionWithReceiver/out/html/styles/style.css b/plugins/base/src/test/resources/expect/functionWithReceiver/out/html/styles/style.css
index fc032e29..687a14e1 100644
--- a/plugins/base/src/test/resources/expect/functionWithReceiver/out/html/styles/style.css
+++ b/plugins/base/src/test/resources/expect/functionWithReceiver/out/html/styles/style.css
@@ -399,18 +399,12 @@ footer {
 }
 
 .platform-tag {
-    text-indent: 100%;
-    white-space: nowrap;
-    overflow: hidden;
-    width: 10px;
-    height: 10px;
-    max-width: 10px;
-    max-height: 10px;
-    border-radius: 8px;
-    transition: width 1s, height 1s;
-    margin-left: 14px;
-    margin-top: auto;
-    margin-bottom: auto;
+    display: flex;
+    flex-direction: row;
+    padding: 4px 8px;
+    height: 16px;
+    border-radius: 100px;
+
     font-family: Inter, Arial, sans-serif;
     font-size: 12px;
     font-weight: 400;
@@ -419,40 +413,25 @@ footer {
     line-height: normal;
     letter-spacing: normal;
     text-align: center;
+
     color: #fff
-}
 
-.table-row:hover .platform-tag,
-.table-row:hover > .platform-tag {
-    text-indent: 0;
-    white-space: nowrap;
-    padding: 0 7px;
-    border-radius: 9px;
-    margin-left: 8px;
-    width: auto;
-    height: 15px;
-    max-width: 500px;
-    max-height: 500px;
-    transition: max-width 1s, max-height 1s
 }
 
 .platform-tags {
     flex: auto;
     display: flex;
     flex-direction: row;
-    padding: 0px;
-    min-width: 230px;
     align-items: flex-start;
     justify-content: flex-end;
 }
 
 .platform-tags > .platform-tag {
     align-self: center;
-    margin: 10px;
 }
 
 .platform-tag:nth-child(1) {
-    background-color: blue;
+    background-color: #4DBB5F;
     color: white;
 }
 
@@ -497,6 +476,7 @@ td.content {
 
 .platform-hinted {
     display: block;
+    margin-bottom: 5px;
 }
 
 .platform-hinted > .platform-bookmarks-row {
@@ -518,7 +498,7 @@ td.content {
 }
 
 .platform-hinted > .platform-bookmarks-row > .platform-bookmark:nth-child(1):hover {
-    border-top: 2px solid blue;
+    border-top: 2px solid #4DBB5F;
 }
 
 .platform-hinted > .platform-bookmarks-row > .platform-bookmark:nth-child(2):hover {
@@ -556,6 +536,7 @@ td.content {
 .table {
     display: flex;
     flex-direction: column;
+    flex-direction: column;
 }
 
 .table-row {
@@ -593,8 +574,11 @@ td.content {
     order: 4;
 }
 
-.signature-subrow > .signature {
+.signature-subrow > .signatures {
     grid-column-start: 2;
+    display: flex;
+    flex-direction: column;
+    margin-top: 5px;
 }
 
 .signature-subrow > * {