239 lines
		
	
	
		
			4.6 KiB
		
	
	
	
		
			CSS
		
	
	
	
	
	
			
		
		
	
	
			239 lines
		
	
	
		
			4.6 KiB
		
	
	
	
		
			CSS
		
	
	
	
	
	
/* src/styles.css */
 | 
						|
.configureMacroDiv {
 | 
						|
  display: grid;
 | 
						|
  grid-template-rows: 1fr;
 | 
						|
  min-width: 12rem;
 | 
						|
}
 | 
						|
.configureMacroDivItem {
 | 
						|
  display: flex;
 | 
						|
  align-content: center;
 | 
						|
  justify-content: space-between;
 | 
						|
  margin-bottom: 10px;
 | 
						|
}
 | 
						|
.configureMacroDivItemButton {
 | 
						|
  display: flex;
 | 
						|
  align-content: center;
 | 
						|
  justify-content: center;
 | 
						|
  margin-bottom: 10px;
 | 
						|
}
 | 
						|
.macroContainer {
 | 
						|
  display: grid;
 | 
						|
  grid-template-rows: repeat(auto-fill, 120px);
 | 
						|
  grid-gap: 40px;
 | 
						|
  overflow-y: auto;
 | 
						|
  max-height: 30em;
 | 
						|
  padding: 2em;
 | 
						|
}
 | 
						|
@media screen and (max-width: 540px) {
 | 
						|
  .macroContainer1 {
 | 
						|
    grid-template-columns: repeat(1, 1fr);
 | 
						|
  }
 | 
						|
  .macroContainer2 {
 | 
						|
    grid-template-columns: repeat(1, 1fr);
 | 
						|
  }
 | 
						|
  .macroContainer3 {
 | 
						|
    grid-template-columns: repeat(1, 1fr);
 | 
						|
  }
 | 
						|
  .wideInputPromptInputEl {
 | 
						|
    width: 20rem;
 | 
						|
    max-width: 100%;
 | 
						|
    height: 3rem;
 | 
						|
  }
 | 
						|
}
 | 
						|
@media screen and (max-width: 540px) and (max-width: 780px) {
 | 
						|
  .macroContainer1 {
 | 
						|
    grid-template-columns: repeat(1, 1fr);
 | 
						|
  }
 | 
						|
  .macroContainer2 {
 | 
						|
    grid-template-columns: repeat(2, 1fr);
 | 
						|
  }
 | 
						|
  .macroContainer3 {
 | 
						|
    grid-template-columns: repeat(2, 1fr);
 | 
						|
  }
 | 
						|
  .wideInputPromptInputEl {
 | 
						|
    width: 30rem;
 | 
						|
    max-width: 100%;
 | 
						|
    height: 20rem;
 | 
						|
  }
 | 
						|
}
 | 
						|
@media screen and (min-width: 781px) {
 | 
						|
  .macroContainer1 {
 | 
						|
    grid-template-columns: repeat(1, 1fr);
 | 
						|
  }
 | 
						|
  .macroContainer2 {
 | 
						|
    grid-template-columns: repeat(2, 1fr);
 | 
						|
  }
 | 
						|
  .macroContainer3 {
 | 
						|
    grid-template-columns: repeat(2, 1fr);
 | 
						|
  }
 | 
						|
  .wideInputPromptInputEl {
 | 
						|
    width: 40rem;
 | 
						|
    max-width: 100%;
 | 
						|
    height: 20rem;
 | 
						|
  }
 | 
						|
}
 | 
						|
.addMacroBarContainer {
 | 
						|
  display: flex;
 | 
						|
  align-content: center;
 | 
						|
  justify-content: space-around;
 | 
						|
  margin-top: 20px;
 | 
						|
}
 | 
						|
.captureToActiveFileContainer {
 | 
						|
  display: flex;
 | 
						|
  align-content: center;
 | 
						|
  justify-content: space-between;
 | 
						|
  margin-bottom: 10px;
 | 
						|
}
 | 
						|
.choiceNameHeader {
 | 
						|
  text-align: center;
 | 
						|
}
 | 
						|
.choiceNameHeader:hover {
 | 
						|
  cursor: pointer;
 | 
						|
}
 | 
						|
.folderInputContainer {
 | 
						|
  display: flex;
 | 
						|
  align-content: center;
 | 
						|
  justify-content: space-between;
 | 
						|
  margin-bottom: 8px;
 | 
						|
  gap: 4px;
 | 
						|
}
 | 
						|
.selectMacroDropdownContainer {
 | 
						|
  display: flex;
 | 
						|
  align-content: center;
 | 
						|
  justify-content: center;
 | 
						|
}
 | 
						|
.quickAddModal .modal {
 | 
						|
  min-width: 35%;
 | 
						|
  overflow-y: auto;
 | 
						|
  max-height: 70%;
 | 
						|
}
 | 
						|
.checkboxRowContainer {
 | 
						|
  margin: 30px 0px;
 | 
						|
  display: grid;
 | 
						|
  grid-template-rows: auto;
 | 
						|
  align-content: center;
 | 
						|
  gap: 5px;
 | 
						|
}
 | 
						|
.checkboxRow {
 | 
						|
  display: flex;
 | 
						|
  justify-content: space-between;
 | 
						|
  align-content: center;
 | 
						|
}
 | 
						|
.checkboxRow .checkbox-container {
 | 
						|
  flex-shrink: 0;
 | 
						|
}
 | 
						|
.checkboxRow span {
 | 
						|
  font-size: 16px;
 | 
						|
  word-break: break-all;
 | 
						|
}
 | 
						|
.submitButtonContainer {
 | 
						|
  display: flex;
 | 
						|
  align-content: center;
 | 
						|
  justify-content: center;
 | 
						|
}
 | 
						|
.chooseFolderWhenCreatingNoteContainer {
 | 
						|
  display: flex;
 | 
						|
  align-content: center;
 | 
						|
  justify-content: space-between;
 | 
						|
  margin-bottom: 10px;
 | 
						|
}
 | 
						|
.chooseFolderFromSubfolderContainer {
 | 
						|
  margin: 20px 0 0 0;
 | 
						|
}
 | 
						|
.clickable:hover {
 | 
						|
  cursor: pointer;
 | 
						|
}
 | 
						|
.quickAddCommandListItem {
 | 
						|
  display: flex;
 | 
						|
  flex: 1 1 auto;
 | 
						|
  align-items: center;
 | 
						|
  justify-content: space-between;
 | 
						|
}
 | 
						|
.quickCommandContainer {
 | 
						|
  display: flex;
 | 
						|
  justify-content: flex-end;
 | 
						|
  align-content: center;
 | 
						|
  margin-bottom: 1em;
 | 
						|
  gap: 4px;
 | 
						|
}
 | 
						|
.yesNoPromptButtonContainer {
 | 
						|
  display: flex;
 | 
						|
  align-items: center;
 | 
						|
  justify-content: space-around;
 | 
						|
  margin-top: 2rem;
 | 
						|
}
 | 
						|
.yesNoPromptParagraph {
 | 
						|
  text-align: center;
 | 
						|
}
 | 
						|
.qaFileSuggestionItem {
 | 
						|
  display: flex;
 | 
						|
  flex-direction: column;
 | 
						|
  width: 100%;
 | 
						|
}
 | 
						|
.qaFileSuggestionItem .suggestion-main-text {
 | 
						|
  font-weight: bold;
 | 
						|
}
 | 
						|
.qaFileSuggestionItem .suggestion-sub-text {
 | 
						|
  font-style: italic;
 | 
						|
}
 | 
						|
.choiceListItem {
 | 
						|
  display: flex;
 | 
						|
  font-size: 16px;
 | 
						|
  align-items: center;
 | 
						|
  margin: 12px 0 0 0;
 | 
						|
  transition: 1000ms ease-in-out;
 | 
						|
}
 | 
						|
.choiceListItemName {
 | 
						|
  flex: 1 0 0;
 | 
						|
}
 | 
						|
.choiceListItemName p {
 | 
						|
  margin: 0;
 | 
						|
  display: inline;
 | 
						|
}
 | 
						|
.quickadd-choice-suggestion p {
 | 
						|
  margin: 0;
 | 
						|
}
 | 
						|
.macroDropdownContainer {
 | 
						|
  display: flex;
 | 
						|
  align-content: center;
 | 
						|
  justify-content: center;
 | 
						|
  margin-bottom: 10px;
 | 
						|
  gap: 10px;
 | 
						|
}
 | 
						|
.macro-choice-buttonsContainer {
 | 
						|
  display: flex;
 | 
						|
  flex-direction: row;
 | 
						|
  justify-content: center;
 | 
						|
  align-items: center;
 | 
						|
  gap: 10px;
 | 
						|
}
 | 
						|
@media only screen and (max-width: 600px) {
 | 
						|
  .macroDropdownContainer {
 | 
						|
    flex-direction: column;
 | 
						|
    align-items: center;
 | 
						|
  }
 | 
						|
  .macroDropdownContainer .macro-choice-buttonsContainer {
 | 
						|
    gap: 20px;
 | 
						|
  }
 | 
						|
}
 | 
						|
.quickadd-update-modal-container {
 | 
						|
  display: flex;
 | 
						|
  flex-direction: column;
 | 
						|
  align-items: center;
 | 
						|
  justify-content: center;
 | 
						|
}
 | 
						|
.quickadd-update-modal {
 | 
						|
  min-width: 35%;
 | 
						|
  max-height: 70%;
 | 
						|
}
 | 
						|
.quickadd-update-modal img {
 | 
						|
  width: 100%;
 | 
						|
  height: auto;
 | 
						|
  margin: 5px;
 | 
						|
}
 | 
						|
.quickadd-bmac-container {
 | 
						|
  display: flex;
 | 
						|
  justify-content: center;
 | 
						|
  align-items: center;
 | 
						|
}
 |