Difference between revisions of "Template:TAS Taipei/CSS"
| Line 946: | Line 946: | ||
clear: both; | clear: both; | ||
} | } | ||
| + | |||
| + | |||
/* Style the buttons that are used to open and close the accordion panel */ | /* Style the buttons that are used to open and close the accordion panel */ | ||
| Line 969: | Line 971: | ||
padding: 0 18px; | padding: 0 18px; | ||
background-color: white; | background-color: white; | ||
| − | + | max-height: 0; | |
| + | overflow: hidden; | ||
| + | transition: 0.6s ease-in-out; | ||
| + | opacity: 0; | ||
} | } | ||
| − | /* The "show" class is added to the accordion panel when the user clicks on one of the buttons. This will show the panel | + | /* The "show" class is added to the accordion panel when the user clicks on one of the buttons. This will show the panel |
| + | |||
div.panel.show { | div.panel.show { | ||
| − | + | opacity: 1; | |
| + | max-height: 500px; /* Whatever you like, as long as its more than the height of the content (on all screen sizes) */ | ||
} | } | ||
| + | |||
| + | button.accordion:after { | ||
| + | content: '\02795'; /* Unicode character for "plus" sign (+) */ | ||
| + | font-size: 13px; | ||
| + | color: #777; | ||
| + | float: right; | ||
| + | margin-left: 5px; | ||
| + | } | ||
| + | |||
| + | button.accordion.active:after { | ||
| + | content: "\2796"; /* Unicode character for "minus" sign (-) */ | ||
| + | } | ||
| + | |||
| + | |||
| + | |||
| + | |||
| + | |||
@import url("/wiki/skins/igem/top_menu_14.css") | @import url("/wiki/skins/igem/top_menu_14.css") | ||
</style> | </style> | ||
</html> | </html> | ||
Revision as of 09:03, 14 July 2016
