Ameliore mobile utilization

3 files changed, 12 insertions, 15 deletions

diff --git a/src/main/scala/reading/component/widget/Popup.scala b/src/main/scala/reading/component/widget/Popup.scala
index f47bc1c..86b47bf 100644
--- a/src/main/scala/reading/component/widget/Popup.scala
+++ b/src/main/scala/reading/component/widget/Popup.scala
@@ -10,7 +10,6 @@ import scalacss.Defaults._
 import scalacss.ScalatagsCss._
 
 import reading.component.widget.style.{ Popup => PopupStyle }
-import reading.component.style.{ Color => C }
 import reading.utils.{ RxAttr }
 
 object Popup {
@@ -30,9 +29,9 @@ object Popup {
         PopupStyle.content,
         content,
         button(
-          PopupStyle.cross,
+          PopupStyle.close,
           RxAttr(onclick, Rx(() => close(onClose))),
-          Cross(20.px, C.stiletto.value)
+          "Fermer"
         )
       )
     )
diff --git a/src/main/scala/reading/component/widget/style/Cross.scala b/src/main/scala/reading/component/widget/style/Cross.scala
index 485e1e9..2e4b990 100644
--- a/src/main/scala/reading/component/widget/style/Cross.scala
+++ b/src/main/scala/reading/component/widget/style/Cross.scala
@@ -15,7 +15,7 @@ object Cross extends StyleSheet.Inline {
     content := "\"\"",
     position.absolute,
     left(40.%%),
-    width(20.%%),
+    width(30.%%),
     height(100.%%),
 
     transform := "rotate(45deg)"
@@ -25,7 +25,7 @@ object Cross extends StyleSheet.Inline {
     content := "\"\"",
     position.absolute,
     left(40.%%),
-    width(20.%%),
+    width(30.%%),
     height(100.%%),
 
     transform := "rotate(-45deg)"
diff --git a/src/main/scala/reading/component/widget/style/Popup.scala b/src/main/scala/reading/component/widget/style/Popup.scala
index ea67d9e..8b77e98 100644
--- a/src/main/scala/reading/component/widget/style/Popup.scala
+++ b/src/main/scala/reading/component/widget/style/Popup.scala
@@ -3,7 +3,7 @@ package reading.component.widget.style
 import scalacss.Defaults._
 
 import reading.Media
-import reading.component.style.{ Color => C }
+import reading.component.style.{ Color => C, Button }
 
 object Popup extends StyleSheet.Inline {
   import dsl._
@@ -46,17 +46,15 @@ object Popup extends StyleSheet.Inline {
     ),
     Media.mobile(
       width(100.%%),
-      height(100.%%)
+      height(100.%%),
+      overflowY.auto
     ),
-    padding(30.px)
+    padding(30.px, 30.px, 0.px, 30.px)
   )
 
-  val cross = style(
-    position.absolute,
-    top(30.px),
-    right(30.px),
-    width(20.px),
-    height(20.px),
-    cursor.pointer
+  val close = style(
+    Button.simple,
+    marginTop(20.px),
+    marginBottom(30.px)
   )
 }