1/** 2 * This file provides styles for the cookies popup 3 */ 4 5#cookiebanner { 6 position: fixed; 7 left: 0; 8 width: 100%; 9 color: @ini_text; 10 background-color: @ini_background_alt; 11 z-index: 1000; 12 padding: 10px; 13 box-sizing: border-box; 14 box-shadow: 0px 0px 10px #666; 15 border-top: @ini_border solid 1px; 16} 17 18#cookiebanner.cb_top { top: 0; } 19 20#cookiebanner.cb_bottom { bottom: 0; } 21 22#cookiebanner p { 23 clear: both; 24 margin: 0 auto; 25 max-width: 910pt; 26} 27 28#cookiebanner .cb_info { 29 margin-bottom: 6pt; 30} 31#cookiebanner .cb_icon { 32 float: left; 33 width: 64px; 34 height: 64px; 35 margin: 8px 16px 8px 2px; 36} 37#cookiebanner .cb_icon svg { 38 width: 100%; 39 height: 100%; 40} 41#cookiebanner .cb_action { 42 margin-top: 6pt; 43 display: grid; 44 grid-template-columns: 1fr 1fr; 45 grid-column-gap: 8pt; 46 column-gap: 8pt; 47 justify-items: center; 48} 49#cookiebanner .cb_action > * { 50 font-size: 12pt; 51} 52 53#cookiebanner .cb_action button { 54 background-color: rgba(0,0,0,0.1); 55 background-image: none; 56 border: @ini_border solid 2pt; 57 color: @ini_text; 58 padding: .25em .5em; 59 cursor: pointer; 60} 61 62/* dark mode overrides */ 63@media (prefers-color-scheme: dark) { 64 body.darkmode #cookiebanner { 65 color: @ini_text_dark; 66 background-color: @ini_background_dark; 67 box-shadow: 0 0 10px @ini_background_site_dark; 68 border-top-color: @ini_border_dark; 69 } 70 body.darkmode #cookiebanner .cb_action button { 71 background-color: rgba(0,0,0,0.25); 72 border-color: @ini_border_dark; 73 color: @ini_text_dark; 74 } 75}