Official Everybody Edits Forums

Do you think I could just leave this part blank and it'd be okay? We're just going to replace the whole thing with a header image anyway, right?

You are not logged in.

Pages: 1

#1 2016-07-05 14:28:22, last edited by Anatoly (2016-07-10 10:50:30)

Anatoly
Guest

I make website stylesheets (SCSS, jQuery, html based) online

Currently i am working on a bootstrap similar style sheet. if you want to see what i have already done go here, and see my work:

Websites the Work is located at
Stylesheet #1

Pictures Overview of everything on one page

▼Stylesheet #1

#2 2016-07-07 23:34:36, last edited by Koya (2016-07-07 23:46:38)

Koya
Fabulous Member
From: The island with those Brits
Joined: 2015-02-18
Posts: 6,310

Re: I make website stylesheets (SCSS, jQuery, html based) online

Key: Bad, caution & Good

You have SCSS enabled but you aren't using any of the functionality of it (I found one use of nested CSS), this is not "SCSS based" (an example of SCSS in full use •, but that is still not "SCSS based") - also SCSS is not interpreted by browsers, it is converted into CSS.

Sort out your fonts, different browsers have their own default font but for most is it the awful Times New Roman, Google offers many fonts you can use https://www.google.com/fonts.

Relax on the border-radius property, you don't and shouldn't use it so frequently - if you do use it for everything maintain the same property value for similar sizes and use it for simple sites.

With codepen you have a feature called auto-prefixer (which can be found by clicking the cog then under "Vendor Prefixing" click the radio button next to "AUTOPREFIXER ") which means that

.noselect {
  user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -moz-user-select: none;
  -khtml-user-select: none;
  -webkit-user-select: none;
  -webkit-touch-callout: none;
}

can be written as

.noselect {
  user-select: none;
}

Good usage of pseudo-classes for titles for containers
Good usage of element w/ class selectors `div.announcement`

Caution about using nesting classes w/ same class but w/out relevant names

<div class="container">
    <h4 class="container">Container Title</h4>
    <div class="container-body">
        Lorem ipsum
    </div>
</div>

Notice how a parent div and a child h4 have the same class but the class doesn't make sense on the h4 - just remove the class and have it defined within the CSS
To safely only talk about that one h4 you use:

[SCSS]
.container {
    /*Container stylings*/
    >h4 { /*The > means a direct child*/
        /*h4 stylings*/
    }
}

Also, h tags aren't really used anymore as you end up removing all of the stuff that turns it from a div to an h (default stylings: `display:block;`)

You have over-complicated the spoilers, you really only need to change the `display` property of the element holding the hidden information, take this pen as an example http://codepen.io/OfficialAntarctica/pen/gMLPpy

[HTML]
<spoiler type="dropdown">
    <div class="title">Spoiler Title</div>
    <div class="body">Something very very frightning</div>
</spoiler>

At a closed state:

[CSS]
.body {
    display:none; /*Don't show*/
}

At an open state:

[CSS]
.body {
    display:initial; /*Leave it how it was / ignore property changes above this*/
}

Clicks use $(this) to talk about the element that called the action, so the classes can be changed on that one only

[JavaScript/jQuery]
$("spoiler >.title").click(function(){
   $(this).parent().toggleClass("open");
});

Generally as a whole, better than most people's first pens and looking forward to seeing more!

▼Hidden text

Po9cnQh.png

PLNQVL8.png
Thank you eleizibeth ^

1SYOldu.png

I stack my signatures rather than delete them so I don't lose them
giphy.gif

WfSi4mm.png

Offline

#3 2016-07-08 00:54:31

hummerz5
Member
From: wait I'm not a secret mod huh
Joined: 2015-08-10
Posts: 5,854

Re: I make website stylesheets (SCSS, jQuery, html based) online

A pretty in-depth review. Glad you're not auditing my code m8.
lol I forgot about the jquery this. Have been doing function(e){ $(e.target) } probably more than I need to

that color thing you linked to
it took me a while to get the purpose of the thing. I clicked and tinkered. Wondered why the background was so fancy. I sent for help after the third day. I thought "surely he's not... using my clipboard?!?... I didn't know js did that yet." Then I happened across the "?" icon, complete with explanation. cool.

Oh, I just looked at the photos and not the codepen! Interesting. You guys sure have a ton of styling in your sheets. Not my forte *cough*. Pretty neat

thanks HG, HG, HG, HG! anatoly, zumza! zoey!

Offline

Wooted by:

Koya

#4 2016-07-10 11:38:16

Anatoly
Guest

Re: I make website stylesheets (SCSS, jQuery, html based) online

Please help! I have accidentally broken my images.

#5 2016-07-20 12:20:24

Anatoly
Guest

Re: I make website stylesheets (SCSS, jQuery, html based) online

I'll work a bit on other stylesheets (example UI, etc.), where i will try to show my best.

P. S. This isn't SCSS!!

#6 2016-07-20 15:28:21

Different55
Forum Admin
Joined: 2015-02-07
Posts: 16,575

Re: I make website stylesheets (SCSS, jQuery, html based) online

AnatolyEE wrote:

I'll work a bit on other stylesheets (example UI, etc.), where i will try to show my best.

P. S. This isn't SCSS!!

bottom one reminds me of pekwm's default theme.

"Sometimes failing a leap of faith is better than inching forward"
- ShinsukeIto

Offline

#7 2016-07-20 16:19:43

Calyfornia
Member
From: Scotland
Joined: 2016-07-09
Posts: 41

Re: I make website stylesheets (SCSS, jQuery, html based) online

Koya wrote:

Sort out your fonts, different browsers have their own default font but for most is it the awful Times New Roman, Google offers many fonts you can use https://www.google.com/fonts.

Just putting it out there...

EENeat | Teaches itself how to play EE (Made in partnership with Jesse)
Rider   | Cross-platform, alternative C# IDE by JetBrains.

Offline

#8 2016-07-20 17:14:37

Anatoly
Guest

Re: I make website stylesheets (SCSS, jQuery, html based) online

Different55 wrote:
AnatolyEE wrote:

I'll work a bit on other stylesheets (example UI, etc.), where i will try to show my best.

P. S. This isn't SCSS!!

bottom one reminds me of pekwm's default theme.

can't open that site. Connection not secure?

#9 2016-07-20 17:36:57

Different55
Forum Admin
Joined: 2015-02-07
Posts: 16,575

Re: I make website stylesheets (SCSS, jQuery, html based) online

AnatolyEE wrote:
Different55 wrote:
AnatolyEE wrote:

I'll work a bit on other stylesheets (example UI, etc.), where i will try to show my best.

P. S. This isn't SCSS!!

bottom one reminds me of pekwm's default theme.

can't open that site. Connection not secure?

Yeah their certificate expired about a week ago and they haven't renewed it yet. Try this.

"Sometimes failing a leap of faith is better than inching forward"
- ShinsukeIto

Offline

#10 2016-07-21 17:08:54

Anatoly
Guest

Re: I make website stylesheets (SCSS, jQuery, html based) online

Should i see this?

CgD8DXW.png

#11 2016-07-21 21:30:21

capasha
Member
Joined: 2015-02-21
Posts: 4,066

Re: I make website stylesheets (SCSS, jQuery, html based) online

AnatolyEE wrote:

Why do you even ask? You can't understand that it's the picture of the site that diff posted?

Offline

#12 2016-07-22 13:20:45

Anatoly
Guest

Re: I make website stylesheets (SCSS, jQuery, html based) online

But what he meant with that?

#13 2016-07-22 15:11:04

Different55
Forum Admin
Joined: 2015-02-07
Posts: 16,575

Re: I make website stylesheets (SCSS, jQuery, html based) online

Different55 wrote:

bottom one reminds me of pekwm's default theme.

I meant that the bottom one looks like it.

"Sometimes failing a leap of faith is better than inching forward"
- ShinsukeIto

Offline

Different551469196664613734

Pages: 1

Board footer

Powered by FluxBB

[ Started around 1739058170.3644 - Generated in 0.080 seconds, 12 queries executed - Memory usage: 1.62 MiB (Peak: 1.81 MiB) ]