setup

src/components/Common/CurrentTemp/index.module.css

@@ -0,0 +1,139 @@
+.chart {
+	height: 100%;
+}
+
+.gas {
+	position: relative;
+}
+
+.currentFlow {
+	position: absolute;
+	top: 20px;
+	left: 50%;
+	transform: translateX(-50%);
+	padding: 8px 22px;
+	border-radius: 2px;
+	letter-spacing: 2px;
+	box-shadow: inset 0 0 22px 0px hsla(0, 0%, 100%, 0.15);
+	line-height: 18px;
+	font-size: 18px;
+	text-align: center;
+	color: #12fff5;
+}
+
+.floatHead {
+	position: absolute;
+	top: 22px;
+	right: 24px;
+	height: 32px;
+	width: 410px;
+	display: flex;
+	align-items: center;
+	justify-content: flex-end;
+}
+
+.mainContent {
+	padding-top: 16px;
+}
+
+.alignRight {
+	text-align: right;
+	justify-self: flex-end;
+}
+
+.grid {
+	display: grid;
+	gap: 6px;
+	grid-template-columns: repeat(2, minmax(100px, 1fr));
+	grid-auto-rows: minmax(64px, min-content);
+}
+
+.areaName {
+	color: #fff;
+	font-size: 20px;
+	line-height: 1;
+	letter-spacing: 1.5px;
+	margin: 0;
+	padding-left: 20px;
+	width: 50%;
+}
+
+.areaPureContent {
+	display: flex;
+}
+
+.areaPureValue {
+	padding: 0 8px;
+}
+
+.areaPureValue:not(:first-child) {
+	border-left: 2px solid #fff6;
+}
+
+.areaContent {
+	width: 50%;
+	padding-left: 12px;
+	display: flex;
+	flex-direction: column;
+}
+
+.areaPureValue,
+.areaValue {
+	display: inline-block;
+	font-size: 17px;
+	line-height: 22px;
+	letter-spacing: 1.2px;
+}
+
+.switchLabel {
+	color: white;
+	margin-left: 6px;
+}
+
+.legend:last-child {
+	margin-left: 8px;
+}
+
+.legend > span {
+	display: inline-block;
+	color: #dff1fe;
+	font-size: 14px;
+	letter-spacing: 2px;
+}
+
+.legend > span:first-child {
+	width: 12px;
+	height: 12px;
+	margin-right: 4px;
+	border-radius: 2px;
+}
+
+.gasIcon {
+	background: #12fff5;
+}
+
+.gas2Icon {
+	background: #2760ff;
+}
+
+.radioGroup {
+	user-select: none;
+}
+
+.radioGroup * {
+	border: none !important;
+	border-radius: 0 !important;
+}
+
+.radioGroup *:focus-within {
+	box-shadow: none !important;
+}
+
+.radioGroup *::before {
+	width: 0 !important;
+}
+
+.radioGroup_button_wrapper {
+	color: #fff !important;
+	background: #03233c !important;
+}