WIP

lang/en/local_amos.php

@@ -441,9 +441,9 @@
 $string['stashsubmitsubject'] = 'Subject';
 $string['stashtitle'] = 'Stash title';
 $string['stashtitledefault'] = 'Work in progress - {$a->time}';
-$string['stringhistory'] = 'History';
+$string['stringhistory'] = 'history';
 $string['strings'] = 'Strings';
-$string['stringversionnotlatest'] = 'There exists a more recent version of the string!';
+$string['stringversionnotlatest'] = 'more recent version exists';
 $string['submitting'] = 'Submitting a contribution';
 $string['submitting_help'] = 'This will send translated strings to official language maintainers. They will be able to apply your work into their stage, review it and eventually commit. Please provide a message for them describing your work and why you would like to see your contribution included.';
 $string['targetversion'] = 'Target version';

renderer.php

@@ -36,7 +36,7 @@ class local_amos_renderer extends plugin_renderer_base {
      * @param local_amos_translator $translator
      * @return string
      */
-    protected function render_local_amos_translator(local_amos_translator $translator) {
+    protected function render_local_amos_translator2(local_amos_translator $translator) {
         global $PAGE;
 
         $listlanguages = mlang_tools::list_languages();

scss/filter.scss

@@ -1,16 +1,13 @@
 // Strings filter at the translator page.
+#page-local-amos-view #amosfilter {
 
-#page-local-amos-view #region-main {
-    overflow-x: auto;
-}
-
-.path-local-amos {
-
+    // Default help texts are designed to be shown below the field. We display them below labels - fix the spacing.
     label + .form-text {
         margin-top: 0;
         margin-bottom: 0.25rem;
     }
 
+    // Once a component is selected, highlight it in bold.
     #amosfilter_fcmp input[type=checkbox]:checked + label {
         font-weight: bold;
     }

scss/styles.scss

@@ -1,13 +1,21 @@
 @import "variables.scss";
 @import "sitefrontpage.scss";
 @import "filter.scss";
-@import "strings.scss";
+@import "translator";
 @import "stage.scss";
 @import "index.scss";
 @import "comment.scss";
 
+#page-local-amos-view {
+    // Avoid content overlap with side blocks.
+    #region-main {
+        overflow-x: auto;
+    }
 
-// Styles used within the AMOS tool itself
+    h2 {
+        text-align: center;
+    }
+}
 
 .path-local-amos {
 
@@ -20,7 +28,7 @@
         }
     }
 
-    #amostranslator {
+    #amostranslatorold {
 
         .string-text {
             textarea.translation-edit {
@@ -93,45 +101,6 @@
     background-color: $amos-color-staged;
 }
 
-.path-local-amos #amostranslator .stringinfo .metainfo {
-    color: #999;
-    font-size: small;
-}
-
-.path-local-amos #amostranslator .placeholderinfo,
-.path-local-amos #amostranslator .greylistedinfo {
-    display: inline-block;
-    vertical-align: middle;
-}
-
-#page-local-amos-index h1.main,
-#page-local-amos-index h2.main {
-    text-align: left;
-}
-
-#page-local-amos-credits .thanks {
-    text-align:center;
-}
-
-#page-local-amos-credits .quicklinks {
-    text-align: center;
-    margin: 1em auto 2em;
-    padding: 10px;
-    border: 1px solid #eee;
-    background-color: #f9f9f9;
-}
-
-#page-local-amos-credits .quicklinks a.current {
-    font-weight: bold;
-}
-
-#page-local-amos-credits .language {
-    border: 1px solid #eee;
-    background-color: #f9f9f9;
-    margin: 0em 2em 3em;
-    padding: 0.5em;
-}
-
 #page-local-amos-credits .langname {
     position: relative;
     left: -1em;
@@ -185,40 +154,6 @@
     padding: 0.5em;
 }
 
-.path-local-amos .pagination {
-    margin-left: auto;
-    margin-right: auto;
-    padding: 1em;
-    text-align: center;
-    font-size: 120%;
-}
-
-.path-local-amos .pagination span {
-    margin-left: 0.5em;
-    margin-right: 0.5em;
-}
-
-.path-local-amos .pagination .current {
-    font-weight: bold;
-}
-
-.path-local-amos .googlebranding {
-    text-align: center;
-}
-
-.path-local-amos .singlebutton.showclosed {
-    text-align: center;
-    margin: 20px auto;
-}
-
-.path-local-amos .stashwrapper {
-    margin: 0px 0px 1em 0px;
-}
-
-.path-local-amos .stashwrapper {
-    background-color: white;
-}
-
 .path-local-amos .stashwrapper.mousein {
     background-color: #f7f7f7;
 }
@@ -228,30 +163,12 @@
     margin: 10px;
 }
 
-.path-local-amos .stash h3 {
-    margin: 0px 0px 0px 40px;
-}
-
-.path-local-amos .stash div {
-    margin-left: 40px;
-}
-
 .path-local-amos .stash img.userpicture {
     position: absolute;
     top: 5px;
     left: 0px;
 }
 
-.path-local-amos .stash .strings span,
-.path-local-amos .stash .languages span,
-.path-local-amos .stash .components span {
-    font-style: italic;
-}
-
-.path-local-amos .stashwrapper .actions {
-    margin: 10px 0px 0px 40px;
-}
-
 .path-local-amos .stashwrapper .actions .singlebutton,
 .path-local-amos .stashwrapper .actions .singlebutton form,
 .path-local-amos .stashwrapper .actions .singlebutton form div {

scss/translator.scss

@@ -0,0 +1,20 @@
+// Strings translator.
+#page-local-amos-view #amostranslator {
+
+    // Undo right margin on help icons.
+    .amosinfo .icon {
+        margin-right: 0;
+    }
+
+    .amosinfo {
+        margin-bottom: 0.25rem;
+    }
+
+    .amosoriginal, .amostranslation {
+        flex: 1 1 auto;
+        min-height: 3rem;
+        border: 1px solid rgb(204,204,204);
+        border-radius: 4px;
+        padding: 5px;
+    }
+}