Új hozzászólás Aktív témák

• cattus addikt

  #7754

  #7753 bandi0000

  2020-03-16 15:07:54

  Új Válasz

  Új hozzászólás

  Összes hozzászólása itt Válaszok az összes hozzászólására itt Válaszok erre a hozzászólásra

  

  cattus

  addikt

  #7753 bandi0000

  #7753 bandi0000

  + egy kis Responsive ötlet is jól jönne

  Szintén Angular material, + Angular Flex-Layout

  Ötlet az az, hogy angularba nyitok egy dialogot a bejelentkezés és regisztrációhoz, viszont úgy szeretném megoldani a kettő közti váltást, hogy a dialogon belül 2 db gomb lenne, egymás mellett, amik egyenként elfoglalják a szélesség 50-50%-át, viszont a legkisebb állapotában minden vezérlő egymás alá kerülne

  Nagyrészt ezek meg is vannak, csak az első fejtörést az okozza, hogy a dialognak kellene egyáltalán adni szélességet? mert ugye elvileg felveszi a tartalomnak a szélességét

  A másik dolog, hogy ahogy összehúzom a böngészőt, a beviteli mezők szépen egymás alá kerülnek, viszont a gombok nem, ez azért lehet mert megadtam nekik, hogy 100% legyen a szélességük, ha viszont ezt kiveszem, akkor meg nem töltik ki a helyet
  (beviteli mezők külön komponensben vannak, azokat alul szúrom be)

  <div fxLayout="column">    
    <div fxLayout="row" fxLayoutAlign="end">        
       <button mat-button (click)="closeDialog()">
<i class="material-icons">close</i>        
        </button>    
    </div>    
    <div fxLayout="row">        
        <div fxFlex="100">            
            <button mat-button (click)="isLoginActive= true" 
                [class.btn--disable]="isLoginActive"               
                class="full-width no-shape">Login</button>            
            <button mat-button (click)="isLoginActive= false" 
                [class.btn--disable]="!isLoginActive"                
                class="full-width no-shape">Registration</button>        
</div>   
    </div>
</div>
<div *ngIf="isLoginActive">    
    <app-login></app-login>
</div>
<div *ngIf="!isLoginActive">    
    <app-registration></app-registration>
</div>

  FxLayout esetében van olyan, hogy megadod, hogy egyes méretekben hogy viselkedjen. Pl.

  <div fxLayout="row" fxLayout.xs="column"></div>
  
  esetén xs méret esetén column, felette row elrendezést használ. Így maradhat a 100% is. Van még gt-xs meg lt-xs is (meg persze a többi méretre is).

Új hozzászólás Aktív témák