locker: remove pixel measurements from default css

.gitignore

@@ -1,2 +1,3 @@
 subprojects/.wraplock
 build
+.cache

data/css/default.css

@@ -198,9 +198,6 @@
     border-radius: 10px;
     background: #0004;
 }
-.wf-locker .fingerprint-overlay-image {
-    -gtk-icon-size: 64px;
-}
 .wf-locker .fingerprint-overlay-image.good {
     color: #0f0;
 }
@@ -211,36 +208,46 @@
     color: #88f;
 }
 
-.wf-locker .mpris image.albumart {
-    -gtk-icon-size:96px;
-}
 .wf-locker .user label {
-    font-size: 70px;
     font-weight: bold;
     text-transform: capitalize;
 }
-.wf-locker .user image {
-    -gtk-icon-size:256px;
-}
 .wf-locker image.weather {
-    -gtk-icon-size:128px;
     padding-left: 25px;
     padding-right: 25px;
     padding-bottom: 100px;
 }
 .wf-locker label.weather {
-    font-size: 128px;
     font-weight: bold;
     padding-left: 100px;
     padding-bottom: 75px;
 }
 .wf-locker label.clock {
-    font-size: 128px;
     font-weight: bold;
     padding-right: 100px;
     padding-bottom: 75px;
 }
 
+.wf-locker.sized-480 {
+    font-size:6px;
+}
+
+.wf-locker.sized-720 {
+    font-size:7px;
+}
+
+.wf-locker.sized-1080 {
+    font-size:10px;
+}
+
+.wf-locker.sized-1440 {
+    font-size:14px;
+}
+
+.wf-locker.sized-2160 {
+    font-size:18px;
+}
+
 @keyframes embiggen {
     to {
         -gtk-icon-size: 64px;

metadata/locker.xml

@@ -186,11 +186,11 @@
 	</option>
 	<option name="pin_pad_font" type="string">
 		<_short>Pin Pad Font</_short>
-		<default>32pt default</default>
+		<default>2em default</default>
 	</option>
 	<option name="pin_reply_font" type="string">
 		<_short>Pin Reply Font</_short>
-		<default>20pt default</default>
+		<default>2em default</default>
 	</option>
 	<option name="pin_always" type="bool">
 	    <_short>Always show</_short>
@@ -245,11 +245,19 @@
 	</option>
 	<option name="fingerprint_font" type="string">
 		<_short>Fingerprint Reply Font</_short>
-		<default>default</default>
+		<default>2em default</default>
 	</option>
-	<option name="fingerprint_icon_size" type="int">
+	<option name="fingerprint_icon_size" type="double">
 		<_short>Fingerprint Icon Size</_short>
-		<default>128</default>
+		<default>10</default>
+		<min>0.5</min>
+		<max>20</max>
+	</option>
+	<option name="fingerprint_overlay_icon_size" type="double">
+		<_short>Fingerprint Overlay Icon Size</_short>
+		<default>7</default>
+		<min>0.5</min>
+		<max>20</max>
 	</option>
 	<option name="fingerprint_always" type="bool">
 	    <_short>Always show</_short>
@@ -307,12 +315,13 @@
 	</option>
 	<option name="network_font" type="string">
 		<_short>Clock Font</_short>
-		<default>20pt default</default>
+		<default>2em default</default>
 	</option>
-	<option name="network_icon_size" type="int">
+	<option name="network_icon_size" type="double">
 		<_short>Icon Size</_short>
-		<default>48</default>
-		<min>16</min>
+		<default>1</default>
+		<min>0.1</min>
+		<max>10.0</max>
 	</option>
 	</group>
 	<group>
@@ -362,15 +371,15 @@
 			<value>bottom-right</value>
 			<_name>Bottom Right</_name>
 		</desc>
-		<default>bottom-right</default>
+		<default>top-center</default>
 	</option>
 	<option name="clock_always" type="bool">
 	    <_short>Always show</_short>
 	    <default>true</default>	
 	</option>
 	<option name="clock_font" type="string">
 		<_short>Clock Font</_short>
-		<default>32pt default</default>
+		<default>3em default</default>
 	</option>
 	</group>
 	<group>
@@ -420,7 +429,13 @@
 	</option>
 	<option name="weather_font" type="string">
 		<_short>Weather Font</_short>
-		<default>64pt default</default>
+		<default>4em default</default>
+	</option>
+	<option name="weather_icon_size" type="double">
+		<_short>Icon Size</_short>
+		<default>5.0</default>
+		<min>0.5</min>
+		<max>10</max>
 	</option>
 	<option name="weather_always" type="bool">
 	    <_short>Always show</_short>
@@ -474,7 +489,13 @@
 	</option>
 	<option name="user_font" type="string">
 		<_short>Font</_short>
-		<default>16pt default</default>
+		<default>3em default</default>
+	</option>
+	<option name="user_icon_size" type="double">
+		<_short>Icon Size</_short>
+		<default>10.0</default>
+		<min>0.5</min>
+		<max>20</max>
 	</option>
 	<option name="user_always" type="bool">
 	    <_short>Always show</_short>
@@ -545,6 +566,16 @@
 	    <_short>Always show</_short>
 		<default>false</default>
 	</option>
+	<option name="mpris_icon_size" type="double">
+		<_short>Album art size</_short>
+		<default>5.0</default>
+		<min>0.5</min>
+		<max>20</max>
+	</option>
+	<option name="mpris_font" type="string">
+		<_short>Font</_short>
+		<default>1em default</default>
+	</option>
 	</group>
 	<group>
 	<_short>Battery</_short>
@@ -609,16 +640,17 @@
 	</option>
 	<option name="battery_percent_font" type="string">
 		<_short>Percent Font</_short>
-		<default>32pt default</default>
+		<default>3em default</default>
 	</option>
 	<option name="battery_description_font" type="string">
 		<_short>Description Font</_short>
-		<default>10pt default</default>
+		<default>0em default</default>
 	</option>
-	<option name="battery_icon_size" type="int">
+	<option name="battery_icon_size" type="double">
 		<_short>Icon Size</_short>
-		<default>96</default>
-		<min>16</min>
+		<default>3</default>
+		<min>0.5</min>
+		<max>10</max>
 	</option>
 	<option name="battery_always" type="bool">
 	    <_short>Always show</_short>
@@ -674,6 +706,12 @@
 	    <_short>Always show</_short>
 		<default>false</default>
 	</option>
+	<option name="volume_icon_size" type="double">
+		<_short>Button size</_short>
+		<default>2.0</default>
+		<min>0.5</min>
+		<max>10.0</max>
+	</option>
 	</group>
 	<group>
 	<_short>Instant Unlock</_short>

src/locker/locker.cpp

@@ -64,7 +64,9 @@ void WayfireLockerApp::perform_lock()
     {
         if (!m_is_locked)
         {
-            on_monitor_present(nullptr);
+            auto display  = Gdk::Display::get_default();
+            auto monitors = display->get_monitors();
+            on_monitor_present(std::dynamic_pointer_cast<Gdk::Monitor>(monitors->get_object(0))->gobj());
         }
     } else
     {
@@ -144,21 +146,31 @@ void WayfireLockerApp::on_activate()
     alternative_monitors = true; /* Don't use WayfireShellApp monitor tracking, we get a different set */
     new CssFromConfigString("locker/background_color", ".wf-locker {background-color:", ";}");
     new CssFromConfigFont("locker/clock_font", ".wf-locker .clock {", "}");
-    new CssFromConfigFont("locker/weather_font", ".wf-locker .weather {", "}");
-    new CssFromConfigFont("locker/user_font", ".wf-locker .user {", "}");
+    new CssFromConfigFont("locker/weather_font", ".wf-locker label.weather {", "}");
+    new CssFromConfigFont("locker/user_font", ".wf-locker .user label {", "}");
     new CssFromConfigFont("locker/pin_pad_font", ".wf-locker .pinpad-button {", "}");
     new CssFromConfigFont("locker/pin_reply_font", ".wf-locker .pinpad-current {", "}");
     new CssFromConfigFont("locker/fingerprint_font", ".wf-locker .fingerprint-text {", "}");
     new CssFromConfigFont("locker/battery_percent_font", ".wf-locker .battery-percent {", "}");
     new CssFromConfigFont("locker/battery_description_font", ".wf-locker .battery-description {", "}");
     new CssFromConfigFont("locker/instant_unlock_font", ".wf-locker .instant-unlock {", "}");
-    new CssFromConfigInt("locker/battery_icon_size", ".wf-locker .battery-image {-gtk-icon-size:", "px;}");
-    new CssFromConfigInt("locker/fingerprint_icon_size", ".wf-locker .fingerprint-icon {-gtk-icon-size:",
-        "px;}");
+    new CssFromConfigFont("locker/network_font", ".wf-locker .network {", "}");
+    new CssFromConfigFont("locker/mpris_font", ".wf-locker .mpris label {", "}");
+
+    new CssFromConfigDouble("locker/user_icon_size", ".wf-locker .user image { -gtk-icon-size:", "em;}");
+    new CssFromConfigDouble("locker/mpris_icon_size", ".wf-locker .mpris .albumart {-gtk-icon-size:",
+        "em;}");
+    new CssFromConfigDouble("locker/weather_icon_size", ".wf-locker image.weather {-gtk-icon-size:", "em;}");
+    new CssFromConfigDouble("locker/battery_icon_size", ".wf-locker .battery-image {-gtk-icon-size:", "em;}");
+    new CssFromConfigDouble("locker/fingerprint_icon_size", ".wf-locker .fingerprint-icon {-gtk-icon-size:",
+        "em;}");
+    new CssFromConfigDouble("locker/fingerprint_overlay_icon_size",
+        ".wf-locker .fingerprint-overlay-image {-gtk-icon-size:",
+        "em;}");
     new CssFromConfigDouble("locker/prewake", ".fade-in {animation-name: slowfade;animation-duration: ",
         "s; animation-timing-function: linear; animation-iteration-count: 1; animation-fill-mode: forwards;} @keyframes slowfade { from {opacity:0; background: #0000;} to {opacity:1;}}");
-    new CssFromConfigFont("locker/network_font", ".wf-locker .network {", "}");
-    new CssFromConfigInt("locker/network_icon_size", ".wf-locker .network {-gtk-icon-size:", "px;}");
+    new CssFromConfigDouble("locker/network_icon_size", ".wf-locker .network {-gtk-icon-size:", "em;}");
+    new CssFromConfigDouble("locker/volume_icon_size", ".wf-locker .volume button {-gtk-icon-size:", "em;}");
 
     /* Init plugins */
     plugins.emplace("clock", Plugin(new WayfireLockerClockPlugin()));
@@ -275,6 +287,7 @@ void WayfireLockerApp::on_monitor_present(GdkMonitor *monitor)
     /* Create lockscreen with a grid for contents */
     window_list.emplace(id, new WayfireLockerAppLockscreen(background_path));
     auto window = window_list[id];
+    window->add_css_class("wf-locker-" + std::string(gdk_monitor_get_connector(monitor)));
 
     for (auto& it : plugins)
     {

src/locker/lockscreen.cpp

@@ -77,6 +77,33 @@ WayfireLockerAppLockscreen::WayfireLockerAppLockscreen(std::string background_pa
         window_activity();
         return false;
     }, false));
+
+    /* Resize cb*/
+    signals.push_back(background.signal_resize().connect([this] (int width, int height)
+    {
+        int size = std::max(get_width(), get_height());
+        remove_css_class("sized-480");
+        remove_css_class("sized-720");
+        remove_css_class("sized-1080");
+        remove_css_class("sized-1440");
+        remove_css_class("sized-2160");
+        if (size <= 480)
+        {
+            add_css_class("sized-480");
+        } else if (size <= 720)
+        {
+            add_css_class("sized-720");
+        } else if (size <= 1080)
+        {
+            add_css_class("sized-1080");
+        } else if (size <= 1440)
+        {
+            add_css_class("sized-1440");
+        } else
+        {
+            add_css_class("sized-2160");
+        }
+    }));
     add_controller(typing_gesture);
 }
 

src/locker/plugin/fingerprint.cpp

@@ -339,6 +339,8 @@ WayfireLockerFingerprintPluginWidget::WayfireLockerFingerprintPluginWidget(std::
     label.set_label(label_contents);
     overlay.set_child(image_print);
     overlay.add_overlay(image_overlay);
+    overlay.set_hexpand(false);
+    overlay.set_halign(Gtk::Align::CENTER);
     image_overlay.set_halign(Gtk::Align::END);
     image_overlay.set_valign(Gtk::Align::END);
 

src/locker/plugin/volume.cpp

@@ -61,6 +61,7 @@ WayfireLockerVolumePluginWidget::WayfireLockerVolumePluginWidget() :
     WayfireLockerTimedRevealer("locker/volume_always")
 {
     set_child(box);
+    box.add_css_class("volume");
     sink_button.add_css_class("volume-button");
     source_button.add_css_class("mic-button");
 

src/util/background-gl.cpp

@@ -1,10 +1,10 @@
 #include <memory>
+#include <gdkmm/pixbuf.h>
+#include <glib.h>
+#include <glibmm/main.h>
+#include <glibmm/refptr.h>
 
 #include "background-gl.hpp"
-#include "gdkmm/pixbuf.h"
-#include "glib.h"
-#include "glibmm/main.h"
-#include "glibmm/refptr.h"
 
 static const char *vertex_shader =
     R"(

src/util/css-config.cpp

@@ -125,7 +125,7 @@ CssFromConfigFont::CssFromConfigFont(std::string option_name, std::string css_be
 
 void CssFromConfigFont::set_from_string()
 {
-    std::regex matcher("(.*?)(\\d+(?:pt|px|rem|em|))(.*?)");
+    std::regex matcher("(.*?)(\\d+\\.?\\d*(?:pt|px|rem|em|))(.*?)");
     std::string font_name = (std::string)option_value;
     std::smatch matches;
     if (std::regex_match(font_name, matches, matcher))