Welcome to the TWC Wiki! You are not logged in. Please log in to the Wiki to vote in polls, change skin preferences, or edit pages. See HERE for details of how to LOG IN.

Difference between revisions of "User:Makanyane/twc.css"

From TWC Wiki
Jump to navigationJump to search
(blanked)
(Tag: Replaced)
Line 1: Line 1:
 
/* Mak's testing area for twc skin */
 
/* Mak's testing area for twc skin */
 +
/*  Responsive column layout from http://www.responsivegridsystem.com/ TWCR added to class names to avoid conflicts */
 +
 +
div.TWCRsection, div.TWCRgroup {
 +
        border: none;
 +
        background: none;
 +
padding: none;
 +
margin: none;
 +
}
 +
 +
/*  SECTIONS  ============================================================================= */
 +
 +
.TWCRsection {
 +
clear: both;
 +
padding: 0px;
 +
margin: 0px;
 +
}
 +
 +
/*  GROUPING  ============================================================================= */
 +
 +
.TWCRgroup:before,
 +
.TWCRgroup:after {
 +
    content:"";
 +
    display:table;
 +
}
 +
.TWCRgroup:after {
 +
    clear:both;
 +
}
 +
.TWCRgroup {
 +
    zoom:1; /* For IE 6/7 (trigger hasLayout) */
 +
}
 +
 +
/*  GRID COLUMN SETUP  ==================================================================== */
 +
 +
.TWCRcol {
 +
display: block;
 +
float:left;
 +
margin: 1% 0 1% 1.6%;
 +
}
 +
 +
.TWCRcol:first-child { margin-left: 0; } /* all browsers except IE6 and lower */
 +
 +
/* ANY FULL WIDTH COLUMN IN SECION*/
 +
.span_full {
 +
width: 100%;
 +
}
 +
/* SPANNING 2 COLUMNS OUT OF 3*/
 +
.span_2_of_3 {
 +
width: 66.1%;
 +
}
 +
/* SINGLE WIDTH COLUMN OF 3*/
 +
.span_1_of_3 {
 +
width: 32.2%;
 +
}
 +
/* SINGLE COLUMN OF 2*/
 +
.span_1_of_2 {
 +
width: 49.2%;
 +
}
 +
/* PAIR OF COLUMNS  40/60 percent splits */
 +
.span_40pct_of_2 {
 +
width: 39.36%;
 +
}
 +
.span_60pct_of_2 {
 +
width: 59.04%;
 +
}
 +
 +
/*  GO FULL WIDTH AT LESS THAN 700 PIXELS & REDUCE MARGINS*/
 +
@media only screen and (max-width: 700px) {
 +
.TWCRcol { margin: 1% 0 1% 0%; }
 +
.col { margin: 1% 0 1% 0%;}
 +
.span_3_of_3, .span_2_of_3, .span_1_of_3, .span_2_of_2, .span_1_of_2, .span_40pct_of_2, .span_60pct_of_2 { width: 100%; }
 +
}
 +
 +
/*New classes for re-designed front page and portals*/
 +
.TWCportal_1, .TWCportal_2, .TWCportal_3 {    border: none;
 +
    padding: .4em .9em .1em;
 +
    color: black;
 +
    vertical-align: top;
 +
}
 +
.TWCportal_1 {
 +
    background: rgb(227,227,227);
 +
    background: linear-gradient(180deg, rgba(165,165,180,0.5) 0%, rgba(165,165,180,0) 100%);
 +
}
 +
.TWCportal_2 {
 +
    background: rgb(205,199,199);
 +
    background: linear-gradient(180deg, rgba(168,160,162,0.5) 0%, rgba(168,160,162,0) 100%);
 +
}
 +
.TWCportal_3 {
 +
    background: rgb(229,225,219);
 +
    background: linear-gradient(180deg, rgba(168,168,162,0.5) 0%, rgba(168,168,162,0) 100%);
 +
}
 +
.TWCportal_head {
 +
    padding:5px;
 +
    background:#7d1515;
 +
    color:white;
 +
    margin-bottom: 0em;
 +
}
 +
h2.TWCportal_head{
 +
    font-size: 128%;
 +
    border-bottom: 0;
 +
    font-weight: bolder;
 +
}
 +
h1.TWCportal_head{
 +
    padding:10px;
 +
    border-bottom: 0;
 +
    text-align: center;
 +
}

Revision as of 02:51, 17 May 2019

/* Mak's testing area for twc skin */
/*  Responsive column layout from http://www.responsivegridsystem.com/ TWCR added to class names to avoid conflicts */

div.TWCRsection, div.TWCRgroup {
        border: none;
        background: none;
	padding: none;
	margin: none;
}

/*  SECTIONS  ============================================================================= */

.TWCRsection {
	clear: both;
	padding: 0px;
	margin: 0px;
}

/*  GROUPING  ============================================================================= */

.TWCRgroup:before,
.TWCRgroup:after {
    content:"";
    display:table;
}
.TWCRgroup:after {
    clear:both;
}
.TWCRgroup {
    zoom:1; /* For IE 6/7 (trigger hasLayout) */
}

/*  GRID COLUMN SETUP   ==================================================================== */

.TWCRcol {
	display: block;
	float:left;
	margin: 1% 0 1% 1.6%;
}

.TWCRcol:first-child { margin-left: 0; } /* all browsers except IE6 and lower */

/* ANY FULL WIDTH COLUMN IN SECION*/
.span_full {
	width: 100%;
}
/* SPANNING 2 COLUMNS OUT OF 3*/
.span_2_of_3 {
	width: 66.1%;
}
/* SINGLE WIDTH COLUMN OF 3*/
.span_1_of_3 {
	width: 32.2%;
}
/* SINGLE COLUMN OF 2*/
.span_1_of_2 {
	width: 49.2%;
}
/* PAIR OF COLUMNS  40/60 percent splits */
.span_40pct_of_2 {
	width: 39.36%;
}
.span_60pct_of_2 {
	width: 59.04%;
}

/*  GO FULL WIDTH AT LESS THAN 700 PIXELS & REDUCE MARGINS*/
@media only screen and (max-width: 700px) {
	.TWCRcol { margin: 1% 0 1% 0%; }
	.col { margin: 1% 0 1% 0%;}
	.span_3_of_3, .span_2_of_3, .span_1_of_3, .span_2_of_2, .span_1_of_2, .span_40pct_of_2, .span_60pct_of_2 { width: 100%; }
}

/*New classes for re-designed front page and portals*/
.TWCportal_1, .TWCportal_2, .TWCportal_3 {    border: none;
    padding: .4em .9em .1em;
    color: black;
    vertical-align: top;
}
.TWCportal_1 {
    background: rgb(227,227,227);
    background: linear-gradient(180deg, rgba(165,165,180,0.5) 0%, rgba(165,165,180,0) 100%);
}
.TWCportal_2 {
    background: rgb(205,199,199);
    background: linear-gradient(180deg, rgba(168,160,162,0.5) 0%, rgba(168,160,162,0) 100%);
}
.TWCportal_3 {
    background: rgb(229,225,219);
    background: linear-gradient(180deg, rgba(168,168,162,0.5) 0%, rgba(168,168,162,0) 100%);
}
.TWCportal_head {
    padding:5px; 
    background:#7d1515; 
    color:white;
    margin-bottom: 0em;
}
h2.TWCportal_head{
    font-size: 128%;
    border-bottom: 0;
    font-weight: bolder;
}
h1.TWCportal_head{
    padding:10px;
    border-bottom: 0;
    text-align: center;
}
Retrieved from "https://wiki.twcenter.net/index.php?title=User:Makanyane/twc.css&oldid=76919"