[COMPONENTS][RightPanel] Added 'Additional options' details on posting form

[CSS] Trimming down wasted space and vendor related prefixes

[TWIG][Templates] Added main navigation to navigation card, removed note car language short display

public/assets/default_theme/css/widgets/buttons.css

@@ -10,26 +10,21 @@ input[type=radio] {
     height: 1rem !important;
     background: var(--accent) !important;
 }
-
 input[type=checkbox]:not(:hover, :focus),
 input[type=radio]:not(:hover, :focus) {
     background: var(--foreground) !important;
 }
-
 input[type=checkbox],
 input[type=radio] {
     border: unset !important;
 }
-
 input[type=radio] {
     background: var(--background-hard) !important;
 }
-
 input[type=radio] {
     border-radius: 50% !important;
     margin: 3px 3px 0 5px !important;
 }
-
 input[type=file] {
     all: unset;
     display: block;
@@ -39,30 +34,22 @@ input[type=file] {
     border-radius: var(--smaller);
     background: var(--gradient) !important;
 }
-
 input[type=radio] {
     border: solid 0.25em !important;
 }
-
 input[type=checkbox] {
     background-size: 100%;
     margin-right: 2px;
-    -webkit-mask-image: url("../../icons/check-off.svg") !important;
     -o-mask-image: url("../../icons/check-off.svg") !important;
     -moz-mask-image: url("../../icons/check-off.svg") !important;
     mask-image: url("../../icons/check-off.svg") !important;
 }
-
 input[type=checkbox]:checked {
-    -webkit-mask-image: url("../../icons/check-on.svg") !important;
     -o-mask-image: url("../../icons/check-on.svg") !important;
     -moz-mask-image: url("../../icons/check-on.svg") !important;
     mask-image: url("../../icons/check-on.svg") !important;
 }
-
 input[type=color] {
-    -webkit-appearance: none;
-    -moz-appearance: none;
     appearance: none;
     width: var(--big);
     height: var(--big);
@@ -78,18 +65,6 @@ input[type=color]::-moz-color-swatch {
     border-radius: var(--smaller);
     border: none;
 }
-
-::-webkit-file-upload-button {
-    cursor: pointer;
-    background-color: unset;
-    border: unset;
-    font-family: 'Open Sans',sans-serif !important;
-    font-weight: bold !important;
-    color: var(--foreground);
-    fill: var(--foreground);
-    margin: 3px;
-}
-
 ::file-selector-button {
     cursor: pointer;
     background-color: unset;
@@ -100,29 +75,24 @@ input[type=color]::-moz-color-swatch {
     fill: var(--foreground);
     margin: 3px;
 }
-
 *|*::-moz-button-content {
     all: unset !important;
 }
-
 button {
     display: block !important;
     cursor: pointer !important;
     margin-left: auto !important;
     margin-top: var(--smaller);
 }
-
 button,
 label {
     font-family: 'Poppins',sans-serif;
     font-weight: bold !important;
     color: currentColor;
 }
-
 select::-ms-expand {
     display: none;
 }
-
 button,
 input,
 select,
@@ -139,18 +109,15 @@ textarea {
     width: inherit;
     max-width: border-box !important;
 }
-
 button,
 select,
 textarea {
     background: var(--gradient) !important;
 }
-
 button,
 input:not([type=checkbox], [type=radio]) {
     background: var(--gradient) !important;
 }
-
 select {
     -webkit-appearance: none !important;
     -moz-appearance: none !important;
@@ -159,12 +126,10 @@ select {
     border-radius: var(--smaller);
     max-width: 100% !important;
 }
-
 select[multiple] {
     overflow-y: scroll;
     height: 20rem;
 }
-
 button:focus,
 button:hover,
 input:focus,

public/assets/default_theme/css/widgets/sections.css

@@ -7,41 +7,31 @@
     border-radius: var(--smaller);
     padding: var(--smaller);
     background: var(--gradient) !important;
-    -webkit-box-shadow: var(--shadow);
-    -moz-box-shadow: var(--shadow);
     box-shadow: var(--shadow);
 }
-
 .profile *[class*="profile-info-"] {
     flex: 1;
 }
-
 .profile-info {
     display: flex;
     flex-wrap: wrap;
     flex-direction: column;
 }
-
 .profile-info-nickname {
     font-size: var(--small);
 }
-
 .profile-info-tags {
     margin: unset;
 }
-
 .profile-info-stats strong {
     margin-right: 5px;
 }
-
 .profile-info-stats {
     margin-top: var(--smaller);
 }
-
 .profile-info-bio {
     word-break: break-all;
 }
-
 .profile-avatar {
     max-width: 4rem;
     max-height: 4rem;
@@ -51,7 +41,6 @@
     margin-right: 5px;
     border-radius: 2px;
 }
-
 .section-widget {
     display: flex;
     flex-direction: column;
@@ -61,27 +50,22 @@
     box-shadow: var(--shadow);
     border: 2px solid var(--border) !important;
 }
-
 .section-widget hr {
     margin-bottom: var(--smaller);
 }
-
 .section-widget-padded {
     padding: var(--smaller);
 }
-
 .section-widget-paging {
     display: block;
     margin-top: var(--smaller);
     margin-left: auto;
 }
-
 .section-title {
     font-size: var(--small);
     font-weight: 700;
     margin: 0;
 }
-
 .section-widget-button-like {
     border-radius: var(--smaller);
     padding: 6px 10px;
@@ -92,30 +76,42 @@
     font-family: 'Open Sans',sans-serif;
     font-weight: 700;
 }
-
+.section-widget-subtitle-details :not(summary,svg) {
+    border-radius: var(--smaller);
+    background: var(--gradient);
+    padding: 6px 10px;
+}
 .section-widget-title-details summary {
     font-size: var(--small);
     font-weight: 700;
+}
+.section-widget-subtitle-details summary {
+    border: 2px solid var(--border);
+    font-size: var(--default);
+    font-weight: 700;
+    margin-bottom: var(--smaller);
+}
+.section-widget-title-details summary,
+.section-widget-subtitle-details summary {
     border-radius: var(--smaller);
     padding: 6px 10px;
     background: var(--gradient) !important;
 }
-
+.section-widget-subtitle-details[open] svg,
 .section-widget-title-details[open] svg {
     transform: rotate(180deg);
     animation: fadeOut 200ms cubic-bezier(0,0.55,0.45,1);
 }
-
+.section-widget-subtitle-details:not([open]) svg,
 .section-widget-title-details:not([open]) svg {
     transform: initial;
     animation: fadeIn 200ms cubic-bezier(0,0.55,0.45,1);
 }
-
+.section-subtitle-summary,
 .section-title-summary {
     display: flex;
     justify-content: space-between;
 }
-
 .section-form {
     display: flex;
     flex-direction: column;
@@ -123,30 +119,25 @@
     width: 100%;
     padding: var(--smaller);
 }
-
 .section-form-legend {
     margin-top: unset;
     margin-bottom: 10px;
     font-weight: bold;
     font-size: var(--medium);
 }
-
 div[class^="mb-"] {
     display: flex;
     flex-direction: column;
     flex-basis: border-box;
     margin-bottom: var(--smaller);
 }
-
 div[class^="mb-"]:last-of-type {
     margin-bottom: unset;
 }
-
 div[class^="mb-"] textarea {
     height: 7rem;
     max-height: 100%;
 }
-
 .alert,
 .alert-danger {
     display: inline-block;