منتدى دعم PBBoard الرسمي
(نسخة قابلة للطباعة من الموضوع)
https://pbboard.info/forums/t23963
أنقر هنا لمشاهدة الموضوع بهيئته الأصلية

كود ملاحظات شركة انكور التطويرية - متعدد الالوان
MAHDI H.D 03-09-2020 04:38 مساءً
السلام عليكم
اقدم لكم كود ملاحظات شركة انكور التطويرية ، جميل جداً بالوان عديده وجميله لي رؤية كود ملاحظات ..
p_17075cq2p0
نبدأ الشرح :
  1. لوحة الحكم >> اعلانات ادسنس >> اضافة اعلان ونضع الكود التالي ..
CODE
<style> .alert-message{position:relative;display:block;background-color:#f7f8fa;padding:8px;margin:20px 0;-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px;color:#39484d;text-align: center;}.alert-message p{margin:0!important;padding:0;line-height:13px;font-size:13px;color:#39484d}.alert-message span{font-size:14px!important}.alert-message i{font-size:22px;text-align:left;display:inline-block;position:absolute;right:0;top:0;padding:13px;opacity:0.8;}.alert-message.success{background-color:#34B816;font-family: Droid Arabic Kufi;color:#fff}.alert-message.success a,.alert-message.success span{color:#fff}.alert-message.alert{background-color:#34B816;font-family: Droid Arabic Kufi;color:#fff}.alert-message.alert a,.alert-message.alert span{color:#fff}.alert-message.warning{background-color:#b90628;font-family: Droid Arabic Kufi;color:#fff}.alert-message.warning a,.alert-message.warning span{color:#fff}.alert-message.error{background-color:#960202;font-family: Droid Arabic Kufi;color:#fff}.alert-message.error a,.alert-message.error span{color:#fff}.alert-message.happy{background-color:#369602;font-family: Droid Arabic Kufi;color:#fff}.alert-message.happy a,.alert-message.happy span{color:#fff}.alert-message.link a,.alert-message.link span{color:#fff}.alert-message.link{background-color:#028f96;font-family: Droid Arabic Kufi;color:#fff}.alert-message.hi a,.alert-message.hi span{color:#fff}.alert-message.hi{background-color:#57DF69;font-family: Droid Arabic Kufi;color:#fff}.alert-message:hover {background-image: linear-gradient(110deg, #766D6C 0%, #606364 50%, transparent 50%, transparent 100%);background-size: 200%;background-position: 150% 0;background-repeat: no-repeat;transition: background-position .9s ease, color .15s ease;color: #eee;} </style>



لاستخدام جميع الكلاسات تفضلو الاكواد :
CODE
<div class="alert-message success">النص هنا <i class="fa fa-check-circle"></i></div>

<div class="alert-message alert">النص هنا <i class="fa fa-info-circle"></i></div>

<div class="alert-message warning">النص هنا <i class="fa fa-exclamation-triangle"></i></div>

<div class="alert-message error">النص هنا <i class="fa fa-exclamation-circle"></i></div>

<div class="alert-message happy">النص هنا <i class="fa fa-bell-o"></i></div>

<div class="alert-message link">النص هنا <i class="fa fa-link"></i></div>

<div class="alert-message hi">النص هنا <i class="fa fa-quote-right"></i></div>


انتهى.. بالتوفيق
منتدى دعم PBBoard الرسمي

Copyright © 2009-2024 PBBoard® Solutions. All Rights Reserved