Zmiana notebooka Jupyter 4.x + logo

Question

W wersji IPython 2.x można dodać logo, dostosowując folder .ipython/profile_name/static/base/images/logo.png i wyświetli niestandardowe logo, które utworzyliśmy w nagłówku notebooka.

W Juwaer notebooka wersja 4.x wiemy, że przenoszą katalog do .jupyter/ zamiast np. .jupyter/base/ i .jupyter/custom/custom.css. Jednak gdy próbuję dostosować domyślny profil w ~/.jupyter/base/images/logo.png, nie mogę już zmienić logo.

Pytanie brzmi: jak niestandardowe logo w Juwater notebooka wersja 4.x. Zastanawiam się, czy istnieje rozwiązanie niestandardowego logo notebooka Jupyter (wersja 4.x), czy też nie. Poniżej zamieszczam przykładową migawkę spersonalizowanego logo notebooka w poprzedniej wersji: 2.x.

Answer 1

Więc tutaj jest szybkie rozwiązanie dzięki @Eric komentarzu (odnosząc się do this post). Najpierw dodaję logo.png do .jupyter/custom/logo.png. Następnie dodaj następujące linie do .jupyter/custom/custom.css, aby załadować logo.

#ipython_notebook img{                       
    display:block; 
    background: url(logo.png) no-repeat; 
    background-size: contain; 
    width: 233px; 
    height: 33px; 
    padding-left: 233px; 
    -moz-box-sizing: border-box; 
    box-sizing: border-box; 
} 

Można również dodać ten tag css, aby zwiększyć wysokość logo dopełnienie dodając:

#ipython_notebook { 
    height: 40px !important; 
} 

Answer 2

logo.png Dodaj do .jupyter/custom/logo.png. Następnie dodaj następujące linie do .jupyter/custom/custom.css, aby załadować logo. Przy kwadratowym rozmiarze widziałem przesunięcie nazwy notebooka, gdy używano CSS titipada. To naprawia.

#ipython_notebook img{                       
     display:block; 
     background: url(logo.png) no-repeat; 
     background-size: contain; 
     width: 33px; 
     height: 33px; 
     padding-left: 33px; 
     -moz-box-sizing: border-box; 
     box-sizing: border-box; 
    } 

    #header-container { 
     display: flex; 
     justify-content: space-between; 
    } 

    span#login_widget { 
     flex-grow: 1; 
     order: 4; 
     display: flex; 
     justify-content: flex-end; 
    } 

    span#save_widget { 
     flex-grow: 40; 
    }