mirror of
				https://github.com/Azure-Samples/graphrag-accelerator.git
				synced 2025-11-03 20:19:53 +00:00 
			
		
		
		
	
		
			
	
	
		
			143 lines
		
	
	
		
			3.0 KiB
		
	
	
	
		
			CSS
		
	
	
	
	
	
		
		
			
		
	
	
			143 lines
		
	
	
		
			3.0 KiB
		
	
	
	
		
			CSS
		
	
	
	
	
	
| 
								 | 
							
								/*
							 | 
						||
| 
								 | 
							
								Copyright (c) Microsoft Corporation.
							 | 
						||
| 
								 | 
							
								Licensed under the MIT License.
							 | 
						||
| 
								 | 
							
								*/
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								@import url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.1/css/all.min.css');
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								#root > div:nth-child(1) > div.withScreencast > div > div > div > section.main.st-emotion-cache-uf99v8.ea3mdgi8 > div.block-container.st-emotion-cache-z5fcl4.ea3mdgi5 > div > div > div > div.st-emotion-cache-ocqkz7.e1f1d6gn5 > div:nth-child(4) > div > div > div > div > div{
							 | 
						||
| 
								 | 
							
								    margin-top: 1.6em;
							 | 
						||
| 
								 | 
							
								}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								[data-testid="stHeadingDivider"] {
							 | 
						||
| 
								 | 
							
								    background-color: #3d9df3;  /* Set your desired color */
							 | 
						||
| 
								 | 
							
								    height: 1px;
							 | 
						||
| 
								 | 
							
								}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								#microsoft-graphrag-copilot > div > span {
							 | 
						||
| 
								 | 
							
								    text-align: center;
							 | 
						||
| 
								 | 
							
								    margin-top: -1em;
							 | 
						||
| 
								 | 
							
								}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								/* Tooltip container */
							 | 
						||
| 
								 | 
							
								.tooltip {
							 | 
						||
| 
								 | 
							
								    position: relative;
							 | 
						||
| 
								 | 
							
								    display: inline-block;
							 | 
						||
| 
								 | 
							
								    border-bottom: 1px dotted black; /* If you want dots under the hoverable text */
							 | 
						||
| 
								 | 
							
								  }
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								  /* Tooltip text */
							 | 
						||
| 
								 | 
							
								  .tooltip .tooltiptext {
							 | 
						||
| 
								 | 
							
								    visibility: hidden;
							 | 
						||
| 
								 | 
							
								    width: 120px;
							 | 
						||
| 
								 | 
							
								    background-color: #555;
							 | 
						||
| 
								 | 
							
								    color: #fff;
							 | 
						||
| 
								 | 
							
								    text-align: center;
							 | 
						||
| 
								 | 
							
								    border-radius: 6px;
							 | 
						||
| 
								 | 
							
								    padding: 5px;
							 | 
						||
| 
								 | 
							
								    position: absolute;
							 | 
						||
| 
								 | 
							
								    z-index: 1;
							 | 
						||
| 
								 | 
							
								    bottom: 125%;
							 | 
						||
| 
								 | 
							
								    left: 50%;
							 | 
						||
| 
								 | 
							
								    margin-left: -60px;
							 | 
						||
| 
								 | 
							
								    opacity: 0;
							 | 
						||
| 
								 | 
							
								    transition: opacity 0.3s;
							 | 
						||
| 
								 | 
							
								  }
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								  /* Show the tooltip text when you hover over the tooltip container */
							 | 
						||
| 
								 | 
							
								  .tooltip:hover .tooltiptext {
							 | 
						||
| 
								 | 
							
								    visibility: visible;
							 | 
						||
| 
								 | 
							
								    opacity: 1;
							 | 
						||
| 
								 | 
							
								  }
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								  .gray-box {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								    background-color: #ffffff;
							 | 
						||
| 
								 | 
							
								    padding: 10px;
							 | 
						||
| 
								 | 
							
								    width: 80%;
							 | 
						||
| 
								 | 
							
								}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								.center-container {
							 | 
						||
| 
								 | 
							
								  margin-top: -10em;
							 | 
						||
| 
								 | 
							
								  display: flex;
							 | 
						||
| 
								 | 
							
								  align-items: center;
							 | 
						||
| 
								 | 
							
								  justify-content: center;
							 | 
						||
| 
								 | 
							
								  height: 100vh;
							 | 
						||
| 
								 | 
							
								}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								.footer {
							 | 
						||
| 
								 | 
							
								  display: flex;
							 | 
						||
| 
								 | 
							
								  justify-content: center;
							 | 
						||
| 
								 | 
							
								  align-items: center;
							 | 
						||
| 
								 | 
							
								  position: fixed;
							 | 
						||
| 
								 | 
							
								  left: 0;
							 | 
						||
| 
								 | 
							
								  bottom: 0;
							 | 
						||
| 
								 | 
							
								  width: 100%;
							 | 
						||
| 
								 | 
							
								  background-color: #f1f1f1;
							 | 
						||
| 
								 | 
							
								  text-align: center;
							 | 
						||
| 
								 | 
							
								  padding: 5px;
							 | 
						||
| 
								 | 
							
								  z-index: 1000;
							 | 
						||
| 
								 | 
							
								}
							 | 
						||
| 
								 | 
							
								.footer p{
							 | 
						||
| 
								 | 
							
								  font-size: 12px;
							 | 
						||
| 
								 | 
							
								}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								/* CSS */
							 | 
						||
| 
								 | 
							
								button[kind="primary"] {
							 | 
						||
| 
								 | 
							
								  background-color: #1d9445;
							 | 
						||
| 
								 | 
							
								  border: 0;
							 | 
						||
| 
								 | 
							
								  border-radius: 56px;
							 | 
						||
| 
								 | 
							
								  color: #fff;
							 | 
						||
| 
								 | 
							
								  cursor: pointer;
							 | 
						||
| 
								 | 
							
								  display: inline-block;
							 | 
						||
| 
								 | 
							
								  font-family: system-ui,-apple-system,system-ui,"Segoe UI",Roboto,Ubuntu,"Helvetica Neue",sans-serif;
							 | 
						||
| 
								 | 
							
								  font-size: 58px;
							 | 
						||
| 
								 | 
							
								  font-weight: 600;
							 | 
						||
| 
								 | 
							
								  outline: 0;
							 | 
						||
| 
								 | 
							
								  padding: 16px 21px;
							 | 
						||
| 
								 | 
							
								  position: relative;
							 | 
						||
| 
								 | 
							
								  text-align: center;
							 | 
						||
| 
								 | 
							
								  text-decoration: none;
							 | 
						||
| 
								 | 
							
								  transition: all .3s;
							 | 
						||
| 
								 | 
							
								  user-select: none;
							 | 
						||
| 
								 | 
							
								  -webkit-user-select: none;
							 | 
						||
| 
								 | 
							
								  touch-action: manipulation;
							 | 
						||
| 
								 | 
							
								}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								button[kind="primary"]:before {
							 | 
						||
| 
								 | 
							
								  background-color: initial;
							 | 
						||
| 
								 | 
							
								  background-image: linear-gradient(#fff 0, rgba(255, 255, 255, 0) 100%);
							 | 
						||
| 
								 | 
							
								  border-radius: 125px;
							 | 
						||
| 
								 | 
							
								  content: "";
							 | 
						||
| 
								 | 
							
								  height: 50%;
							 | 
						||
| 
								 | 
							
								  left: 4%;
							 | 
						||
| 
								 | 
							
								  opacity: .5;
							 | 
						||
| 
								 | 
							
								  position: absolute;
							 | 
						||
| 
								 | 
							
								  top: 0;
							 | 
						||
| 
								 | 
							
								  transition: all .3s;
							 | 
						||
| 
								 | 
							
								  width: 62%;
							 | 
						||
| 
								 | 
							
								}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								button[kind="primary"]:hover {
							 | 
						||
| 
								 | 
							
								  box-shadow: rgba(255, 255, 255, .2) 0 3px 15px inset, rgba(0, 0, 0, .1) 0 3px 5px, rgba(0, 0, 0, .1) 0 10px 13px;
							 | 
						||
| 
								 | 
							
								  transform: scale(1.05);
							 | 
						||
| 
								 | 
							
								}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								@media (min-width: 768px) {
							 | 
						||
| 
								 | 
							
								button[kind="primary"] {
							 | 
						||
| 
								 | 
							
								    padding: 15px 34px;
							 | 
						||
| 
								 | 
							
								    margin: 20px auto;
							 | 
						||
| 
								 | 
							
								  }
							 | 
						||
| 
								 | 
							
								}
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								.element-container:has(>.stTextArea), .stTextArea {
							 | 
						||
| 
								 | 
							
								  display: block;
							 | 
						||
| 
								 | 
							
								  margin-left: auto;
							 | 
						||
| 
								 | 
							
								  margin-right: auto;
							 | 
						||
| 
								 | 
							
								}
							 | 
						||
| 
								 | 
							
								.stTextArea textarea {
							 | 
						||
| 
								 | 
							
								  height: 500px;
							 | 
						||
| 
								 | 
							
								  /*background-color: #a7b0a4;*/
							 | 
						||
| 
								 | 
							
								}
							 |