WP styles

Some specific styles for WordPress projects.

less/_XX-wp-styles.less

@@ -0,0 +1,296 @@
+/*
+	File Name: _XX-wp-styles.less
+	Author: Geoffrey Crofte (Alsacréations)
+	Contributors: Automattic, Geoffrey Crofte
+	Description: Reset styles for WordPress usage of Knacss
+	Creation date: 2014-11-20
+*/
+
+/*--------------------------------------------------------------
+1.0 Menus
+--------------------------------------------------------------*/
+
+// current menu elements
+
+.current_page_item > a {
+}
+.current-menu-item > a {
+}
+.current_page_ancestor > a {
+}
+
+
+// blocks of content navigation
+
+.comment-navigation,
+.paging-navigation,
+.post-navigation {
+	margin: 0 0 1.5em;
+	overflow: hidden;
+}
+.comment-navigation .nav-previous,
+.paging-navigation .nav-previous,
+.post-navigation .nav-previous {
+	float: left;
+	width: 50%;
+}
+.comment-navigation .nav-next,
+.paging-navigation .nav-next,
+.post-navigation .nav-next {
+	float: right;
+	text-align: right;
+	width: 50%;
+}
+
+
+/*--------------------------------------------------------------
+2.0 Alignments
+--------------------------------------------------------------*/
+
+// class in img elements
+.alignleft {
+	float: left;
+	margin: 0 1.5em .25em 0;
+}
+.alignright {
+	float: right;
+	margin: 0 0 .25em 1.5em;
+}
+.aligncenter {
+	clear: both;
+	display: block;
+	margin: 1.5em auto;
+}
+
+
+
+/*--------------------------------------------------------------
+3.0 Clearings
+--------------------------------------------------------------*/
+
+.entry-content,
+.comment-content {
+	clear: both;
+	
+	&:after, &:before {
+		content: "";
+		display: table;
+	}
+}
+
+
+
+/*--------------------------------------------------------------
+4.0 Widgets
+--------------------------------------------------------------*/
+
+.widget + .widget {
+	margin: 1.5em 0 0;
+}
+
+// usage example:
+.widget select {
+	max-width: 100%;
+}
+
+
+
+
+/*--------------------------------------------------------------
+5.0 Posts and pages
+--------------------------------------------------------------*/
+
+
+/* === 5.1 Posts - post_class === */
+
+// featured content
+.sticky {
+}
+
+// attachment post
+.attachment {
+}
+
+// format of post
+.format- {
+	&video {
+	}
+}
+
+// class for a tag
+.tag- {
+	&name-of-tag {
+	}
+}
+
+// class for categorie
+.category- {
+	&name-of-category {
+	}
+}
+
+
+
+/* === 5.2 Pages - body_class === */
+
+// front page
+.home {
+	// if display posts
+	&.blog {
+	}
+	// if static page
+	&.page {
+	}
+}
+
+// page displays posts
+.blog {
+	// if is frontpage
+	&.home {
+	}
+	// if static page
+	&.page {
+	}
+}
+
+// simple page
+.page {
+}
+
+// page of single post
+.single {	
+}
+
+// page of archives
+.archive {
+}
+
+// page of search 
+.search {
+	// if has results
+	.search-results {
+	}
+	// if has no results
+	.search-no-results {
+	}
+}
+
+// page 404
+.error404 {
+}
+
+// user logged in
+.logged-in {
+}
+
+// text direction if right-to-left
+.rtl {
+}
+
+
+
+/* === 5.3 Posts and Pages - Contents === */
+
+.hentry {
+	margin: 0 0 1.5em;
+}
+
+.page-content,
+.entry-content,
+.entry-summary {
+	margin: 1.5em 0 0;
+}
+
+.page-links {
+	clear: both;
+	margin: 0 0 1.5em;
+}
+
+
+
+/*--------------------------------------------------------------
+6.0 Comments
+--------------------------------------------------------------*/
+
+.comment-content a {
+	word-wrap: break-word;
+}
+.bypostauthor {
+	// some make-the-logo-bigger styles
+}
+
+
+
+/*--------------------------------------------------------------
+7.0 Media
+--------------------------------------------------------------*/
+
+img.wp-smiley {
+	margin-bottom: 0;
+	margin-top: 0;
+	padding: 0;
+	border: none;
+}
+
+
+
+/*--------------------------------------------------------------
+8.0 Captions
+--------------------------------------------------------------*/
+
+.wp-caption {
+	max-width: 100%;
+	margin-bottom: 1.5em;
+}
+.wp-caption img {
+	display: block;
+	margin: 0 auto;
+}
+.wp-caption-text {
+	margin: 1em 0;
+	text-align: center;
+}
+
+
+
+/*--------------------------------------------------------------
+9.0 Galleries
+--------------------------------------------------------------*/
+
+.gallery {
+	margin-bottom: 1.5em;
+}
+.gallery-item {
+	display: inline-block;
+	width: 100%;
+	text-align: center;
+	vertical-align: top;
+	
+	.gallery-columns-2 & {
+		max-width: 50%;		
+	}
+	.gallery-columns-3 & {
+		max-width: 33.33%;		
+	}
+	.gallery-columns-4 & {
+		max-width: 25%;		
+	}
+	.gallery-columns-5 & {
+		max-width: 20%;		
+	}
+	.gallery-columns-6 & {
+		max-width: 16.66%;		
+	}
+	.gallery-columns-7 & {
+		max-width: 14.28%;		
+	}
+	.gallery-columns-8 & {
+		max-width: 12.5%;		
+	}
+	.gallery-columns-9 & {
+		max-width: 11.11%;		
+	}
+}
+.gallery-caption {
+	display: block;
+}