eddiesigner

:root,
[data-theme="light"],
[data-theme="dark"],
:root:not([data-theme="light"]) {
  --background-color: #fff;
  --primary-foreground-color: #4a4a4a;
  --secondary-foreground-color: #000;
  --primary-subtle-color: #04aeee;
  --secondary-subtle-color: #f4f8fd;
  --titles-color: #333;

eddiesigner

<style>
    @media only screen and (min-width: 48rem) {
        .m-featured-slider .swiper-container {
        	padding-bottom: 50px;
    	}

        .m-featured-slide__picture {
            display: flex;
		    justify-content: flex-end;
            border-radius: 0;

eddiesigner

import React, { PureComponent } from 'react';
import { Dimensions, Animated, TouchableWithoutFeedback } from 'react-native';
import styled from 'styled-components';

// I use these values because I have two columns of cards with some space and because
// I want to keep a vertical ratio.
// You can change them for some fixed values or anything else, it depends of your needs
const cardWidth = (Dimensions.get('window').width / 2) - 30;
const cardHeight = cardWidth * 1.4

eddiesigner

Clone the Liebling repository and follow these steps first: https://github.com/eddiesigner/liebling/wiki/Theme-development-with-Docker

When everything is done, open your default.hbs and before </head> put this code:

<script>
  var maxPages = parseInt('{{pagination.pages}}');
</script>