Main Page.css: Difference between revisions

← Older edit Newer edit →

@@ Line 329: / Line 329: @@
 /* */
 .crw-card-grid{
-   display: grid;
+   display: grid !important;
-   grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
+   grid-template-columns: repeat(auto-fit, minmax(240px, 240px));
-   gap: 0.75em;
+   gap: 16px;
+  justify-content: center;
+  align-content: start;
+  margin: 0;
+  padding: 0;
+}
+.crw-card-grid > p{
+  margin: 0;
+  display: contents;
 }
 .crw-card{
-   border: 1px solid #004080;
+  background: #fff;
-   background: #FDFDFD;
+   border: 1px solid rgba(0,0,0,0.125);
+   border-radius: 0.375rem;
    overflow: hidden;
-  border-radius: 8px;
    height: 100%;
    display: flex;
@@ Line 353: / Line 362: @@
 .crw-card-img{
-   height: 120px;
+   height: 140px;
-   background: rgba(0,64,128,0.06);
+   background: rgba(0,0,0,0.03);
    overflow: hidden;
 }
@@ Line 371: / Line 380: @@
 .crw-card-body{
-   padding: 0.7em 0.8em;
+   padding: 1rem;
    flex: 1;
    display: flex;
@@ Line 378: / Line 387: @@
 .crw-card-title{
-   font-weight: 800;
+   font-weight: 700;
-   line-height: 1.15;
+   line-height: 1.2;
+  margin: 0;
 }
 .crw-card-title a{
-   color: #004080;
+   color: #0d6efd;
    text-decoration: none;
 }
@@ Line 393: / Line 403: @@
 .crw-card-desc{
-   margin-top: 0.35em;
+   margin-top: 0.5rem;
    font-size: 0.95em;
-   line-height: 1.25;
+   line-height: 1.35;
-   color: var(--color-base, #202122);
+   color: #212529;
 }
 .crw-card-desc:empty{
    display: none;
+}
+.crw-card:hover{
+  border-color: rgba(0,0,0,0.2);
 }
@@ Line 407: / Line 421: @@
    html.skin-theme-clientpref-night .crw-card{
      background: #121c32;
-     border-color: #004080;
+     border-color: rgba(255,255,255,0.18);
+  }
+  html.skin-theme-clientpref-night .crw-card-img{
+    background: rgba(255,255,255,0.06);
    }
    html.skin-theme-clientpref-night .crw-card-title a{
-     color: #b9dcff;
+     color: #8ab4f8;
    }
    html.skin-theme-clientpref-night .crw-card-desc{
      color: #e5e7eb;
    }
-   html.skin-theme-clientpref-night .crw-card-img{
+   html.skin-theme-clientpref-night .crw-card:hover{
-     background: rgba(0,64,128,0.14);
+     border-color: rgba(255,255,255,0.28);
    }
 }
@@ Line 423: / Line 440: @@
    html.skin-theme-clientpref-os .crw-card{
      background: #121c32;
-     border-color: #004080;
+     border-color: rgba(255,255,255,0.18);
+  }
+  html.skin-theme-clientpref-os .crw-card-img{
+    background: rgba(255,255,255,0.06);
    }
    html.skin-theme-clientpref-os .crw-card-title a{
-     color: #b9dcff;
+     color: #8ab4f8;
    }
    html.skin-theme-clientpref-os .crw-card-desc{
      color: #e5e7eb;
    }
-   html.skin-theme-clientpref-os .crw-card-img{
+   html.skin-theme-clientpref-os .crw-card:hover{
-     background: rgba(0,64,128,0.14);
+     border-color: rgba(255,255,255,0.28);
    }
 }
-.crw-card-grid{
-  display: grid !important;
-  grid-template-columns: repeat(6, minmax(0, 1fr));
-  gap: 12px;
-  justify-items: stretch;
-  align-items: stretch;
-  margin: 0;
-  padding: 0;
-}
-.crw-card-grid > p{
-  margin: 0;
-  display: contents;
-}
-/* responsive */
-@media (max-width: 1400px){ .crw-card-grid{ grid-template-columns: repeat(5, minmax(0, 1fr)); } }
-@media (max-width: 1200px){ .crw-card-grid{ grid-template-columns: repeat(4, minmax(0, 1fr)); } }
-@media (max-width: 960px){  .crw-card-grid{ grid-template-columns: repeat(3, minmax(0, 1fr)); } }
-@media (max-width: 720px){  .crw-card-grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); } }
-@media (max-width: 480px){  .crw-card-grid{ grid-template-columns: 1fr; } }