mirror of
				https://git.ianrenton.com/ian/spothole.git
				synced 2025-10-27 16:59:25 +00:00 
			
		
		
		
	
		
			
				
	
	
		
			164 lines
		
	
	
		
			2.6 KiB
		
	
	
	
		
			CSS
		
	
	
	
	
	
			
		
		
	
	
			164 lines
		
	
	
		
			2.6 KiB
		
	
	
	
		
			CSS
		
	
	
	
	
	
| /* NAVIGATION */
 | |
| 
 | |
| .navbar-nav .nav-link.active {
 | |
|   font-weight: bold;
 | |
| }
 | |
| 
 | |
| 
 | |
| /* INTRO/WARNING BOXES */
 | |
| 
 | |
| #intro-box {
 | |
|     display: none;
 | |
| }
 | |
| 
 | |
| 
 | |
| /* GENERAL PAGE LAYOUT */
 | |
| 
 | |
| div.container {
 | |
|    display:grid;
 | |
|    grid-template-rows:auto 1fr auto;
 | |
|    grid-template-columns:100%;
 | |
| 
 | |
|    /* fallback height */
 | |
|    min-height:100vh;
 | |
| 
 | |
|    /* new small viewport height for modern browsers */
 | |
|    min-height:100svh;
 | |
| }
 | |
| 
 | |
| 
 | |
| /* ABOUT PAGE*/
 | |
| 
 | |
| #info-container{
 | |
|     width: 100%;
 | |
| }
 | |
| 
 | |
| @media (min-width: 768px) {
 | |
|   #info-container{
 | |
|     max-width: 60em;
 | |
|     margin: 0 auto;
 | |
|   }
 | |
| }
 | |
| 
 | |
| 
 | |
| /* SPOTS/ALERTS PAGES, SETTINGS/STATUS AREAS */
 | |
| 
 | |
| div.appearing-panel {
 | |
|     display: none;
 | |
| }
 | |
| 
 | |
| button#add-spot-button {
 | |
|     display: none;
 | |
| }
 | |
| 
 | |
| .spothole-card-text {
 | |
|     line-height: 2.5em !important;
 | |
| }
 | |
| 
 | |
| 
 | |
| 
 | |
| /* SPOTS/ALERTS PAGES, MAIN TABLE */
 | |
| 
 | |
| /* Custom version of Bootstrap table colouring to colour 2 in every 4 rows, because of our second row per spot that
 | |
| appears on mobile */
 | |
| .table-striped-custom > tbody > tr:nth-of-type(4n+3) > *,
 | |
| .table-striped-custom > tbody > tr:nth-of-type(4n+4) > * {
 | |
|     --bs-table-color-type: var(--bs-table-striped-color);
 | |
|     --bs-table-bg-type: var(--bs-table-striped-bg);
 | |
| }
 | |
| 
 | |
| td.nowrap, span.nowrap {
 | |
|     text-wrap: nowrap;
 | |
| }
 | |
| 
 | |
| span.flag-wrapper {
 | |
|     display: inline-block;
 | |
|     width: 1.7em;
 | |
|     text-align: center;
 | |
|     cursor: default;
 | |
| }
 | |
| 
 | |
| span.band-bullet {
 | |
|     display: inline-block;
 | |
|     cursor: default;
 | |
|     padding-right: 0.2em;
 | |
| }
 | |
| 
 | |
| span.icon-wrapper {
 | |
|     display: inline-block;
 | |
|     width: 1.5em;
 | |
|     text-align: center;
 | |
|     cursor: default;
 | |
| }
 | |
| 
 | |
| span.freq-mhz {
 | |
|     display: inline-block;
 | |
|     min-width: 1.7em;
 | |
|     text-align: right;
 | |
|     font-weight: bold;
 | |
| }
 | |
| 
 | |
| span.freq-khz {
 | |
|     padding: 0 0.2em;
 | |
| }
 | |
| 
 | |
| span.freq-hz {
 | |
|     font-size: 0.8em;
 | |
| }
 | |
| 
 | |
| span.mode-q, span.bearing-q {
 | |
|     padding-left: 0.5em;
 | |
|     font-size: 0.7em;
 | |
|     color: lightgray;
 | |
| }
 | |
| 
 | |
| a.dx-link {
 | |
|     color: var(--bs-emphasis-color);
 | |
|     text-decoration: none;
 | |
|     font-weight: bold;
 | |
| }
 | |
| 
 | |
| /* QRT/faded styles */
 | |
| tr.table-faded td {
 | |
|     filter: grayscale(100%) opacity(30%) !important;
 | |
|     text-decoration: line-through !important;
 | |
| }
 | |
| tr.table-faded td span {
 | |
|     text-decoration: line-through !important;
 | |
| }
 | |
| 
 | |
| 
 | |
| /* MAP */
 | |
| div#map {
 | |
|     width: auto;
 | |
|     height: 100%;
 | |
|     margin: 0;
 | |
|     overflow: hidden;
 | |
|     cursor: default;
 | |
|     font-size: 16px;
 | |
| }
 | |
| 
 | |
| .leaflet-container {
 | |
|     font-family: var(--bs-body-font-family) !important;
 | |
| }
 | |
| 
 | |
| a.leaflet-popup-callsign-link {
 | |
|     color: black;
 | |
|     font-weight: bold;
 | |
|     text-decoration: none;
 | |
| }
 | |
| 
 | |
| 
 | |
| /* GENERAL MOBILE SUPPORT */
 | |
| 
 | |
| @media (max-width: 991.99px) {
 | |
|     .hideonmobile {
 | |
|         display: none !important;
 | |
|     }
 | |
| }
 | |
| 
 | |
| @media (min-width: 992px) {
 | |
|     .hidenotonmobile {
 | |
|         display: none !important;
 | |
|     }
 | |
| } | 
