1/* 2 * Copyright (C) 2022 Huawei Device Co., Ltd. 3 * Licensed under the Apache License, Version 2.0 (the "License"); 4 * you may not use this file except in compliance with the License. 5 * You may obtain a copy of the License at 6 * 7 * http://www.apache.org/licenses/LICENSE-2.0 8 * 9 * Unless required by applicable law or agreed to in writing, software 10 * distributed under the License is distributed on an "AS IS" BASIS, 11 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. 12 * See the License for the specific language governing permissions and 13 * limitations under the License. 14 */ 15 16export const SpFlagHtml = `<style> 17 .sp-flags-vessel { 18 background-color: var(--dark-background5,#F6F6F6); 19 min-height: 100%; 20 display: grid; 21 grid-template-columns: 1fr; 22 grid-template-rows:1fr; 23 } 24 :host{ 25 width: 100%; 26 height: 100%; 27 background-color: var(--dark-background5,#F6F6F6); 28 display: block; 29 } 30 .body{ 31 width: 85%; 32 margin: 2% 5% 2% 5%; 33 background-color: var(--dark-background3,#FFFFFF); 34 border-radius: 16px 16px 16px 16px; 35 padding-left: 2%; 36 padding-right: 4%; 37 } 38 .title { 39 padding-left: 2%; 40 margin-left: 8%; 41 } 42 .flag-widget { 43 width: 80%; 44 padding: 1% 2% 1% 2%; 45 margin-left: 8%; 46 margin-right: 8%; 47 border-radius: 10px 10px 10px 10px; 48 } 49 .flag-widget:nth-child(2n+1) { 50 background-color: #F5F5F5; 51 } 52 .flag-title-label { 53 margin-right: 10px; 54 flex-grow: 1; 55 text-align: left; 56 opacity: 0.9; 57 font-family: Helvetica-Bold; 58 font-size: 16px; 59 color: #000000; 60 line-height: 28px; 61 font-weight: 700; 62 } 63 .flag-head-div { 64 display: flex; 65 align-items: center; 66 } 67 .flag-des-div { 68 opacity: 0.6; 69 font-family: Helvetica; 70 font-size: 12px; 71 color: var(--dark-color,#000000); 72 text-align: left; 73 line-height: 20px; 74 font-weight: 400; 75 margin-top: 0.1%; 76 } 77 .config_footer { 78 margin-top: 1%; 79 } 80 .flag-select { 81 width: 12rem; 82 border: 1px solid var(--dark-color1,#4D4D4D); 83 border-radius: 16px; 84 opacity: 0.6; 85 font-family: Helvetica; 86 font-size: 12px; 87 color: var(--dark-color1,#000000); 88 text-align: center; 89 line-height: 20px; 90 font-weight: 400; 91 -webkit-appearance: none; 92 background: url(img/down.png) no-repeat 96% center; 93 } 94 .device_label { 95 font-weight: 500; 96 margin-right: 10px; 97 opacity: 0.9; 98 font-family: Helvetica-Bold; 99 font-size: 14px; 100 } 101 .device_input { 102 line-height: 20px; 103 font-weight: 400; 104 margin-right: 2%; 105 border-radius: 16px; 106 border: 1px solid #ccc; 107 padding-left: 10px; 108 } 109 </style> 110 <div class="sp-flags-vessel"> 111 <div class="body"> 112 <h3 class="title">Feature flags</h3> 113 </div> 114 </div> 115 `; 116