Would a stylish style mess up my logging in?

ngoonee · 2010-07-30 11:25:41

After the forum downtime my 'auto-log-in' didn't work, so I just typed in my password and got a 'wrong code' message or something like that. Figured that was weird, since I could see other people posting.

Eventually it turned out that I could only login if I turned stylish off. I'm only using one style (Carbon eXtreme). Could stylish somehow mess up with the text in the textbox? Haven't had problems logging in to other sites before....

Pierre · 2010-07-30 11:28:19

what does stylish change here on the forums? There "wrong code" message is from my spam bot trap. I guess this plugin blocks some css code I use to display a tiny dot which sets a cookie.

ngoonee · 2010-07-30 11:52:20

Pierre wrote:

what does stylish change here on the forums? There "wrong code" message is from my spam bot trap. I guess this plugin blocks some css code I use to display a tiny dot which sets a cookie.

Its just (as far as I know) a colour change, I like white-on-gray text, I'm a dark theme sorta guy.

Once I check 'auto-login' its not given me any more problems, so not a big deal. Your explanation makes quite a bit of sense, the stylish theme would change such stuff I think.

Pierre · 2010-07-30 12:47:08

Well, without the code that was changed I cannot tell that much.

ngoonee · 2010-07-30 14:59:42

Hmm... I'm not a webdev at all. What would you need?

Pierre · 2010-07-30 15:01:20

I don't really know stylish but I guess you have some css code that you have defined to be used on archlinux.org...just post that code.

ngoonee · 2010-07-30 15:07:03

This is just a copy paste, I don't know enough to know what's necessary/not... sorry about that.

/*
 "Carbon eXtreme" - Dark Global theme.
 by Urban1zed
 BEGIN
*/

/*
 summary:
 - basic background = dark grey
 - basic text = light grey
 - "semantic" importance = contrast
 - unvisited links (and form labels) = white
 - visited links = grey
 - underline links = false. (the only "bad" but IMO excusable thing)
 - form elements, :hover, :focus, and more

 latest revisions
 +2008-08-18+ FF3 fix
*/

@namespace url(http://www.w3.org/1999/xhtml);

@-moz-document
 url-prefix(http://) ,
 url-prefix(https://)
{


/*
  *
   * init
   * - setting basic colours / background
   * - disabling background images
  *
 *
*/

html
{ background-color : #222 !important
; border-color     : #444 !important
}

body
{ background-color : #333 !important
; border-color     : #666 !important
; color            : #ccc !important
}

body *
{ background-color : transparent !important
; border-color     : #666        !important /* "inherit" is bugged ! */
; color            : inherit     !important
}

html  ,
html *
{ background-image : none !important
}

/*
  *
   * semantic blocks
  *
 *
*/

/*
  * top header:
 *
*/

/*
 * - wannabe
*/
.head  ,
.header  ,
*[id*="title"]  ,
*[id*="Title"]  ,
*[id*="head"]  ,
*[id*="Head"]  ,
*[class*="header"]  ,
*[class*="Header"]  ,
*[id*="hlavicka"]  ,
*[id*="Hlavicka"]  ,
*[class*="hlavicka"]  ,
*[class*="Hlavicka"]
{ background-color : #404040 !important
}

/*
 * - real
*/
header  ,
#head  ,
#header  ,
#top   /* ?: disputable */
{ background-color : #444 !important
}

/*
  * navigation :
  * ( 'menu predicting magic' )
 *
*/

/*
 * - wannabe
*/
.navlist a  ,
.Navlist a  ,
*.navigation a  ,
*[id*="menu"] a  ,
*[id*="Menu"] a  ,
*[id*="navig"] a  ,
*[id*="Navig"] a  ,
*[id$="nav"] a  ,
*[id$="Nav"] a  ,
*[class*="menu"] a  ,
*[class*="Menu"] a  ,
*[class*="navig"] a  ,
*[class*="Navig"] a  ,
*[class$="nav"] a  ,
*[class$="Nav"] a
{ background-color : #282839 !important
}

/*
 * - real
*/
label  , /* ! label added, let's see */
nav a  ,
menu a  ,
#menu a  ,
#navigation a
{ background-color : #223 !important
}

/* above ID selectors would override below rules
 * due # selector priority
 * so that's why this :
*/
#menu a:hover  ,
#navigation a:hover
{ background-color : #000 !important
}

/*
  * aside:
 *
*/

/*
 * - wannabe
*/
div[id*="side"]  ,
div[id*="Side"]  ,
div[class*="side"]  ,
div[class*="Side"]
{ background-color : #404040 !important
}

/*
 * - real
*/
aside  ,
.aside  ,
#aside
{ background-color : #444 !important
}

/*
 * footer
*/

footer  ,
div[id*="foot"]  ,
div[class*="foot"]  ,
div[id*="paticka"]  ,
div[class*="paticka"]
{ background-color : #444 !important
}

/*
  * others semantic blocks
  * (yet unimplemented)
 *
*/
/*
article  {
}

#main  {
}

#content  {
}

section  ,
.section  {
}

.divider  {
}
/* */



/*
  * anonymous heading elements
 *
*/

*[class*="heading"]  ,
*[class*="Heading"]  ,
*[id*="heading"]  ,
*[id*="Heading"]  ,
*[class*="nadpis"]  ,
*[class*="Nadpis"]  ,
*[id*="nadpis"]  ,
*[id*="Nadpis"]
{ border-color : #888 !important
; color        : #eee !important
}




/*
  *
   * concrete HTML block elements
  *
 *
*/

/*
  * headers
  * h1 , h2 , h3 , h4 , h5 , h6
  * caption , th , lh , dt , legend
 *
*/
h1
{ background-color : #000 !important
; border-color     : #eee !important
; color            : #fff !important
}

h2  ,
h3  ,
h4  ,
h5  ,
h6  ,
caption  , /* table h. */
th  , /* table-row|column h. */
lh  , /* list h. html3. how f***ing usefull element. deprecated. */
dl dt  , /* definition h. */
html fieldset legend   /* form h. */
{ background-color : #222 !important
; border-color     : #999 !important
; color            : #eee !important
}

/*
  * other stuff
  * now they have the same colour;
  * it would be nice if it was distinguishable simply by colour
 *
*/

blockquote  ,
code  , /* code is inline */
xmp  ,
pre
{ background-color : #444 !important
}

td  {
 /* tried, but it was not good */
}

hr
{ background-color : #666 !important
; border-color     : #666 !important
; color            : #666 !important
}


/*
  *
   * concrete HTML inline elements
   * - just colour altered
  *
 *
*/

/*
  * emphasis:
 *
*/

/*
 * - wannabe
*/
*[id*="important"]  ,
*[id*="Important"]  ,
*[class*="important"]  ,
*[class*="Important"]
{ border-color : #666 !important
; color        : #fff !important
}

/*
 * - wannabe #2
 * ( yes, it is NOT semantic, but this is usefull, trust me ;] )
*/
b  ,
b *  ,
i  ,
i *
{ border-color : #555 !important
; color        : #eee !important
}

/*
 * real
*/
em  ,
em *  ,
strong  ,
strong *
{ border-color : #666 !important
; color        : #fff !important
}

/*
  *
   * common "semantic" classes
   * initally based on WHATWG HTML5 specs draft
   * ("semantic classes" have been rejected)
   * but here may be very usefull
  *
 *
*/

/*
  * current / active
  * usefull especially for
  * - "active" tabs,
  * - "current" links in menu
 *
*/
.current  ,
.selected  ,
.active
{ background-color : #000 !important
; color            : #fff !important
}

*[class*=Current]  ,
*[class*=Selected]  ,
*[class*=Active]  ,
*[class*=current]  ,
*[class*=selected]  ,
*[class*=active]
{ background-color : #111 !important
; color            : #eee !important
}

/*
  * other not-so-common classes
 *
*/
.copyright
{ color : #ccc !important
}
.error
{ color : #f66 !important
}
.warning
{ color : #f99 !important
}
.example
{ color : #cff !important
}
.issue
{ color : #f99 !important
}
.note
{ color : #cff !important
}
.search
{ color : #cff !important
}

/*
 * other funny WHATWG stuff
*/
*[irrelevant]
{
}

/*
  * links and interactive stuff
  * that is: links, labels and any other form element
  * with :hover / :active / :focus states
 *
*/

/*
 * "onclick warning"
*/
*[onclick]:hover
{ background-color : #FFFFFF !important
}

/*
 * properly coded label will behave as unvisited link
*/
label[for]  ,
a:link  ,
a:link *
{ border-color : #FFFFFF !important
; color        : #FFFFFF !important
}

label[for]:focus  ,
label[for]:hover  ,
a:link:focus  ,
a:link:hover
{ background-color : #000 !important
; border-color     : #000 !important
; color            : #FFFFFF !important
}

a:link:focus *  ,
a:link:hover *
{ border-color : #FFFFFF !important
; color        : #FFFFFF !important
}

a:visited  ,
a:visited *
{ border-color : #FFFFFF !important
; color        : #666666 !important
}

a:visited:focus  ,
a:visited:hover
{ background-color : #000 !important
; border-color     : #000 !important
; color            : #333333 !important
}

a:visited:focus *  ,
a:visited:hover *
{ border-color : #000 !important
; color        : #FFFFFF !important
}

/*
 * active. no matter if visited or not
*/
a:active  ,
a:active *
{ border-color : #000 !important
; color        : #FFFFFF !important
}

/*
  * form elems and some IMO neat effects
 *
*/
html button  ,
html select  ,
html input
{ background-color : #222 !important
}

html input[type="password"]
{ background-color : #755 !important
}

html textarea  ,
html input[type="text"]  ,
html input:not([type])
{ background-color : #555 !important
}

html textarea:hover  ,
html input[type="text"]:hover  ,
html input:not([type]):hover
{ background-color : #444 !important
}

html textarea:focus  ,
html input:focus  ,
html button:focus  ,
html textarea:focus:hover  ,
html input:focus:hover  ,
html button:focus:hover
{ background-color : #000 !important
; border-color     : #fff !important
}

html input[type="password"]:focus
{ background-color : #300 !important
}

input[disabled]
{ color : #888 !important
}

/*
  *
   * fixes and tweaks
  *
 *
*/


/*
  * FF3 fix, hope it will work
  * +2008-08-18+
 *
*/
html button  ,
html select  ,
html input  ,
html textarea 
{ -moz-appearance : none !important
}


/*
  * give solid bg to some elems that deserve it
 *
*/

/* dropdowns that was not catched
 * by above 'menu predicting magic'
*/
li:hover li
{ background-color : #333 !important
}

/* wd DOM inspector
*/
div[id^=webdeveloper]
{ background-color : #333 !important
}

/* flashblock. bruteforce.
*/
div[style~="url(chrome://flashblock/content/flash.png)"]
{ background-color : #630 !important
}

/* last.fm
*/
td.quantifier > div  ,
div.graph > div#tomGraph
{ background-color : #222 !important
}

/* search hilite
*/
span#__firefox-findbar-search-id
{ background-color : #9ff !important
}

/* imageblock
*//* * ( my upcoming userscript, maybe one time... /
span.imgBlock-mask
{ outline: 1px dotted
; text-align: center
; overflow: hidden
}
/* */

/* gmail (2D: maybe more specific context)
*/
#pop
{ background-color : #222 !important
}


/*
  * no underline for links
  * disputable.
  * but isn't strict colour difference enough?
 *
*[DISABLED]/
a
{ text-decoration : none !important
}
/* */

}

/*
 END
 "Carbon eXtreme" - Dark Global theme.
 by Urban1zed
*/

Pierre · 2010-07-30 15:13:13

What the hell. Whoever wrote this tried to somehow match every website out there. There is no way to make this work correctly. Such things have to be written specific for each site.

ngoonee · 2010-07-30 15:24:47

Well, it works on most of the sites I use. I'm presuming from your reaction that I shouldn't bother with it

Pierre · 2010-07-30 15:26:15

Let's say it would take some time to read into that code. :-)

ngoonee · 2010-07-30 15:28:00

Hmm, I feel bad as it is. Don't bother. I just wanted a simple way to make everything light on dark background, hate reading webpages which burn my eyes

Wintervenom · 2010-07-30 16:48:30

The override I wrote also broke on log-in, too:

@namespace url(http://www.w3.org/1999/xhtml);

@-moz-document domain("bbs.archlinux.org") {
  * {
    font-size: 8pt !important;
  }
  div {
    border: none !important;
  }
  .blockpost h2 {
    border: 1px #6f0d00 solid !important;
    background: #6f0d00 !important;
  }
  .blockpost h2 span, .blockpost h2 a {
    background: none !important;
  }
  .blockpost h2 span {
    background: none !important;
  }
  .blockpost h2 a:visited {
    color: #ce2d02 !important;
  }
  .box {
    border: 1px #6f0d00 solid !important;
  }
  .postleft, .postright  {
    float: none !important;
    position: static !important;
    width: auto !important;
  }
  .postleft dd {
    display: none;
  }
  .postleft dt {
    display: inline !important;
    font-weight: normal !important;
  }
  .postleft dt::after {
    content: ", a";
  }
  .usertitle {
    display: inline !important;
  }
  .usertitle::after {
    content: " »";
  }
  .usertitle strong {
    font-weight: normal !important;
  }
  .postright {
    padding-left: 4em !important;
  }
  .postfootleft, .postfootright {
    border-top: 1px #6f0d00 solid !important;
  }
  .postfootleft p {
    color:  #932a0b !important;
  }
  #punsearch table * {
    border: none !important;
  }
}

Last edited by Wintervenom (2010-07-30 16:49:08)

fsckd · 2010-07-31 02:12:31

I had to modify my user stylesheet. I have no problem logging in and am fairly happy with the results.

Relevant parts:

* {
    color:          #aabbcc !important;
    background:     #000000 !important;
}
hr {
    background-color: #ccbbaa !important;
}
h1 {
    color:          #BB0000 !important;
}
h2 {
    color:          orange  !important;
}
h3 {
    color:          #00BB00 !important;
}
h4 {
    color:          #BBBB00 !important;
}
a:link {
    text-decoration:    none;
    font-weight:    bold;
    color:    #88ccee !important;
    background:    none !important;
}
a:visited {
    text-decoration:    none;
    font-weight:    bold;
    color:    #aa88bb !important;
    background:    none !important;
}
td {
    border-color: #554444 !important;
}


/* ArchLinux Forums */
/* does not work
body > div#archnavbar {
    background-color: none !important;
}
body > div#archnavbar > div#archnavbarlogo {
    background: url(https://bbs.archlinux.org/style/ArchLinux/archlogo.png) no-repeat !important;
    background-color: #ff0000 !important;
}*/
div.blockpost > div.box > div.inbox:first-child > div.postbody {
    border-left-color: #000000 !important;
}
div.postfootleft > p > strong {
    color: #445544 !important;
}
div.postfootleft > p > span {
    color: #554455 !important;
}
div#brdmenu > ul > li > a {
    border-right-color: #000000 !important;
}
div.postmsg div.codebox {
    border-color: #aabb88 !important;
}
div.postmsg div.quotebox {
    border-color: #aa99cc !important;
}
div#brdmain > div.blockpost > h2 {
    border-color: #334455 !important;
    border-style: dotted !important;
}
div.postlinksb > div.inbox > div.pagepost,
div.linksb > div.inbox > div.pagepost {
    border-top-style: solid !important;
    border-top-width: 1px !important;
}

Ok, it looks ugly and the ARchlogo doesn't show but it works and it's dark which is all that matters.

diegonc · 2010-07-31 03:54:19

[OT]
Curved comments! This is the first time I see that
[/OT]

Arch Linux

#1 2010-07-30 11:25:41

Would a stylish style mess up my logging in?

#2 2010-07-30 11:28:19

Re: Would a stylish style mess up my logging in?

#3 2010-07-30 11:52:20

Re: Would a stylish style mess up my logging in?

#4 2010-07-30 12:47:08

Re: Would a stylish style mess up my logging in?

#5 2010-07-30 14:59:42

Re: Would a stylish style mess up my logging in?

#6 2010-07-30 15:01:20

Re: Would a stylish style mess up my logging in?

#7 2010-07-30 15:07:03

Re: Would a stylish style mess up my logging in?

#8 2010-07-30 15:13:13

Re: Would a stylish style mess up my logging in?

#9 2010-07-30 15:24:47

Re: Would a stylish style mess up my logging in?

#10 2010-07-30 15:26:15

Re: Would a stylish style mess up my logging in?

#11 2010-07-30 15:28:00

Re: Would a stylish style mess up my logging in?

#12 2010-07-30 16:48:30

Re: Would a stylish style mess up my logging in?

#13 2010-07-31 02:12:31

Re: Would a stylish style mess up my logging in?

#14 2010-07-31 03:54:19

Re: Would a stylish style mess up my logging in?

Board footer