Skip to content

Commit

Permalink
add css styling (#5803)
Browse files Browse the repository at this point in the history
* add css styling

Signed-off-by: Niels Bantilan <[email protected]>

* update logo height

Signed-off-by: Niels Bantilan <[email protected]>

---------

Signed-off-by: Niels Bantilan <[email protected]>
  • Loading branch information
cosmicBboy authored Oct 3, 2024
1 parent 0198e91 commit efca412
Show file tree
Hide file tree
Showing 7 changed files with 189 additions and 46 deletions.
113 changes: 113 additions & 0 deletions docs/_static/custom.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,113 @@
html[data-theme=light], html[data-theme=dark] {
--pst-color-primary: #7652A2;
--pst-color-link: #7652A2;
--pst-color-link-hover: #7652A2;
}


/* Styling for page layout */
.bd-page-width {
max-width: 100%;
}

/* style the main title logo */
.navbar-brand:hover, .navbar-brand:visited:hover {
text-decoration: none;
}

.navbar-brand img {
height: 70%;
}

/*
Center the main page content only when the sidebar has the .hide-on-wide
class, which is only on the root page
*/
.bd-sidebar.hide-on-wide + main.bd-main .bd-content {
justify-content: center;
}

/* left sidebar nav width */
.bd-sidebar-primary {
width: 15%;
min-width: 250px;
padding: 1rem;
}

/* make the scroll bar sleeker */
.bd-sidebar::-webkit-scrollbar {
width: 3px;
height: 3px;
background: transparent;
}

.bd-sidebar::-webkit-scrollbar-thumb {
background: var(--pst-color-border);
}

/* make sure page content fills up the page */
.bd-main .bd-content {
justify-content: left;
}

.bd-main .bd-content .bd-article-container {
padding: 2.5rem;
max-width: 75em;
}

/* aligh navbar items with the sidebar */
.bd-header .navbar-header-items__start {
width: 15%;
min-width: 250px;
}

/* styles for the main page subtitle and badges */
div.sd-card.sd-shadow-sm.subtitle-and-badges {
border: none;
box-shadow: none !important;
}

div.subtitle-and-badges .sd-card-body {
padding: 0;
}

div.subtitle-and-badges .sd-card-title {
color: #808080;
font-weight: 350 !important;
font-size: 25px;
padding-top: 10px;
padding-bottom: 10px;
}

div.subtitle-and-badges a {
text-decoration: none;
}

div.subtitle-and-badges a img {
margin: 2px 0;
}

/* update table hover color to neutral color */
.table tbody tr:hover {
background-color: var(--pst-color-table-inner-border);
}

/* custom footer style */
div.custom-footer {
text-align: center;
background-color: var(--pst-color-surface);
padding: 15px 0;
color: var(--pst-color-text-muted);
}

/* anchor link hover style */
a:hover,
nav.bd-links li>a:active,
nav.bd-links li>a:hover,
.bd-header ul.navbar-nav>li.nav-item>.nav-link:hover {
color: var(--pst-color-primary);
}

.bd-header ul.navbar-nav>li.nav-item>.nav-link:hover:before {
border-bottom: max(3px, .1875rem, .12em) solid var(--pst-color-primary);
}
10 changes: 10 additions & 0 deletions docs/_static/custom.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
window.addEventListener("DOMContentLoaded", function() {
// Select all <a> elements with class "external"
var externalLinks = document.querySelectorAll("a.external");

// Loop through each <a> element with class "external"
externalLinks.forEach(function(link) {
// Set the target attribute to "_blank"
link.setAttribute("target", "_blank");
});
});
6 changes: 4 additions & 2 deletions docs/_templates/layout.html

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

1 change: 1 addition & 0 deletions docs/api/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@


::::{grid} 2
:gutter: 2

:::{grid-item-card} {octicon}`rocket` Flytekit SDK
:link: flytekit/docs_index
Expand Down
27 changes: 22 additions & 5 deletions docs/conf.py
Original file line number Diff line number Diff line change
Expand Up @@ -385,14 +385,31 @@

html_theme_options = {
# custom flyteorg pydata theme options
"github_url": "https://github.com/flyteorg/flyte",
# "github_url": "https://github.com/flyteorg/flyte",
"logo": {
"text": "Flyte Docs",
"text": "Flyte",
},
"external_links": [
{"name": "Flyte", "url": "https://flyte.org"},
],
"icon_links": [
{
"name": "GitHub",
"icon": "fa-brands fa-github",
"type": "fontawesome",
"url": "https://github.com/flyteorg/flyte",
},
{
"name": "Slack",
"url": "https://slack.flyte.org",
"icon": "fa-brands fa-slack",
"type": "fontawesome",
},
{
"name": "Flyte",
"url": "https://flyte.org",
"icon": "fa-solid fa-dragon",
"type": "fontawesome",
}
],
"use_edit_page_button": True,
Expand All @@ -403,9 +420,9 @@
# Add any paths that contain custom static files (such as style sheets) here,
# relative to this directory. They are copied after the builtin static files,
# so a file named "default.css" will overwrite the builtin "default.css".
# html_static_path = []
# html_css_files = []
# html_js_files = []
html_static_path = ["_static"]
html_css_files = ["custom.css"]
html_js_files = ["custom.js"]

# Custom sidebar templates, must be a dictionary that maps document names
# to template names.
Expand Down
77 changes: 39 additions & 38 deletions docs/index.md
Original file line number Diff line number Diff line change
@@ -1,54 +1,55 @@
# Welcome to Flyte!

```{eval-rst}
.. raw:: html
````{card} The highly scalable and flexible workflow orchestrator that unifies data, ML and analytics.
:class-card: subtitle-and-badges
<p style="color: #808080; font-weight: 350; font-size: 25px; padding-top: 10px; padding-bottom: 10px;">
The highly scalable and flexible workflow orchestrator that unifies data, ML and analytics.
</p>
.. image:: https://img.shields.io/badge/Graduate%20Project-Linux%20Foundation-purple?style=for-the-badge
:target: https://lfaidata.foundation/projects/flyte/
:alt: Linux Foundation
.. image:: https://img.shields.io/github/stars/flyteorg/flyte?label=github&logo=github&style=for-the-badge
:target: https://github.com/flyteorg/flyte
:alt: GitHub Repo stars
```{image} https://img.shields.io/badge/Graduate%20Project-Linux%20Foundation-purple?style=for-the-badge
:target: https://lfaidata.foundation/projects/flyte/
:alt: Linux Foundation
```
.. image:: https://img.shields.io/github/release/flyteorg/flyte.svg?style=for-the-badge&color=blue
:target: https://github.com/flyteorg/flyte/releases/latest
:alt: Flyte Release
```{image} https://img.shields.io/github/stars/flyteorg/flyte?label=github&logo=github&style=for-the-badge
:target: https://github.com/flyteorg/flyte
:alt: GitHub Repo stars
```
.. image:: https://img.shields.io/github/actions/workflow/status/flyteorg/flyte/tests.yml?label=tests&style=for-the-badge
:target: https://github.com/flyteorg/flyte/actions/workflows/tests.yml
:alt: GitHub Test Status
```{image} https://img.shields.io/github/release/flyteorg/flyte.svg?style=for-the-badge&color=blue
:target: https://github.com/flyteorg/flyte/releases/latest
:alt: Flyte Release
```
.. image:: https://img.shields.io/github/actions/workflow/status/flyteorg/flyte/sandbox.yml?label=Sandbox%20docker%20image&style=for-the-badge
:target: https://github.com/flyteorg/flyte/actions/workflows/sandbox.yml
:alt: GitHub Sandbox Status
```{image} https://img.shields.io/github/actions/workflow/status/flyteorg/flyte/tests.yml?label=tests&style=for-the-badge
:target: https://github.com/flyteorg/flyte/actions/workflows/tests.yml
:alt: GitHub Test Status
```
.. image:: https://img.shields.io/github/milestones/closed/flyteorg/flyte?style=for-the-badge
:target: https://github.com/flyteorg/flyte/milestones?state=closed
:alt: Completed Milestones
```{image} https://img.shields.io/github/actions/workflow/status/flyteorg/flyte/sandbox.yml?label=Sandbox%20docker%20image&style=for-the-badge
:target: https://github.com/flyteorg/flyte/actions/workflows/sandbox.yml
:alt: GitHub Sandbox Status
```
.. image:: https://img.shields.io/pypi/dm/flytekit?color=blue&label=flytekit%20downloads&style=for-the-badge&logo=pypi&logoColor=white
:target: https://github.com/flyteorg/flytekit
:alt: Flytekit Downloads
```{image} https://img.shields.io/github/milestones/closed/flyteorg/flyte?style=for-the-badge
:target: https://github.com/flyteorg/flyte/milestones?state=closed
:alt: Completed Milestones
```
.. image:: https://img.shields.io/badge/Slack-Chat-pink?style=for-the-badge&logo=slack
:target: https://slack.flyte.org
:alt: Flyte Slack
```{image} https://img.shields.io/pypi/dm/flytekit?color=blue&label=flytekit%20downloads&style=for-the-badge&logo=pypi&logoColor=white
:target: https://github.com/flyteorg/flytekit
:alt: Flytekit Downloads
```
.. image:: https://img.shields.io/badge/LICENSE-Apache2.0-ff69b4.svg?style=for-the-badge
:target: http://www.apache.org/licenses/LICENSE-2.0.html
:alt: License
```{image} https://img.shields.io/badge/Slack-Chat-pink?style=for-the-badge&logo=slack
:target: https://slack.flyte.org
:alt: Flyte Slack
```
.. |br| raw:: html
```{image} https://img.shields.io/badge/LICENSE-Apache2.0-ff69b4.svg?style=for-the-badge
:target: http://www.apache.org/licenses/LICENSE-2.0.html
:alt: License
```
<br>
<br>
````

```

[Flyte](https://github.com/flyteorg/flyte) is an open-source, Kubernetes-native
workflow orchestrator implemented in [Go](https://go.dev/). It enables highly
Expand Down
1 change: 0 additions & 1 deletion docs/user_guide/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -94,7 +94,6 @@ concepts/component_architecture/index
:hidden:
flytekit-java <https://github.com/spotify/flytekit-java>
unionml <https://unionml.readthedocs.io/>
pterodactyl <https://github.com/NotMatthewGriffin/pterodactyl>
latch sdk <https://docs.latch.bio/>
```

0 comments on commit efca412

Please sign in to comment.