Skip to content

jQuery.org cleanup. #208

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
wants to merge 5 commits into from
Closed

jQuery.org cleanup. #208

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
b6de625
Minor fixes for jQuery.org.
kleinmaetschke Feb 12, 2013
11e2844
jQuery.org homepage fixes.
kleinmaetschke Feb 13, 2013
3cab17f
Getting us to a point where very little styling remains.
kleinmaetschke Feb 13, 2013
34ea141
Cleaning up for merge.
kleinmaetschke Feb 13, 2013
2b92454
Converting errant spaces to tabs.
kleinmaetschke Feb 13, 2013
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Binary file modified themes/jquery.org/images/foundation-logos.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified themes/jquery.org/images/icn-jquery-logo.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
139 changes: 123 additions & 16 deletions themes/jquery.org/style.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,8 +3,8 @@ Theme Name: jquery-org
Template: jquery
*/

a,
#sidebar h3 {
/*Custom Colors*/
/*a, #sidebar h3 {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Each selector belongs on a separate line, as shown in the old code.

color: #b71551;
}

Expand All @@ -13,11 +13,32 @@ a,
}

#content h1 {
color: #0098bf;
color: white;
font-weight: normal;
font-style: normal;
}

#content h2 {
color: white;
font-weight: normal;
font-style: normal;
margin-bottom: 20px;
}*/
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Why did we commit a bunch of commented out styles?


#banner-large-image {
margin-right: -25px;
margin-left: -25px;
margin-top: -20px;
height: 360px;
background: url(images/header-join-page.jpg) no-repeat center;
background-size: cover;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
display: block;
position: relative;
}

#content h2 {
color: #b71551;
font-weight: normal;
Expand All @@ -43,7 +64,13 @@ a,
font-size: 60px;
}

.jquery-foundation.home #banner-secondary.large-banner.entry-header {
padding-bottom: 0px;
}

.jquery-foundation.page-id-5 #content #banner-large-image .vertically-centered-black-bg {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Using page-id-5 seems really bad.

margin-top: 14.5%;
}

/*Homepage*/

Expand All @@ -52,10 +79,10 @@ a,
}

.sub-banner {
background-color: #d6eef1;
background-color: lightgray;
text-align: center;
margin: -25px -25px 0;
color: #007d88;
color: rgb(102,102,102);
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Aren't we using hex values everywhere else (unless we're using rgba())?

font: bold 20px/40px "klavika-web", "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
}

Expand Down Expand Up @@ -118,8 +145,16 @@ ul.flex-direction-nav {
border-bottom: 10px solid #c1c1c1;
border-top: 10px solid #c1c1c1;
text-align: center;
padding-top: 35px;
padding-bottom: 35px;
margin-top: 25px;
}

.jquery-foundation.page-id-2 #content .dark-callout-box {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Using page-id-2 seems really bad.

padding-top: 0px;
padding-bottom: 0px;
}

.big-message {
font: bold 50px/50px "klavika-web", "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
color: #ffffff !important;
Expand All @@ -132,7 +167,7 @@ ul.flex-direction-nav {
}

#content .dark-callout-box p {
ont: bold 30px/50px "klavika-web", "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
font: bold 30px/50px "klavika-web", "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
color: #dddcdc;
}

Expand All @@ -142,6 +177,14 @@ ul.flex-direction-nav {
color: #464646;
}

#content .project {
margin-top: 35px;
}

#content .twelve.columns .project {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

indentation

margin-top: 0px;
}

.project img {
float: left;
display: inline;
Expand Down Expand Up @@ -178,6 +221,13 @@ ul.flex-direction-nav {
z-index: 1;
}

.member-level button.button.join {
position: relative;
top: 0px;
left: 15px;
margin-bottom: 15px;
}

.member-level-icon.fan {
background: url(images/icn-fan.png) center top no-repeat;
}
Expand Down Expand Up @@ -262,23 +312,20 @@ a.icon-search::before {
clear: none;
}


.choose-gifts {
background-color: #378a9b;
border-bottom: 16px solid #1b4c5e;
background-color: lightgray;
clear: both;
position: relative;
z-index: 2;
padding-left: 15px;
padding-right: 15px;
padding-top: 15px;
padding-bottom: 15px;
padding-bottom: 45px;
}

.choose-gifts h4 {
font: bold 18px/20px "klavika-web", "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
margin-bottom: 10px;
color: #ffffff;
}

.choose-gifts label {
Expand All @@ -290,6 +337,7 @@ a.icon-search::before {
height: 1px;
margin-top: 15px;
margin-bottom: 15px;
background: #898989;
}

.choose-gifts select {
Expand All @@ -298,6 +346,61 @@ a.icon-search::before {
margin-bottom: 15px;
}

.choose-gifts button.button.pay {
margin-right: 20px;
}

#content .choose-gifts textarea {
width: 100%;
background: white;
border: 1px solid rgba(192,192,192,1);
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Why are we using rgba() for a solid color?

}

.choose-gifts input[type="name"] {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This isn't even valid.

margin-right: 3px;
}

.choose-gifts input[type="name"], .choose-gifts input[type="email"]{
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Also not valid.

display: inline;
width: 49%;
padding: 8px 12px;
border: 1px solid rgba(192,192,192,1);
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

rgba()?

border-radius: 2px;
-webkit-box-shadow: inset 0 1px 3px rgba(0,0,0,0.17);
box-shadow: inset 0 1px 3px rgba(0,0,0,0.17);
}

#content .choose-gifts input:focus, #content .choose-gifts input[type=text]:focus, #content .choose-gifts textarea:focus {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is why we split each selector onto a new line.

border: 1px solid #78CFF5;
-webkit-box-shadow: none;
box-shadow: none;
}

#content .choose-gifts input::-webkit-input-placeholder {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@ajpiano Prime candidate for stylus.

color: rgba(51,51,51,0.75);
}
#content .choose-gifts input:-moz-placeholder {
color: rgba(51,51,51,0.75);
}
#content .choose-gifts input::-moz-placeholder {
color: rgba(51,51,51,0.75);
}
#content .choose-gifts input:-ms-input-placeholder {
color: rgba(51,51,51,0.75);
}

#content .choose-gifts textarea::-webkit-input-placeholder {
color: rgba(51,51,51,0.75);
}
#content .choose-gifts textarea:-moz-placeholder {
color: rgba(51,51,51,0.75);
}
#content .choose-gifts textarea::-moz-placeholder {
color: rgba(51,51,51,0.75);
}
#content .choose-gifts textarea:-ms-input-placeholder {
color: rgba(51,51,51,0.75);
}

/*History Page*/

Expand Down Expand Up @@ -410,15 +513,15 @@ a.icon-search::before {
margin-bottom: 40px;
}

.button,
#content .button {
/*a.button,
#content a.button, .button {
background-color: #b71551;
}

.button:hover,
#content .button:hover {
a.button:hover,
#content a.button:hover {
background-color: #7c0d36;
}
}*/
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Why are we committing commented out styles?



/*Adjust widths for longer navigation*/
Expand All @@ -431,6 +534,10 @@ nav#main ul {
width: 80%;
}

.content-full.full-width #content {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Why does jquery.org have different page styling that every other site?

padding-bottom: 15px;
}

@media only screen and (max-width: 767px) {
.sponsors-page ul.block-grid li img {
float: none;
Expand Down
2 changes: 1 addition & 1 deletion themes/jquery/css/base.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -1689,7 +1689,7 @@ nav#main {
}

.jquery-foundation nav#main {
background-color: rgba(7, 105, 173, 0.10);
background-color: rgba(102, 102, 102, 0.1);
}

.no-boxshadow nav#main {
Expand Down