Web improvements

royalnet/web/royalprints/login/templates/login_index.html

@@ -30,7 +30,7 @@
 }
 
 session["login_date"] = [la data e l'ora di adesso]</code></pre>
-                <form action="{{ url_for("login.login_done") }}" method="post" class="login-form fullsize">
+                <form action="{{ url_for("login.login_done") }}" method="post" class="login-form full">
                     <label for="login-username">
                         <span class="label-text">Username</span>
                         <input id="login-username" type="text" name="username">

royalnet/web/royalprints/newaccount/templates/newaccount_index.html

@@ -13,7 +13,7 @@
                 </span>
             </div>
             <div class="dbox-bot">
-                <form method="post" class="newaccount-form fullsize">
+                <form method="post" class="newaccount-form full">
                     <label for="newaccount-username">
                         <span class="label-text">Username</span>
                         <input id="newaccount-username" type="text" name="username">

royalnet/web/royalprints/profile/templates/profile_page.html

@@ -9,6 +9,8 @@
         <h1>
             {{ royal.username }}
         </h1>
+        <div class="columns-3">
+            <div class="column">
                 <div class="dbox profile-links">
                     <div class="dbox-top">
                         <span class="left">Account collegati</span>
@@ -33,6 +35,8 @@
                         </ul>
                     </div>
                 </div>
+            </div>
+            <div class="column">
                 <div class="dbox profile-stats">
                     <div class="dbox-top">
                         <span class="left">Statistiche</span>
@@ -50,6 +54,8 @@
                         </ul>
                     </div>
                 </div>
+            </div>
+            <div class="column">
                 <div class="dbox profile-aliases">
                     <div class="dbox-top">
                         <span class="left">Alias</span>
@@ -63,4 +69,12 @@
                     </div>
                 </div>
             </div>
+        </div>
+        <h2>
+            Medals
+        </h2>
+        <p>
+            TODO
+        </p>
+    </div>
 {% endblock %}

royalnet/web/royalprints/wikiedit/templates/wikiedit_page.html

@@ -17,7 +17,7 @@
             </span>
         </div>
         <div class="dbox-bot">
-            <form method="POST" class="wikiedit-form fullsize">
+            <form method="POST" class="wikiedit-form full">
                 <label for="wikiedit-title" class="label-big">
                     <span class="label-text">Titolo</span>
                     <input id="wikiedit-title" type="text" name="title" value="{{ page.title }}">

royalnet/web/static/ryg.css

@@ -314,22 +314,22 @@ table tbody tr:last-child td:first-child {
 table tbody tr:last-child td:last-child {
   border-radius: 0 0 4px 0;
 }
-form.fullsize label {
+form.full label {
   margin-top: 4px;
   margin-bottom: 4px;
   display: flex;
 }
-form.fullsize label .label-text {
+form.full label .label-text {
   margin-right: 12px;
   min-width: 60px;
 }
-form.fullsize label input {
+form.full label input {
   flex-grow: 1;
 }
-form.fullsize label.label-big {
+form.full label.label-big {
   font-size: x-large;
 }
-form.fullsize label.label-big * {
+form.full label.label-big * {
   font-size: x-large;
 }
 *[disabled=""],
@@ -398,17 +398,31 @@ form.fullsize label.label-big * {
   background-color: rgba(160, 204, 255, 0.2);
   color: #ffffff !important;
 }
-.horizontal-container {
+.horizontal-container-main {
   display: flex;
   justify-content: center;
   align-content: center;
   flex-direction: row;
 }
-@media (max-width: 799px) {
+@media (max-width: 1199px) {
-  .horizontal-container {
+  .horizontal-container-main {
     flex-direction: column;
   }
 }
+.columns-3 {
+  display: flex;
+  justify-content: center;
+  align-content: center;
+  flex-direction: row;
+}
+.columns-3 .column {
+  width: 33.3%;
+}
+.fill {
+  width: 100%;
+  height: 100%;
+  margin: 0 !important;
+}
 .vertical-main {
   width: 100%;
 }

royalnet/web/static/ryg.less

@@ -387,7 +387,7 @@ table {
     }
 }
 
-form.fullsize {
+form.full {
 
     label {
         margin-top: 4px;
@@ -492,18 +492,37 @@ form.fullsize {
 }
 
 //Horizontal container, should contain elements such as main and sidebar
-.horizontal-container {
+.horizontal-container-main {
     display: flex;
     justify-content: center;
     align-content: center;
     flex-direction: row;
 
-    @media (max-width: 799px)
+    @media (max-width: 1199px)
     {
         flex-direction: column;
     }
 }
 
+//Tripart horizontal container
+.columns-3 {
+    display: flex;
+    justify-content: center;
+    align-content: center;
+    flex-direction: row;
+    
+    .column {
+        width: 33.3%;
+    }
+}
+
+//Fill the whole parent element and ignore margins
+.fill {
+    width: 100%;
+    height: 100%;
+    margin: 0 !important;
+}
+
 //Vertical main page container
 .vertical-main {
     width: 100%;

royalnet/web/static/tf2.css

@@ -228,14 +228,14 @@ nav .nav-sitename {
 nav .nav-login-unavailable {
   opacity: 0.25;
 }
-.horizontal-container {
+.horizontal-container-main {
   display: flex;
   justify-content: center;
   align-content: center;
   flex-direction: column;
 }
 @media (min-width: 800px) {
-  .horizontal-container {
+  .horizontal-container-main {
     flex-direction: row;
   }
 }

royalnet/web/static/tf2.less

@@ -275,7 +275,7 @@ nav {
 
 //Elements
 
-.horizontal-container {
+.horizontal-container-main {
     display: flex;
     justify-content: center;
     align-content: center;

royalnet/web/templates/base.html

@@ -55,7 +55,7 @@
             </span>
         </div>
     </nav>
-    <div class="horizontal-container">
+    <div class="horizontal-container-main">
         <div class="vertical-main">
             {% block content %}{% endblock %}
         </div>