Basculer le menu
Changer de menu des préférences
Basculer le menu personnel
Non connecté(e)
Votre adresse IP sera visible au public si vous faites des modifications.

« Modèle:Accueil/shared/styles.css » : différence entre les versions

De Nefald
Hiob (discussion | contributions)
Aucun résumé des modifications
Hiob (discussion | contributions)
mAucun résumé des modifications
Ligne 127 : Ligne 127 :


/* ====================================
/* ====================================
   2. BARRE DE RECHERCHE - STYLE STAR CITIZEN
   2. BARRE DE RECHERCHE - MINIMALISTE
  ==================================== */
 
/* ====================================
  2. BARRE DE RECHERCHE - STYLE STAR CITIZEN
   ==================================== */
   ==================================== */


Ligne 138 : Ligne 134 :
     display: flex;
     display: flex;
     align-items: center;
     align-items: center;
     gap: var(--space-sm);
    justify-content: center;
     max-width: 600px;
     gap: 0.75rem;
     max-width: 500px;
     width: 100%;
     width: 100%;
     margin-top: var(--space-xl);
     margin-top: var(--space-xl);
     margin-left: auto;
     margin-left: auto;
     margin-right: auto;
     margin-right: auto;
     padding: 1rem 1.5rem;
     padding: 0.625rem 1.25rem;
      
      
     /* Style avec cadre */
     /* Style */
     background-color: rgba(255, 255, 255, 0.03);
     background-color: rgba(255, 255, 255, 0.02);
     border: 1px solid rgba(135, 191, 219, 0.3);
     border: 1px solid rgba(255, 255, 255, 0.15);
     border-radius: 50px;
     border-radius: 50px;
      
      
     /* Typography */
     /* Typography */
     font-size: 0.9375rem;
     font-size: 0.875rem;
    font-weight: 500;
      
      
     /* Interaction */
     /* Interaction */
     cursor: pointer;
     cursor: pointer;
     transition: all 0.3s ease;
     transition: all 0.2s ease;
    box-shadow: 0 0 20px rgba(135, 191, 219, 0.1);
}
}


.home-search:hover {
.home-search:hover {
     background-color: rgba(255, 255, 255, 0.05);
     background-color: rgba(255, 255, 255, 0.04);
     border-color: rgba(238, 165, 41, 0.5);
     border-color: rgba(255, 255, 255, 0.25);
    box-shadow: 0 0 30px rgba(238, 165, 41, 0.2);
}
}


.home-search__icon {
.home-search__icon {
     font-size: 1.125rem;
     font-size: 0.875rem;
     opacity: 0.6;
     opacity: 0.5;
     flex-shrink: 0;
     flex-shrink: 0;
     line-height: 1;
     line-height: 1;
    transition: opacity 0.2s;
}
.home-search:hover .home-search__icon {
    opacity: 0.9;
}
}


.home-search__text {
.home-search__text {
    flex: 1;
     color: var(--color-base);
     color: var(--color-base);
     opacity: 0.7;
     opacity: 0.6;
     user-select: none;
     user-select: none;
     text-align: left;
     text-align: center;
     line-height: 1.4;
     line-height: 1;
    transition: opacity 0.2s;
}
 
.home-search:hover .home-search__text {
    opacity: 1;
}
 
.home-search__kbd-wrapper {
    margin-left: var(--space-xs);
    flex-shrink: 0;
}
}


Ligne 202 : Ligne 180 :
     align-items: center;
     align-items: center;
     justify-content: center;
     justify-content: center;
     min-width: 1.5rem;
     min-width: 1.25rem;
     height: 1.5rem;
     height: 1.25rem;
     padding: 0 0.4rem;
     padding: 0 0.35rem;
     font-family: monospace;
     font-family: monospace;
     font-size: 0.75rem;
     font-size: 0.6875rem;
     font-weight: 700;
     font-weight: 600;
     background: rgba(135, 191, 219, 0.2);
     background: rgba(255, 255, 255, 0.08);
     border: 1px solid rgba(135, 191, 219, 0.3);
     border: 1px solid rgba(255, 255, 255, 0.15);
     border-radius: 4px;
     border-radius: 3px;
     color: var(--color-base);
     color: var(--color-base);
     opacity: 0.6;
     opacity: 0.5;
    transition: all 0.2s;
}
 
.home-search:hover .home-search__kbd {
    background: rgba(238, 165, 41, 0.2);
    border-color: rgba(238, 165, 41, 0.4);
    opacity: 0.9;
}
}


Ligne 227 : Ligne 198 :
         margin-left: 1rem;
         margin-left: 1rem;
         margin-right: 1rem;
         margin-right: 1rem;
         padding: 0.875rem 1.25rem;
         padding: 0.5rem 1rem;
     }
     }
      
      
     .home-search__kbd-wrapper {
     .home-search__kbd {
        display: none;
    }
}
 
@media (max-width: 480px) {
    .home-search {
        padding: 0.75rem 1rem;
        gap: 0.75rem;
    }
   
    .home-search__icon {
        font-size: 1rem;
    }
   
    .home-search__text {
        font-size: 0.875rem;
    }
}
 
@media (hover: none) {
    .home-search__kbd-wrapper {
         display: none;
         display: none;
     }
     }
Les témoins (''cookies'') nous aident à fournir nos services. En utilisant nos services, vous acceptez notre utilisation de témoins.