my-codes: أكواد إضافة كنترول بانل

الأحد، 9 نوفمبر 2014

أكواد إضافة كنترول بانل

الكود الأول :

.admin-controll,.admin-controll * {
    margin: 0;
    padding: 0;
    list-style: none;
    list-style-type: none;
    line-height: 1.0;
}
.admin-controll ul {
    position: absolute;
    top: -999em;
    width: 100%;
}
.admin-controll ul li {
    width: 100%;
    background: 333333;
}
.admin-controll li:hover {
    visibility: inherit;
}
.admin-controll li {
    float: left;
    position: relative;
}
.admin-controll a {
    display: block;
    position: relative;
}
.admin-controll li:hover ul,.admin-controll li.sfHover ul {
    left: 0;
    top: 100%;
    z-index: 99;
}
.admin-controll li:hover li ul,.admin-controll li.sfHover li ul {
    top: -999em;
}
.admin-controll li li:hover ul,.admin-controll li li.sfHover ul {
    left: 100%;
    top: 0;
}
.admin-controll li li:hover li ul,.admin-controll li li.sfHover li ul {
    top: -999em;
}
.admin-controll li li li:hover ul,.admin-controll li li li.sfHover ul {
    left: 100%;
    top: 0;
}
.mbl-admin-bar {
    margin: 0px;
    direction: ltr;
    color: #ccc;
    font: 400 13px/32px "Open Sans",sans-serif;
    height: 32px;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    min-width: 600px;
    z-index: 99999;
    background: #222;
    float: left;
}
.mbl-admin-bar li a {
    display: block;
    color: #fff;
    padding: 7px 15px;
    font-weight: 400;
    text-decoration: none;
    font-size: 14px;
}
.mbl-admin-bar li li a {
    font-size: 15px;
    color: #fff;
    float: none;
    padding: 0px;
    width: 0;
}
ul.children {
    color: #fff;
    background: #333333;
    font-size: 18px;
    min-width: 230px;
    padding: 10px;
    float: right;
    margin-left: -98px;
}
.mbl-admin-bar li a:hover,.mbl-admin-bar li a:active,.mbl-admin-bar li a:focus,.mbl-admin-bar li:hover > a,.mbl-admin-bar li.current-cat > a,.mbl-admin-bar li.current_page_item > a,.mbl-admin-bar li.current-menu-item > a {
    color: #38b8f0;
    background: #333333;
}
.fa {
    font-size: 18px;
    color: #999;
    margin-right: 5px;
}
.fa.fa-user {
    font-size: 50px;
    float: left;
    padding: 20px;
    border: 1px solid #212121;
    background: #575757;
}
ul.children img {
    width: 80px;
    height: auto;
    float: left;
    margin-right: 10px;
}
ul.children a {
    margin-top: 10px;
}
li.mright {
    float: right;
}
li.mblogo a {
    padding: 3px 15px 3px 15px!important;
}
ul.child1 {
    min-width: 180px;
    color: #fff;  background: #333333;
}
ul.child1 li a {
    padding: 10px;
    width: 100%;
    background: #333333;
}

الكود الثاني:

<link href='//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css' rel='stylesheet'/>
<link href='http://fonts.googleapis.com/css?family=Open Sans:400' rel='stylesheet' type='text/css'/>
 <span class='item-control blog-admin'>
<div class='span-24'>
<div class='mbl-cpanel'>
<ul class='admin-controll mbl-admin-bar'>
<li class='mblogo'><a href="http://gooplz.blogspot.com/"><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhYzAUiv5EnkanLY3ZJ6U3_PzzYWldUfC3WD68osH2ntNelBxfi_T5pIf-Fufr5kYi8nTvv0DOf14EJftR89BMLc_ouwVMdHKg59zGq_4-NqNxmVeV2SIDtK90EorER-ieN4_b5APznT6E/s1600/v.pn'/></a></li>
<li class='blog-title'><a expr:href='data:blog.homepageUrl'><i class='fa fa-tachometer'/> <data:blog.title/></a></li>
<li><a href='http://www.blogger.com/home'><i class='fa fa-puzzle-piece'/> Dashboard</a></li>
<li><a href="#"><i class="fa fa-pencil"></i> Posting</a>
<ul class='child1'>
<li><a expr:href='"http://www.blogger.com/blogger.g?blogID=" + data:blog.blogId + "#editor/src=sidebar"'><i class='fa fa-pencil'/> New Post</a></li>
<li><a expr:href='"http://www.blogger.com/blogger.g?blogID=" + data:blog.blogId + "#editor/target=page"'><i class='fa fa-file'/> New Page</a></li>
<li><a expr:href='"http://www.blogger.com/blogger.g?blogID=" + data:blog.blogId + "#posts"'><i class='fa fa-th-list'/> All Posts</a></li>
<li><a expr:href='"https://www.blogger.com/blogger.g?blogID=" + data:blog.blogId + "#editor/target=post;postID=" + data:blog.postId + ""'><i class="fa fa-pencil-square"/>Edit Post</a></li>
</ul>
</li>
<li><a href="#"><i class="fa fa-cogs"></i> Customize</a>
<ul class='child1'>
<li><a expr:href='"http://www.blogger.com/blogger.g?blogID=" + data:blog.blogId + "#pageelements"'><i class='fa fa-wrench'/> Layout</a></li>
<li><a expr:href='"http://www.blogger.com/blogger.g?blogID=" + data:blog.blogId + "#templatehtml"'><i class='fa fa-pencil-square-o'/> Edit Template</a></li>
</ul>
</li>
<li><a expr:href='"http://www.blogger.com/blogger.g?blogID=" + data:blog.blogId + "#comments"'><i class='fa fa-comment'/> Comments</a>
<ul class='child1'>
<li><a expr:href='"http://www.blogger.com/blogger.g?blogID=" + data:blog.blogId + "#pendingcomments"'><i class="fa fa-bullhorn"></i> Pending Comments</a></li>
<li><a expr:href='"http://www.blogger.com/blogger.g?blogID=" + data:blog.blogId + "#spamcomments"'><i class="fa fa-ban"></i> Spam Comments</a></li>
</ul>
</li>
<li><a expr:href='"http://www.blogger.com/blogger.g?blogID=" + data:blog.blogId + "#basicsettings"'><i class='fa fa-cog'/> Settings</a>
<ul class='child1'>
<li><a expr:href='"http://www.blogger.com/blogger.g?blogID=" + data:blog.blogId + "#basicsettings"'><i class="fa fa-heart-o"></i> Basics</a></li>
<li><a expr:href='"http://www.blogger.com/blogger.g?blogID=" + data:blog.blogId + "#postandcommentsettings"'><i class="fa fa-comments"></i> Post & Comments</a></li>
<li><a expr:href='"http://www.blogger.com/blogger.g?blogID=" + data:blog.blogId + "#emailandmobilesettings"'><i class="fa fa-mobile"></i> Mobile & Email</a></li>
<li><a expr:href='"http://www.blogger.com/blogger.g?blogID=" + data:blog.blogId + "#languageandformattingsettings"'><i class="fa fa-calendar-o"></i> Language</a></li>
<li><a expr:href='"http://www.blogger.com/blogger.g?blogID=" + data:blog.blogId + "#searchsettings"'><i class="fa fa-search-plus"></i> Search Preference</a></li>
<li><a expr:href='"http://www.blogger.com/blogger.g?blogID=" + data:blog.blogId + "#othersettings"'><i class="fa fa-code"></i> Other</a></li>
<li><a expr:href='"http://www.blogger.com/blogger.g?blogID=" + data:blog.blogId + "#overviewstats"'><i class='fa fa-signal'/>Stats</a></li>
</ul>
</li>
<li class='mright'><a href='https://www.facebook.com/elouajdiabdel'><i class='fa fa-signal'/> Admin</a>
<ul class='children'>
<li><img src='https://yt3.ggpht.com/-Ac1HJve9by0/AAAAAAAAAAI/AAAAAAAAAAA/1cpcpdfi3c4/s88-c-k-no/photo.jpg'/>
<div class='mauthor'>
<br/> abdelhak elouajdi </div>
<a href='http://www.blogger.com/logout.g'> Logout</a></li>
</ul>
</li>
</ul>
</div>
</div>
</span>

ليست هناك تعليقات:

إرسال تعليق

الاشتراك في: تعليقات الرسالة (Atom)