chore: various frontend changes (#37973)

templates/repo/issue/view_content.tmpl

@@ -171,14 +171,3 @@
 
 {{template "repo/issue/view_content/reference_issue_dialog" .}}
 {{template "shared/user/block_user_dialog" .}}
-
-<div class="ui g-modal-confirm delete modal">
-	<div class="header">
-		{{svg "octicon-trash"}}
-		{{ctx.Locale.Tr "repo.branch.delete" .HeadTarget}}
-	</div>
-	<div class="content">
-		<p>{{ctx.Locale.Tr "repo.branch.delete_desc"}}</p>
-	</div>
-	{{template "base/modal_actions_confirm" .}}
-</div>

web_src/css/base.css

@@ -382,16 +382,6 @@ a.label,
   color: var(--color-text-light-2);
 }
 
-/* styles from removed fomantic transition module */
-.hidden.transition {
-  visibility: hidden;
-  display: none;
-}
-.visible.transition {
-  display: block !important;
-  visibility: visible !important;
-}
-
 .ui.comments .comment .metadata {
   color: var(--color-text-light-2);
 }
@@ -438,11 +428,6 @@ img.ui.avatar,
   margin-top: calc(var(--page-spacing) - 1rem);
 }
 
-.ui.message.flash-message pre {
-  white-space: pre-line;
-  margin: 0;
-}
-
 .ui .header > i + .content {
   padding-left: 0.75rem;
   vertical-align: middle;
@@ -486,10 +471,6 @@ img.ui.avatar,
   color: var(--color-text) !important;
 }
 
-.ui .border {
-  border: 1px solid;
-}
-
 .user-menu > .item {
   width: 100%;
   border-radius: 0 !important;

web_src/css/index.css

@@ -22,8 +22,9 @@
 @import "./modules/tab.css";
 @import "./modules/form.css";
 @import "./modules/dropdown.css";
-@import "./modules/shortcut.css";
+@import "./modules/transition.css";
 
+@import "./modules/shortcut.css";
 @import "./modules/tippy.css";
 @import "./modules/breadcrumb.css";
 @import "./modules/comment.css";

web_src/css/modules/animations.css

@@ -101,13 +101,6 @@ code.language-math.is-loading::after {
   animation: pulse-1p5 200ms linear;
 }
 
-.ui.modal,
-.ui.dimmer.transition {
-  animation-name: fadein;
-  animation-duration: 100ms;
-  animation-timing-function: ease-in-out;
-}
-
 .rotate-clockwise {
   animation: rotate-clockwise-keyframes 1s linear infinite;
 }

web_src/css/modules/message.css

@@ -31,6 +31,11 @@ details.ui.message:not(:has(pre)) summary {
   cursor: text;
 }
 
+.ui.message.flash-message pre {
+  white-space: pre-line;
+  margin: 0;
+}
+
 .ui.message:first-child {
   margin-top: 0;
 }

web_src/css/modules/transition.css

@@ -0,0 +1,24 @@
+/* styles for Fomantic transition (toggle): dimmer, modal, dropdown menu */
+
+/* this is the only place using "hidden" and "visible" classes, it can safely work with tailwind without prefix in the future */
+.ui.modal.transition.hidden,
+.ui.dropdown > .menu.transition.hidden {
+  display: none;
+  visibility: hidden;
+}
+
+.ui.modal.transition.visible,
+.ui.dropdown > .menu.transition.visible {
+  display: block;
+  visibility: visible;
+}
+
+/* dimmer uses "active" but not "hidden/visible" classes, no special classes for it here */
+
+/* only modal and dimmer need animation, dropdown menu doesn't */
+.ui.modal.transition,
+.ui.dimmer.transition {
+  animation-name: fadein;
+  animation-duration: 100ms;
+  animation-timing-function: ease-in-out;
+}