Init

janfaracik · May 16, 2022 · 43e4f5c · 43e4f5c
1 parent 62fbc3a
commit 43e4f5c
Show file tree

Hide file tree

Showing 3 changed files with 28 additions and 22 deletions.
diff --git a/war/src/main/less/modules/section.less b/war/src/main/less/modules/section.less
@@ -57,10 +57,7 @@
   &::after {
     position: absolute;
     content: "";
-    top: -10px;
-    left: -10px;
-    bottom: -10px;
-    right: -10px;
+    inset: -10px;
     z-index: -1;
     border-radius: 10px;
     transition: var(--standard-transition);
@@ -110,30 +107,35 @@
     align-items: center;
     justify-content: center;
     margin: 0 1rem 0 0;
-    width: 48px;
-    height: 48px;
-    margin: 0 1rem 0 0;
+    width: 3rem;
+    height: 3rem;
     flex-shrink: 0;
     color: var(--text-color);
 
-    &::before {
+    &::before,
+    &::after {
       content: "";
       position: absolute;
-      top: 0;
-      left: 0;
-      bottom: 0;
-      right: 0;
+      inset: 0;
       border-radius: 100%;
+      pointer-events: none;
+    }
+
+    &::before {
       background: currentColor;
       opacity: 0.1;
-      pointer-events: none;
+    }
+
+    &::after {
+      border: 1px solid currentColor;
+      opacity: 0.015;
     }
 
     img,
     svg {
       position: relative;
-      width: 24px !important;
-      height: 24px !important;
+      width: 50% !important;
+      height: 50% !important;
       color: currentColor;
     }
 
@@ -152,6 +154,7 @@
       padding: 0 0.4rem;
       box-shadow: 0 1px 1px rgba(black, 0.1);
       color: white;
+      animation: animate-in-badge var(--elastic-transition) 0.1s both;
 
       &::after {
         content: "";
@@ -171,15 +174,20 @@
   dt {
     font-size: 0.95rem;
     font-weight: 600;
-    margin: 0 0 2px 0;
+    margin: 0 0 0.25rem 0;
     color: var(--text-color);
   }
 
   dd {
     color: var(--text-color-secondary);
     font-weight: 500;
-    margin: 0;
-    line-height: 1.66;
-    margin-right: 10px;
+    line-height: 1.6;
+    margin: 0 10px 0 0;
+  }
+}
+
+@keyframes animate-in-badge {
+  from {
+    transform: scale(0);
   }
 }
diff --git a/...src/main/less/modules/manage-jenkins.less → war/src/main/less/pages/manage-jenkins.less b/...src/main/less/modules/manage-jenkins.less → war/src/main/less/pages/manage-jenkins.less
@@ -1,5 +1,3 @@
-/* ----------- Manage Jenkins page ----------- */
-
 .manage-messages a,
 .manage-messages a:visited {
   color: inherit !important;

diff --git a/war/src/main/less/styles.less b/war/src/main/less/styles.less
@@ -41,7 +41,6 @@ html {
 @import './modules/content-blocks';
 @import './modules/icon-size';
 @import './modules/icons';
-@import './modules/manage-jenkins';
 @import './modules/page-footer';
 @import './modules/page-header';
 @import './modules/panes-and-bigtable';
@@ -55,5 +54,6 @@ html {
 @import './modules/tooltips';
 
 @import './pages/about';
+@import './pages/manage-jenkins';
 @import './pages/plugin-manager';
 @import './pages/setupWizardFirstUser';