mirror of
				https://github.com/mdbootstrap/mdb-ui-kit.git
				synced 2025-10-31 07:57:45 +03:00 
			
		
		
		
	fixed checkboxes inside lists
This commit is contained in:
		
							parent
							
								
									99704278fa
								
							
						
					
					
						commit
						31f43761de
					
				|  | @ -27,6 +27,7 @@ | ||||||
|     &:before { |     &:before { | ||||||
|       display: block; |       display: block; | ||||||
|       position: absolute; |       position: absolute; | ||||||
|  |       left: 0; | ||||||
|       content: ""; |       content: ""; | ||||||
|       background-color: rgba(0,0,0,.84); |       background-color: rgba(0,0,0,.84); | ||||||
|       height: @checkbox-size; |       height: @checkbox-size; | ||||||
|  |  | ||||||
							
								
								
									
										185
									
								
								less/_lists.less
									
									
									
									
									
								
							
							
						
						
									
										185
									
								
								less/_lists.less
									
									
									
									
									
								
							|  | @ -1,99 +1,102 @@ | ||||||
| .list-group { | .list-group { | ||||||
|  |   border-radius: 0; | ||||||
|  |   .list-group-item { | ||||||
|  |     background-color: transparent; | ||||||
|  |     overflow: hidden; | ||||||
|  |     border: 0; | ||||||
|     border-radius: 0; |     border-radius: 0; | ||||||
|     .list-group-item { |     padding: 0 16px; | ||||||
|         background-color: transparent; |     &.baseline { | ||||||
|         overflow: hidden; |       border-bottom: 1px solid #cecece; | ||||||
|         border: 0; |       &:last-child { | ||||||
|         border-radius: 0; |         border-bottom: none; | ||||||
|         padding: 0 16px; |       } | ||||||
|         &.baseline { |  | ||||||
|             border-bottom: 1px solid #cecece; |  | ||||||
|             &:last-child { |  | ||||||
|                 border-bottom: none; |  | ||||||
|             } |  | ||||||
|         } |  | ||||||
|         .row-picture, .row-action-primary { |  | ||||||
|             float: left; |  | ||||||
|             display: inline-block; |  | ||||||
|             padding-right: 16px; |  | ||||||
|             img, i, label { |  | ||||||
|                 display: block; |  | ||||||
|                 width: 56px; |  | ||||||
|                 height: 56px; |  | ||||||
|             } |  | ||||||
|             img { |  | ||||||
|                 background: rgba(0,0,0,0.1); |  | ||||||
|                 padding: 1px; |  | ||||||
|                 &.circle { |  | ||||||
|                     border-radius: 100%; |  | ||||||
|                 } |  | ||||||
|             } |  | ||||||
|             i { |  | ||||||
|                 background: rgba(0,0,0,0.25); |  | ||||||
|                 border-radius: 100%; |  | ||||||
|                 text-align: center; |  | ||||||
|                 line-height: 56px; |  | ||||||
|                 font-size: 20px; |  | ||||||
|                 color: white; |  | ||||||
|             } |  | ||||||
|             label { |  | ||||||
|                 margin-left: 7px; |  | ||||||
|                 margin-right: -7px; |  | ||||||
|                 margin-top: 5px; |  | ||||||
|                 margin-bottom: -5px; |  | ||||||
|             } |  | ||||||
|         } |  | ||||||
|         .row-content { |  | ||||||
|             display: inline-block; |  | ||||||
|             width: ~"calc(100% - 92px)"; |  | ||||||
|             min-height: 66px; |  | ||||||
|             .action-secondary { |  | ||||||
|                 position: absolute; |  | ||||||
|                 right: 16px; |  | ||||||
|                 top: 16px; |  | ||||||
|                 i { |  | ||||||
|                     font-size: 20px; |  | ||||||
|                     color: rgba(0,0,0,0.25); |  | ||||||
|                     cursor: pointer; |  | ||||||
|                 } |  | ||||||
|             } |  | ||||||
|             .action-secondary  ~ * { |  | ||||||
|                 max-width: ~"calc(100% - 30px)"; |  | ||||||
|             } |  | ||||||
|             .least-content { |  | ||||||
|                 position: absolute; |  | ||||||
|                 right: 16px; |  | ||||||
|                 top: 0px; |  | ||||||
|                 color: rgba(0,0,0,0.54); |  | ||||||
|                 font-size: 14px; |  | ||||||
|             } |  | ||||||
|         } |  | ||||||
|         .list-group-item-heading { |  | ||||||
|             color: rgba(0, 0, 0, 0.77); |  | ||||||
|             font-size: 20px; |  | ||||||
|             line-height: 29px; |  | ||||||
|         } |  | ||||||
|     } |     } | ||||||
|     .list-group-item.active { |     .row-picture, .row-action-primary { | ||||||
|         &:hover, &:focus { |       float: left; | ||||||
|             background: rgba(0,0,0,.15); |       display: inline-block; | ||||||
|             outline: 10px solid rgba(0,0,0,.15); |       padding-right: 16px; | ||||||
|  |       img, i, label { | ||||||
|  |         display: block; | ||||||
|  |         width: 56px; | ||||||
|  |         height: 56px; | ||||||
|  |       } | ||||||
|  |       img { | ||||||
|  |         background: rgba(0,0,0,0.1); | ||||||
|  |         padding: 1px; | ||||||
|  |         &.circle { | ||||||
|  |           border-radius: 100%; | ||||||
|         } |         } | ||||||
|         .list-group-item-heading, .list-group-item-text { |       } | ||||||
|             color: @lightbg-text; |       i { | ||||||
|  |         background: rgba(0,0,0,0.25); | ||||||
|  |         border-radius: 100%; | ||||||
|  |         text-align: center; | ||||||
|  |         line-height: 56px; | ||||||
|  |         font-size: 20px; | ||||||
|  |         color: white; | ||||||
|  |       } | ||||||
|  |       label { | ||||||
|  |         margin-left: 7px; | ||||||
|  |         margin-right: -7px; | ||||||
|  |         margin-top: 5px; | ||||||
|  |         margin-bottom: -5px; | ||||||
|  |         .checkbox-material { | ||||||
|  |           left: -10px; | ||||||
|         } |         } | ||||||
|  |       } | ||||||
|  |     } | ||||||
|  |     .row-content { | ||||||
|  |       display: inline-block; | ||||||
|  |       width: ~"calc(100% - 92px)"; | ||||||
|  |       min-height: 66px; | ||||||
|  |       .action-secondary { | ||||||
|  |         position: absolute; | ||||||
|  |         right: 16px; | ||||||
|  |         top: 16px; | ||||||
|  |         i { | ||||||
|  |           font-size: 20px; | ||||||
|  |           color: rgba(0,0,0,0.25); | ||||||
|  |           cursor: pointer; | ||||||
|  |         } | ||||||
|  |       } | ||||||
|  |       .action-secondary  ~ * { | ||||||
|  |         max-width: ~"calc(100% - 30px)"; | ||||||
|  |       } | ||||||
|  |       .least-content { | ||||||
|  |         position: absolute; | ||||||
|  |         right: 16px; | ||||||
|  |         top: 0px; | ||||||
|  |         color: rgba(0,0,0,0.54); | ||||||
|  |         font-size: 14px; | ||||||
|  |       } | ||||||
|  |     } | ||||||
|  |     .list-group-item-heading { | ||||||
|  |       color: rgba(0, 0, 0, 0.77); | ||||||
|  |       font-size: 20px; | ||||||
|  |       line-height: 29px; | ||||||
|  |     } | ||||||
|  |   } | ||||||
|  |   .list-group-item.active { | ||||||
|  |     &:hover, &:focus { | ||||||
|  |       background: rgba(0,0,0,.15); | ||||||
|  |       outline: 10px solid rgba(0,0,0,.15); | ||||||
|  |     } | ||||||
|  |     .list-group-item-heading, .list-group-item-text { | ||||||
|  |       color: @lightbg-text; | ||||||
|  |     } | ||||||
| 
 | 
 | ||||||
|  |   } | ||||||
|  |   .list-group-separator { | ||||||
|  |     clear: both; | ||||||
|  |     overflow: hidden; | ||||||
|  |     margin-top: 10px; | ||||||
|  |     margin-bottom: 10px; | ||||||
|  |     &:before { | ||||||
|  |       content: ""; | ||||||
|  |       width: ~"calc(100% - 90px)"; | ||||||
|  |       border-bottom: 1px solid rgba(0,0,0,0.1); | ||||||
|  |       float: right; | ||||||
|     } |     } | ||||||
|     .list-group-separator { |   } | ||||||
|         clear: both; |  | ||||||
|         overflow: hidden; |  | ||||||
|         margin-top: 10px; |  | ||||||
|         margin-bottom: 10px; |  | ||||||
|         &:before { |  | ||||||
|             content: ""; |  | ||||||
|             width: ~"calc(100% - 90px)"; |  | ||||||
|             border-bottom: 1px solid rgba(0,0,0,0.1); |  | ||||||
|             float: right; |  | ||||||
|         } |  | ||||||
|     } |  | ||||||
| } | } | ||||||
|  |  | ||||||
		Loading…
	
		Reference in New Issue
	
	Block a user