From cee6c6581774593424ec35a8d30b1ba803be3fd0 Mon Sep 17 00:00:00 2001 From: Melisandre_64 Date: Thu, 26 Dec 2024 14:01:17 +0530 Subject: [PATCH] Update Style.css --- frontend/src/components/Style.css | 211 +++++++++++++++++++++++++++++- 1 file changed, 210 insertions(+), 1 deletion(-) diff --git a/frontend/src/components/Style.css b/frontend/src/components/Style.css index 7e113f90bd..1c6621f818 100644 --- a/frontend/src/components/Style.css +++ b/frontend/src/components/Style.css @@ -55,9 +55,19 @@ li.clickableUserDetails:hover { --cds-text-secondary: black; } -.inputSearch { +<<<<<<< Updated upstream +.inputSearch , .inputSearch ,.inputText { --cds-text-primary: black; /*width: 100%;*/ +======= +.inputText { + /* @extend .inputCommon; if using SCSS */ + width: 100%; +} + +.inputSearch { + /* @extend .inputCommon; */ +>>>>>>> Stashed changes width: 50%; --cds-text-secondary: black; --cds-icon-primary: black; @@ -87,17 +97,33 @@ button { border-radius: 2px; padding: 5px 10px; } +<<<<<<< Updated upstream .add_button { align-self: flex-start; display: flex; align-items: center; margin-top: 0.5rem; +======= + /* Creating common class between add_button and remove_button so the can use common properties */ +.buttonBase { + border: 1px solid; + display: flex; + align-items: center; +} + +.add_button { + /* @extend .buttonBase; */ +>>>>>>> Stashed changes color: rgb(0, 208, 255); border: 1px solid rgb(0, 208, 255); } .remove-btn { +<<<<<<< Updated upstream +======= + /* @extend .buttonBase; */ +>>>>>>> Stashed changes color: red; border: 1px solid red; } @@ -106,22 +132,39 @@ button { display: flex; justify-content: space-between; } +<<<<<<< Updated upstream .ruleBody { border: 0.5px solid #295785; border-radius: 5px; +======= + /* Creating or introducing a new common class (e.g., .commonBoundary) for use common properties od + rule.body and .gridBoundary */ +.commonBoundary { + border: 0.5px solid #295785; + border-radius: 5px; +} + +.ruleBody { + /* @extend .commonBoundary; */ +>>>>>>> Stashed changes margin: 2%; padding: 0.5%; } .gridBoundary { +<<<<<<< Updated upstream border: 0.5px solid #295785; border-radius: 5px; +======= + /* @extend .commonBoundary; */ +>>>>>>> Stashed changes padding: 1%; box-shadow: 4px 2px 4px #d3d3d3; margin-bottom: 1%; } +<<<<<<< Updated upstream .columnBoundary { border: 0.5px solid #295785; border-radius: 5px; @@ -130,6 +173,31 @@ button { width: 120%; } +======= + +/*Create a common class for these shared properties (e.g., .boundary) */ + +.boundary { + border-radius: 5px; + border: 0.5px solid #295785; + margin: 2%; + padding: 1%; +} + +.columnBoundary { + /* @extend .boundary; */ + width: 120%; +} + +.section { + + border-color: green; + border-radius: 3px; + margin: 0.5%; +} + + +>>>>>>> Stashed changes .inlineDiv { display: flex; margin-top: 2%; @@ -165,24 +233,41 @@ button { } .middleAlign { +<<<<<<< Updated upstream height: 100%; display: flex; +======= + +>>>>>>> Stashed changes align-items: center; justify-content: center; } .middleAlignHorizontal { +<<<<<<< Updated upstream display: flex; /* align-items: center; */ +======= + +>>>>>>> Stashed changes justify-content: center; } .middleAlignVertical { +<<<<<<< Updated upstream height: 100%; display: flex; +======= + +>>>>>>> Stashed changes align-items: center; /* justify-content: center; */ } .bottomAlign { +<<<<<<< Updated upstream +======= + /* @extend .flexCenter; */ + align-items: flex-end; +>>>>>>> Stashed changes height: 100%; display: flex; align-items: flex-end; @@ -252,20 +337,65 @@ button { width: 100%; } +<<<<<<< Updated upstream /* Results */ .inputText { --cds-text-primary: black; +======= +.resultPageContent { + /* @extend .contentMargins; */ + margin-right: 0%; /* Override if needed */ +} + +.searchLabNumber, +.sampleInfo { + /* @extend .contentMargins; */ + margin-left: 0%; /* Overrides */ + margin-right: 0%; +} + + +/* Use common class for Shared properties */ +.inputCommon { + --cds-text-primary: black; + --cds-text-secondary: black; +} + +.inputText { + /* @extend .inputCommon; */ +>>>>>>> Stashed changes width: 100%; --cds-text-secondary: black; /* margin-top: 0.1%; */ } .inputText2 { +<<<<<<< Updated upstream +======= + /* @extend .inputCommon; */ + width: 380px; + padding-left: 1%; +} + + +.inputCommon { +>>>>>>> Stashed changes --cds-text-primary: black; width: 380px; --cds-text-secondary: black; +<<<<<<< Updated upstream padding-left: 1%; /* margin-top: 0.1%; */ +======= +} + +.inputSelect, +.inputSelect2, +.selectSampleType { + /* @extend .inputCommon; */ + --cds-text-primary: black; + --cds-text-secondary: black; +>>>>>>> Stashed changes } .inputSelect { @@ -305,6 +435,30 @@ button { padding: 5px 10px; } +<<<<<<< Updated upstream +======= +/* We can Cerate a common class for add and remove buttons */ +.buttonBase { + background: none; + outline: none; + cursor: pointer; + font-weight: 500; + border-radius: 2px; + padding: 5px 10px; +} + +.add_button, +.remove-btn { + /* @extend .buttonBase; */ + background: none; + outline: none; + cursor: pointer; + font-weight: 500; + border-radius: 2px; + padding: 5px 10px; +} + +>>>>>>> Stashed changes .add_button { align-self: flex-start; display: flex; @@ -331,13 +485,29 @@ button { padding: 0.5%; } +<<<<<<< Updated upstream .inlineDiv { +======= +/* Create ac common class for inlineDiv and result */ +.flexSpaceBetween { +>>>>>>> Stashed changes display: flex; margin-top: 2%; margin-bottom: 3%; margin-left: 1%; } +<<<<<<< Updated upstream +======= +.inlineDiv, +.results { + /* @extend .flexSpaceBetween; */ + display: flex; + justify-content: space-between; +} + + +>>>>>>> Stashed changes .section { border: 0.5px solid green; border-radius: 3px; @@ -380,6 +550,7 @@ button { text-align: justify; padding: 0.6875rem 1rem; } +<<<<<<< Updated upstream .error { font-size: 12px; @@ -391,6 +562,26 @@ button { content: " "; font-size: 10px; } */ +======= +/* Creating a common class for errorMessage and error */ +.errorBase { + font-size: 12px; + color: red; + margin-bottom: 0.25rem; +} + +.errorMessage { + /* @extend .errorBase; */ + width: 150px; + margin-top: 0.25rem; +} + +.error { + /* @extend .errorBase; */ + font-size: 12px; + color: red; + margin-bottom: 0.25rem; +>>>>>>> Stashed changes } .second-row { @@ -471,8 +662,26 @@ button { width: 100%; } +<<<<<<< Updated upstream .custom-sidenav-button { pointer-events: auto; +======= +.custom-sidenav-button, +.cds--side-nav__link-text { + /* @extend .sidenavButtonBase; */ + box-sizing: border-box; + margin: 0; + border: 0; + cursor: pointer; + display: flex; + align-items: center; + background-color: var(--cds-background-hover, #072655); + color: var(--cds-text-secondary, #ffffff); + transition: color 110ms, background-color 110ms, outline 110ms; + -webkit-user-select: none; + user-select: none; + width: 100%; +>>>>>>> Stashed changes } .custom-sidenav-button:hover {