bSideBar > iSideBar IAMcss

#3
viT-1 · Sep 19, 2016 · f364ac0 · f364ac0
1 parent 253963d
commit f364ac0
Show file tree

Hide file tree

Showing 9 changed files with 78 additions and 84 deletions.
diff --git a/css/original/base-layScreen-mobile.css b/css/original/base-layScreen-mobile.css
@@ -20,20 +20,19 @@
 	clear: both;
 }
 
-.bSideBar-master {
+.iSideBar[ly-list ~= 'master'] {
 	border-top: 15px solid #FFF;
 }
 
-.bSideBar {
+.iSideBar[ly-list] {
 	text-align: center;
 }
 
-.bSideBar li {
+.iSideBar[ly-list] li {
 	display: inline-block;
 }
 
-.bSideBar_mi > a
-, .bSideBar_mi.-active h2  {
+.iSideBar[role = 'heading']  {
 	padding-right: 16px;
 }
 
@@ -56,8 +55,7 @@ menu menu
 
 /**** screen max629 */
 @media screen and (max-width:629px) {
-.bSideBar_mi > a
-, .bSideBar_mi h2 {
+.iSideBar[role = 'heading'] {
 	background-image: none;
 	padding-left: 16px;
 }
@@ -75,8 +73,8 @@ menu menu
 
 /**** screen max422 */
 @media screen and (max-width:422px) {
-.bSideBar
-, .bSideBar li {
+.iSideBar[ly-list]
+, .iSideBar[ly-list] li {
 	clear: left;
 }
 

diff --git a/css/original/base-layScreen-wide.css b/css/original/base-layScreen-wide.css
@@ -8,27 +8,26 @@
 	background: #CF9;	
 }
 
-.bSideBar {
+.iSideBar[ly-list] {
 	position: absolute;
 	top: 250px;
 	width: 185px;
 }
 
-.bSideBar.-master {
+.iSideBar[ly-list ~= 'master'] {
 	left: 0;
 }
 
-.bSideBar.-slave {
+.iSideBar[ly-list ~= 'slave'] {
 	right: 0;
 }
 
-.bSideBar_mi > a
-, .bSideBar_mi.-active h2 {
+.iSideBar[role = 'heading'] {
 	border-width: 15px;
 	border-style: none solid;
 }
 
-.bSideBar_mi {
+.iSideBar[ly-item] {
 	margin-bottom: 15px;
 }
 

diff --git a/css/original/base-mdi.css b/css/original/base-mdi.css
@@ -1,11 +1,9 @@
-.bSideBar_mi > a
-, .bSideBar_mi h2 {
+.iSideBar[role = 'heading'] {
 	position: relative;
 	background-image: none;
 }
 
-.bSideBar_mi > a:before
-, .bSideBar_mi h2:before
+.iSideBar[role = 'heading']:before
 , .iMoreLess dd > *:first-child:after {
 	font-weight: normal;
 	font-style: normal;
@@ -15,8 +13,7 @@
 	speak: none;
 }
 
-.bSideBar_mi > a:before
-, .bSideBar_mi h2:before {
+.iSideBar[role = 'heading']:before {
 	position: absolute;
 	left: 12px;
 	top: 0;
@@ -37,52 +34,44 @@
 	content: '\fe3e';
 }
 
-.mi-about > a:before
-, .mi-about h2:before {
+.iSideBar[ly-item ~= 'about'] *[role = 'heading']:before {
 	content: '\263a';
 }
 
-.mi-reviews > a:before
-, .mi-reviews h2:before {
+.iSideBar[ly-item ~= 'reviews'] *[role = 'heading']:before {
 	content: '\2653';
 }
 
-.mi-video > a:before
-, .mi-video h2:before {
+.iSideBar[ly-item ~= 'video'] *[role = 'heading']:before {
 	content: '\25b6';
 }
 
-.mi-photo > a:before
-, .mi-photo h2:before {
+.iSideBar[ly-item ~= 'photo'] *[role = 'heading']:before {
 	content: '\113d';
 }
 
-.mi-books > a:before
-, .mi-books h2:before {
+.iSideBar[ly-item ~= 'books'] *[role = 'heading']:before {
 	content: '\25e7';
 }
 
-/* Вынести content в контент, но IE8 не поддерживает считывание data-атрибута в качестве контента */
+/* @todo: Вынести content в контент, но IE8 не поддерживает считывание data-атрибута в качестве контента */
 /*
 .mi-books > a[data-ico]:before {
 	content: attr(data-ico);
 }
 */
 
-.mi-schedule > a:before
-, .mi-schedule h2:before {
+.iSideBar[ly-item ~= 'schedule'] *[role = 'heading']:before {
 	content: '\25d4';
 }
 
-.mi-events > a:before
-, .mi-events h2:before {
+.iSideBar[ly-item ~= 'events'] *[role = 'heading']:before{
 	content: '\24d8';
 }
 
 /**** screen max629 */
 @media screen and (max-width:629px) {
-.bSideBar_mi > a:before
-, .bSideBar_mi h2:before {
+.iSideBar[role = 'heading']:before {
 	display: none;
 }}
 /* screen max629 ****/

diff --git a/css/original/base-sknGreen.css b/css/original/base-sknGreen.css
@@ -2,25 +2,26 @@
 	background: #CF9;	
 }
 
-.bSideBar_mi > a {
+/**** @class iSideBar */
+a.iSideBar[role = 'heading'] {
 	color: #CF9;
 }
 
-.bSideBar_mi.-active h2
-, .bSideBar_mi a {
+.iSideBar[role] {
 	border-color: #CF9;
 	transition: border-color .7s ease;
 }
 
-.bSideBar.-master .bSideBar_mi > a:hover
-, .bSideBar.-master .bSideBar_mi.-active h2 {
+.iSideBar[ly-list = 'master'] a[role = 'heading']:hover
+, .iSideBar[ly-list = 'master'] h2[role = 'heading'] {
 	border-right-color: #FFF;
 }
 
-.bSideBar.-slave .bSideBar_mi > a:hover
-, .bSideBar.-slave .bSideBar_mi.-active h2 {
+.iSideBar[ly-list = 'slave'] a[role = 'heading']:hover
+, .iSideBar[ly-list = 'slave'] h2[role = 'heading'] {
 	border-left-color: #FFF;
 }
+/* @class iSideBar ****/
 
 a[href='#top'] {
 	color: #CF9;
@@ -34,7 +35,7 @@ a[href='#top']:hover {
 	background: #9C6;
 }
 
-.bSideBar_mi li a {
+.iSideBar[role = 'link'] {
 	color: #9C6;
 }
 
@@ -43,16 +44,16 @@ a[href='#top']:hover {
 , *[role='main'] h3
 , *[role='main'] h3 a
 , *[role='main'] h4
-, .bSideBar_mi.-active
-, .bSideBar_mi li a:hover {
+, .iSideBar[ly-item ~= 'active']
+, .iSideBar[role = 'link']:hover {
 	color: #370;
 }
 
-*[role='main'] h3 a:hover {
+*[role = 'main'] h3 a:hover {
 	color: blue;
 }
 
-.bSideBar_mi > a
+a.iSideBar[role = 'heading']
 , .bBase  {
 	background-color: #370;
 }
@@ -62,33 +63,33 @@ body {
 }
 
 *[role='main']
-, .bSideBar_mi.-active h2
-, .bSideBar_mi.-active a {
+, h2.iSideBar[role = 'heading']
+, a.iSideBar[role = 'link']
+ {
 	background-color: #FFF;
 }
 
 
-.bSideBar_mi > a
-, .bSideBar_mi h2 {
+.iSideBar[role = 'heading'] {
 	background-repeat: no-repeat;
 }
 
 /* IcoMoon заменил спрайты */
 /*
-.bSideBar_mi > a {
+a.iSideBar[role = 'heading'] {
 	background-position:  -385px 8px;
 }
 
-.bSideBar_mi > a:hover {
+a.iSideBar[role = 'heading']:hover {
 	background-position:  -185px 8px;
 }
 
-.bSideBar_mi h2 {
+h2.iSideBar[role = 'heading'] {
 	background-position:  15px 8px;
 }
 */
 
-.bSideBar_mi > a:hover {
+a.iSideBar[role = 'heading']:hover {
 	color: #FFF;
 }
 
@@ -105,8 +106,8 @@ body {
 }
 
 .bPanel
-, .bSideBar_mi > a
-, .bSideBar_mi.-active
+, a.iSideBar[role = 'heading']
+, .iSideBar[ly-item ~= 'active']
 , *[role='main'] h3
 , *[role='main'] h4 {
 	font-family: Tahoma, Arial, Helvetica, sans-serif;
@@ -117,19 +118,19 @@ body {
 }
 
 .bPanel h1
-, .bSideBar_mi.-active h2 {
+, h2.iSideBar[role = 'heading'] {
 	font-size: 1em;
 }
 
 .bPanel
 , *[role='main'] h4
 , h3 .tpDate
-, .bSideBar_mi li a {
+, .iSideBar[role = 'link'] {
 	font-size: 0.8em;
 }
 
-.bSideBar_mi > a
-, .bSideBar_mi.-active {
+a.iSideBar[role = 'heading']
+, .iSideBar[ly-item ~= 'active'] {
 	text-decoration: none;
 }
 
@@ -150,7 +151,7 @@ a {
 	text-transform: uppercase;
 }
 
-.bSideBar_mi.-active h2 {
+h2.iSideBar[role = 'heading'] {
 	cursor: default;
 }
 

diff --git a/css/original/base.css b/css/original/base.css
@@ -144,34 +144,35 @@ h3:target  .iAnchor[href ^= '#'] {
 }
 }
 
-.bSideBar_mi > a
-, .bSideBar_mi.-active h2 {
+/**** @class iSideBar */
+.iSideBar[role = 'heading'] {
 	display: block;
 	padding: 1em 0 1em 58px;
 	font-weight: bolder;
 }
 
-.bSideBar_mi.-active h2 {
+h2.iSideBar[role = 'heading'] {
 	margin: 0;
 }
 
-.bSideBar_mi li a {
+.iSideBar[role = 'link'] {
 	display: block;
 	padding-bottom: 15px;
 	border-width: 15px;
 }
 
-.bSideBar.-master li li a {
+.iSideBar[ly-list ~= 'master'] *[role = 'link']{
 	text-align: right;
 	padding-left: 15px;
 	border-style: none none none solid;
 }
 
-.bSideBar.-slave li li a {
+.iSideBar[ly-list ~= 'slave'] *[role = 'link'] {
 	text-align: left;
 	padding-right: 15px;
 	border-style: none solid none none;
 }
+/* @class iSideBar ****/
 
 *[role='main'] {
 	padding: 15px;

diff --git a/xsl/original/base-layScreen.xsl b/xsl/original/base-layScreen.xsl
@@ -30,10 +30,10 @@
 		<div class="bBase">
 			<hr class="-hidden" />
 			<xsl:apply-templates select="$nav_navRoot/menu[@lang = $base_htmlLang]">
-				<xsl:with-param name="mod__class" select="'-master'" />
+				<xsl:with-param name="mod__class" select="'master'" />
 			</xsl:apply-templates>
 			<xsl:apply-templates select="$nav_navRoot/menu[@lang = $base_htmlLang]">
-				<xsl:with-param name="mod__class" select="'-slave'" />
+				<xsl:with-param name="mod__class" select="'slave'" />
 			</xsl:apply-templates>
 
 			<div role="main">