Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add a dedicated stylesheet #190

Merged
merged 2 commits into from
Dec 17, 2024
Merged

Conversation

edan-bainglass
Copy link
Member

@edan-bainglass edan-bainglass commented Dec 17, 2024

This PR moves CSS styles to a local stylesheet and loads it in the main notebook. It also adds more CSS classes for app containers. See aiidalab/aiidalab-qe#983 for an example.

Note that for feature logos, other than images (local or url-linked), you can also use Font Awesome icons.

For example, you can use an <img> tag:

<a
  class="feature"
  href="{appbase}/my_notebook.ipynb"
  target="_blank">
  <img
    class="feature-logo"
    src="{appbase}/<image-folder>/image.png"  -> can also use a link to an online image
    alt="My feature" />
  <div class="feature-label">My feature</div>
</a>

or an <i> tag for Font Awesome icons

<a
  class="feature"
  href="{appbase}/my_notebook.ipynb"
  target="_blank">
  <i class="fa fa-whatever feature-logo"></i>
  <div class="feature-label">My feature</div>
</a>

where fa-whatever is a Font Awesome 4 CSS class (ipywidgets 7 supports FA4)

@mikibonacci
Copy link
Member

Hi @edan-bainglass, thanks for the work, LGTM!

@edan-bainglass edan-bainglass merged commit c66b365 into aiidalab:main Dec 17, 2024
3 checks passed
edan-bainglass added a commit to aiidalab/aiidalab-docker-stack that referenced this pull request Dec 17, 2024
* Update aiidalab-home to 24.12.0
* Update aiidalab-home to 24.12.1 (including aiidalab/aiidalab-home#190)

---------

Co-authored-by: Edan Bainglass <[email protected]>
edan-bainglass added a commit to aiidalab/aiidalab-qe that referenced this pull request Dec 18, 2024
This PR uses new CSS classes introduced in aiidalab/aiidalab-home#190 to redesign the app's container in the home app.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants