From a1427593aedf542a5197a1565968e3d3694c3be8 Mon Sep 17 00:00:00 2001
From: ciukstar <ciukstar@yahoo.com>
Date: Sun, 8 Oct 2023 00:21:08 +0300
Subject: [PATCH] Fix appoinntment and request cards

---
 src/Admin/Services.hs                         | 121 ++++++------------
 src/Admin/Staff.hs                            |   5 +-
 src/Demo/DemoDataEN.hs                        |  56 +++++---
 src/Foundation.hs                             |  64 +++++----
 src/Handler/Appointments.hs                   |  28 ++--
 src/Handler/Book.hs                           |  12 +-
 src/Handler/Requests.hs                       |  28 ++--
 static/img/Salon-ERD.svg                      |  41 +++---
 templates/admin/services/create.hamlet        |   6 +-
 templates/admin/services/edit.hamlet          |   6 +-
 .../admin/services/expert/create.cassius      |   2 +
 templates/admin/services/expert/form.cassius  |   3 +
 templates/admin/services/expert/form.hamlet   |  46 +++++++
 templates/admin/services/offer/create.hamlet  |   6 +-
 templates/admin/services/offer/edit.hamlet    |   6 +-
 templates/admin/services/offer/offer.hamlet   |   6 +-
 templates/admin/services/search.hamlet        |   2 +-
 templates/admin/services/services.hamlet      |  75 +++++------
 templates/admin/services/services.julius      |  23 +---
 templates/admin/services/subservices.hamlet   |   4 +-
 templates/admin/staff/staff.cassius           |  15 ++-
 templates/admin/staff/staff.hamlet            |   2 +-
 templates/appointments/appointment.cassius    |  24 +++-
 templates/appointments/appointment.hamlet     |  74 ++++++-----
 templates/appointments/appointments.hamlet    |  36 +++---
 templates/appointments/hist.hamlet            |  34 +----
 templates/appointments/hist.julius            |   4 +-
 templates/login.cassius                       |   3 +
 templates/login.hamlet                        |  15 ++-
 templates/requests/hist.hamlet                |  34 +----
 templates/requests/hist.julius                |   4 +-
 templates/requests/request.cassius            |  24 +++-
 templates/requests/request.hamlet             |  70 +++++-----
 33 files changed, 448 insertions(+), 431 deletions(-)
 create mode 100644 templates/admin/services/expert/form.cassius
 create mode 100644 templates/admin/services/expert/form.hamlet

diff --git a/src/Admin/Services.hs b/src/Admin/Services.hs
index afd0418..30edd0b 100644
--- a/src/Admin/Services.hs
+++ b/src/Admin/Services.hs
@@ -238,51 +238,7 @@ formExpert sid role extra = do
         , fsAttrs = [("class","mdc-text-field__input"),("min","0"),("max","5")]
         } (roleRating . entityVal <$> role)
     let r = Role <$> emplR <*> FormSuccess sid <*> nameR <*> ratingR
-    let w = [whamlet|
-#{extra}
-<div.form-field>
-  <div.mdc-select.mdc-select--filled.mdc-select--required data-mdc-auto-init=MDCSelect
-    :isJust (fvErrors emplV):.mdc-select--invalid>
-    ^{fvInput emplV}
-    <div.mdc-select__anchor role=button aria-aspopup=listbox aria-expanded=false aria-required=true>
-      <span.mdc-select__ripple>
-      <span.mdc-floating-label>#{fvLabel emplV}
-      <span.mdc-select__selected-text-container>
-        <span.mdc-select__selected-text>
-      <span.mdc-select__dropdown-icon>
-        <svg.mdc-select__dropdown-icon-graphic viewBox="7 10 10 5" focusable=false>
-          <polygon.mdc-select__dropdown-icon-inactive stroke=none fill-rule=evenodd points="7 10 12 15 17 10">
-          <polygon.mdc-select__dropdown-icon-active stroke=none fill-rule=evenodd points="7 15 12 10 17 15">
-      <span.mdc-line-ripple>
-
-    <div.mdc-select__menu.mdc-menu.mdc-menu-surface.mdc-menu-surface--fullwidth>
-      <ul.mdc-deprecated-list role=listbox>
-        $forall Entity eid (Staff ename _ _ _ _ _) <- staff
-          <li.mdc-deprecated-list-item role=option data-value=#{fromSqlKey eid} aria-selected=false>
-            <span.mdc-deprecated-list-item__ripple>
-            <span.mdc-deprecated-list-item__text>
-              #{ename}
-
-  $maybe errs <- fvErrors emplV
-    <div.mdc-select-helper-text.mdc-select-helper-text--validation-msg>
-      #{errs}
-
-$forall v <- [nameV,ratingV]
-  <div.form-field>
-    <label.mdc-text-field.mdc-text-field--filled data-mdc-auto-init=MDCTextField
-      :isJust (fvErrors v):.mdc-text-field--invalid
-      :isJust (fvErrors v):.mdc-text-field--with-trailing-icon>
-      <span.mdc-text-field__ripple>
-      <span.mdc-floating-label>#{fvLabel v}
-      ^{fvInput v}
-      $maybe _ <- fvErrors v
-        <i.mdc-text-field__icon.mdc-text-field__icon--trailing.material-symbols-outlined>error
-      <span.mdc-line-ripple>
-    $maybe errs <- fvErrors v
-      <div.mdc-text-field-helper-line>
-        <div.mdc-text-field-helper-text.mdc-text-field-helper-text--validation-msg aria-hidden=true>
-          #{errs}
-|]
+    let w = $(widgetFile "admin/services/expert/form")
     return (r,w)
   where
 
@@ -347,17 +303,17 @@ getAdmServicesSearchR = do
 
 postAdmPriceDeleteR :: OfferId -> Services -> Handler Html
 postAdmPriceDeleteR pid sids = do
-    scrollY <- (("scrollY",) <$>) <$> runInputGet (iopt textField "scrollY")
-    open <- (("open",) <$>) <$> runInputGet (iopt textField "open")
+    y <- (("y",) <$>) <$> runInputGet (iopt textField "y")
+    o <- (("o",) <$>) <$> runInputGet (iopt textField "o")
     runDB $ delete pid
     addMessageI "info" MsgRecordDeleted
-    redirect (AdminR $ AdmServicesR sids,catMaybes [scrollY,open])
+    redirect (AdminR $ AdmServicesR sids,catMaybes [y,o])
 
 
 getAdmPriceEditR :: OfferId -> Services -> Handler Html
 getAdmPriceEditR pid (Services sids) = do
-    scrollY <- (("scrollY",) <$>) <$> runInputGet (iopt textField "scrollY")
-    open <- (("open",) <$>) <$> runInputGet (iopt textField "open")
+    y <- (("y",) <$>) <$> runInputGet (iopt textField "y")
+    o <- (("o",) <$>) <$> runInputGet (iopt textField "o")
     price <- runDB $ selectOne $ do
         x <- from $ table @Offer
         where_ $ x ^. OfferId ==. val pid
@@ -370,8 +326,8 @@ getAdmPriceEditR pid (Services sids) = do
 
 postAdmPriceR :: OfferId -> Services -> Handler Html
 postAdmPriceR pid (Services sids) = do
-    scrollY <- (("scrollY",) <$>) <$> runInputGet (iopt textField "scrollY")
-    open <- (("open",) <$>) <$> runInputGet (iopt textField "open")
+    y <- (("y",) <$>) <$> runInputGet (iopt textField "y")
+    o <- (("o",) <$>) <$> runInputGet (iopt textField "o")
     price <- runDB $ selectOne $ do
         x <- from $ table @Offer
         where_ $ x ^. OfferId ==. val pid
@@ -382,7 +338,7 @@ postAdmPriceR pid (Services sids) = do
           runDB $ replace pid r
           addMessageI "info" MsgRecordEdited
           redirect ( AdminR $ AdmPriceR pid (Services sids)
-                   , catMaybes [scrollY,open,Just ("pid",pack $ show $ fromSqlKey pid)]
+                   , catMaybes [y,o,Just ("pid",pack $ show $ fromSqlKey pid)]
                    )
       _ -> defaultLayout $ do
           setTitleI MsgPrice
@@ -391,8 +347,8 @@ postAdmPriceR pid (Services sids) = do
 
 getAdmPriceR :: OfferId -> Services -> Handler Html
 getAdmPriceR pid sids = do
-    scrollY <- (("scrollY",) <$>) <$> runInputGet (iopt textField "scrollY")
-    open <- (("open",) <$>) <$> runInputGet (iopt textField "open")
+    y <- (("y",) <$>) <$> runInputGet (iopt textField "y")
+    o <- (("o",) <$>) <$> runInputGet (iopt textField "o")
     price <- runDB $ selectOne $ do
         x <- from $ table @Offer
         where_ $ x ^. OfferId ==. val pid
@@ -405,15 +361,15 @@ getAdmPriceR pid sids = do
 
 postAdmOfferR :: Services -> Handler Html
 postAdmOfferR (Services sids) = do
-    scrollY <- (("scrollY",) <$>) <$> runInputGet (iopt textField "scrollY")
-    open <- (("open",) <$>) <$> runInputGet (iopt textField "open")
+    y <- (("y",) <$>) <$> runInputGet (iopt textField "y")
+    o <- (("o",) <$>) <$> runInputGet (iopt textField "o")
     ((fr,widget),enctype) <- runFormPost $ formOffer (last sids) Nothing
     case fr of
       FormSuccess r -> do
           pid <- runDB $ insert r
           addMessageI "info" MsgRecordAdded
           redirect ( AdminR $ AdmServicesR (Services sids)
-                   , catMaybes [scrollY,open,Just ("pid",pack $ show $ fromSqlKey pid)]
+                   , catMaybes [y,o,Just ("pid",pack $ show $ fromSqlKey pid)]
                    )
       _ -> defaultLayout $ do
           setTitleI MsgPrice
@@ -422,8 +378,8 @@ postAdmOfferR (Services sids) = do
 
 getAdmOfferCreateR :: Services -> Handler Html
 getAdmOfferCreateR (Services sids) = do
-    scrollY <- (("scrollY",) <$>) <$> runInputGet (iopt textField "scrollY")
-    open <- (("open",) <$>) <$> runInputGet (iopt textField "open")
+    y <- (("y",) <$>) <$> runInputGet (iopt textField "y")
+    o <- (("o",) <$>) <$> runInputGet (iopt textField "o")
     (widget,enctype) <- generateFormPost $ formOffer (last sids) Nothing
     defaultLayout $ do
         setTitleI MsgOffer
@@ -525,10 +481,10 @@ getAdmServiceImageR sid = do
 
 postAdmServiceDeleteR :: Services -> Handler Html
 postAdmServiceDeleteR (Services sids) = do
-    scrollY <- fromMaybe "0" <$> runInputGet (iopt textField "scrollY")
+    y <- fromMaybe "0" <$> runInputGet (iopt textField "y")
     runDB $ delete (last sids)
     addMessageI "info" MsgRecordDeleted
-    redirect (AdminR $ AdmServicesR (Services (init sids)),[("scrollY",scrollY)])
+    redirect (AdminR $ AdmServicesR (Services (init sids)),[("y",y)])
 
 
 postAdmServiceR :: Services -> Handler Html
@@ -539,7 +495,7 @@ postAdmServiceR (Services sids) = do
         where_ $ x ^. ServiceId ==. val (last sids)
         return (x,t)
     ((fr,widget),enctype) <- runFormPost $ formService (fst <$> service) Nothing (snd =<< service)
-    scrollY <- fromMaybe "0" <$> runInputGet (iopt textField "scrollY")
+    y <- fromMaybe "0" <$> runInputGet (iopt textField "y")
     case fr of
       FormSuccess (s,mfi,ma) -> do
           _ <- runDB $ replace (last sids) s
@@ -553,9 +509,9 @@ postAdmServiceR (Services sids) = do
                 _ <- runDB $ upsert
                      (Thumbnail (last sids) bs (fileContentType fi) ma)
                      [ThumbnailPhoto P.=. bs, ThumbnailMime P.=. fileContentType fi, ThumbnailAttribution P.=. ma]
-                redirect (AdminR $ AdmServicesR (Services sids),[("scrollY",scrollY)])
+                redirect (AdminR $ AdmServicesR (Services sids),[("y",y)])
             Nothing -> redirect ( AdminR $ AdmServicesR (Services sids)
-                                , [("sid",pack $ show $ fromSqlKey $ last sids),("scrollY",scrollY)]
+                                , [("sid",pack $ show $ fromSqlKey $ last sids),("y",y)]
                                 )
       _ -> defaultLayout $ do
           setTitleI MsgService
@@ -564,7 +520,7 @@ postAdmServiceR (Services sids) = do
 
 getAdmServiceEditFormR :: Services -> Handler Html
 getAdmServiceEditFormR (Services sids) = do
-    scrollY <- fromMaybe "0" <$> runInputGet (iopt textField "scrollY")
+    y <- fromMaybe "0" <$> runInputGet (iopt textField "y")
     service <- runDB $ selectOne $ do
         x :& t <- from $ table @Service `leftJoin` table @Thumbnail
             `on` (\(x :& t) -> just (x ^. ServiceId) ==. t ?. ThumbnailService)
@@ -578,8 +534,8 @@ getAdmServiceEditFormR (Services sids) = do
 
 getAdmServiceCreateFormR :: Services -> Handler Html
 getAdmServiceCreateFormR (Services sids) = do
-    scrollY <- (("scrollY",) <$>) <$> runInputGet (iopt textField "scrollY")
-    open <- (("open",) <$>) <$> runInputGet (iopt textField "open")
+    y <- (("y",) <$>) <$> runInputGet (iopt textField "y")
+    o <- (("o",) <$>) <$> runInputGet (iopt textField "o")
     (widget,enctype) <- generateFormPost $ formService Nothing (LS.last sids) Nothing
     defaultLayout $ do
         setTitleI MsgService
@@ -588,8 +544,8 @@ getAdmServiceCreateFormR (Services sids) = do
 
 postAdmServicesR :: Services -> Handler Html
 postAdmServicesR (Services sids) = do
-    scrollY <- (("scrollY",) <$>) <$> runInputGet (iopt textField "scrollY")
-    open <- (("open",) <$>) <$> runInputGet (iopt textField "open")
+    y <- (("y",) <$>) <$> runInputGet (iopt textField "y")
+    o <- (("o",) <$>) <$> runInputGet (iopt textField "o")
     ((fr,widget),enctype) <- runFormPost $ formService Nothing (LS.last sids) Nothing
     case fr of
       FormSuccess (s,mfi,a) -> do
@@ -605,7 +561,7 @@ postAdmServicesR (Services sids) = do
                                           }
             Nothing -> return ()
           redirect ( AdminR $ AdmServicesR (Services sids)
-                   , catMaybes [Just ("sid",pack $ show $ fromSqlKey sid),scrollY,open]
+                   , catMaybes [Just ("sid",pack $ show $ fromSqlKey sid),y,o]
                    )
       _ -> defaultLayout $ do
           setTitleI MsgService
@@ -614,9 +570,8 @@ postAdmServicesR (Services sids) = do
 
 getAdmServicesR :: Services -> Handler Html
 getAdmServicesR (Services sids) = do
-    stati <- reqGetParams <$> getRequest
-    open <- runInputGet (iopt textField "open")
-    scrollY <- fromMaybe "0" <$> runInputGet (iopt textField "scrollY")
+    o <- runInputGet (iopt textField "o")
+    y <- fromMaybe "0" <$> runInputGet (iopt textField "y")
     mpid <- (toSqlKey <$>) <$> runInputGet (iopt intField "pid")
     msid <- (toSqlKey <$>) <$> runInputGet (iopt intField "sid")
     user <- maybeAuth
@@ -634,7 +589,7 @@ getAdmServicesR (Services sids) = do
           orderBy [asc (x ^. OfferId)]
           return x
       Nothing -> return []
-      
+
     experts <- case service of
       Just (Entity sid _,_) -> runDB $ select $ do
         r :& e <- from $ table @Role
@@ -642,19 +597,21 @@ getAdmServicesR (Services sids) = do
         where_ $ r ^. RoleService ==. val sid
         return (r,e)
       Nothing -> return []
-      
+
     services <- (second (join . unValue) <$>) <$> runDB ( select $ do
-        x :& t <- from $ table @Service `leftJoin` table @Thumbnail
-            `on` (\(x :& t) -> just (x ^. ServiceId) ==. t ?. ThumbnailService)
+        s :& t <- from $ table @Service `leftJoin` table @Thumbnail
+            `on` (\(s :& t) -> just (s ^. ServiceId) ==. t ?. ThumbnailService)
         case sids of
-          [] -> where_ $ isNothing $ x ^. ServiceGroup
-          (last -> y) -> where_ $ x ^. ServiceGroup ==. just (val y)
-        orderBy [asc (x ^. ServiceId)]
-        return (x,t ?. ThumbnailAttribution) )
+          [] -> where_ $ isNothing $ s ^. ServiceGroup
+          (last -> x) -> where_ $ s ^. ServiceGroup ==. just (val x)
+        orderBy [asc (s ^. ServiceId)]
+        return (s,t ?. ThumbnailAttribution) )
     setUltDestCurrent
     msgs <- getMessages
     app <- getYesod
     langs <- languages
+    btnDelete <- newIdent
+    dlgDelete <- newIdent
     detailsDescription <- newIdent
     detailsOffer <- newIdent
     detailsExperts <- newIdent
diff --git a/src/Admin/Staff.hs b/src/Admin/Staff.hs
index 1a5ef48..a13eb77 100644
--- a/src/Admin/Staff.hs
+++ b/src/Admin/Staff.hs
@@ -40,7 +40,7 @@ import Yesod.Core
     , typeSvg, addMessageI, redirect, FileInfo (fileContentType)
     , SomeMessage (SomeMessage), fileSourceByteString
     , MonadTrans (lift), whamlet, getRequest
-    , YesodRequest (reqGetParams)
+    , YesodRequest (reqGetParams), newIdent
     )
 import Yesod.Core.Widget (setTitleI)
 import Yesod.Auth (maybeAuth, Route (LoginR))
@@ -308,7 +308,7 @@ $forall v <- [fnameV,emailV]
     return (r,w)
   where
       resolveSelected adminR = case adminR of FormSuccess x -> x ; _ -> False
-      
+
       uniqueNameField = checkM uniqueName textField
 
       uniqueName :: Text -> Handler (Either AppMessage Text)
@@ -678,6 +678,7 @@ getAdmStaffR = do
           return x ) )
     msgs <- getMessages
     setUltDestCurrent
+    fabAddStaff <- newIdent
     defaultLayout $ do
         setTitleI MsgStaff
         $(widgetFile "admin/staff/staff")
diff --git a/src/Demo/DemoDataEN.hs b/src/Demo/DemoDataEN.hs
index f10724f..7039bd1 100644
--- a/src/Demo/DemoDataEN.hs
+++ b/src/Demo/DemoDataEN.hs
@@ -39,7 +39,7 @@ import Model
     , Contents (Contents, contentsSection, contentsContent)
     , BookStatus (BookStatusRequest)
     , Book (Book, bookUser, bookOffer, bookRole, bookDay, bookTime, bookTz, bookStatus)
-    , Business (Business, businessName, businessAddress, businessPhone, businessMobile, businessEmail)
+    , Business (Business, businessName, businessAddress, businessPhone, businessMobile, businessEmail), Hist (histBook, histLogtime, histDay, histTime, histTz, histStatus, Hist)
     )
 import Data.FileEmbed (embedFile)
 import Demo.DemoPhotos
@@ -50,7 +50,7 @@ import Demo.DemoPhotos
 populateEN :: MonadIO m => ReaderT SqlBackend m ()
 populateEN = do
 
-    (today,time) <- liftIO $ getCurrentTime >>= \x -> return (utctDay x,timeToTimeOfDay (utctDayTime x))
+    (now,today,time) <- liftIO $ getCurrentTime >>= \x -> return (x ,utctDay x,timeToTimeOfDay (utctDayTime x))
 
     insert_ $ Business { businessName = "Salon"
                        , businessAddress = "5331 Rexford Court, Montgomery AL 36116"
@@ -414,7 +414,7 @@ We will continue to offer the latest treatments, the most innovative techniques
 
     r212 <- insert $ Role { roleStaff = e2
                           , roleService = s12
-                          , roleName = "Barbers"
+                          , roleName = "Hairdresser"
                           , roleRating = Just 3
                           }
 
@@ -532,8 +532,8 @@ We will continue to offer the latest treatments, the most innovative techniques
 
     r51511 <- insert $ Role { roleStaff = e5
                             , roleService = s1511
-                            , roleName = "Hairdresser"
-                            , roleRating = Just 2
+                            , roleName = "Barber"
+                            , roleRating = Just 4
                             }
 
     s1512 <- insert $ Service { serviceName = "Before Perm Conditioner"
@@ -1008,18 +1008,27 @@ We will continue to offer the latest treatments, the most innovative techniques
                         , userFullName = Just "Patty O’Furniture"
                         , userEmail = Just "pattyofurniture@mail.org"
                         }
+          
     insert_ $ UserPhoto { userPhotoUser = c1
                         , userPhotoPhoto = $(embedFile "static/img/customer-women-1.avif")
                         , userPhotoMime = "image/avif"
                         }
 
-    insert_ $ Book { bookOffer = o131
-                   , bookRole = Just r212 
-                   , bookUser = c1
-                   , bookDay = addDays 1 today
-                   , bookTime = time
-                   , bookTz = utc
-                   , bookStatus = BookStatusRequest
+    b1 <- insert $ Book { bookOffer = o131
+                        , bookRole = Just r212 
+                        , bookUser = c1
+                        , bookDay = addDays 1 today
+                        , bookTime = time
+                        , bookTz = utc
+                        , bookStatus = BookStatusRequest
+                        }
+          
+    insert_ $ Hist { histBook = b1
+                   , histLogtime = now
+                   , histDay = addDays 1 today
+                   , histTime = time
+                   , histTz = utc
+                   , histStatus = BookStatusRequest
                    }
 
 
@@ -1030,18 +1039,27 @@ We will continue to offer the latest treatments, the most innovative techniques
                         , userFullName = Just "Ray Sin"
                         , userEmail = Just "raysin@mail.org"
                         }
+          
     insert_ $ UserPhoto { userPhotoUser = c2
                         , userPhotoPhoto = $(embedFile "static/img/customer-men-1.avif")
                         , userPhotoMime = "image/avif"
                         }
 
-    insert_ $ Book { bookOffer = o111
-                   , bookRole = Just r51511 
-                   , bookUser = c2
-                   , bookDay = addDays 2 today
-                   , bookTime = time
-                   , bookTz = utc
-                   , bookStatus = BookStatusRequest
+    b2 <- insert $ Book { bookOffer = o111
+                        , bookRole = Just r51511 
+                        , bookUser = c2
+                        , bookDay = addDays 2 today
+                        , bookTime = time
+                        , bookTz = utc
+                        , bookStatus = BookStatusRequest
+                        }
+          
+    insert_ $ Hist { histBook = b2
+                   , histLogtime = now
+                   , histDay = addDays 2 today
+                   , histTime = time
+                   , histTz = utc
+                   , histStatus = BookStatusRequest
                    }
 
     insert_ $ Book { bookOffer = o141
diff --git a/src/Foundation.hs b/src/Foundation.hs
index 836f59d..dd1e9a6 100644
--- a/src/Foundation.hs
+++ b/src/Foundation.hs
@@ -37,7 +37,8 @@ import Database.Persist.Sql (ConnectionPool, runSqlPool, fromSqlKey)
 import qualified Database.Esqueleto.Experimental as E ((==.), exists)
 import Database.Esqueleto.Experimental
     ( select, selectOne, from, table, Value (Value), where_
-    , (^.), just
+    , (^.), (:&) ((:&))
+    , just, orderBy, asc, unionAll_, not_, val
     )
 
 -- | The foundation datatype for your application. This can be a good place to
@@ -112,9 +113,9 @@ instance Yesod App where
             addStylesheet $ StaticR material_components_web_min_css
             addScript     $ StaticR material_components_web_min_js
             $(widgetFile "default-layout")
-            
+
         brand <- runDB $ selectOne $ from $ table @Brand
-        
+
         withUrlRenderer $(hamletFile "templates/default-layout-wrapper.hamlet")
 
     -- The page to be redirected to when authentication is required.
@@ -134,7 +135,7 @@ instance Yesod App where
     isAuthorized (StaticR _) _ = return Authorized
     isAuthorized (AdminR UsersR) _ = return Authorized
     isAuthorized (AdminR UserCreateFormR) _ = return Authorized
-    
+
     isAuthorized (AdminR AdmServicesSearchR) _ = return Authorized
     isAuthorized (AdminR (AdmServicesR _)) _ = return Authorized
     isAuthorized (AdminR (AdmServiceR _)) _ = return Authorized
@@ -148,9 +149,9 @@ instance Yesod App where
     isAuthorized (AdminR (AdmExpertR _ _)) _ = return Authorized
     isAuthorized (AdminR (AdmExpertEditR _ _)) _ = return Authorized
     isAuthorized (AdminR (AdmExpertDeleteR _ _)) _ = return Authorized
-    
-    
-    
+
+
+
     isAuthorized (AdminR (AdmOfferR _)) _ = return Authorized
     isAuthorized (AdminR (AdmPriceR _ _)) _ = return Authorized
     isAuthorized (AdminR (AdmPriceEditR _ _)) _ = return Authorized
@@ -182,20 +183,20 @@ instance Yesod App where
     isAuthorized (AdminR (AdmEmplUserR _)) _ = return Authorized
     isAuthorized (AdminR (AdmEmplUnregR _ _)) _ = return Authorized
     isAuthorized (AdminR AdmStaffSearchR) _ = return Authorized
-    
+
     isAuthorized (AdminR BrandR) _ = return Authorized
     isAuthorized (AdminR BrandDeleteR) _ = return Authorized
     isAuthorized (AdminR (BrandEditR _)) _ = return Authorized
     isAuthorized (AdminR (BrandMarkR _)) _ = return Authorized
     isAuthorized (AdminR (BrandIcoR _)) _ = return Authorized
     isAuthorized (AdminR BrandCreateR) _ = return Authorized
-    
+
     isAuthorized (AdminR BusinessR) _ = return Authorized
     isAuthorized (AdminR BusinessCreateR) _ = return Authorized
     isAuthorized (AdminR (BusinessEditR _)) _ = return Authorized
-    isAuthorized (AdminR BusinessDeleteR) _ = return Authorized    
-    
-    
+    isAuthorized (AdminR BusinessDeleteR) _ = return Authorized
+
+
     isAuthorized ContactR _ = return Authorized
 
     isAuthorized BookEndR _ = return Authorized
@@ -204,15 +205,15 @@ instance Yesod App where
     isAuthorized BookStaffR _ = return Authorized
     isAuthorized BookOffersR _ = return Authorized
     isAuthorized BookSearchR _ = return Authorized
-        
+
     isAuthorized AppointmentsR _ = return Authorized
     isAuthorized (AppointmentR _) _ = return Authorized
     isAuthorized (AppointmentCancelR _) _ = return Authorized
     isAuthorized (AppointmentHistR _) _ = return Authorized
     isAuthorized (AppointmentRescheduleR _) _ = return Authorized
     isAuthorized (AppointmentApproveR _) _ = return Authorized
-    
-    
+
+
     isAuthorized RequestsR _ = return Authorized
     isAuthorized (RequestR _) _ = return Authorized
     isAuthorized RequestsSearchR _ = return Authorized
@@ -220,12 +221,12 @@ instance Yesod App where
     isAuthorized (RequestFinishR _) _ = return Authorized
     isAuthorized (RequestRescheduleR _) _ = return Authorized
     isAuthorized (RequestHistR _) _ = return Authorized
-    
-    
+
+
     isAuthorized AccountR _ = return Authorized
     isAuthorized (AccountPhotoR _) _ = return Authorized
     isAuthorized ProfileR _ = return Authorized
-    
+
     isAuthorized ServicesR _ = return Authorized
     isAuthorized (ServiceR _) _ = return Authorized
     isAuthorized (ServiceOffersR _) _ = return Authorized
@@ -294,11 +295,11 @@ instance YesodAuth App where
     -- Where to send a user after successful login
     loginDest :: App -> Route App
     loginDest _ = HomeR
-    
+
     -- Where to send a user after logout
     logoutDest :: App -> Route App
     logoutDest _ = HomeR
-    
+
     -- Override the above two destinations when a Referer: header is present
     redirectToReferer :: App -> Bool
     redirectToReferer _ = True
@@ -336,11 +337,24 @@ formLogin route = do
     ult <- getUrlRender >>= \rndr -> fromMaybe (rndr HomeR) <$>  lookupSession ultDestKey
     msgs <- getMessages
     users <- liftHandler $ runDB $ select $ do
-        x <- from $ table @User
-        where_ $ E.exists $ do
-            e <- from $ table @Staff
-            where_ $ e ^. StaffUser E.==. just (x ^. UserId)
-        return (x ^. UserId, x ^. UserName)
+        x :& y <- from $
+            do x <- from $ table @User
+               where_ $ not_ $ E.exists $ do
+                   e <- from $ table @Staff
+                   where_ $ e ^. StaffUser E.==. just (x ^. UserId)
+               where_ $ E.exists $ do
+                   b <- from $ table @Book
+                   where_ $ b ^. BookUser E.==. x ^. UserId
+               return $ x :& val False
+            `unionAll_`
+            do x <- from $ table @User
+               where_ $ E.exists $ do
+                   e <- from $ table @Staff
+                   where_ $ e ^. StaffUser E.==. just (x ^. UserId)
+               return $ x :& val True
+        
+        orderBy [asc y, asc (x ^. UserName)]
+        return (x ^. UserId, x ^. UserName, y)
     $(widgetFile "login")
 
 
diff --git a/src/Handler/Appointments.hs b/src/Handler/Appointments.hs
index 075c45f..b0c82a0 100644
--- a/src/Handler/Appointments.hs
+++ b/src/Handler/Appointments.hs
@@ -106,13 +106,13 @@ postAppointmentApproveR bid = do
               where_ $ x ^. BookUser ==. val uid
               return x
           case book of
-            Just (Entity bid' (Book _ _ _ day time tz status)) -> do
-                now <- liftIO getCurrentTime
-                runDB $ insert_ $ Hist bid' now day time tz status
+            Just (Entity _ (Book _ _ _ day time tz _)) -> do
                 runDB $ update $ \x -> do
                     set x [BookStatus =. val BookStatusApproved]
                     where_ $ x ^. BookId ==. val bid
                     where_ $ x ^. BookUser ==. val uid
+                now <- liftIO getCurrentTime
+                runDB $ insert_ $ Hist bid now day time tz BookStatusApproved
                 redirect $ AppointmentR bid
 
             Nothing -> do
@@ -246,14 +246,6 @@ getAppointmentHistR bid = do
                   where_ $ b ^. BookUser ==. val uid
               orderBy [desc (x ^. HistLogtime)]
               return x
-              
-          book <- case hist of
-            [] -> return Nothing
-            _ -> runDB $ selectOne $ do
-                x <- from $ table @Book
-                where_ $ x ^. BookId ==. val bid
-                return x
-          now <- liftIO getCurrentTime
           defaultLayout $ do
               setTitleI MsgHistory
               $(widgetFile "appointments/hist")
@@ -274,13 +266,13 @@ postAppointmentCancelR bid = do
               where_ $ x ^. BookUser ==. val uid
               return x
           case book of
-            Just (Entity bid' (Book _ _ _ day time tz status)) -> do
-                now <- liftIO getCurrentTime
-                runDB $ insert_ $ Hist bid' now day time tz status
+            Just (Entity _ (Book _ _ _ day time tz _)) -> do
                 runDB $ update $ \x -> do
                     set x [BookStatus =. val BookStatusCancelled]
                     where_ $ x ^. BookId ==. val bid
                     where_ $ x ^. BookUser ==. val uid
+                now <- liftIO getCurrentTime
+                runDB $ insert_ $ Hist bid now day time tz BookStatusCancelled
                 redirect $ AppointmentR bid
 
             Nothing -> do
@@ -309,9 +301,7 @@ postAppointmentR bid = do
               where_ $ x ^. BookUser ==. val uid
               return x
           case book of
-            Just (Entity bid' (Book _ _ _ day' time' tz' status')) -> do
-                now <- liftIO getCurrentTime
-                runDB $ insert_ $ Hist bid' now day' time' tz' status'
+            Just _ -> do
                 runDB $ update $ \x -> do
                     set x [ BookDay =. val day
                           , BookTime =. val time
@@ -320,6 +310,8 @@ postAppointmentR bid = do
                           ]
                     where_ $ x ^. BookId ==. val bid
                     where_ $ x ^. BookUser ==. val uid
+                now <- liftIO getCurrentTime
+                runDB $ insert_ $ Hist bid now day time tz BookStatusRequest
                 redirect $ AppointmentR bid
 
             Nothing -> do
@@ -384,8 +376,6 @@ getAppointmentsR = do
           setTitleI MsgMyAppointments
           $(widgetFile "appointments/login")
       Just (Entity uid _) -> do
-          app <- getYesod
-          langs <- languages
           books <- runDB $ select $ do
               x :& _ :& s <- from $ table @Book
                   `innerJoin` table @Offer `on` (\(x :& o) -> x ^. BookOffer ==. o ^. OfferId)
diff --git a/src/Handler/Book.hs b/src/Handler/Book.hs
index 8a93ab4..a180681 100644
--- a/src/Handler/Book.hs
+++ b/src/Handler/Book.hs
@@ -59,7 +59,7 @@ import Yesod.Form.Input (runInputPost, iopt, runInputGet)
 import Settings (widgetFile)
 
 import Yesod.Persist.Core (runDB)
-import Database.Persist ( Entity(Entity), PersistStoreWrite (insert) )
+import Database.Persist ( Entity(Entity), PersistStoreWrite (insert, insert_) )
 import Database.Persist.Sql ( fromSqlKey, toSqlKey, SqlBackend )
 
 import Database.Esqueleto.Experimental
@@ -106,7 +106,7 @@ import Model
       , ServiceName, RoleStaff, RoleRating, RoleService, OfferId, BookOffer
       , BookUser, BookRole, ThumbnailService, ThumbnailAttribution
       , ServiceOverview, ServiceDescr, ServiceGroup
-      ), BookStatus (BookStatusRequest)
+      ), BookStatus (BookStatusRequest), Hist (Hist)
     )
 
 import Menu (menu)
@@ -204,8 +204,12 @@ postBookCustomerR = do
           ((fr,fw),et) <- runFormPost $ formCustomer user Nothing Nothing Nothing ioffers ioffers irole (maybeToList irole)
           case fr of
             FormSuccess (items,role,day,time,tz,Entity uid _) -> do
-                bids <- forM items $ \((_,Entity oid _),_) -> runDB $
-                    insert $ Book uid oid ((\(_,Entity rid _) -> rid) <$> role) day time tz BookStatusRequest
+                now <- liftIO getCurrentTime
+                bids <- forM items $ \((_,Entity oid _),_) -> do
+                    bid  <- runDB $ insert $
+                        Book uid oid ((\(_,Entity rid _) -> rid) <$> role) day time tz BookStatusRequest
+                    runDB $ insert_ $ Hist bid now day time tz BookStatusRequest
+                    return bid
                 addMessageI "info" MsgRecordAdded
                 deleteSession sessKeyBooking
                 redirect (BookEndR, ("bid",) . pack . show . fromSqlKey <$> bids)
diff --git a/src/Handler/Requests.hs b/src/Handler/Requests.hs
index 826c063..96b0594 100644
--- a/src/Handler/Requests.hs
+++ b/src/Handler/Requests.hs
@@ -69,7 +69,7 @@ import Foundation
       , MsgFinishAppointmentConfirm, MsgDay, MsgTimezone, MsgMinutes, MsgContinue
       , MsgAppointmentTimeIsInThePast, MsgAppointmentDayIsInThePast, MsgSave
       , MsgNoHistoryYet, MsgAdjusted, MsgLoginBanner, MsgNoAssigneeRequestApprove
-      , MsgNoAssigneeRequestReschedule, MsgCurrent
+      , MsgNoAssigneeRequestReschedule
       )
     )
 
@@ -119,14 +119,6 @@ getRequestHistR bid = do
                   where_ $ b ^. BookId ==. x ^. HistBook
               orderBy [desc (x ^. HistLogtime)]
               return x
-              
-          book <- case hist of
-            [] -> return Nothing
-            _ -> runDB $ selectOne $ do
-                x <- from $ table @Book
-                where_ $ x ^. BookId ==. val bid
-                return x
-          now <- liftIO getCurrentTime
           defaultLayout $ do
               setTitleI MsgHistory
               $(widgetFile "requests/hist")
@@ -245,12 +237,12 @@ postRequestFinishR bid = do
               where_ $ x ^. BookId ==. val _bid
               return x
           case book of
-            Just (Entity bid' (Book _ _ _ day time tz status)) -> do
-                now <- liftIO getCurrentTime
-                runDB $ insert_ $ Hist bid' now day time tz status
+            Just (Entity _ (Book _ _ _ day time tz _)) -> do
                 runDB $ update $ \x -> do
                     set x [BookStatus =. val BookStatusPaid]
                     where_ $ x ^. BookId ==. val bid
+                now <- liftIO getCurrentTime
+                runDB $ insert_ $ Hist bid now day time tz BookStatusPaid
                 redirect $ RequestR bid
 
             Nothing -> do
@@ -290,12 +282,12 @@ postRequestApproveR bid = do
               return r
               
           case (book,role) of
-            (Just (Entity bid' (Book _ _ _ day time tz status),_),Just (Entity rid _)) -> do
-                now <- liftIO getCurrentTime
-                runDB $ insert_ $ Hist bid' now day time tz status
+            (Just (Entity _ (Book _ _ _ day time tz _),_),Just (Entity rid _)) -> do
                 runDB $ update $ \x -> do
                     set x [BookRole =. just (val rid), BookStatus =. val BookStatusApproved]
                     where_ $ x ^. BookId ==. val bid
+                now <- liftIO getCurrentTime
+                runDB $ insert_ $ Hist bid now day time tz BookStatusApproved
                 redirect $ RequestR bid
 
             _ -> do
@@ -406,9 +398,7 @@ postRequestR bid = do
               return r
               
           case (book,role) of
-            (Just (Entity bid' (Book _ _ _ day' time' tz' status'),_),Just (Entity rid _)) -> do
-                now <- liftIO getCurrentTime
-                runDB $ insert_ $ Hist bid' now day' time' tz' status'
+            (Just _,Just (Entity rid _)) -> do
                 runDB $ update $ \x -> do
                     set x [ BookRole =. just (val rid)
                           , BookDay =. val day
@@ -417,6 +407,8 @@ postRequestR bid = do
                           , BookStatus =. val BookStatusAdjusted
                           ]
                     where_ $ x ^. BookId ==. val bid
+                now <- liftIO getCurrentTime
+                runDB $ insert_ $ Hist bid now day time tz BookStatusAdjusted
                 redirect $ RequestR bid
 
             _ -> do
diff --git a/static/img/Salon-ERD.svg b/static/img/Salon-ERD.svg
index 048e49c..7c16761 100644
--- a/static/img/Salon-ERD.svg
+++ b/static/img/Salon-ERD.svg
@@ -312,10 +312,10 @@
       ><path d="M0 0 L255 0 L255 224 L0 224 L0 0 Z"
       /></clipPath
       ><clipPath clipPathUnits="userSpaceOnUse" id="clipPath103"
-      ><path d="M0 0 L0 224 L255 224 L255 0 Z"
+      ><path d="M196 166 L196 180 L124 180 L124 166 ZM0 0 L0 224 L255 224 L255 0 Z"
       /></clipPath
       ><clipPath clipPathUnits="userSpaceOnUse" id="clipPath104"
-      ><path d="M220 154 L-4 154 L-4 409 L220 409 Z"
+      ><path d="M54 350 L40 350 L40 278 L54 278 ZM220 154 L-4 154 L-4 409 L220 409 Z"
       /></clipPath
       ><clipPath clipPathUnits="userSpaceOnUse" id="clipPath105"
       ><path d="M0 0 L130 0 L130 70 L0 70 L0 0 Z"
@@ -375,15 +375,18 @@
       ><path d="M56 122 L126 122 L126 -4 L56 -4 Z"
       /></clipPath
       ><clipPath clipPathUnits="userSpaceOnUse" id="clipPath124"
-      ><path d="M0 0 L71 0 L71 123 L0 123 L0 0 Z"
+      ><path d="M0 0 L70 0 L70 122 L0 122 L0 0 Z"
       /></clipPath
       ><clipPath clipPathUnits="userSpaceOnUse" id="clipPath125"
-      ><path d="M0 0 L0 123 L71 123 L71 0 Z"
+      ><path d="M0 0 L0 122 L70 122 L70 0 Z"
       /></clipPath
       ><clipPath clipPathUnits="userSpaceOnUse" id="clipPath126"
-      ><path d="M66 170 L66 47 L-5 47 L-5 170 Z"
+      ><path d="M66 172 L66 50 L-4 50 L-4 172 Z"
       /></clipPath
       ><clipPath clipPathUnits="userSpaceOnUse" id="clipPath127"
+      ><path d="M-72 -14 L144 -14 L144 28 L-72 28 L-72 -14 Z"
+      /></clipPath
+      ><clipPath clipPathUnits="userSpaceOnUse" id="clipPath128"
       ><path d="M-54 -14 L108 -14 L108 28 L-54 28 L-54 -14 Z"
       /></clipPath
     ></defs
@@ -1241,23 +1244,27 @@ AElFTkSuQmCC" height="18" preserveAspectRatio="none"
       /><circle transform="translate(33,33) rotate(90) translate(56,0) rotate(90) translate(-89,-33)" clip-path="url(#clipPath123)" fill="white" r="4.125" cx="89" cy="44.2679" stroke="none"
       /><circle fill="none" r="4.125" clip-path="url(#clipPath123)" cx="89" transform="translate(33,33) rotate(90) translate(56,0) rotate(90) translate(-89,-33)" cy="44.2679"
     /></g
-    ><g fill-opacity="1" text-rendering="geometricPrecision" stroke="black" stroke-linecap="butt" transform="translate(265,155)" stroke-miterlimit="0" stroke-opacity="1" fill="black" stroke-dasharray="5,5" font-family="sans-serif" stroke-linejoin="round" font-size="11px" image-rendering="optimizeQuality"
-    ><line y2="85" fill="none" x1="33" clip-path="url(#clipPath125)" x2="33" y1="33"
+    ><g fill-opacity="1" text-rendering="geometricPrecision" stroke="black" stroke-linecap="butt" transform="translate(265,154)" stroke-miterlimit="0" stroke-opacity="1" fill="black" stroke-dasharray="5,5" font-family="sans-serif" stroke-linejoin="round" font-size="11px" image-rendering="optimizeQuality"
+    ><line y2="86" fill="none" x1="33" clip-path="url(#clipPath125)" x2="33" y1="34"
     /></g
-    ><g font-size="11px" transform="translate(265,155)" fill-opacity="1" fill="white" text-rendering="geometricPrecision" image-rendering="optimizeQuality" font-family="sans-serif" stroke="white" stroke-opacity="1"
-    ><circle r="4.125" clip-path="url(#clipPath125)" cx="33" cy="44.2679" stroke="none"
-      /><circle fill="none" r="4.125" clip-path="url(#clipPath125)" cx="33" cy="44.2679" stroke="black"
-      /><line clip-path="url(#clipPath125)" fill="none" x1="28.875" x2="37.125" y1="36.5714" y2="36.5714" stroke="black"
+    ><g font-size="11px" transform="translate(265,154)" fill-opacity="1" fill="white" text-rendering="geometricPrecision" image-rendering="optimizeQuality" font-family="sans-serif" stroke="white" stroke-opacity="1"
+    ><circle r="4.125" clip-path="url(#clipPath125)" cx="33" cy="45.2679" stroke="none"
+      /><circle fill="none" r="4.125" clip-path="url(#clipPath125)" cx="33" cy="45.2679" stroke="black"
+      /><line clip-path="url(#clipPath125)" fill="none" x1="28.875" x2="37.125" y1="37.5714" y2="37.5714" stroke="black"
     /></g
-    ><g stroke-linecap="butt" font-size="11px" transform="translate(298,240) rotate(-180) translate(-33,-85)" fill-opacity="1" fill="black" text-rendering="geometricPrecision" image-rendering="optimizeQuality" font-family="sans-serif" stroke-linejoin="bevel" stroke="black" stroke-opacity="1"
-    ><path fill="none" d="M33 92.1429 L28.875 85 L33 92.1429 L33 85 L33 92.1429 L37.125 85 Z" clip-path="url(#clipPath126)"
+    ><g stroke-linecap="butt" font-size="11px" transform="translate(298,240) rotate(-180) translate(-33,-86)" fill-opacity="1" fill="black" text-rendering="geometricPrecision" image-rendering="optimizeQuality" font-family="sans-serif" stroke-linejoin="bevel" stroke="black" stroke-opacity="1"
+    ><path fill="none" d="M33 93.1429 L28.875 86 L33 93.1429 L33 86 L33 93.1429 L37.125 86 Z" clip-path="url(#clipPath126)"
     /></g
-    ><g font-size="11px" transform="translate(298,240) rotate(-180) translate(-33,-85)" fill-opacity="1" fill="white" text-rendering="geometricPrecision" image-rendering="optimizeQuality" font-family="sans-serif" stroke="white" stroke-opacity="1"
-    ><circle r="4.125" clip-path="url(#clipPath126)" cx="33" cy="96.2679" stroke="none"
-      /><circle fill="none" r="4.125" clip-path="url(#clipPath126)" cx="33" cy="96.2679" stroke="black"
+    ><g font-size="11px" transform="translate(298,240) rotate(-180) translate(-33,-86)" fill-opacity="1" fill="white" text-rendering="geometricPrecision" image-rendering="optimizeQuality" font-family="sans-serif" stroke="white" stroke-opacity="1"
+    ><circle r="4.125" clip-path="url(#clipPath126)" cx="33" cy="97.2679" stroke="none"
+      /><circle fill="none" r="4.125" clip-path="url(#clipPath126)" cx="33" cy="97.2679" stroke="black"
     /></g
-    ><g font-size="11px" transform="translate(44,2)" fill-opacity="1" fill="black" text-rendering="geometricPrecision" image-rendering="optimizeQuality" font-family="sans-serif" stroke="black" stroke-opacity="1"
+    ><g font-size="11px" transform="translate(424,234)" fill-opacity="1" fill="black" text-rendering="geometricPrecision" image-rendering="optimizeQuality" font-family="sans-serif" stroke="black" stroke-opacity="1"
     ><text x="10" xml:space="preserve" y="11" clip-path="url(#clipPath127)" stroke="none"
+      >customer</text
+    ></g
+    ><g font-size="11px" transform="translate(44,2)" fill-opacity="1" fill="black" text-rendering="geometricPrecision" image-rendering="optimizeQuality" font-family="sans-serif" stroke="black" stroke-opacity="1"
+    ><text x="10" xml:space="preserve" y="11" clip-path="url(#clipPath128)" stroke="none"
       >group</text
     ></g
     ><g font-size="10px" fill-opacity="1" fill="rgb(120,120,120)" text-rendering="geometricPrecision" image-rendering="optimizeQuality" stroke="rgb(120,120,120)" stroke-opacity="1"
diff --git a/templates/admin/services/create.hamlet b/templates/admin/services/create.hamlet
index c385fa9..5051d56 100644
--- a/templates/admin/services/create.hamlet
+++ b/templates/admin/services/create.hamlet
@@ -2,17 +2,17 @@
   <div.mdc-top-app-bar__row.mdc-theme--background>
     <section.mdc-top-app-bar__section.mdc-top-app-bar__section-align-start>
       <a.mdc-top-app-bar__navigation-icon.mdc-icon-button role=button
-        href=@?{(AdminR $ AdmServicesR (Services sids),catMaybes [scrollY,open])}>
+        href=@?{(AdminR $ AdmServicesR (Services sids),catMaybes [y,o])}>
         <span.mdc-icon-button__ripple>
         <i.material-symbols-outlined>arrow_back
       <span.mdc-top-app-bar__title.mdc-theme--text-primary-on-light>_{MsgService}
 
 <main.mdc-top-app-bar--fixed-adjust>
   <form method=POST enctype=#{enctype} novalidate
-    action=@?{(AdminR $ AdmServicesR (Services sids),catMaybes [scrollY,open])}>
+    action=@?{(AdminR $ AdmServicesR (Services sids),catMaybes [y,o])}>
     ^{widget}
     <div.actions>
-      <a.mdc-button href=@?{(AdminR $ AdmServicesR (Services sids),catMaybes [scrollY,open])} role=button>
+      <a.mdc-button href=@?{(AdminR $ AdmServicesR (Services sids),catMaybes [y,o])} role=button>
         <span.mdc-button__ripple>
         <span.mdc-button__focus-ring>
         <span.mdc-button__label>_{MsgCancel}
diff --git a/templates/admin/services/edit.hamlet b/templates/admin/services/edit.hamlet
index 98434c9..3e3a007 100644
--- a/templates/admin/services/edit.hamlet
+++ b/templates/admin/services/edit.hamlet
@@ -2,7 +2,7 @@
   <div.mdc-top-app-bar__row.mdc-theme--background>
     <section.mdc-top-app-bar__section.mdc-top-app-bar__section--align-start>
       <a.mdc-top-app-bar__navigation-icon.mdc-icon-button role=button
-        href="@{AdminR $ AdmServicesR (Services sids)}?scrollY=#{scrollY}&open=subservices">
+        href="@{AdminR $ AdmServicesR (Services sids)}?y=#{y}&open=subservices">
         <span.mdc-icon-button__ripple>
         <span.mdc-icon-button__focus-ring>
         <i.material-symbols-outlined>arrow_back
@@ -10,10 +10,10 @@
         
 <main.mdc-top-app-bar--fixed-adjust>
   <form method=POST enctype=#{enctype} novalidate
-    action="@{AdminR $ AdmServiceR (Services sids)}?scrollY=#{scrollY}&open=subservices">
+    action="@{AdminR $ AdmServiceR (Services sids)}?y=#{y}&open=subservices">
     ^{widget}
     <div.actions>
-      <a.mdc-button href="@{AdminR $ AdmServicesR (Services sids)}?scrollY=#{scrollY}&open=subservices" role=button>
+      <a.mdc-button href="@{AdminR $ AdmServicesR (Services sids)}?y=#{y}&open=subservices" role=button>
         <span.mdc-button__ripple>
         <span.mdc-button__focus-ring>
         <span.mdc-button__label>_{MsgCancel}
diff --git a/templates/admin/services/expert/create.cassius b/templates/admin/services/expert/create.cassius
index f1d7cb2..9e8f999 100644
--- a/templates/admin/services/expert/create.cassius
+++ b/templates/admin/services/expert/create.cassius
@@ -8,6 +8,8 @@ main
       display: flex
       flex-direction: column
       margin-bottom: 1rem
+      input.mdc-text-field__input
+        caret-color: var(--mdc-theme-text-primary-on-light)
     div.form-actions
       display: flex
       flex-direction: row
diff --git a/templates/admin/services/expert/form.cassius b/templates/admin/services/expert/form.cassius
new file mode 100644
index 0000000..a455258
--- /dev/null
+++ b/templates/admin/services/expert/form.cassius
@@ -0,0 +1,3 @@
+
+.mdc-select__menu img
+  clip-path: circle(50%)
\ No newline at end of file
diff --git a/templates/admin/services/expert/form.hamlet b/templates/admin/services/expert/form.hamlet
new file mode 100644
index 0000000..ce4ed20
--- /dev/null
+++ b/templates/admin/services/expert/form.hamlet
@@ -0,0 +1,46 @@
+
+#{extra}
+<div.form-field>
+  <div.mdc-select.mdc-select--filled.mdc-select--required data-mdc-auto-init=MDCSelect
+    :isJust (fvErrors emplV):.mdc-select--invalid>
+    ^{fvInput emplV}
+    <div.mdc-select__anchor role=button aria-aspopup=listbox aria-expanded=false aria-required=true>
+      <span.mdc-select__ripple>
+      <span.mdc-floating-label>#{fvLabel emplV}
+      <span.mdc-select__selected-text-container>
+        <span.mdc-select__selected-text>
+      <span.mdc-select__dropdown-icon>
+        <svg.mdc-select__dropdown-icon-graphic viewBox="7 10 10 5" focusable=false>
+          <polygon.mdc-select__dropdown-icon-inactive stroke=none fill-rule=evenodd points="7 10 12 15 17 10">
+          <polygon.mdc-select__dropdown-icon-active stroke=none fill-rule=evenodd points="7 15 12 10 17 15">
+      <span.mdc-line-ripple>
+
+    <div.mdc-select__menu.mdc-menu.mdc-menu-surface.mdc-menu-surface--fullwidth>
+      <ul.mdc-deprecated-list.mdc-deprecated-list--image-list role=listbox>
+        $forall Entity eid (Staff ename _ _ _ _ _) <- staff
+          <li.mdc-deprecated-list-item role=option data-value=#{fromSqlKey eid} aria-selected=false>
+            <span.mdc-deprecated-list-item__ripple>
+            <span.mdc-deprecated-list-item__graphic>
+              <img src=@{AdminR $ AdmStaffPhotoR eid} width=56 height=56 alt=_{MsgPhoto} loading=lazy>
+            <span.mdc-deprecated-list-item__text>
+              #{ename}
+
+  $maybe errs <- fvErrors emplV
+    <div.mdc-select-helper-text.mdc-select-helper-text--validation-msg>
+      #{errs}
+
+$forall v <- [nameV,ratingV]
+  <div.form-field>
+    <label.mdc-text-field.mdc-text-field--filled data-mdc-auto-init=MDCTextField
+      :isJust (fvErrors v):.mdc-text-field--invalid
+      :isJust (fvErrors v):.mdc-text-field--with-trailing-icon>
+      <span.mdc-text-field__ripple>
+      <span.mdc-floating-label>#{fvLabel v}
+      ^{fvInput v}
+      $maybe _ <- fvErrors v
+        <i.mdc-text-field__icon.mdc-text-field__icon--trailing.material-symbols-outlined>error
+      <span.mdc-line-ripple>
+    $maybe errs <- fvErrors v
+      <div.mdc-text-field-helper-line>
+        <div.mdc-text-field-helper-text.mdc-text-field-helper-text--validation-msg aria-hidden=true>
+          #{errs}
diff --git a/templates/admin/services/offer/create.hamlet b/templates/admin/services/offer/create.hamlet
index 983edca..7e22b2c 100644
--- a/templates/admin/services/offer/create.hamlet
+++ b/templates/admin/services/offer/create.hamlet
@@ -2,7 +2,7 @@
   <div.mdc-top-app-bar__row.mdc-theme--background>
     <section.mdc-top-app-bar__section.mdc-top-app-bar__section--align-start>
       <a.mdc-top-app-bar__navigation-icon.mdc-icon-button
-        href=@?{(AdminR $ AdmServicesR (Services sids),catMaybes [scrollY,open])}>
+        href=@?{(AdminR $ AdmServicesR (Services sids),catMaybes [y,o])}>
         <span.mdc-icon-button__ripple>
         <i.material-symbols-outlined>arrow_back
       <span.mdc-top-app-bar__title.mdc-theme--text-primary-on-light>_{MsgOffer}
@@ -10,10 +10,10 @@
   
 <main.mdc-top-app-bar--fixed-adjust>
   <form method=POST enctype=#{enctype} novalidate
-    action=@?{(AdminR $ AdmOfferR (Services sids),catMaybes [scrollY,open])}>
+    action=@?{(AdminR $ AdmOfferR (Services sids),catMaybes [y,o])}>
     ^{widget}
     <div.actions>
-      <a.mdc-button href=@?{(AdminR $ AdmServicesR (Services sids),catMaybes [scrollY,open])} role=button>
+      <a.mdc-button href=@?{(AdminR $ AdmServicesR (Services sids),catMaybes [y,o])} role=button>
         <span.mdc-button__ripple>
         <span.mdc-button__focus-ring>
         <span.mdc-button__label>_{MsgCancel}
diff --git a/templates/admin/services/offer/edit.hamlet b/templates/admin/services/offer/edit.hamlet
index 72cd3ea..df9a924 100644
--- a/templates/admin/services/offer/edit.hamlet
+++ b/templates/admin/services/offer/edit.hamlet
@@ -2,17 +2,17 @@
   <div.mdc-top-app-bar__row.mdc-theme--background>
     <section.mdc-top-app-bar__section.mdc-top-app-bar__section--align-start>
       <a.mdc-top-app-bar__navigation-icon.mdc-icon-button role=button
-        href=@?{(AdminR $ AdmPriceR pid (Services sids),catMaybes [scrollY,open])}>
+        href=@?{(AdminR $ AdmPriceR pid (Services sids),catMaybes [y,o])}>
         <span.mdc-icon-button__ripple>
         <span.mdc-icon-button__focus-ring>
         <i.material-symbols-outlined>arrow_back
       <span.mdc-top-app-bar__title.mdc-theme--text-primary-on-light>_{MsgOffer}
 <main.mdc-top-app-bar--fixed-adjust>
   <form method=POST enctype=#{enctype} novalidate
-    action=@?{(AdminR $ AdmPriceR pid (Services sids),catMaybes [scrollY,open])}>
+    action=@?{(AdminR $ AdmPriceR pid (Services sids),catMaybes [y,o])}>
     ^{widget}
     <div.actions>
-      <a.mdc-button href=@?{(AdminR $ AdmPriceR pid (Services sids),catMaybes [scrollY,open])} role=button>
+      <a.mdc-button href=@?{(AdminR $ AdmPriceR pid (Services sids),catMaybes [y,o])} role=button>
         <span.mdc-button__ripple>
         <span.mdc-button__focus-ring>
         <span.mdc-button__label>_{MsgCancel}
diff --git a/templates/admin/services/offer/offer.hamlet b/templates/admin/services/offer/offer.hamlet
index 1b88902..d8ec568 100644
--- a/templates/admin/services/offer/offer.hamlet
+++ b/templates/admin/services/offer/offer.hamlet
@@ -2,7 +2,7 @@
   <div.mdc-top-app-bar__row.mdc-theme--background>
     <section.mdc-top-app-bar__section.mdc-top-app-bar__section--align-start>
       <a.mdc-top-app-bar__navigation-icon.mdc-icon-button 
-        href=@?{(AdminR $ AdmServicesR sids,catMaybes [scrollY,open,Just ("pid",pack $ show $ fromSqlKey pid)])}>
+        href=@?{(AdminR $ AdmServicesR sids,catMaybes [y,o,Just ("pid",pack $ show $ fromSqlKey pid)])}>
         <span.mdc-icon-button__ripple>
         <i.material-symbols-outlined>arrow_back
       <span.mdc-top-app-bar__title.mdc-theme--text-primary-on-light>_{MsgOffer}
@@ -12,7 +12,7 @@
         <span.mdc-icon-button__focus-ring>
         <i.material-symbols-outlined>delete
       <a.mdc-top-app-bar__action-item.mdc-icon-button role=button
-        href=@?{(AdminR $ AdmPriceEditR pid sids,catMaybes [scrollY,open])}>
+        href=@?{(AdminR $ AdmPriceEditR pid sids,catMaybes [y,o])}>
         <span.mdc-icon-button__ripple>
         <span.mdc-icon-button__focus-ring>
         <i.material-symbols-outlined>edit
@@ -27,7 +27,7 @@
             <span.mdc-button__ripple>
             <span.mdc-button__focus-ring>
             <span.mdc-button__label>_{MsgCancel}
-          <form method=POST action=@?{(AdminR $ AdmPriceDeleteR pid sids,catMaybes [scrollY,open])}>
+          <form method=POST action=@?{(AdminR $ AdmPriceDeleteR pid sids,catMaybes [y,o])}>
             <button.mdc-button.mdc-button--raised type=submit>
               <span.mdc-button__ripple>
               <span.mdc-button__focus-ring>
diff --git a/templates/admin/services/search.hamlet b/templates/admin/services/search.hamlet
index 16e3204..d61c890 100644
--- a/templates/admin/services/search.hamlet
+++ b/templates/admin/services/search.hamlet
@@ -59,7 +59,7 @@
       $forall Entity sid (Service name _ _ _ _ _) <- services
         <a.mdc-list-item href=@{AdminR $ AdmServicesR $ Services [sid]}
           .mdc-list-item--with-one-line.mdc-list-item--with-leading-image.mdc-list-item--with-trailing-icon
-          onclick="this.href = `${this.href}?scrollY=${window.scrollY}`">
+          onclick="this.href = `${this.href}?y=${window.scrollY}`">
           <span.mdc-list-item__ripple>
           <span.mdc-list-item__start>
             <img src=@{AdminR $ AdmServiceImageR sid} height=56 width=56 loading=lazy
diff --git a/templates/admin/services/services.hamlet b/templates/admin/services/services.hamlet
index a1de84e..ba5f0ae 100644
--- a/templates/admin/services/services.hamlet
+++ b/templates/admin/services/services.hamlet
@@ -12,7 +12,7 @@ $if null sids
       $else
         $with sid <- pack $ show $ fromSqlKey $ last sids
           <a.mdc-top-app-bar__navigation-icon.mdc-icon-button 
-            href=@?{(AdminR $ AdmServicesR (Services (init sids)),[("sid",sid),("scrollY",scrollY),("open","subservices")])}>
+            href=@?{(AdminR $ AdmServicesR (Services (init sids)),[("sid",sid),("y",y),("o","subservices")])}>
             <span.mdc-icon-button__ripple>
             <span.mdc-icon-button__focus-ring>
             <i.material-symbols-outlined>arrow_back
@@ -39,7 +39,8 @@ $if null sids
             <span.mdc-icon-button__focus-ring>
             <i.material-symbols-outlined>login
       $else
-        <button.mdc-top-app-bar__action-item.mdc-icon-button type=button #btnDelete>
+        <button.mdc-top-app-bar__action-item.mdc-icon-button type=button ##{btnDelete}
+          onclick="document.getElementById('#{dlgDelete}').MDCDialog.open()">
           <span.mdc-icon-button__ripple>
           <span.mdc-icon-button__focus-ring>
           <i.material-symbols-outlined>delete
@@ -48,22 +49,22 @@ $if null sids
           <span.mdc-icon-button__focus-ring>
           <i.material-symbols-outlined>edit
 
-<div.mdc-dialog data-mdc-auto-init=MDCDialog #dlgDelete>
-  <div.mdc-dialog__container>
-    <div.mdc-dialog__surface role=alertdialog tabindex=-1 aria-modal=true>
-      <h4.mdc-dialog__title>
-        _{MsgPleaseConfirm}
-      <div.mdc-dialog__content>
-        _{MsgDeleteAreYouSure}
-      <div.mdc-dialog__actions>
-        <button.mdc-dialog__button.mdc-button data-mdc-dialog-action=cancel>
-          <span.mdc-button__ripple>
-          <span.mdc-button__label>_{MsgCancel}
-        <button.mdc-dialog__button.mdc-button.mdc-button--raised type=submit form=formDelete>
-          <span.mdc-button__ripple>
-          <span.mdc-button__label>_{MsgYesDelete}
-        <form method=POST action=@{AdminR $ AdmServiceDeleteR (Services sids)} #formDelete>
-  <div.mdc-dialot__scrim>
+        <div.mdc-dialog data-mdc-auto-init=MDCDialog ##{dlgDelete}>
+          <div.mdc-dialog__container>
+            <div.mdc-dialog__surface role=alertdialog tabindex=-1 aria-modal=true>
+              <h4.mdc-dialog__title>
+                _{MsgPleaseConfirm}
+              <div.mdc-dialog__content>
+                _{MsgDeleteAreYouSure}
+              <div.mdc-dialog__actions>
+                <button.mdc-dialog__button.mdc-button data-mdc-dialog-action=cancel>
+                  <span.mdc-button__ripple>
+                  <span.mdc-button__label>_{MsgCancel}
+                <button.mdc-dialog__button.mdc-button.mdc-button--raised type=submit form=formDelete>
+                  <span.mdc-button__ripple>
+                  <span.mdc-button__label>_{MsgYesDelete}
+                <form method=POST action=@{AdminR $ AdmServiceDeleteR (Services sids)} #formDelete>
+          <div.mdc-dialot__scrim>
   
 <main.mdc-top-app-bar--fixed-adjust>
 
@@ -117,9 +118,9 @@ $if null sids
           #{preEscapedToMarkup $ unTextarea descr}
 
   $if not (null sids)
-    <details.mdc-list ##{detailsOffer} data-mdc-auto-init=MDCList :open == Just "offer":open
+    <details.mdc-list ##{detailsOffer} data-mdc-auto-init=MDCList :o == Just "offer":open
       ontoggle="this.querySelector('summary i.expand').textContent = this.open ? 'expand_less' : 'expand_more'">
-      <summary.mdc-list-item :open == Just "offer":.mdc-list-item--activated
+      <summary.mdc-list-item :o == Just "offer":.mdc-list-item--activated
         .mdc-list-item--with-one-line.mdc-list-item--with-trailing-icon>
         <span.mdc-list-item__ripple>
         <span.mdc-list-item__content>
@@ -129,9 +130,9 @@ $if null sids
               <div.badge>#{length offer}
         <span.mdc-list-item__end>
           <i.expand.material-symbols-outlined>
-            $if open == Just "offer"
+            $if o == Just "offer"
               expand_less
-            $elseif open == Nothing
+            $elseif o == Nothing
               expand_more
             $else
               expand_more
@@ -144,7 +145,7 @@ $if null sids
       $else
         <nav.mdc-list data-mdc-auto-init=MDCList>
           $forall Entity pid (Offer _ name price prefix suffix _) <- offer
-            <a.mdc-list-item href=@?{(AdminR $ AdmPriceR pid (Services sids),[("open","offer")])}
+            <a.mdc-list-item href=@?{(AdminR $ AdmPriceR pid (Services sids),[("o","offer")])}
               :Just pid == mpid:.mdc-list-item--activated
               .mdc-list-item--with-two-lines.mdc-list-item--with-trailing-icon>
               <span.mdc-list-item__ripple>
@@ -164,7 +165,7 @@ $if null sids
 
       <div.mdc-touch-target-wrapper ##{fabAddOffer}>
         <a.mdc-fab.mdc-fab--extended.mdc-fab--touch href=@{AdminR $ AdmOfferCreateR (Services sids)}
-          onclick="this.href = `${this.href}?scrollY=${window.scrollY}&open=offer`">
+          onclick="this.href = `${this.href}?y=${window.scrollY}&o=offer`">
           <span.mdc-fab__ripple>
           <span.mdc-fab__focus-ring>
           <span.mdc-fab__icon.material-symbols-outlined>add
@@ -172,9 +173,9 @@ $if null sids
           <span.mdc-fab__touch>
 
   $if not (null sids)
-    <details.mdc-list ##{detailsExperts} data-mdc-auto-init=MDCList :open == Just "experts":open
+    <details.mdc-list ##{detailsExperts} data-mdc-auto-init=MDCList :o == Just "experts":open
       ontoggle="this.querySelector('summary i.expand').textContent = this.open ? 'expand_less' : 'expand_more'">
-      <summary.mdc-list-item :open == Just "experts":.mdc-list-item--activated
+      <summary.mdc-list-item :o == Just "experts":.mdc-list-item--activated
         .mdc-list-item--with-one-line.mdc-list-item--with-trailing-icon>
         <span.mdc-list-item__ripple>
         <span.mdc-list-item__content>
@@ -184,9 +185,9 @@ $if null sids
               <div.badge>#{length experts}
         <span.mdc-list-item__end>
           <i.expand.material-symbols-outlined>
-            $if open == Just "experts"
+            $if o == Just "experts"
               expand_less
-            $elseif open == Nothing
+            $elseif o == Nothing
               expand_more
             $else
               expand_more
@@ -199,8 +200,10 @@ $if null sids
       $else
         <nav.mdc-list data-mdc-auto-init=MDCList>
           $forall (Entity rid (Role _ _ rname rating),Entity eid (Staff ename _ _ _ _ _)) <- experts
-            <a.mdc-list-item.mdc-list-item--with-leading-image href=@?{(AdminR $ AdmExpertR rid (Services sids),stati)}
-              .mdc-list-item--with-three-lines.mdc-list-item--with-trailing-icon>
+            <a.mdc-list-item.mdc-list-item--with-leading-image 
+              href=@?{(AdminR $ AdmExpertR rid (Services sids),[("o","experts")])}
+              .mdc-list-item--with-three-lines.mdc-list-item--with-trailing-icon
+              onclick="this.href = [new window.URL(this.href)].map(x => {x.searchParams.append('y',window.scrollY); return x.href;})[0]">
               <span.mdc-list-item__ripple>
               <span.mdc-list-item__start>
                 <img src=@{AdminR $ AdmStaffPhotoR eid} width=56 height=56 alt=_{MsgPhoto} loading=lazy>
@@ -221,8 +224,8 @@ $if null sids
 
       <div.mdc-touch-target-wrapper ##{fabAddExpert}>
         <a.mdc-fab.mdc-fab--extended.mdc-fab--touch 
-          href=@?{(AdminR $ AdmExpertCreateR (Services sids),[("open","experts")])}
-          onclick="this.href = [new window.URL(this.href)].map(x => {x.searchParams.append('scrollY',window.scrollY); return x.href;})[0]">
+          href=@?{(AdminR $ AdmExpertCreateR (Services sids),[("o","experts")])}
+          onclick="this.href = [new window.URL(this.href)].map(x => {x.searchParams.append('y',window.scrollY); return x.href;})[0]">
           <span.mdc-fab__ripple>
           <span.mdc-fab__focus-ring>
           <span.mdc-fab__icon.material-symbols-outlined>add
@@ -231,9 +234,9 @@ $if null sids
       
             
   $if not (null sids)
-    <details.mdc-list ##{detailsSubservices} data-mdc-auto-init=MDCList :open == Just "subservices":open
+    <details.mdc-list ##{detailsSubservices} data-mdc-auto-init=MDCList :o == Just "subservices":open
       ontoggle="this.querySelector('summary i.expand').textContent = this.open ? 'expand_less' : 'expand_more'">
-      <summary.mdc-list-item :open == Just "subservices":.mdc-list-item--activated
+      <summary.mdc-list-item :o == Just "subservices":.mdc-list-item--activated
         .mdc-list-item--with-one-line.mdc-list-item--with-trailing-icon>
         <span.mdc-list-item__ripple>
         <span.mdc-list-item__content>
@@ -243,9 +246,9 @@ $if null sids
               <div.badge>#{length services}
         <span.mdc-list-item__end>
           <i.expand.material-symbols-outlined>
-            $if open == Just "subservices"
+            $if o == Just "subservices"
               expand_less
-            $elseif open == Nothing
+            $elseif o == Nothing
               expand_more
             $else
               expand_more
diff --git a/templates/admin/services/services.julius b/templates/admin/services/services.julius
index 10cce17..c8600b6 100644
--- a/templates/admin/services/services.julius
+++ b/templates/admin/services/services.julius
@@ -1,23 +1,14 @@
 
-window.scroll(0,#{scrollY});
+window.scroll(0,#{y});
 
 window.mdc.autoInit();
 
-[document.getElementById('btnDelete')].filter(x => !!x).forEach(function (x) {
-  x.addEventListener('click',function (e) {
-    document.getElementById('dlgDelete').MDCDialog.open();
-  });
-});
-
-[ [ #{detailsDescription},
-    #{detailsOffer},
-    #{detailsExperts},
-    #{detailsSubservices}
-  ]
-].forEach(function (xs) {
-   xs.filter(x => !!x).forEach(function (x) {
-     document.getElementById(x).addEventListener('click',function (e) {
-       xs.filter(y => y !== x).map(x => document.getElementById(x)).filter(x => !!x).forEach(function (x) {
+[Array.from(
+  document.querySelectorAll('details.mdc-list')
+)].forEach(function (xs) {
+   xs.forEach(function (x) {
+     x.addEventListener('click',function (e) {
+       xs.filter(y => y !== x).forEach(function (x) {
 	 x.removeAttribute('open');
        });
      });
diff --git a/templates/admin/services/subservices.hamlet b/templates/admin/services/subservices.hamlet
index f30708a..51ea3b7 100644
--- a/templates/admin/services/subservices.hamlet
+++ b/templates/admin/services/subservices.hamlet
@@ -10,7 +10,7 @@
       <a.mdc-list-item href=@{AdminR $ AdmServicesR $ Services (sids ++ [sid])}
         :Just sid == msid:.mdc-list-item--activated
         .mdc-list-item--with-one-line.mdc-list-item--with-leading-image.mdc-list-item--with-trailing-icon
-        onclick="this.href = `${this.href}?scrollY=${window.scrollY}`">
+        onclick="this.href = `${this.href}?y=${window.scrollY}`">
         <span.mdc-list-item__ripple>
         <span.mdc-list-item__start>
           <img src=@{AdminR $ AdmServiceImageR sid} height=56 width=56 loading=lazy
@@ -27,7 +27,7 @@
   <div.mdc-touch-target-wrapper #fabAddSubservice>
     <a.mdc-fab.mdc-fab--extended.mdc-fab--touch
       href=@?{(AdminR $ AdmServiceCreateFormR (Services sids),[("open","subservices")])}
-      onclick="this.href = `${this.href}&scrollY=${window.scrollY}`">
+      onclick="this.href = `${this.href}&y=${window.scrollY}`">
       <span.mdc-fab__ripple>
       <span.mdc-fab__focus-ring>
       <span.mdc-fab__icon.material-symbols-outlined>add
diff --git a/templates/admin/staff/staff.cassius b/templates/admin/staff/staff.cassius
index f4198a5..d04d1a2 100644
--- a/templates/admin/staff/staff.cassius
+++ b/templates/admin/staff/staff.cassius
@@ -1,14 +1,17 @@
 
-#fabAddStaff
+main
+  nav.mdc-list
+    margin-bottom: 4rem
+    .mdc-list-item--activated .mdc-list-item__primary-text
+      color: var(--theme-accent)
+    .mdc-list-item__start img
+      clip-path: circle(50%)
+
+##{fabAddStaff}
   position: fixed
   right: 1rem
   bottom: 1rem
   z-index: 1
 
-nav.mdc-list
-  margin-bottom: 4rem
-  .mdc-list-item--activated .mdc-list-item__primary-text
-    color: var(--theme-accent)
-
 aside.mdc-snackbar
   bottom: 5rem
\ No newline at end of file
diff --git a/templates/admin/staff/staff.hamlet b/templates/admin/staff/staff.hamlet
index a006470..d44b162 100644
--- a/templates/admin/staff/staff.hamlet
+++ b/templates/admin/staff/staff.hamlet
@@ -58,7 +58,7 @@
       <figcaption>
         _{MsgNoStaffYet}.
 
-  <div.mdc-touch-target-wrapper #fabAddStaff>
+  <div.mdc-touch-target-wrapper ##{fabAddStaff}>
     <a.mdc-fab.mdc-fab--touch href=@{AdminR AdmStaffCreateR}>
       <span.mdc-fab__ripple>
       <span.mdc-fab__focus-ring>
diff --git a/templates/appointments/appointment.cassius b/templates/appointments/appointment.cassius
index 7203587..d150b98 100644
--- a/templates/appointments/appointment.cassius
+++ b/templates/appointments/appointment.cassius
@@ -1,7 +1,21 @@
 
 main
-  margin: 0 1rem 1rem 1rem
-  details.mdc-list
-    padding: 0
-    section.mdc-card-wrapper__text-section
-      margin: 0 1rem
\ No newline at end of file
+  padding: 1rem 0
+  .mdc-card
+    .mdc-card__media-content h4
+      position: absolute
+      bottom: 0
+      left: 0
+      padding: 0.2rem 1rem
+      color: var(--mdc-theme-text-primary-on-light)
+      background-color: var(--mdc-theme-primary)
+    details.mdc-list
+      padding: 0
+      section.mdc-card-wrapper__text-section
+        margin: 0 1rem
+
+@media screen and (max-width: 768px)
+  main div.mdc-card
+    box-shadow: none
+    border-radius: 0
+    background: none
\ No newline at end of file
diff --git a/templates/appointments/appointment.hamlet b/templates/appointments/appointment.hamlet
index c14e5a9..7d55f0d 100644
--- a/templates/appointments/appointment.hamlet
+++ b/templates/appointments/appointment.hamlet
@@ -29,11 +29,12 @@
         <div.mdc-card>
           <div.mdc-card__primary-action>
             <div.mdc-card__media.mdc-card__media--16-9 style="background-image:url('@{ServiceThumbnailR sid}')">
-              $maybe Entity _ (Thumbnail _ _ _ attrib) <- thumbnail
-                $maybe attribution <- attrib
-                  <div.mdc-card__media-content
-                    style="text-align:end;font-size:0.5rem;position:relative;bottom:0;margin-right:4px">
-                    ^{attribution}
+              <div.mdc-card__media-content>
+                $maybe Entity _ (Thumbnail _ _ _ attrib) <- thumbnail
+                  $maybe attribution <- attrib
+                    <div style="text-align:end;font-size:0.5rem;position:absolute;bottom:0;right:0;padding-right:4px">
+                      ^{attribution}
+                <h4>#{sname}
             <div.mdc-card__ripple>
 
           <details.mdc-list.mdc-card-wrapper__text-section
@@ -99,36 +100,36 @@
             <section.mdc-card-wrapper__text-section #appointmentFullLongTime>
               #{show date} #{show time}
 
-          $maybe Entity eid (Staff ename _ _ _ _ _) <- staff
-            <details.mdc-list.mdc-card-wrapper__text-section
-              ontoggle="this.querySelector('summary i.expand').textContent = this.open ? 'expand_less' : 'expand_more'">
-              <summary.mdc-list-item.mdc-list-item--with-leading-icon.mdc-list-item--with-one-line
-                .mdc-list-item--with-trailing-icon>
-                <span.mdc-list-item__ripple>
-                <span.mdc-list-item__start>
-                 <i.material-symbols-outlined>emoji_people
-                <span.mdc-list-item__content>
-                  <div.mdc-list-item__primary-text style="color:var(--mdc-theme-text-hint-on-light)">
-                    _{MsgAcquaintance}
-                <span.mdc-list-item__end>
-                 <i.expand.material-symbols-outlined>expand_more
-              <div style="display:flex;flex-direction:row;align-items:flex-start;justify-content:space-around">
-                $maybe Entity uid (User uname _ _ fname _) <- user
-                  <figure style="margin:0;padding:0;text-align:center">
-                    <img src=@{AccountPhotoR uid} width=56 height=56 style="clip-path:circle(50%)" alt=_{MsgPhoto}
-                      onerror="this.src = '@{PhotoPlaceholderR}'">
-                    <figcaption style="line-height:1">
-                      <small>
-                        $maybe fname <- fname
-                          #{fname}
-                        $nothing
-                          #{uname}
-                      <div>
-                        <small>(_{MsgCustomer})
-
-                  <i.material-symbols-outlined style="align-self:center;color:var(--mdc-theme-text-icon-on-background)">
-                    handshake
-
+          <details.mdc-list.mdc-card-wrapper__text-section
+            ontoggle="this.querySelector('summary i.expand').textContent = this.open ? 'expand_less' : 'expand_more'">
+            <summary.mdc-list-item.mdc-list-item--with-leading-icon.mdc-list-item--with-one-line
+              .mdc-list-item--with-trailing-icon>
+              <span.mdc-list-item__ripple>
+              <span.mdc-list-item__start>
+               <i.material-symbols-outlined>emoji_people
+              <span.mdc-list-item__content>
+                <div.mdc-list-item__primary-text style="color:var(--mdc-theme-text-hint-on-light)">
+                  _{MsgAcquaintance}
+              <span.mdc-list-item__end>
+               <i.expand.material-symbols-outlined>expand_more
+            <div style="margin:0.5rem 0;display:flex;flex-direction:row;align-items:flex-start;justify-content:space-around">
+              $maybe Entity uid (User uname _ _ fname _) <- user
+                <figure style="margin:0;padding:0;text-align:center">
+                  <img src=@{AccountPhotoR uid} width=56 height=56 style="clip-path:circle(50%)" alt=_{MsgPhoto}
+                    onerror="this.src = '@{PhotoPlaceholderR}'">
+                  <figcaption style="line-height:1">
+                    <small>
+                      $maybe fname <- fname
+                        #{fname}
+                      $nothing
+                        #{uname}
+                    <div>
+                      <small>(_{MsgCustomer})
+
+                <i.material-symbols-outlined style="align-self:center;color:var(--mdc-theme-text-icon-on-background)">
+                  handshake
+
+              $maybe Entity eid (Staff ename _ _ _ _ _) <- staff
                 <figure style="margin:0;padding:0;text-align:center">
                   <img src=@{AdminR $ AdmStaffPhotoR eid} width=56 height=56 alt=_{MsgPhoto} loading=lazy
                     style="clip-path:circle(50%)">
@@ -137,6 +138,9 @@
                     $maybe Entity _ (Role _ _ rname _) <- role
                       <div>
                         <small>(#{rname})
+              $nothing
+                <figure style="margin:0;padding:0">
+                  <i.material-symbols-outlined style="font-size:3rem">indeterminate_question_box
 
           $maybe Entity _ (Contents _ content) <- location
             <details.mdc-list.mdc-card-wrapper__text-section
diff --git a/templates/appointments/appointments.hamlet b/templates/appointments/appointments.hamlet
index 65c008f..6343a39 100644
--- a/templates/appointments/appointments.hamlet
+++ b/templates/appointments/appointments.hamlet
@@ -35,27 +35,23 @@
             <span.mdc-button__label>_{MsgBookAppointment}
   $else
     <nav.mdc-list data-mdc-auto-init=MDCList>
-      $forall (Entity bid (Book _ _ _ date time _ status),Entity _ (Service sname _ _ dur _ _)) <- books
-        <a.mdc-list-item href=@{AppointmentR bid}
-          .mdc-list-item--with-leading-icon.mdc-list-item--with-three-lines.mdc-list-item--with-trailing-icon>
-          <span.mdc-list-item__ripple>
-          <span.mdc-list-item__start>
-            $with (color,icon,msg) <- resolve status
+      $forall (Entity bid (Book _ _ _ date time _ status),Entity _ (Service sname _ _ _ _ _)) <- books
+        $with (color,icon,msg) <- resolve status
+          <a.mdc-list-item href=@{AppointmentR bid}
+            .mdc-list-item--with-leading-icon.mdc-list-item--with-three-lines.mdc-list-item--with-trailing-icon>
+            <span.mdc-list-item__ripple>
+            <span.mdc-list-item__start>
               <i.material-symbols-outlined style="color:#{color}" title=_{msg}>#{icon}                
-          <span.mdc-list-item__content>
-            <div.appointment-time.mdc-list-item__primary-text>
-              #{show date} #{show time}
-            <div.mdc-list-item__secondary-text>
-              #{sname}
-            <div.mdc-list-item__secondary-text>
-              $maybe duration <- dur
-                $with translate <- renderMessage app langs
-                  $with pat <- intercalate "" ["%H",translate MsgSymbolHour," %M",translate MsgSymbolMinute]
-                    $with duration <- formatTime defaultTimeLocale (unpack pat) duration
-                      #{duration}
-          <span.mdc-list-item__end>
-            <i.material-symbols-outlined>arrow_forward_ios
-        <div.mdc-list-divider role=separator>
+            <span.mdc-list-item__content>
+              <div.appointment-time.mdc-list-item__primary-text>
+                #{show date} #{show time}
+              <div.mdc-list-item__secondary-text style="white-space:nowrap;overflow:hidden;text-overflow:ellipsis">
+                #{sname}
+              <div.mdc-list-item__secondary-text style="white-space:nowrap;overflow:hidden;text-overflow:ellipsis">
+                _{msg}
+            <span.mdc-list-item__end>
+              <i.material-symbols-outlined>arrow_forward_ios
+          <div.mdc-list-divider role=separator>
 
 $forall (_,msg) <- msgs
   <aside.mdc-snackbar data-mdc-auto-init=MDCSnackbar>
diff --git a/templates/appointments/hist.hamlet b/templates/appointments/hist.hamlet
index d1733b1..9d5acf1 100644
--- a/templates/appointments/hist.hamlet
+++ b/templates/appointments/hist.hamlet
@@ -15,35 +15,6 @@
       <figcaption>
         _{MsgNoHistoryYet}.
   $else
-    $maybe Entity _ (Book _ _ _ day time tz status) <- book
-      $with (color,icon,msg) <- resolve status
-        <details.mdc-list data-mdc-auto-init=MDCList
-          ontoggle="this.querySelector('summary i.expand').textContent = this.open ? 'expand_less' : 'expand_more'">
-          <summary.mdc-list-item.mdc-list-item--with-leading-icon.mdc-list-item--with-two-lines
-            .mdc-list-item--with-trailing-icon>
-            <span.mdc-list-item__ripple>
-            <span.mdc-list-item__start>
-              <i.material-symbols-outlined style="color:#{color}">#{icon}
-            <span.mdc-list-item__content>
-              <div.datetime.mdc-list-item__primary-text>
-                #{show now}
-              <div.mdc-list-item__secondary-text>
-                _{msg}
-            <span.mdc-list-item__end>
-              <i.expand.material-symbols-outlined>expand_more
-          <dl>
-            <dt>_{MsgDay}
-            <dd>#{show day}
-
-            <dt>_{MsgTime}
-            <dd>#{show time}
-
-            <dt>_{MsgTimezone}
-            <dd>#{show tz}
-
-            <dt>_{MsgStatus}
-            <dd>#{show status}
-        <div.mdc-list-divider role=separator>  
     $forall Entity _ (Hist _ logtime day time tz status) <- hist
       $with (color,icon,msg) <- resolve status
         <details.mdc-list data-mdc-auto-init=MDCList
@@ -54,8 +25,9 @@
             <span.mdc-list-item__start>
               <i.material-symbols-outlined style="color:#{color}">#{icon}
             <span.mdc-list-item__content>
-              <div.datetime.mdc-list-item__primary-text>
-                #{show logtime}
+              $with dt <- formatTime defaultTimeLocale "%Y-%m-%d %H:%M:%S" logtime
+                <time.mdc-list-item__primary-text datetime="#{dt}">
+                  #{dt}
               <div.mdc-list-item__secondary-text>
                 _{msg}
             <span.mdc-list-item__end>
diff --git a/templates/appointments/hist.julius b/templates/appointments/hist.julius
index 72328e9..b8da590 100644
--- a/templates/appointments/hist.julius
+++ b/templates/appointments/hist.julius
@@ -1,8 +1,8 @@
 
 Array.from(
-  document.querySelectorAll('.datetime')
+  document.querySelectorAll('time[datetime]')
 ).forEach(function (x) {
-  x.textContent = new Date(x.textContent).toLocaleDateString(
+  x.textContent = new Date(x.getAttribute('datetime')).toLocaleDateString(
     navigator.language,
     { weekday: 'short',
       year: 'numeric',
diff --git a/templates/login.cassius b/templates/login.cassius
index 10bf6b2..dd6534d 100644
--- a/templates/login.cassius
+++ b/templates/login.cassius
@@ -40,5 +40,8 @@ div.mdc-dialog
           flex-direction: row
           justify-content: space-between
           align-items: center
+    form hr
+      width: 100%
+      opacity: 0.6
   div.mdc-dialog__actions
     gap: 1rem
\ No newline at end of file
diff --git a/templates/login.hamlet b/templates/login.hamlet
index 808c7ac..771d8aa 100644
--- a/templates/login.hamlet
+++ b/templates/login.hamlet
@@ -66,7 +66,7 @@
         <h4.mdc-dialog__title>_{MsgDemoUserAccounts}
       <div.mdc-dialog__content>
         <form name=formUserOptions>
-          $forall (Value uid,Value uname) <- users
+          $forall (Value uid,Value uname,Value staff) <- users
             $with ident <- T.pack $ show $ fromSqlKey uid
               <div.mdc-form-field>
                 <div.mdc-radio tabindex=-1 data-mdc-auto-init=MDCRadio>
@@ -77,10 +77,17 @@
                   <div.mdc-radio__ripple>
                   <div.mdc-radio__focus-ring>
                 <label for=radio#{ident}>
-                  <span>#{uname}
-                  <img src=@{AccountPhotoR uid} style="clip-path:circle(50%)" width=24 height=24 alt=_{MsgPhoto}
+                  <span style="line-height:1">
+                    <div>#{uname}
+                    <small style="color:var(--mdc-theme-text-hint-on-light);text-transform:lowercase">
+                      $if staff
+                        _{MsgEmployee}
+                      $else
+                        _{MsgCustomer}
+                  <img src=@{AccountPhotoR uid} style="clip-path:circle(50%)" width=48 height=48 alt=_{MsgPhoto}
                     onerror="this.src = '@{PhotoPlaceholderR}'">
-              
+            <hr>
+            
       <div.mdc-dialog__actions>
         <button.mdc-button type=button data-mdc-dialog-action=close>
           <span.mdc-button__ripple>
diff --git a/templates/requests/hist.hamlet b/templates/requests/hist.hamlet
index d27e758..8b67ef5 100644
--- a/templates/requests/hist.hamlet
+++ b/templates/requests/hist.hamlet
@@ -15,35 +15,6 @@
       <figcaption>
         _{MsgNoHistoryYet}.
   $else
-    $maybe Entity _ (Book _ _ _ day time tz status) <- book
-      $with (color,icon,msg) <- resolve status
-        <details.mdc-list data-mdc-auto-init=MDCList
-          ontoggle="this.querySelector('summary i.expand').textContent = this.open ? 'expand_less' : 'expand_more'">
-          <summary.mdc-list-item.mdc-list-item--with-leading-icon.mdc-list-item--with-two-lines
-            .mdc-list-item--with-trailing-icon>
-            <span.mdc-list-item__ripple>
-            <span.mdc-list-item__start>
-              <i.material-symbols-outlined style="color:#{color}">#{icon}
-            <span.mdc-list-item__content>
-              <div.datetime.mdc-list-item__primary-text>
-                #{show now}
-              <div.mdc-list-item__secondary-text>
-                _{msg}
-            <span.mdc-list-item__end>
-              <i.expand.material-symbols-outlined>expand_more
-          <dl>
-            <dt>_{MsgDay}
-            <dd>#{show day}
-
-            <dt>_{MsgTime}
-            <dd>#{show time}
-
-            <dt>_{MsgTimezone}
-            <dd>#{show tz}
-
-            <dt>_{MsgStatus}
-            <dd>#{show status}
-        <div.mdc-list-divider role=separator>  
     $forall Entity _ (Hist _ logtime day time tz status) <- hist
       $with (color,icon,msg) <- resolve status
         <details.mdc-list data-mdc-auto-init=MDCList
@@ -54,8 +25,9 @@
             <span.mdc-list-item__start>
               <i.material-symbols-outlined style="color:#{color}">#{icon}
             <span.mdc-list-item__content>
-              <div.datetime.mdc-list-item__primary-text>
-                #{show logtime}
+              $with dt <- formatTime defaultTimeLocale "%Y-%m-%d %H:%M:%S" logtime
+                <time.mdc-list-item__primary-text datetime="#{dt}">
+                  #{dt}
               <div.mdc-list-item__secondary-text>
                 _{msg}
             <span.mdc-list-item__end>
diff --git a/templates/requests/hist.julius b/templates/requests/hist.julius
index 72328e9..b8da590 100644
--- a/templates/requests/hist.julius
+++ b/templates/requests/hist.julius
@@ -1,8 +1,8 @@
 
 Array.from(
-  document.querySelectorAll('.datetime')
+  document.querySelectorAll('time[datetime]')
 ).forEach(function (x) {
-  x.textContent = new Date(x.textContent).toLocaleDateString(
+  x.textContent = new Date(x.getAttribute('datetime')).toLocaleDateString(
     navigator.language,
     { weekday: 'short',
       year: 'numeric',
diff --git a/templates/requests/request.cassius b/templates/requests/request.cassius
index 7203587..d150b98 100644
--- a/templates/requests/request.cassius
+++ b/templates/requests/request.cassius
@@ -1,7 +1,21 @@
 
 main
-  margin: 0 1rem 1rem 1rem
-  details.mdc-list
-    padding: 0
-    section.mdc-card-wrapper__text-section
-      margin: 0 1rem
\ No newline at end of file
+  padding: 1rem 0
+  .mdc-card
+    .mdc-card__media-content h4
+      position: absolute
+      bottom: 0
+      left: 0
+      padding: 0.2rem 1rem
+      color: var(--mdc-theme-text-primary-on-light)
+      background-color: var(--mdc-theme-primary)
+    details.mdc-list
+      padding: 0
+      section.mdc-card-wrapper__text-section
+        margin: 0 1rem
+
+@media screen and (max-width: 768px)
+  main div.mdc-card
+    box-shadow: none
+    border-radius: 0
+    background: none
\ No newline at end of file
diff --git a/templates/requests/request.hamlet b/templates/requests/request.hamlet
index f470d60..fddafc4 100644
--- a/templates/requests/request.hamlet
+++ b/templates/requests/request.hamlet
@@ -30,11 +30,12 @@
         <div.mdc-card>
           <div.mdc-card__primary-action>
             <div.mdc-card__media.mdc-card__media--16-9 style="background-image:url('@{ServiceThumbnailR sid}')">
-              $maybe Entity _ (Thumbnail _ _ _ attrib) <- thumbnail
-                $maybe attribution <- attrib
-                  <div.mdc-card__media-content
-                    style="text-align:end;font-size:0.5rem;position:relative;bottom:0;margin-right:4px">
-                    ^{attribution}
+              <div.mdc-card__media-content>
+                $maybe Entity _ (Thumbnail _ _ _ attrib) <- thumbnail
+                  $maybe attribution <- attrib
+                    <div style="text-align:end;font-size:0.5rem;position:absolute;bottom:0;right:0;padding-right:4px">
+                      ^{attribution}
+                <h4>#{sname}
             <div.mdc-card__ripple>
 
           <details.mdc-list.mdc-card-wrapper__text-section
@@ -100,21 +101,21 @@
             <section.appointment-datetime.mdc-card-wrapper__text-section>
               #{show date} #{show time}
 
-          $maybe Entity eid (Staff ename _ _ _ _ _) <- staff
-            <details.mdc-list.mdc-card-wrapper__text-section
-              ontoggle="this.querySelector('summary i.expand').textContent = this.open ? 'expand_less' : 'expand_more'">
-              <summary.mdc-list-item.mdc-list-item--with-leading-icon
-                .mdc-list-item--with-one-line.mdc-list-item--with-trailing-icon>
-                <span.mdc-list-item__ripple>
-                <span.mdc-list-item__start>
-                 <i.material-symbols-outlined>emoji_people
-                <span.mdc-list-item__content>
-                  <div.mdc-list-item__primary-text style="color:var(--mdc-theme-text-hint-on-light)">
-                    _{MsgAcquaintance}
-                <span.mdc-list-item__end>
-                 <i.expand.material-symbols-outlined>expand_more
-              <div style="display:flex;flex-direction:row;align-items:flex-start;justify-content:space-around">
+          <details.mdc-list.mdc-card-wrapper__text-section
+            ontoggle="this.querySelector('summary i.expand').textContent = this.open ? 'expand_less' : 'expand_more'">
+            <summary.mdc-list-item.mdc-list-item--with-leading-icon
+              .mdc-list-item--with-one-line.mdc-list-item--with-trailing-icon>
+              <span.mdc-list-item__ripple>
+              <span.mdc-list-item__start>
+               <i.material-symbols-outlined>emoji_people
+              <span.mdc-list-item__content>
+                <div.mdc-list-item__primary-text style="color:var(--mdc-theme-text-hint-on-light)">
+                  _{MsgAcquaintance}
+              <span.mdc-list-item__end>
+               <i.expand.material-symbols-outlined>expand_more
+            <div style="display:flex;flex-direction:row;align-items:flex-start;justify-content:space-around">
 
+              $maybe Entity eid (Staff ename _ _ _ _ _) <- staff
                 <figure style="margin:0;padding:0;text-align:center">
                   <img src=@{AdminR $ AdmStaffPhotoR eid} width=56 height=56 alt=_{MsgPhoto} loading=lazy
                     style="clip-path:circle(50%)">
@@ -123,22 +124,25 @@
                     $maybe Entity _ (Role _ _ rname _) <- role
                       <div>
                         <small>(#{rname})
+              $nothing
+                <figure style="margin:0;padding:0">
+                  <i.material-symbols-outlined style="font-size:3rem">indeterminate_question_box
 
-                <i.material-symbols-outlined style="align-self:center;color:var(--mdc-theme-text-icon-on-background)">
-                  handshake
+              <i.material-symbols-outlined style="align-self:center;color:var(--mdc-theme-text-icon-on-background)">
+                handshake
 
-                $with Entity uid (User uname _ _ fname _) <- customer
-                  <figure style="margin:0;padding:0;text-align:center">
-                    <img src=@{AccountPhotoR uid} width=56 height=56 style="clip-path:circle(50%)" alt=_{MsgPhoto}
-                      onerror="this.src = '@{PhotoPlaceholderR}'">
-                    <figcaption style="line-height:1">
-                      <small>
-                        $maybe fname <- fname
-                          #{fname}
-                        $nothing
-                          #{uname}
-                      <div>
-                        <small>(_{MsgCustomer})
+              $with Entity uid (User uname _ _ fname _) <- customer
+                <figure style="margin:0;padding:0;text-align:center">
+                  <img src=@{AccountPhotoR uid} width=56 height=56 style="clip-path:circle(50%)" alt=_{MsgPhoto}
+                    onerror="this.src = '@{PhotoPlaceholderR}'">
+                  <figcaption style="line-height:1">
+                    <small>
+                      $maybe fname <- fname
+                        #{fname}
+                      $nothing
+                        #{uname}
+                    <div>
+                      <small>(_{MsgCustomer})
 
           $maybe Entity _ (Contents _ content) <- location
             <details.mdc-list.mdc-card-wrapper__text-section