You are viewing a plain text version of this content. The canonical link for it is here.
Posted to notifications@superset.apache.org by GitBox <gi...@apache.org> on 2023/01/17 20:13:32 UTC
[GitHub] [superset] aortiz-WW opened a new issue, #22758: How can I change the UI on superset
aortiz-WW opened a new issue, #22758:
URL: https://github.com/apache/superset/issues/22758
## Screenshot
Here is what the normal looking superset looks like when I run it locally
here!]
## Description
I want to add a banner to the bottom of the navbar and before the footer. I have been searching on how to do this but all methods that I've seen do not work. I've tried changing the code in the navbar.html of the superset-worker image and then using using that modified image for the superset-worker container. I have tried changing the index.jsx in the superset-frontend/src/dashboards/Header/index.jsx
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For additional commands, e-mail: notifications-help@superset.apache.org
[GitHub] [superset] rusackas commented on issue #22758: How can I change the UI on superset
Posted by GitBox <gi...@apache.org>.
rusackas commented on issue #22758:
URL: https://github.com/apache/superset/issues/22758#issuecomment-1387238093
Sounds like you're doing development in a non-dev build (thus docker-compose `non-dev`).
Just do `docker-compose up` instead, and webpack will rebuild the front-end when you build changes.
There are other options, too, to run webpack in a separate thread with hot-reloading and such. The blog is a bit out of date since Superset is now a monorepo, but you can get more info [here](https://preset.io/blog/tutorial-contributing-code-to-apache-superset/).
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For additional commands, e-mail: notifications-help@superset.apache.org
[GitHub] [superset] rusackas closed issue #22758: How can I change the UI on superset
Posted by GitBox <gi...@apache.org>.
rusackas closed issue #22758: How can I change the UI on superset
URL: https://github.com/apache/superset/issues/22758
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For additional commands, e-mail: notifications-help@superset.apache.org
[GitHub] [superset] aortiz-WW commented on issue #22758: How can I change the UI on superset
Posted by GitBox <gi...@apache.org>.
aortiz-WW commented on issue #22758:
URL: https://github.com/apache/superset/issues/22758#issuecomment-1387590021
I have tried using docker compose but the superset_db container is always failing, which I think causes the others to fail. this is because when I go to port 8088 (where when I use `non-dev` it shows superset) it does not work at all.
I am trying to follow the link you provided but it seems this too does not help. I run the command `npm ci` and just get a nasty error so I just use npm install which seems to work. After that, `npm run dev-server` returns an find this error in the browser
I continue to run the backend but `superset db upgrade` returns:
```
(.venv) PS C:\Users\aortiz\Documents\GitHub\superset> superset db upgrade
superset : The term 'superset' is not recognized as the name of a cmdlet, function, script file,
or operable program. Check the spelling of the name, or if a path was included, verify that the
path is correct and try again.
At line:1 char:1
+ superset db upgrade
+ ~~~~~~~~
+ CategoryInfo : ObjectNotFound: (superset:String) [], CommandNotFoundException
+ FullyQualifiedErrorId : CommandNotFoundException
```
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For additional commands, e-mail: notifications-help@superset.apache.org
[GitHub] [superset] aortiz-WW commented on issue #22758: How can I change the UI on superset
Posted by GitBox <gi...@apache.org>.
aortiz-WW commented on issue #22758:
URL: https://github.com/apache/superset/issues/22758#issuecomment-1387173118
> Is it specifically for this home/welcome page, or ALL pages/views?
>
> For the former, you might start at `superset-frontend/src/views/CRUD/welcome/Welcome.tsx`
>
> For the latter, it gets more complicated than that, since Superset is not (yet) a single page app, but a good starting point for the global nav would be `superset-frontend/src/views/components/Menu.tsx` and for the footer area, start at `superset/templates/superset/basic.html`.
>
> Closing this issue since it's not a bug, but I hope this ant the other comment help get the ball rolling. Please join us on [Slack](http://bit.ly/join-superset-slack) in the `#customizing-superset` channel if you need more help.
I found the file and edit it by adding this to the return of the MenuWrapper:
```
<div id="banner-unclassified" style={{ backgroundColor: 'green', color: 'white', textAlign: 'center', padding: '10px' }}>
Unclassified
</div>
```
Nothing happened. I'm just wondering how is it that the changes are not visible.
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For additional commands, e-mail: notifications-help@superset.apache.org
[GitHub] [superset] aortiz-WW commented on issue #22758: How can I change the UI on superset
Posted by GitBox <gi...@apache.org>.
aortiz-WW commented on issue #22758:
URL: https://github.com/apache/superset/issues/22758#issuecomment-1387138339
> You can add a banner to the bottom of the navbar and before the footer by editing the HTML and CSS of the Superset application.
>
> One way to do this is by modifying the navbar.html file located in the superset/assets/templates directory. You can add a new div element for the banner and style it using CSS.
>
> Another way is to modify the index.jsx file located in the superset-frontend/src/dashboards/Header/index.jsx and add a new component for the banner, and then import and render it in the Header component.
>
> It's important to note that if you are using the official Superset Docker image, any changes you make to the image will be lost when you update or rebuild the image. A good practice is to use a volume to mount a local directory containing your custom templates into the container, this way you can make changes to the files on your host and have them reflected in the running container.
I tried doing that. I ran the docker-compose-non-dev so it included the modified container image for the superset_worker container. In this image, I changed what you referenced but still did not get the changed I wanted. Here is the code I wrote in the navbar.html in the `superset/templates/appbuilder`. I don't see the directorey you mentioned.
```
{#
Licensed to the Apache Software Foundation (ASF) under one
or more contributor license agreements. See the NOTICE file
distributed with this work for additional information
regarding copyright ownership. The ASF licenses this file
to you under the Apache License, Version 2.0 (the
"License"); you may not use this file except in compliance
with the License. You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing,
software distributed under the License is distributed on an
"AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
KIND, either express or implied. See the License for the
specific language governing permissions and limitations
under the License.
#}
{% set menu = appbuilder.menu %}
{% set app_icon_width = appbuilder.app.config['APP_ICON_WIDTH'] %}
{% set logo_target_path = appbuilder.app.config['LOGO_TARGET_PATH'] or '/profile/{}/'.format(current_user.username) %}
{% set root_path = logo_target_path if not logo_target_path.startswith('/') else '/superset' + logo_target_path if current_user.username is defined else '#' %}
{% block navbar %}
<div id="app-menu">
<div class="navbar navbar-static-top {{menu.extra_classes}}" role="navigation">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="{{ root_path }}">
<img
width="{{ app_icon_width }}"
src="{{ appbuilder.app_icon }}"
alt="{{ appbuilder.app_name }}"
/>
</a>
</div>
</div>
</div>
<div class="banner-unclassified" style="background-color: green; color: white; text-align: center; padding: 10px;">Unclassified</div>
</div>
{% endblock %}
```
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For additional commands, e-mail: notifications-help@superset.apache.org
[GitHub] [superset] Abhijrathod commented on issue #22758: How can I change the UI on superset
Posted by GitBox <gi...@apache.org>.
Abhijrathod commented on issue #22758:
URL: https://github.com/apache/superset/issues/22758#issuecomment-1386046800
You can add a banner to the bottom of the navbar and before the footer by editing the HTML and CSS of the Superset application.
One way to do this is by modifying the navbar.html file located in the superset/assets/templates directory. You can add a new div element for the banner and style it using CSS.
Another way is to modify the index.jsx file located in the superset-frontend/src/dashboards/Header/index.jsx and add a new component for the banner, and then import and render it in the Header component.
It's important to note that if you are using the official Superset Docker image, any changes you make to the image will be lost when you update or rebuild the image. A good practice is to use a volume to mount a local directory containing your custom templates into the container, this way you can make changes to the files on your host and have them reflected in the running container.
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For additional commands, e-mail: notifications-help@superset.apache.org
[GitHub] [superset] rusackas commented on issue #22758: How can I change the UI on superset
Posted by GitBox <gi...@apache.org>.
rusackas commented on issue #22758:
URL: https://github.com/apache/superset/issues/22758#issuecomment-1386058742
Is it specifically for this home/welcome page, or ALL pages/views?
For the former, you might start at `superset-frontend/src/views/CRUD/welcome/Welcome.tsx`
For the latter, it gets more complicated than that, since Superset is not (yet) a single page app, but a good starting point for the global nav would be `superset-frontend/src/views/components/Menu.tsx` and for the footer area, start at `superset/templates/superset/basic.html`.
Closing this issue since it's not a bug, but I hope this ant the other comment help get the ball rolling. Please join us on [Slack](http://bit.ly/join-superset-slack) in the `#customizing-superset` channel if you need more help.
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For additional commands, e-mail: notifications-help@superset.apache.org