landscapeapp icon indicating copy to clipboard operation
landscapeapp copied to clipboard

Add capability for custom CSS from user side

Open milanlakhani opened this issue 2 years ago • 7 comments

This adds an optional config extra_css in settings.yml, which allows extra lines of css to be appended to the end of src/styles.css, from the user end. This is useful because people may being using the landscape in different contexts - eg for Bloomberg, not every filter is applicable so we hide some of them.

The extra_css config can be included in settings.yml in the global section. Below is an example of how this is used for having a selection of filters to not show on the left side:

global:
    extra_css: |
        div.select[data-name="project"] { display: none !important; }
        div.select[data-name="organization"] { display: none !important; }
        div.select[data-name="headquarters"] { display: none !important; }
        div.select[data-name="company-type"] { display: none !important; }
        div.select[data-name="industries"] { display: none !important; }

This is what the home page looks like with and without filters disabled, notice the difference in filters available on the left hand side:

Without any filters disabled: Screenshot 2022-08-04 at 14 54 41

With some filters disabled: Screenshot 2022-08-04 at 14 57 47

Of course this is just one example of how extra_css can be used.

CC @michaelmoss @awright @danielsilverstone-ct @GeriG966 @abhi0469

milanlakhani avatar Aug 08 '22 11:08 milanlakhani

Deploy Preview for landscapeapp ready!

Name Link
Latest commit 6fd552eb246f9e84c9c3ea9ed6a2c659216c80d9
Latest deploy log https://app.netlify.com/sites/landscapeapp/deploys/62f0ee894fc6d30009ddf745
Deploy Preview https://deploy-preview-839--landscapeapp.netlify.app
Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site settings.

netlify[bot] avatar Aug 08 '22 11:08 netlify[bot]

Deploy Preview for landscapeapp failed.

Name Link
Latest commit 20abf5d8e962d98b086c612b7df60598a48480c8
Latest deploy log https://app.netlify.com/sites/landscapeapp/deploys/6374090c36834f00081a2812

netlify[bot] avatar Aug 08 '22 11:08 netlify[bot]

I want to get a better solution, the list of options will grow too much with this approach, instead I would prefer something like a customCss property where people can, for example, hide filters if they need to or hide other parts of the UI

AndreyKozlov1984 avatar Aug 08 '22 13:08 AndreyKozlov1984

I want to get a better solution, the list of options will grow too much with this approach, instead I would prefer something like a customCss property where people can, for example, hide filters if they need to or hide other parts of the UI

Works for me, I will do a patch with a customCss property from settings.yml so people can make any CSS changes

milanlakhani avatar Aug 09 '22 21:08 milanlakhani

Hi @AndreyKozlov1984 I think and have tested that this now has the desired effect? Also maybe you should consider merging #836 when you get a chance - it's a bugfix that allows landscapes to be run without a crunchbase key, which has been pivotal for us to test our changes on different landscapes.

milanlakhani avatar Aug 10 '22 12:08 milanlakhani

@milanlakhani we don't need crunchbase key at this moment, because you can just use organization: { name: 'test'}} for that purpose

AndreyKozlov1984 avatar Aug 10 '22 13:08 AndreyKozlov1984

@AndreyKozlov1984 please can you explain if possible why Card mode uses dynamic api calls?

milanlakhani avatar Aug 11 '22 16:08 milanlakhani

@AndreyKozlov1984 just to prompt you, this feature is now available as you requested it ;) and description updated

milanlakhani avatar Nov 16 '22 11:11 milanlakhani