浏览代码

Change style and structure for <main>

Visman 2 年之前
父节点
当前提交
9aafe533f8

+ 2 - 2
app/templates/forum.forkbb.php

@@ -203,10 +203,10 @@
     </div>
 @endif
 @if ($p->enableMod && $form = $p->formMod)
-    <section id="fork-mod" class="f-moderate">
+    <aside id="fork-mod" class="f-moderate">
       <h2>{!! __('Moderate') !!}</h2>
       <div class="f-fdivm">
     @include ('layouts/form')
       </div>
-    </section>
+    </aside>
 @endif

+ 1 - 1
app/templates/layouts/crumbs.forkbb.php

@@ -1,5 +1,5 @@
 @section ('crumbs')
-      <nav>
+      <nav class="f-nav-crumbs">
         <ol class="f-crumbs" itemscope itemtype="https://schema.org/BreadcrumbList">
     @foreach ($p->crumbs as $cur)
         @if (\is_object($cur[0]))

+ 1 - 1
app/templates/layouts/install.forkbb.php

@@ -18,7 +18,7 @@
       <h1 id="id-fhth1"><span id="id-fhtha">{!! __('ForkBB Installation') !!}</span></h1>
       <p id="id-fhtdesc">{!! __('Welcome') !!}</p>
     </header>
-    <main>
+    <main id="fork-main">
 @if ($iswev = $p->fIswev)
     @include ('layouts/iswev')
 @endif

+ 1 - 1
app/templates/layouts/main.forkbb.php

@@ -20,7 +20,7 @@
       <p id="id-fhtdesc">{!! $p->fDescription !!}</p>
 @endif
     </header>
-    <main>
+    <main id="fork-main">
 @if ($p->fAnnounce)
     <aside id="fork-announce">
       <p class="f-sim-header">{!! __('Announcement') !!}</p>

+ 3 - 3
app/templates/layouts/redirect.forkbb.php

@@ -15,12 +15,12 @@
 </head>
 <body>
   <div id="fork">
-    <main>
-      <section id="fork-rdrct" class="f-main">
+    <main id="fork-main">
+      <aside id="fork-rdrct" class="f-main">
         <h2 id="id-rdrct-h2">{!! __('Redirecting') !!}</h2>
         <p class="f-rdrct-p">{!! __($p->message) !!} {!! __('Redirecting...') !!}</p>
         <p class="f-rdrct-p"><a href="{{ $p->link }}">{!! __('Click redirect') !!}</a></p>
-      </section>
+      </aside>
     </main>
     <footer id="fork-footer">
 <!-- debuginfo -->

+ 2 - 2
app/templates/topic.forkbb.php

@@ -178,12 +178,12 @@
 @yield ('crumbs')
     </div>
 @if ($p->enableMod && $form = $p->formMod)
-    <section id="fork-mod" class="f-moderate">
+    <aside id="fork-mod" class="f-moderate">
       <h2>{!! __('Moderate') !!}</h2>
       <div class="f-fdivm">
     @include ('layouts/form')
       </div>
-    </section>
+    </aside>
 @endif
 @if ($p->online)
     @include ('layouts/stats')

+ 38 - 45
public/style/ForkBB/style.css

@@ -144,12 +144,6 @@ body,
   }
 }
 
-#fork main {
-  order: 2;
-  /*display: flex;
-  flex-direction: column;*/
-}
-
 #fork b,
 #fork strong {
   font-weight: bold;
@@ -245,7 +239,6 @@ body,
 
 #fork .f-mheader {
   padding: 0.625rem;
-  margin-top: 0.625rem;
   border: 0.0625rem solid #814A00;
   background-color: #E0C8B3; /*#DABCA0; #D3B58D;*/
 }
@@ -624,7 +617,6 @@ body,
 @media screen and (min-width: 50rem) {
   #fork #id-fhth1 {
     width: 100%;
-    /* padding: 0.625rem; */
     overflow: auto;
     white-space: normal;
   }
@@ -633,10 +625,6 @@ body,
 /*********/
 /* iswev */
 /*********/
-#fork main > .f-iswev-wrap {
-  margin: 1rem 0;
-}
-
 #fork .f-iswev {
   border: 0.0625rem solid;
   padding: 0.625rem;
@@ -910,13 +898,12 @@ body,
 /******************/
 /* Хлебные крошки */
 /******************/
-#fork .f-nav-links {
-  margin: 1rem 0;
+#fork .f-nav-crumbs {
+  padding: 0 0.625rem;
 }
 
 #fork .f-crumbs {
-  padding: 0 0.625rem;
-  /*overflow: hidden;*/
+  overflow: hidden;
 }
 
 #fork .f-crumb {
@@ -929,14 +916,6 @@ body,
   content: " /";
 }
 
-/*#fork .f-crumb-a:not(.active) {
-  border-bottom: 0.0625rem solid;
-}*/
-
-/*#fork .f-crumb-a.active {
-  font-weight: bold;
-}*/
-
 #fork .f-subscribed > .f-crumb-a::after {
   display: inline;
   font: 400 0.875rem "fa";
@@ -1009,10 +988,9 @@ body,
 }
 
 @media screen and (max-width: 49.9999rem) {
-  .f-nav-links > nav {
+  #fork .f-crumbs {
     white-space: nowrap;
     overflow-x: auto;
-    width: 100%;
   }
 }
 
@@ -1027,8 +1005,22 @@ body,
 /********/
 /* Тело */
 /********/
+#fork #fork-main {
+  order: 2;
+  display: flex;
+  flex-direction: column;
+  gap: 1rem;
+}
+
+#fork-main > :first-child:not(#fork-announce) {
+  margin-top: 1rem;
+}
+
+#fork-main > :last-child:not(aside) {
+  margin-bottom: 1rem;
+}
+
 #fork .f-main {
-  margin: 1rem 0;
   position: relative;
 }
 
@@ -1082,6 +1074,10 @@ body,
   padding: 0.3125rem 0;
 }
 
+#fork #fork-stats:not(:last-child) {
+  margin-bottom: -1rem;
+}
+
 #fork-stats .f-stats-dt {
   display: none;
 }
@@ -1135,7 +1131,7 @@ body,
 /* Логин/Регистрация */
 /*********************/
 #fork .f-lrdiv {
-  margin: 1rem auto;
+  margin: 0 auto;
   max-width: 20rem;
   border-radius: 0.1875rem;
 }
@@ -1163,7 +1159,7 @@ body,
   background-color: #F8F4E3;
 }
 
-#fork .f-ftlist .f-category {
+#fork .f-category + .f-category {
   margin-top: 0.625rem;
 }
 
@@ -1345,10 +1341,6 @@ body,
 /********************/
 /* Страница раздела */
 /********************/
-#fork #fork-subforums {
-  margin: 1rem 0;
-}
-
 #fork-subforums .f-ftch2 {
   display: none;
 }
@@ -1445,7 +1437,6 @@ body,
   border-top: 0.0625rem solid #AA7939;
   border-bottom: 0.0625rem solid #AA7939;
   position: relative;
-  /* background-color: #FFFFFF; */
 }
 
 #fork .f-post + .f-post {
@@ -1921,14 +1912,13 @@ body,
 /****************/
 #fork .f-preview {
   border-top: 0.0625rem solid #AA7939;
-  margin-bottom: 1rem;
 }
 
 #fork .f-preview > h2 {
   display: block;
   font-size: 1rem;
   line-height: 1.5;
-  padding: 1rem 0.625rem 0.3125rem;
+  padding: 0.625rem 0.3125rem;
 }
 
 #fork .f-preview .f-post-body {
@@ -1940,11 +1930,9 @@ body,
 /*****************************/
 #fork .f-post-form {
   border-top: 0.0625rem solid #AA7939;
-  margin-bottom: 1rem;
 }
 
 #fork #fork-view-posts {
-  margin-bottom: 1rem;
   margin-top: -1rem;
 }
 
@@ -1952,7 +1940,7 @@ body,
 #fork #fork-view-posts > h2 {
   display: block;
   font-size: 1rem;
-  padding: 1rem 0.625rem 0.3125rem;
+  padding: 0.625rem 0.3125rem;
 }
 
 #fork .f-post-form > .f-fdiv {
@@ -2205,6 +2193,10 @@ body,
   position: relative;
 }
 
+#fork #fork-mod:not(:last-child) {
+  margin-bottom: -1rem;
+}
+
 #fork-mod .f-fdivm {
   padding: 0.3125rem;
 }
@@ -2635,6 +2627,12 @@ body,
 /***********************/
 /* Приватные сообщения */
 /***********************/
+#fork #forkpm {
+  display: flex;
+  flex-direction: column;
+  gap: 1rem;
+}
+
 #fork .f-mi-pmoff {
   opacity: 0.4;
 }
@@ -2782,7 +2780,7 @@ body,
     border-bottom-width: 0.125rem;
   }
 
-  #fork.f-with-nav main {
+  #fork.f-with-nav #fork-main {
     order: 1;
     width: calc(100% - 17rem);
   }
@@ -2800,11 +2798,6 @@ body,
     width: 100%;
   }
 
-  /* #fork.f-with-nav #fork-debug {
-    order: 4;
-    width: 100%;
-  } */
-
   #fork.f-with-nav #fork-navdir {
     position: sticky;
     top: 0;