क्या सीमा को हटाने का कोई तरीका है, मुझे लगता है कि यह कोणीय सामग्री से mat-expansion-panel का box-shadow है? मैं चाहता हूं कि यह पूरी तरह से सफेद हो, इसलिए आपको केवल टेक्स्ट और विस्तार तीर दिखाई देगा

<mat-accordion>
 <mat-expansion-panel class="" (opened)="panelOpenState = true"
                   (closed)="panelOpenState = false">

   <mat-expansion-panel-header>

     <mat-panel-title>
       <span class="right">Filter</span>
     </mat-panel-title>

   </mat-expansion-panel-header>

   <p><app-data></app-data></p>

 </mat-expansion-panel>
</mat-accordion>

Mat-Panel

28
Sergi 6 अगस्त 2018, 22:43
थीमिंग गाइड पर एक नज़र डालें और इसे CSS से हटा दें
 – 
user184994
6 अगस्त 2018, 22:46

4 जवाब

mat-elevation-z0 क्लास जोड़ें। एक आकर्षण की तरह काम करता है, मुझे हाल ही में इसका उपयोग करने की ज़रूरत है।

<mat-accordion>
 <mat-expansion-panel class="mat-elevation-z0" (opened)="panelOpenState = true"
                   (closed)="panelOpenState = false">

   <mat-expansion-panel-header>

     <mat-panel-title>
       <span class="right">Filter</span>
     </mat-panel-title>

   </mat-expansion-panel-header>

   <p><app-data></app-data></p>

 </mat-expansion-panel>
</mat-accordion>
34
Tomasz Błachut 6 अगस्त 2018, 22:47
दुख की बात है कि मुझे नहीं पता। DevTools के साथ शैलियों का निरीक्षण करने का प्रयास करें
 – 
Tomasz Błachut
7 अगस्त 2018, 17:24
2
होवर शैली को हटाने के लिए .mat-expansion-panel:not(.mat-expanded) .mat-expansion-panel-header:not([aria-disabled='true']):hover { background: white; }
 – 
Zesky
27 फरवरी 2019, 16:11

मैं इसे सीएसएस के साथ करता हूं:

.mat-expansion-panel:not([class*='mat-elevation-z']) {
    box-shadow: none;
}
8
JBeen 16 मार्च 2019, 15:39
आसान और संक्षिप्त। कोई बेहतर नहीं हो सकता!
 – 
ReturnTable
22 अगस्त 2019, 02:11
.mat-expansion-panel:not([class*='mat-elevation-z']) {
  box-shadow: 0px 0px 0px -2px rgba(0, 0, 0, 0.2), 0px 0px 0px 0px rgba(0, 0, 0, 0.14), 0px 0px 0px 0px rgba(0, 0, 0, 0.12); 
}

इससे चल जाएगा।

0
Nick 17 जिंदा 2019, 04:31

आप mat-expansion-panel वर्ग को टॉगल करके भी कर सकते हैं

<mat-accordion>
  <mat-expansion-panel [class.mat-expansion-panel]="false">
     ...
  </mat-expansion-panel>
</mat-accordion>
-1
Maxime Lechevallier 11 जिंदा 2019, 12:33
यह समाधान छाया को हटाता है, लेकिन एनिमेशन को भी अक्षम करता है।
 – 
Vukašin Manojlović
7 फरवरी 2020, 02:45