Merge pull request #3703 from finnishtransportagency/HARJA-914-saavut…

…ettavuus-nappaimisto-tuki Harja 914 saavutettavuus nappaimisto tuki
finnishtransportagency · Nov 20, 2024 · 58943dd · 58943dd
2 parents 2bc3bbd + 880aab8
commit 58943dd
Show file tree

Hide file tree

Showing 9 changed files with 46 additions and 19 deletions.
diff --git a/dev-resources/less/grid.less b/dev-resources/less/grid.less
@@ -316,6 +316,9 @@
       margin-left: 2px;
     }
   }
+  td.toiminnot span.rivilla-virheita {
+    margin-right: -6px;
+  }
 
   td.rivinumero {
     text-align: center;

diff --git a/dev-resources/less/napit.less b/dev-resources/less/napit.less
@@ -200,6 +200,19 @@
     &.tumma {
         color: @blue-dark;
     }
+  &.pelkka-ikoni {
+    color: @black-default;
+    padding: 0px;
+    outline: none;
+    border-style: none;
+    background-color: transparent;
+    border-color: transparent;
+    padding-top: 3px;
+    height: 24px;
+  }
+  &.pelkka-ikoni:focus {
+     border: 1px solid @blue-default;
+   }
 }
 
 .nappi-korkeus-36 {

diff --git a/resources/public/laadunseuranta/cards.html b/resources/public/laadunseuranta/cards.html
@@ -2,7 +2,7 @@
 <html>
 	<head>
 		<meta charset="UTF-8">
-		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">    
+		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=on">
 		<link href="css/style.css" rel="stylesheet" type="text/css">
 		<script type="text/javascript" src="js/proj4.js"></script>
 		<script type="text/javascript">

diff --git a/src/clj/harja/palvelin/index.clj b/src/clj/harja/palvelin/index.clj
@@ -46,7 +46,7 @@
       [:meta {:http-equiv "X-UA-Compatible" :content "IE=edge,chrome=1"}]
       ;; Edge yrittää muuttaa isot numerot puhelinnumerolinkeiksi. Ei haluta sitä käytöstä.
       [:meta {:name "format-detection" :content "telephone=no"}]
-      [:meta {:name "viewport" :content "width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"}]
+      [:meta {:name "viewport" :content "width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=5"}]
       [:meta {:name "apple-mobile-web-app-capable" :content "yes"}]
       [:meta {:name "mobile-web-app-capable" :content "yes"}]
       [:meta {:charset "utf-8"}]
@@ -87,7 +87,7 @@
        [:head
         [:title "HARJA Mobiili laadunseuranta"]
         [:meta {:charset "utf-8"}]
-        [:meta {:name "viewport" :content "width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"}]
+        [:meta {:name "viewport" :content "width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=5"}]
         [:meta {:name "apple-mobile-web-app-capable" :content "yes"}]
         [:meta {:name "mobile-web-app-capable" :content "yes"}]
         [:link {:href "//fonts.googleapis.com/css?family=Open+Sans:400,700" :rel "stylesheet" :type "text/css"}]

diff --git a/src/cljs/harja/ui/grid/muokkaus.cljs b/src/cljs/harja/ui/grid/muokkaus.cljs
@@ -353,15 +353,19 @@
           (or (toimintonappi-fn rivi (partial muokkaa! muokatut-atom virheet varoitukset huomautukset skeema id) id)
               (when (and (not= false voi-muokata?)
                          (or (nil? voi-poistaa?) (voi-poistaa? rivi)))
-                [:span.klikattava {:on-click
-                                   #(do (.preventDefault %)
-                                        (muokkaa! muokatut-atom
-                                                  virheet varoitukset huomautukset skeema
-                                                  id assoc
-                                                  :poistettu true))}
-                 (ikonit/livicon-trash)]))
+                [napit/poista
+                 ""
+                 #(do (.preventDefault %)
+                    (muokkaa! muokatut-atom
+                      virheet varoitukset huomautukset skeema
+                      id assoc
+                      :poistettu true))
+                 {:teksti-nappi? false
+                  :vayla-tyyli? true
+                  :tooltip "Poista rivi"
+                  :luokka "napiton-nappi pelkka-ikoni"}]))
           (when (and nayta-virheikoni? (seq rivin-virheet))
-            [:span.rivilla-virheita
+            [:span.rivilla-virheita {:role "alert" :aria-label "Rivillä virheitä."}
              (ikonit/livicon-warning-sign)])]))]))
 
 (defn- kasketty-jarjestys [{:keys [virheet-ylos-fn jarjesta-kun-kasketaan muokatut muokatut-atom]}]

diff --git a/src/cljs/harja/ui/grid/perus.cljs b/src/cljs/harja/ui/grid/perus.cljs
@@ -152,11 +152,15 @@
       (when (or (nil? voi-poistaa?) (voi-poistaa? rivi))
         (if (and esta-poistaminen? (esta-poistaminen? rivi))
           [:span (ui-ikonit/livicon-trash-disabled (esta-poistaminen-tooltip rivi))]
-          [:span.klikattava {:on-click #(do (.preventDefault %)
-                                            (muokkaa! id assoc :poistettu true))}
-           (ui-ikonit/livicon-trash)]))
+          [napit/poista ""
+           #(do (.preventDefault %)
+              (muokkaa! id assoc :poistettu true))
+           {:teksti-nappi? false
+            :vayla-tyyli? true
+            :tooltip "Poista rivi"
+            :luokka "napiton-nappi pelkka-ikoni"}]))
       (when-not (empty? rivin-virheet)
-        [:span.rivilla-virheita
+        [:span.rivilla-virheita {:role "alert" :aria-label "Rivillä virheitä."}
          (ui-ikonit/livicon-warning-sign)])])])
 
 (defn- rivin-infolaatikko* [sisalto rivi data]
@@ -524,6 +528,7 @@
                (if-not sarake-sort
                  [:div otsikko]
                  [:div.ilmoitukset-sort
+                  ;;TODO: Muuta span.klikattava buttoniksi jossakin vaiheessa.
                   [:span.klikattava {:on-click (:fn sarake-sort)}
                    otsikko " " (sort-ikoni (:suunta sarake-sort)) " "]]))]) skeema)
         (when (or nayta-toimintosarake?

diff --git a/src/cljs/harja/ui/napit.cljs b/src/cljs/harja/ui/napit.cljs
@@ -400,13 +400,15 @@
   ([teksti toiminto {:keys [luokka vayla-tyyli? teksti-nappi?] :as optiot}]
    [nappi teksti toiminto (merge
                             optiot
-                            {:luokka (str (cond
+                            {:aria-label "Poista"
+                             :tooltip (or (:tooltip optiot) "Poista rivi")
+                             :luokka (str (cond
                                             (and
                                               vayla-tyyli?
                                               teksti-nappi?) "button-negative-text"
                                             vayla-tyyli? "button-negative-default"
                                             :else "nappi-kielteinen") " " luokka)
-                             :ikoni  (ikonit/livicon-trash)})]))
+                             :ikoni (ikonit/livicon-trash)})]))
 
 (defn tarkasta
   ([teksti toiminto] (tarkasta teksti toiminto {}))

diff --git a/src/cljs/harja/views/urakka/kulut/yhteiset.cljs b/src/cljs/harja/views/urakka/kulut/yhteiset.cljs
@@ -212,7 +212,7 @@
                             [napit/poista ""
                              #(do
                                 (poista-oikaisu-fn rivi id))
-                             {:luokka "napiton-nappi"}]))
+                             {:luokka "napiton-nappi pelkka-ikoni"}]))
       :voi-lisata? false ;; Piilotetaan default lisää rivi -nappi. Se on korvattu custom-toiminnolla
       :validoi-uusi-rivi? false
       :on-rivi-blur (fn [oikaisu i]

diff --git a/test/cljs/harja/views/urakka/yleiset_test.cljs b/test/cljs/harja/views/urakka/yleiset_test.cljs
@@ -66,6 +66,6 @@
       (u/click :button.nappi-ensisijainen)
       --
       "Muokkaustoimintojen nappien määrä kun toiminnot avattu"
-      (is (= 7 (count (u/sel [:button]))))
+      (is (= 10 (count (u/sel [:button]))))
       (is (= 4 (count (u/sel [:.muokkaustoiminnot :button]))))
       (is (= 3 (count (u/sel [:.livi-alasveto :button])))))))