News:

SMF 2.1.4 has been released! Take it for a spin! Read more.

Main Menu

Quote & Code style in smf 2 ?

Started by Am', February 19, 2010, 06:01:27 PM

Previous topic - Next topic

You like or not style of quotes & codes (smf2) ?

I like
8 (30.8%)
I dislike
18 (69.2%)

Total Members Voted: 26

Marcus Forsberg

I do hope the code tags aren't green as they are in your example above? That really doesn't fit into Curve, to be honest..

~DS~

LOL, it's a text editor tool for Windows I believed.
"There is no god, and that's the simple truth. If every trace of any single religion were wiped out and nothing were passed on, it would never be created exactly that way again. There might be some other nonsense in its place, but not that exact nonsense. If all of science were wiped out, it would still be true and someone would find a way to figure it all out again."
~Penn Jillette – God, NO! – 2011

Marcus Forsberg


Am'

yes green, but you can easly change that

اذا أحس أحد انه لم يخطأ ابدا في حياته, فهذا يعني أنه لم يجرب أي جديد في حياته
My Mods For SMF 2 RC3 : XQuote XCode - Vbulletin Style New Meta Tags

Marcus Forsberg

If I were you, I'd make a blue version as the default option, but include that green version for those who either want it for Curve, or have a green theme.

Am'

for the quote is good ? for the code try the green you'll love it.

I had the same opinion as you but the problem is that there's blue everywhere, so I had the idea to change the colors (quote & code)
اذا أحس أحد انه لم يخطأ ابدا في حياته, فهذا يعني أنه لم يجرب أي جديد في حياته
My Mods For SMF 2 RC3 : XQuote XCode - Vbulletin Style New Meta Tags

Am'

اذا أحس أحد انه لم يخطأ ابدا في حياته, فهذا يعني أنه لم يجرب أي جديد في حياته
My Mods For SMF 2 RC3 : XQuote XCode - Vbulletin Style New Meta Tags

Marcus Forsberg

The orange in the quote is OK, fits in well.
If you could post a full page screenshot of the code block, so I can see how it looks in-context, maybe I could change my mind..? ;)

Am'

and this screenshot ?

http://img96.imageshack.us/img96/6718/captureeq.png

(you can download the module for a complete test)

اذا أحس أحد انه لم يخطأ ابدا في حياته, فهذا يعني أنه لم يجرب أي جديد في حياته
My Mods For SMF 2 RC3 : XQuote XCode - Vbulletin Style New Meta Tags

Marcus Forsberg

I was more thinking a picture of an entire thread, so I can see how it really fits into the entire Curve theme, since I don't have time to test your package at this time.

Am'

Quote from: Nas on March 12, 2010, 03:16:35 PM
I was more thinking a picture of an entire thread, so I can see how it really fits into the entire Curve theme, since I don't have time to test your package at this time.

http://www.pict.com/view/3103319/800/test
اذا أحس أحد انه لم يخطأ ابدا في حياته, فهذا يعني أنه لم يجرب أي جديد في حياته
My Mods For SMF 2 RC3 : XQuote XCode - Vbulletin Style New Meta Tags

Marcus Forsberg

Thanks.
Well, it's not *too* bad, but I still can't say I'm fond of that color.
The actual style is pretty nice though, and as you said it's not too hard to change the colors. :)

As for the package you posted... You shouldn't package mods as rar. You should use zip or tar.gz. Also, it's double packaged.
package-info.xml and all associated files must be placed on the top level of your package.

That is, if you want to submit it to our customization site.

Am'

archive upgraded

Quote from: Nas on March 12, 2010, 03:20:45 PM
Thanks.
Well, it's not *too* bad, but I still can't say I'm fond of that color.
The actual style is pretty nice though, and as you said it's not too hard to change the colors. :)

well ... blue is good, but not too!  ;)
اذا أحس أحد انه لم يخطأ ابدا في حياته, فهذا يعني أنه لم يجرب أي جديد في حياته
My Mods For SMF 2 RC3 : XQuote XCode - Vbulletin Style New Meta Tags

~DS~

Quote from: Am' on March 12, 2010, 03:10:33 PM
Quote from: Dismal Shadow on March 12, 2010, 02:47:27 PM
Can you make the one for RC3 of the second quote style made by Antechinus.
http://www.simplemachines.org/community/index.php?topic=347845.0

euh sorry i don't understand ;)

The one with
Quote
Quote from: Antechinus on November 13, 2009, 07:15:24 AM


Now for the ones with curved corners. Yes, I know you can do them without images if you only want them in Firefox and Safari/Chrome but this method makes them work in all browsers.
Css/index.css:
Find:

/* A quote, perhaps from another post. */
.quoteheader
{
color: #7a899c;
}
.codeheader, .quoteheader
{
font-size: 0.9em;
font-weight: bold;
padding-left: 5px;
}
blockquote, blockquote blockquote blockquote
{
font-size: 0.9em;
color: #000000;
line-height: 1.4em;
background: url(../images/theme/quote.png) 2px 2px no-repeat #D7DAEC;
border-top: solid 1px #000;
border-bottom: solid 1px #000;
padding: 1em 1em 1em 2em;
margin: 0.3em 0 0 0;
}
blockquote blockquote
{
background: #e7eAfC;
}

/* A code block - maybe even PHP ;). */
code
{
display: block;
font-family: "courier new", "times new roman", monospace;
font-size: x-small;
background: #eee;
border-top: solid 1px #000;
border-bottom: solid 1px #000;
line-height: 1.3em;
padding: 3px 1em;
overflow: auto;
white-space: pre;
/* Stop after about 24 lines, and just show a scrollbar. */
max-height: 24em;
}


Replace with:

/* A quote, perhaps from another post. */
.codeheader, .quoteheader
{
font-size: 0.9em;
font-weight: bold;
padding-left: 20px;
}
.quoteheader, blockquote blockquote .quoteheader
{
color: #7a899c;
    background: url(../images/theme/quote_ends.png) 0 -100px no-repeat;
}
.topslice_quote, blockquote blockquote .topslice_quote
{
    background: url(../images/theme/quote_slices.png) 100% -100px no-repeat;
padding: 0.3em 0;
}
blockquote .quoteheader
{
color: #7a899c;
    background: url(../images/theme/quote_ends.png) 0 0 no-repeat;
}
blockquote .topslice_quote
{
    background: url(../images/theme/quote_slices.png) 100% 0 no-repeat;
}
blockquote, blockquote blockquote blockquote
{
font-size: 0.9em;
color: #000000;
line-height: 1.4em;
background: #FFFFFF;
border-left: 1px solid #DCE0F3;
border-right: 1px solid #DCE0F3;
padding: 0 1em 0 1.5em;
margin: 0 0 0 0;
}
blockquote blockquote
{
background: #F0F4F7;
border-left: 1px solid #D8DDF1;
border-right: 1px solid #D8DDF1;
}
.quotefooter, blockquote blockquote .quotefooter
{
    background: url(../images/theme/quote_ends.png) 0 100% no-repeat;
padding-left: 20px;
margin-bottom: -5px;
}
.botslice_quote, blockquote blockquote .botslice_quote
{
    height: 10px;
background: url(../images/theme/quote_slices.png) 100% 100% no-repeat;
}
blockquote .quotefooter
{
color: #7a899c;
    background: url(../images/theme/quote_ends.png) 0 -270px no-repeat;
padding-left: 20px;
}
blockquote .botslice_quote
{
    height: 10px;
background: url(../images/theme/quote_slices.png) 100% -230px no-repeat;
}
blockquote blockquote blockquote .quoteheader {display: none;}
blockquote blockquote blockquote blockquote {display: none;}
blockquote blockquote blockquote .quotefooter {display: none;}

/* A code block - maybe even PHP ;). */
code
{
display: block;
font-family: "courier new", "times new roman", monospace;
font-size: x-small;
background: #eee;
border-top: solid 4px #AAAABB;
border-bottom: solid 4px #AAAABB;
line-height: 1.3em;
padding: 3px 1em;
overflow: auto;
white-space: pre;
/* Stop after about 24 lines, and just show a scrollbar. */
max-height: 24em;
}


This will look like the second screenshot. You will need to copy the two attached images (quote_ends.png and quote_slices.png) to your default/images/theme folder.

Note that this uses the same styling for the code boxes as the first example. There is no point trying to put rounded corners on code boxes because they usually have scroll bars at the bottom and at the right, which makes them look silly if you try to add rounded corners. The code boxes are best kept simple IMO.

Enjoy.
"There is no god, and that's the simple truth. If every trace of any single religion were wiped out and nothing were passed on, it would never be created exactly that way again. There might be some other nonsense in its place, but not that exact nonsense. If all of science were wiped out, it would still be true and someone would find a way to figure it all out again."
~Penn Jillette – God, NO! – 2011

Marcus Forsberg

Yeah, it really depends on what type of blue you use, and how you use it. A blue color like #330099 would of course not fit in, while a lighter, more gray, tone may.

Quote from: Am' on March 12, 2010, 03:26:13 PM
archive upgraded

Quote from: Nas on March 12, 2010, 03:20:45 PM
Thanks.
Well, it's not *too* bad, but I still can't say I'm fond of that color.
The actual style is pretty nice though, and as you said it's not too hard to change the colors. :)

well ... blue is good, but not too!  ;)

Akyhne

Bloc's quotes are nice, but they wouldn't work for code BBC. Would steal focus.

Ar-S

Bonjour,
Une modification de l'apparence du contenu de la balise code est vraiment une bonne initiative.
J'utilise actuellement la 1.1.13 et j'aurai vraiment aimé savoir si un mod du genre existait.
Du coup je n'ai trouvé que celui ci pour la version 2RC, ce qui ne m'intéresse pas (pour le moment..)
pouvez vous me guider vers un topic ou un mod permettant cela ?
D'avance merci.

Kindred

please use English or ask in the French language support board.
Слaва
Украинi

Please do not PM, IM or Email me with support questions.  You will get better and faster responses in the support boards.  Thank you.

"Loki is not evil, although he is certainly not a force for good. Loki is... complicated."

Advertisement: