📐 better styling for small screens

.vscode/launch.json

@@ -15,6 +15,6 @@
                 "BITBOT_SHOWIMAGE": "true"
             },
             "justMyCode": false
-        }
+        },
     ]
 }

config/config.ini

@@ -3,7 +3,7 @@ exchange = bitmex
 instrument = BTC/USD
 stock_symbol = 
 holdings = 0
-instruments = LTC/BTC,ETH/BTC
+instruments = LTC/USD,ETH/BTC
 
 [display]
 rotation = 0

config/expanded.mplstyle → config/default.expanded.mplstyle

@@ -12,8 +12,8 @@ xtick.direction:    in
 ytick.direction:    in
 
 ytick.minor.visible: False
-xtick.major.pad:     -10
-ytick.major.pad:     -20
+xtick.major.pad:     -20
+ytick.major.pad:     -5
 
 figure.subplot.left:   0  
 figure.subplot.right:  1    

config/small.expanded.mplstyle

@@ -0,0 +1,2 @@
+ytick.major.pad:     -5
+xtick.major.pad:     -10

config/small_screen.mplstyle → config/small.mplstyle

@@ -1,7 +1,6 @@
-
 xtick.labelsize:    6
 ytick.labelsize:    6
 
 axes.xmargin:       0.15
 axes.ymargin:       0.15
-axes.zmargin:       0.1
+axes.zmargin:       0.1

src/configuration/bitbot_files.py

@@ -24,10 +24,11 @@ def __init__(self, base_path):
         self.logging_ini = self.existing_file_path('logging.ini')
 
         self.base_style = self.existing_file_path('base.mplstyle')
-        self.expanded_style = self.existing_file_path('expanded.mplstyle')
-        self.default_style = self.existing_file_path('default.mplstyle')
         self.volume_style = self.existing_file_path('volume.mplstyle')
-        self.small_screen_style = self.existing_file_path('small_screen.mplstyle')
+        self.default_style = self.existing_file_path('default.mplstyle')
+        self.small_screen_style = self.existing_file_path('small.mplstyle')
+        self.expanded_style = self.existing_file_path('default.expanded.mplstyle')
+        self.small_expanded_style = self.existing_file_path('small.expanded.mplstyle')
 
     def existing_file_path(self, file_name):
         file_path = pjoin(self.config_folder, file_name)

src/drawing/chart_overlay.py

@@ -62,6 +62,10 @@ def overlay1(self, chartdata):
 
     def overlay2(self, chartdata):
         portfolio_value = self.value_held(chartdata)
+        # 🎹 draw instrument name
+        yield RotatedTextBlock(chartdata.instrument, self.medium_font)
+        # 🕎 candle width
+        yield DrawText(chartdata.candle_width, self.medium_font, colour='red', align=Align.TopRight)
         # 🏳️ title block
         yield TextBlock([
             # ➗ draw coloured change percentage
@@ -73,10 +77,6 @@ def overlay2(self, chartdata):
                 if portfolio_value
                 else DrawText.random_from_bool(self.ai_comments(), self.price_increasing(chartdata), self.title_font)]
         ], align=Align.LeastIntrusive)
-        # 🎹 draw instrument name
-        yield RotatedTextBlock(chartdata.instrument, self.medium_font)
-        # 🕎 candle width
-        yield DrawText(chartdata.candle_width, self.medium_font, colour='red', align=Align.TopRight)
 
     def price_increasing(self, chartdata):
         return chartdata.start_price() < chartdata.last_close()

src/drawing/market_chart.py

@@ -63,13 +63,22 @@ def plot_chart(self, config, layout, ax, candle_data):
             volume_overlay(ax[1], opens, closes, volumes, colorup='white', colordown='red', width=1)
             self.fig.subplots_adjust(bottom=0.01)
 
+    # 📑 styles overide each other left to right?
     def get_default_styles(self, config, display, files):
+        small_display = self.is_small_display(display)
+
+        if small_display:
+            yield files.small_screen_style
+        yield files.default_style
+
         if config.expand_chart():
             yield files.expanded_style
-        else:
-            yield files.default_style
-        if display.size()[0] < 300:
-            yield files.small_screen_style
+            if small_display:
+                yield files.small_expanded_style
+
+    def is_small_display(self, display):
+        small_display = display.size()[0] < 300
+        return small_display
 
     def create_chart_figure(self, config, display, files):
         # 📏 apply global base style
@@ -87,6 +96,10 @@ def create_chart_figure(self, config, display, files):
             ax1 = fig.add_subplot(gs[0], zorder=1)
             ax2 = None
 
+            # 📏 align price tick labels for expanded chart
+            if(config.expand_chart()):
+                ax1.set_yticklabels(ax1.get_yticklabels(), ha='left')
+
             if config.show_volume():
                 with plt.style.context(files.volume_style):
                     ax2 = fig.add_subplot(gs[1], zorder=0)