Eklentisiz XFRM için ızgara düzeni

  • Konbuyu başlatan Michaelgen
  • Başlangıç tarihi

[XFB] Konu Bilgileri

Konu Hakkında Merhaba, tarihinde Şablon değişiklikleri kategorisinde Michaelgen tarafından oluşturulan Eklentisiz XFRM için ızgara düzeni başlıklı konuyu okuyorsunuz. Bu konu şimdiye dek 48 kez görüntülenmiş, 0 yorum ve 0 tepki puanı almıştır...
Kategori Adı Şablon değişiklikleri
Konu Başlığı Eklentisiz XFRM için ızgara düzeni
Konbuyu başlatan Michaelgen
Başlangıç tarihi
Cevaplar
Görüntüleme
İlk mesaj tepki puanı
Son Mesaj Yazan Michaelgen
  • Michaelgen

  • Hey, buradaki herkes Hemant. müvekkilimden biri, 2 sütunlu [TH] NODE ile ızgara düzenine sahip olduğumuz gibi, kaynak düzeninde ızgara görünümü elde etmek istiyor.
    İşte Extra.less'a yerleştirmeniz gereken basit bir CSS, aradığınızı verecektir.
    BEĞENDİYSENİZ LÜTFEN İNCELEYİNİZ
    Kod:
    .structItem--resource {
       background-color: white !important;
       border-collapse: collapse;
       padding: 0px;
       width: 100%;
       min-height: 138px;
       height: 138px;
       height: auto;
       display: inline-block !important;
       margin: 9px 0px 0px 6px;
       max-width: 49% !important;
       max-height: 162px;
       box-sizing: border-box;
       vertical-align: top;
       border-radius: 2px;
       box-shadow: 0 1px 4px rgba(0, 0, 0, 0.28); }
    .structItem-cell--iconExpanded .structItem-iconContainer .avatar {
       width: 96px;
       height: 96px;
       font-size: 57.6px;
       margin-left: 3px; }
    .structItem--resource .structItem-cell--main {
       width: 100%;
       height: 112px; }
    .structItem--resource .structItem-cell--resourceMeta {
       display: block;
       width: auto !important;
       margin-top: -13px;
       margin-bottom: 15px; }
    span.avatar.avatar--s.avatar--separated.structItem-secondaryIcon {
       display: none; }
    .structItem--resource .ratingStarsRow--justified {
       border-bottom: 1px solid #dfdfdf;
       margin-bottom: 2px;
       padding-bottom: 2px; }
    .pairs.pairs--justified>dd {
       float: left;
       text-align: right;
       max-width: 100%; }
    .structItem--resource .structItem-metaItem--lastUpdate {
       float: right; }
    .structItem--resource .structItem-metaItem--downloads {
       float: left; }
    .structItem-cell.structItem-cell--icon.structItem-cell--iconExpanded {
       width: 120px; }
    div[data-type="resource"] .structItemContainer {
       background-color: #f5f5f5; }
    @media (max-width: 1125px) {
    .structItem--resource {
       max-width: calc(95%) !important;   } }
    @media (max-width: 650px) {
    .structItem--resource {
       display: table !important;
       max-width: 100% !important;
       margin: 5px 5px 5px 0px;
       box-shadow: none;     } }

    Metni İndir ve Güncelle yerine Yazı Tipi harika simgesini almak isteyen varsa, bu CSS'yi aşağıdaki CSS'ye ekstra.less'ta yapıştırın
    Kod:
    .structItem-metaItem--lastUpdate dt,.structItem-metaItem--downloads dt{
      font-size:0px; }
    .structItem-metaItem--downloads dd{
      margin-left:18px; }
    .structItem-metaItem--downloads dt:before ,.structItem-metaItem--lastUpdate dt:before {
        font-family: FontAwesome;
        font-size: 14px;
        position: absolute; }
    .structItem-metaItem--downloads dt:before {
        margin-left: 0px;
      content: '\f019'; }
    .structItem-metaItem--lastUpdate dt:before {
      content: '\f017';
      margin-left: -15px; }
     

    Create an account or login to comment

    You must be a member in order to leave a comment

    Create account

    Create an account on our community. It's easy!

    Log in

    Already have an account? Log in here.

    Üst
    AdBlock Detected

    We get it, advertisements are annoying!

    Sure, ad-blocking software does a great job at blocking ads, but it also blocks useful features of our website. For the best site experience please disable your AdBlocker.

    I've Disabled AdBlock    No Thanks