windy-plugins/examples/07-multiple-files-plugin/plugin.less at master · vasudevan-p/windy-plugins · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
@import "dev/variables.less";


#windy-plugin-examples {
	font-size: 12px;
	padding: .5em .7em;
	line-height: 2;
	z-index: 100;

	@h: 440px;

	width: 360px;
	height: @h;

	margin-left: -10px;

	h3 {
		margin: 0 0 .3em .6em;
	}

	.closing-x {
		display: block;
	}

	section {
		margin-left: 10px;
		line-height: 1.5;

		span:not(:first-child) {
			margin-left: 1em;
		}
		&:first-of-type {
			color: black;
		}
		&:last-of-type {
			font-size: .9em;
		}
		[data-ref="modelAlt"] {
			&.red {
				color: red;
			}
		}
	}

	[data-ref="zoom"] {
		position: absolute;
		right: 20px;
		bottom: 15px;
		font-size: 25px;
		color: @myred;
	}

	.mobile({
		display: block;
		left: 0;
		top: 0;
		right: 0;
		width: ~"calc(100% - 20px)";
		margin: 10px;
	});

	//=================================
	//
	// SVG items
	//
	//=================================

	.axis path,
	.axis line {
	  fill: none;
	  stroke: #000;
	  shape-rendering: crispEdges;
	}

	#sounding-chart {
		height: @h - 80px;
		position: relative;
		svg {
			width: 100%;
			height: 100%;
		}

		.infoLine .dewpoint { fill: steelblue; }
		.infoLine .temp { fill: red; }
		.zoomButton { cursor: pointer; }
	}
}