السلام عليكم ورحمة الله وبركاتة... اليوم على مدونة مهووس تك احببت مشاركة معكم تديونة جديدة وهي عبارة عن واجهة عرب ويب الحالية (الأحترافية لبلوجر) التي تم اصدارها منذ وقت قصير جدا .
لتركيب الواجهة :
- اذهب للمدونة
- القاالب
- تحرير القالب html
نلتقي في موضوع جديد في امان الله<b:if cond='data:blog.url == data:blog.homepageUrl'>
<link href='//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css' rel='stylesheet'/>
<link href='//cdn.jsdelivr.net/darfonts/0.1/tv-tha-tye-wide/stylesheet.css' rel='stylesheet'/>
<link href='//ar1web-com.googlecode.com/svn/trunk/animate.css' rel='stylesheet'/>
<!-- Home Page for web3-night.blogspot.com-->
<div class='outer-wrap animated fadeInUp' style=' font-family: 'ge_ss_tvbold''>
<center>
<div class='logo'>
<a href='http://web3-night.blogspot.com/'><img src='http://i.imgur.com/IQbwbTf.png'/></a>
</div>
</center>
<div class='title-ar1web'>ويب <span> نايت</span></div>
<div class='ender' style=' font-family: 'ge_ss_tvbold''><i class='fa fa-globe'/> الشرق الأوسط، العراق</div>
<div class='social'>
<li class='ar1web-tooltip ar1web-tooltip-top' data-ar1web-tooltip='كن صديقًا لنا'><a href='https://www.blogger.com/follow-blog.g?blogID=3942045828751851644' target='_blank'><i class='fa fa-users'/></a></li>
<li class='contact-button ar1web-tooltip ar1web-tooltip-top' data-ar1web-tooltip='راسلنا'><a href='#'><i class='fa fa-envelope-square'/></a></li>
<li class='ar1web-tooltip ar1web-tooltip-top' data-ar1web-tooltip='صفحتنا على الفيسبوك'><a href='https://www.facebook.com/WEB3.Night/?ref=bookmarks' target='_blank'><i class='fa fa-facebook'/></a></li>
<li class='ar1web-tooltip ar1web-tooltip-top' data-ar1web-tooltip='تابعنا على تويتر'><a href='https://www.facebook.com/WEB3.Night/?ref=bookmarks' target='_blank'><i class='fa fa-twitter'/></a></li>
<li class='ar1web-tooltip ar1web-tooltip-top' data-ar1web-tooltip='تابعنا على جوجل+'><a href='https://www.facebook.com/WEB3.Night/?ref=bookmarks' target='_blank'><i class='fa fa-google-plus'/></a></li>
</div>
<div class='actions'>
<li><a href='http://web3-night.blogspot.com/search/?max-results=7'><i class='fa fa-newspaper-o'/> المدونة</a></li>
<select class='genrebox' onchange='document.location.href=this.options[this.selectedIndex].value;' style=' font-family: 'ge_ss_tvbold''>
<option style=' font-family: 'ge_ss_tvbold'' value=''>الأقسام :</option>
<option value='/search/label/قوالب بلوجر/'>قوالب بلوجر</option>
<option value='/search/label/قوالب ووردبريس/'>قوالب ووردبريس</option>
<option value='/search/label/قوالب PSD/'>قوالب PSD</option>
<option value='/search/label/اضافات بلوجر'>اضافات بلوجر</option>
<option value='/search/label/هاكات التعليقات '>هاكات التعليقات </option>
<option value='/search/label/سلايدر/'>سلايدر</option>
<option value='/search/label/موك آب/'>موك آب</option>
<option value='/search/label/خطوط عربية'>خطوط عربية</option>
<option value='/search/label/خطوط أجنبية'>خطوط أجنبية</option>
<option value='/search/label/PSD'>ملفات مفتوحة</option>
<option value='/search/label/خلفيات'>خلفيات</option>
<option value='/search/label/أزرار المشاركة/'>أزرار المشاركة</option>
</select>
</div>
<style>
body { background: #fff; } .fa { display: inline-block; font-family: FontAwesome; font-style: normal; font-weight: 400; line-height: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .outer-wrap { width: 100%; height: 100%; margin: 13% auto 0; border: 0; } .logo { margin: 0 auto; width: 70px; height: 70px; background-color: #F6F9FA; padding: 5px; border: 1px solid #E9F0F3; border-radius: 100%!important; box-sizing: initial!important; } .logo img { width: 70px; height: 70px; border-radius: 100%!important; transition: all .17s ease-out; } .logo img:hover { -webkit-filter: grayscale(100%); } .title-ar1web { text-align: center; color: #384047; font-size: 26px; font-weight: 500; margin-top: 10px; font-family: 'ge_ss_tvbold'; } .title-ar1web span { color: #E74C3C; } .ender { text-align: center; color: #31465A; font-size: 11px; margin-top: 5px;font-family: Droid Arabic Naskh; } .social { margin: 30px 0; text-align: center; float: none; } .social li { display: inline-block; margin-right: 8px; background-color: #D3D9DD; width: 26px; height: 26px; text-align: center; line-height: 25.5555px; border-radius: 50%!important; transition: all 0.3s ease-out 0s; } .social li:hover { background-color: #E74C3C; } .social li a { color: #fff; padding: 4px; font-size: 13px; } .actions { text-align: center; margin: 10px 0; } .actions li { list-style: none; display: inline-block; padding-left: 5px; padding-right: 5px; } .actions li a { background-color: #E74C3C; color: #FFF; font-size: 13px; padding: 4px 8px; border-radius: 2px!important; text-decoration: none; transition: all 0.3s ease-out 0s; } .actions li a:hover.buka-contact:hover { background-color: #DA4335; } .wrapper{display: none!important;}
.contact-sec { position: fixed; top: 50%; margin-top: -190px; left: 50%; max-width: 350px; width: 90%; border-radius: 2px!important; margin-left: -175px; background-color: #FFF; height: auto; z-index: 99999; display: none; box-shadow: 2px 3px 3px rgba(0,0,0,0.1); -webkit-transform: scale(0); -moz-transform: scale(0); transform: scale(0); transition: all .5s ease; -webkit-transition: all .2s ease; -moz-transition: all .2s ease; -o-transition: all .2s ease; } .contact-close { position: absolute; top: -12px; right: -12px; background-color: #E74C3C; color: #FFF; height: 25px; width: 25px; text-align: center; border-radius: 2px!important; line-height: 25px; font-size: 10px; transition: all 0.3s ease-out 0s; } a.contact-close { color: #FFF!important; } .contact-close:hover { background-color: #D24334; } .contact-sec .widget { padding: 20px; } .contact-sec .contact-form-cross { display: none; } .contact-sec.contact-show { -webkit-transform: scale(1); -moz-transform: scale(1); transform: scale(1); } .form { font-family: inherit !important; font-size: 13px!important; text-align: right; } .contact-form-name, .contact-form-email, .contact-form-email-message { max-width: 100%; width: 100%; } span.c_form { color: #e74c3c!important; } .contact-form-widget { height: auto; margin-left: 0; max-width: 100%; padding: 0; padding-top: 0; width: 100%; } .contact-form-name, .contact-form-email, .contact-form-email-message { max-width: 100%!important; width: 100%!important; border: 1px solid #F6F9FA!important; background-color: #F6F9FA!important; } .contact-form-email:hover, .contact-form-name:hover, .contact-form-email-message:hover { border: 1px solid #E9F0F3!important; border-top: 1px solid #E9F0F3!important; box-shadow: none!important; } .contact-form-email:focus, .contact-form-name:focus, .contact-form-email-message:focus { border-color: #E9F0F3 !important; box-shadow: none!important; transition: all .3s ease-out!important; } .contact-form-button-submit.disabled, .contact-form-button-submit.disabled:hover, .contact-form-button-submit.disabled:active { background-color: #3AC162!important; border-color: #3AC162!important; transition: all .3s ease-out!important; } .contact-form-button-submit:focus, .contact-form-button-submit.focus { border-color: #3AC162!important; box-shadow: none!important; transition: all .3s ease-out!important; } .contact-form-button-submit { background-color: #E74C3C; background-image: -webkit-linear-gradient(top, #E74C3C, #E74C3C); border-color: #E74C3C; border-radius: 0!important; width: 100%!important; font-size: 13px!important; font-weight: 400!important; text-transform: capitalize !important; font-family: inherit !important; padding-bottom: 26px !important; transition: all 0.3s ease-out 0s!important; } .contact-form-button-submit:hover { background-color: #D83929; background-image: -webkit-linear-gradient(top, #D83929, #D83929); border-color: #D83929; border-radius: 0!important; cursor: pointer!important; } .contact-form-error-message-with-border { background: rgba(234, 97, 83, 0.1)!important; border: 1px solid #ea6153!important; bottom: 0; box-shadow: none!important; color: #666; font-size: 11px; font-weight: normal; line-height: 19px; margin-left: 0; opacity: 1; position: static; text-align: center; width: 308px!important; } .contact-form-success-message-with-border { background: rgba(234, 97, 83, 0.1)!important; border: 1px solid #ea6153!important; bottom: 0; box-shadow: none!important; color: #222; font-size: 11px; line-height: 19px; margin-left: 0; opacity: 1; position: static; text-align: center; width: 308px!important; } #outer-wrapper.pop_contact { transition: all 0s ease; -webkit-transition: all 0s ease; -moz-transition: all 0s ease; -o-transition: all 0s ease; } #outer-wrapper.pop_contact:before { content: ''; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.69); transition: all 0s ease; -webkit-transition: all 0s ease; -moz-transition: all 0s ease; -o-transition: all 0s ease; }.title{display: none;}
.ar1web-tooltip {position:relative;display:inline-block;}
.ar1web-tooltip:before, .ar1web-tooltip:after {position:absolute;opacity:0;z-index:1000000;-webkit-transition:0.3s ease;-moz-transition:0.3s ease;pointer-events:none;}
.ar1web-tooltip:hover:before, .ar1web-tooltip:hover:after {opacity:1;}
.ar1web-tooltip:before {content:'';position:absolute;background:transparent;border:6px solid transparent;position:absolute;} .ar1web-tooltip:after {content: attr(data-ar1web-tooltip);background: hsla(0,0%,20%,0.9);color: #fff;padding: 5px 8px;font-size: 11px;white-space: nowrap;
border-radius: 3px;-webkit-backface-visibility: hidden;}
.ar1web-tooltip-top:before {bottom:129%;left:10%;margin:0 0 -18px 0;border-top-color:rgba(0,0,0,0.7);border-top-color:hsla(0,0%,20%,0.9);}
.ar1web-tooltip-top:after {bottom:125%;left:10%;margin:0 0 -6px -10px;}
.ar1web-tooltip-top:hover:before {margin-bottom:-10px;}
.ar1web-tooltip-top:hover:after {margin-bottom:2px;}
.genrebox{background: #E74C3C; border: 0; color: #fff; outline: 0; padding: 4px 0; display: inline-block; font-size: 12px; font-weight: 500; border-radius: 2px!important;}
@media screen and (max-width: 500px) {
.outer-wrap {
margin: 35% auto 0px;
}
.contact-sec {
top: 55%;
}
.contact-sec {
max-width: 280px!important;
margin-left: -141px !important;
}
.contact-form-error-message-with-border {
width: 238px!important;
}
.contact-form-success-message-with-border {
width: 238px!important;
}
.social { width: initial!important;}
}
</style>
</div>
</b:if>
<b:if cond='data:blog.url != data:blog.homepageUrl'>
و الأن نبحث عن </body> واضف الكود </b:if> فوقة مباشر (قبلة)
بإمكانك إدراج الأكواد الغير قابلة لنشر بتحويله عبر محول الأكواد لتصلك إشعارات ردود هذا الموضوع على البريد الإلكترونى أضف علامة بالمربع بجوار كلمة "إعلامى" عبّر عن تعليقكالإبتسامات