Difference between revisions of "Team:Jilin China/CSS Details"
| Line 65: | Line 65: | ||
} | } | ||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
@media screen and (min-width:1080px){ | @media screen and (min-width:1080px){ | ||
| Line 414: | Line 355: | ||
text-align: center; | text-align: center; | ||
margin: 0; | margin: 0; | ||
| + | } | ||
| + | |||
| + | .details_button_background{ | ||
| + | box-sizing: border-box; | ||
| + | } | ||
| + | |||
| + | .details_button{ | ||
| + | border:3px solid black; | ||
| + | height:3.5rem !important; | ||
| + | width:3.5rem !important; | ||
| + | border-radius: 3.5rem; | ||
| + | transition: all 0.3s ease; | ||
| + | position: relative; | ||
| + | padding:0 !important; | ||
| + | margin:0 calc(50vw - 6rem) !important; | ||
| + | box-sizing: border-box; | ||
| + | } | ||
| + | .details_button:hover{ | ||
| + | width:12rem !important; | ||
| + | background:black; | ||
| + | } | ||
| + | .details_button svg{ | ||
| + | transform: translate(2.25px,2.25px); | ||
| + | } | ||
| + | .details_button .vertical_line{ | ||
| + | transition: all 0.4s ease; | ||
| + | d:path('M27.5,12,27.5,27.5,27.5,43'); | ||
| + | |||
| + | } | ||
| + | .details_button:hover .vertical_line{ | ||
| + | d:path('M27.5,12,42.94,27.5,27.5,43'); | ||
| + | stroke:white; | ||
| + | } | ||
| + | .details_button h5{ | ||
| + | transform: translate(-3px,-3px); | ||
| + | padding:0 !important; | ||
| + | margin:0 !important; | ||
| + | color: black; | ||
| + | line-height: 3.5rem !important; | ||
| + | position:absolute; | ||
| + | top:0; | ||
| + | left:3rem; | ||
| + | width:8.5rem !important; | ||
| + | text-align: center; | ||
| + | transition: all 0.3s ease; | ||
| + | font-size:1.1rem !important; | ||
| + | } | ||
| + | .details_button:hover h5{ | ||
| + | |||
| + | color: white; | ||
| + | } | ||
| + | .details_button .horizon_line, .vertical_line { | ||
| + | fill: none; | ||
| + | stroke: #000; | ||
| + | stroke-width: 3.5px; | ||
| + | } | ||
| + | .details_button .horizon_line { | ||
| + | stroke-miterlimit: 10; | ||
| + | } | ||
| + | .details_button .vertical_line { | ||
| + | stroke-linejoin: round; | ||
} | } | ||
} | } | ||
Revision as of 08:24, 2 September 2018