About Seiten mit CSS Codes anpassen

2002Andreas

Noch eine Spielerei

Eigenes Icon.

Eigener Text.

Icon rot.

CSS

#faviconid {
  -moz-box-ordinal-group: 2 !important;
}

#identity-box.certErrorPage.notSecureText box#identity-icon-box.identity-box-button  {
  font-size: 0 !important;
}

#identity-box.certErrorPage.notSecureText box#identity-icon-box.identity-box-button::after {  
  color: red !important; 
  content: "! Achtung !" !important;
  font-size: 15px !important;
}

#identity-box.certErrorPage.notSecureText box#identity-icon-box.identity-box-button image#identity-icon {
    fill: transparent !important;
}

#identity-box.certErrorPage.notSecureText box#identity-icon-box.identity-box-button image#identity-icon {
    background: url("file:///C:/Users/Andi/Icons%20Firefox/error.png")!important;
    margin-right: 2px !important;     
    content: '' !important;
    display: block !important;
    width: 16px !important;
    height: 16px !important;
    background-repeat: no-repeat !important;
    background-position: 0 0 !important;
}

#identity-box.certErrorPage.notSecureText box#identity-icon-box.identity-box-button image#faviconid.faviconclass {
  filter: invert(42%) sepia(75%) saturate(4294%) hue-rotate(354deg) brightness(108%) contrast(120%) !important;
}

Alles anzeigen

Edit:

Code angepasst, siehe Beitrag Nr. 1243

Heinrich

Das hat aber noch einen kleinen Fehler

mit

CSS

#identity-icon-label  {
  font-size: 0 !important;
}

Blendest du den Text gleich pauschal für alle Tabs aus

Wenn schon dann so

CSS

#identity-box.certErrorPage.notSecureText box#identity-icon-box.identity-box-button  {
  font-size: 0 !important;
}

2002Andreas

Zitat von Heinrich

hat aber noch einen kleinen Fehler

Sorry, du hast natürlich recht

PS:

Ich ändere das mal oben im Code.

FuchsFan

Zitat von Heinrich

Gebe mal BITTE den Code für die Button`s mit Icon und am besten gleich die Icon`s dazu dann brauche ich nicht erst noch basteln !!

Warum nicht, ist doch Weihnachtszeit.

Der Code dazu:

CSS

/*Kritische Seite, Weiterleitungs-Warnung*/
@namespace url(http://www.w3.org/1999/xhtml);
 @-moz-document url-prefix(about:certerror){

    body {
        background-color: gainsboro !important;
        }
        
        
    html body.certerror div.container div#text-container{
        border: 2px solid dodgerblue !important;
        border-style: double  !important;
        border-width:  7px !important;
        padding: 50px 100px 50px 100px !important;
        background-color: beige !important;
        margin-top: -300px !important;
        box-shadow: 13px 13px 0px 0px coral inset !important;
    }

    /*Damit wird das original Icon ausgeblendet */
    .certerror .title {
  background-image: none !important;
}
.certerror .title {
    background: url("..//icons/warnung2.png") no-repeat !important;
   background-position: 60px -1px !important;
   background-size: 70px 70px !important;
   padding: 0 0 0 160px !important;
}
    
    #advancedPanelContainer {
        background-color: rgba(233,219,205,1.00) !important;
        }
    
    #badCertAdvancedPanel{
        background-color: #fbe8d2 !important;
        border: 2px solid dodgerblue !important;
        margin-top: 15px !important;
        }
    
    
    #advancedButton{
        color: #B70E11 !important;
        background: rgba(242,234,227,1.00) url("..//icons/0009.png") no-repeat !important;
        background-position: 7px 8px !important;
        background-size: 16px 16px !important;
        border: 1px solid dodgerblue !important;
        padding-left: 33px !important;
        }
    
    
    #advancedButton:hover{
        color: #B70E11 !important;
        background: lightblue url("..//icons/0009.png") no-repeat !important;
        background-position: 7px 8px !important;
        background-size: 16px 16px !important;
        border: 1px solid dodgerblue !important;
        padding-left: 33px !important;
        }
        
    #exceptionDialogButton {
        color: #B70E11 !important;
        background: rgba(242,234,227,1.00) url("..//icons/warnung.png") no-repeat !important;
        background-position: 7px 6px !important;
        background-size: 17px 17px !important;
        border: 1px solid red !important;
        padding-left: 33px !important;
        }
    #exceptionDialogButton:hover {
        color: #B70E11 !important;
        background: lightblue url("..//icons/vpn.png") no-repeat !important;
        background-position: 7px 6px !important;
        background-size: 17px 17px !important;
        border: 1px solid dodgerblue !important;
        padding-left: 33px !important;
        }        
    
    /* Button "Zurück /Empfohlen)" */
    #advancedPanelReturnButton,
    #returnButton{
        color: green !important;
        background: rgba(242,234,227,1.00) url("..//icons/07801.png") no-repeat !important;
        background-position: 7px 7px !important;
        background-size: 18px 18px !important;
        border: 1px solid dodgerblue !important;
        padding-left: 35px !important;
        }
    #advancedPanelReturnButton:hover,
    #returnButton:hover{
        color: green !important;
        background: lightblue url("..//icons/about2.png") no-repeat !important;
        background-position: 7px 7px !important;
        background-size: 18px 18px !important;
        }
        
    .title-text,
    #learnMoreLink,
    #errorCode,
    #viewCertificate{
        color: crimson !important;
        font-weight: 600 !important;
        }
    #errorWhatToDoTitleText > strong:nth-child(1){
        color: blue !important;
        }
        
    /* Button "Zertifikate anzeigen" unter Erweitert */    
    #badCertAdvancedPanel.advanced-panel a#viewCertificate {
        background: white url("..//icons/Bild34.png") no-repeat !important;
        background-position: 7px 3px !important;
        background-size: 14px 14px !important;
        border: 1px solid dodgerblue !important;
        border-radius: 20px !important;
        padding: 0px 10px 0px 30px !important;
        }
    #badCertAdvancedPanel.advanced-panel a#viewCertificate:hover {
        background: lightblue url("..//icons/Bild34.png") no-repeat !important;
        background-position: 7px 3px !important;
        background-size: 14px 14px !important;
        padding: 0px 10px 0px 30px !important;
        }            
    
    /* Text unter "Was können Sie dagegen tun */    
    #text-container div#errorWhatToDo p#errorWhatToDoText p{
        color: blue !important;
        }

    /* Button "Weitere Informationen" */
   #text-container p#learnMoreContainer a#learnMoreLink{
        background: white url("..//icons/Bild34.png") no-repeat !important;
        background-position: 7px 3px !important;
        background-size: 14px 14px !important;
        border: 1px solid dodgerblue !important;
        border-radius: 20px !important;
        padding: 0px 10px 0px 30px !important;
        }    
    #text-container p#learnMoreContainer a#learnMoreLink:hover{
        background: lightblue url("..//icons/Bild34.png") no-repeat !important;
        background-position: 7px 3px !important;
        background-size: 14px 14px !important;
        padding: 0px 10px 0px 30px !important;
        }    
        
    }

Alles anzeigen

icons.zip

Zitat von 2002Andreas

Eigener Text.

Dafür habe ich immer noch diesen Code. Icons sind natürlich keine dabei.

Code

/************** unsichere Seiten mit rotem Text ***********/

#identity-icon-label[value="Nicht sicher"] {
    color: red;
    font-weight: bold;
    }

Heinrich

Zitat von 2002Andreas

Zitat von Heinrich

hat aber noch einen kleinen Fehler

Sorry, du hast natürlich recht
PS:
Ich ändere das mal oben im Code.

Ich habe nicht NATÜRLICH recht sondern eben AUCH mal

Wer keine Fehler macht der werfe das erste Schwein

Zitat von FuchsFan

Zitat von Heinrich

Gebe mal BITTE den Code für die Button`s mit Icon und am besten gleich die Icon`s dazu dann brauche ich nicht erst noch basteln !!

Warum nicht, ist doch Weihnachtszeit.

Wegen Weihnachten sage ich dann auch mal artig DANKE

2002Andreas

Zitat von FuchsFan

Dafür habe ich immer noch diesen Code.

Das ist der Originaltext, mit meinem Code wird der verändert.

Zitat von Heinrich

Wer keine Fehler macht...

FuchsFan

Zitat von 2002Andreas

Das ist der Originaltext

Ahhhh, das ist schon lange her, dass ich mal so eine Seite erwischt habe.

Dann nehme ich mal Deine Vorlage und werde es hübsch machen. Danke!

Heinrich

Nur das hintere Symbol statt ROT einfärben gegen ein Icon Tauschen klappt nicht .......... mir ist da mal spontan nichts zu eingefallen.

Das Linke Icon bei welcher Seite auch immer zu Tauschen habe ich aber nun dann endlich dank 2002Andreas mal begriffen, IMMERHIN ich werde schlauer.

Mach einen dummen Menschen einmal schlau denn kiegst du nie wieder dumm

2002Andreas

Zitat von FuchsFan

und werde es hübsch machen. Danke!

Mach das, sollte ja auch nur ein Beipiel sein.

Zitat von Heinrich

IMMERHIN ich werde schlauer.

FuchsFan

Zitat von 2002Andreas

Mach das, sollte ja auch nur ein Beipiel sein.

Sagst Du mir bitte noch, was der Code ab Zeile 30 macht.

Beitrag

RE: About Seiten mit CSS Codes anpassen

Noch eine Spielerei

Eigenes Icon.

Eigener Text.

Icon rot.

(Quelltext, 32 Zeilen)

Edit:

Code angepasst, siehe Beitrag Nr. 1243

2002Andreas

11. Dezember 2022 um 16:32

2002Andreas

Zitat von FuchsFan

was der Code ab Zeile 30 macht.

Der färbt recht das Icon rot:

FuchsFan

Zitat von 2002Andreas

Der färbt recht das Icon rot:

Und warum habe ich das nicht?

2002Andreas

Zitat von FuchsFan

Und warum habe ich das nicht?

Standard gibt es das auch nicht.

Du brauchst dieses Skript dazu:

JavaScript

//  FavIconInUrlBar.uc.js

(function() {

    if (location != 'chrome://browser/content/browser.xhtml')
        return;
    
    var fav = document.createXULElement('image');
    fav.setAttribute('id', 'faviconid');
    fav.setAttribute('class', 'faviconclass');

    gBrowser.tabContainer.addEventListener('TabAttrModified', function() {            
     
    var favicon = gBrowser.selectedTab.image;
      
    if (favicon)
    {    
        fav.src = favicon;
        
        var position = document.getElementById('identity-icon');
        position.parentNode.insertBefore(fav, position.previousSibling);
    }
    else
    {
        fav.removeAttribute('src');
    }
    
 }, false);
 
    fav.style.height = '16px';
    fav.style.width  = '16px';
    fav.style.marginLeft  = '7px';
    fav.style.marginRight  = '3px';
    fav.style.marginTop  = '2px';
})();

Alles anzeigen

FuchsFan

Zitat von 2002Andreas

Du brauchst dieses Skript dazu:

Sachen gibt es, und das wird alles geheim gehalten.

2002Andreas

Damit bekommst du wieder ein Favicon in die Urlbar.

Forum:

FuchsFan

Zitat von 2002Andreas

Damit bekommst du wieder ein Favicon in die Urlbar.

Danke, Andreas.

Wie bekomme ich da ein anderes Warndreieck eingebaut?

2002Andreas

Zitat von FuchsFan

Wie bekomme ich da ein anderes Warndreieck eingebaut?

Das wird schwierig, zumindest für mich

Ich habe das eben mal versucht, funktioniert aber alles nicht.

FuchsFan

Zitat von 2002Andreas

Ich habe das eben mal versucht, funktioniert aber alles nicht.

Dann lassen wir das, danke.

Heinrich

Zitat von FuchsFan

Wie bekomme ich da ein anderes Warndreieck eingebaut?

Genau das versuche ich auch schon die ganze Zeit !!

Das Script von Andreas versemmelt mir alle Favicons, verträgt sich nicht mit meinen anderen Änderungen !

Ich bastel weiter...................................

2002Andreas

Zitat von Heinrich

verträgt sich nicht mit meinen anderen Änderungen !

Wenn es um Abstände geht, die kannst du im Skript anpassen.

About Seiten mit CSS Codes anpassen

RE: About Seiten mit CSS Codes anpassen

Ähnliche Themen

Mehrzeilige Tableiste für aktuelle Firefox-Versionen

Addons Manager Nightly