From ca5f73084256cf15a8c52c4e70e0706afc689b7c Mon Sep 17 00:00:00 2001 From: surjendu104 Date: Fri, 13 Oct 2023 09:36:28 +0530 Subject: [PATCH] update : resolved code execution error and updated scss file --- index.html | 2 +- styles/style.css | 14 +- styles/style.css.map | 2 +- styles/style.scss | 380 +++++++++++++++++++++++-------------------- 4 files changed, 211 insertions(+), 187 deletions(-) diff --git a/index.html b/index.html index 9cdc941..3ab5f24 100644 --- a/index.html +++ b/index.html @@ -71,7 +71,7 @@

CODEy

- +
diff --git a/styles/style.css b/styles/style.css index 5d405b2..ff84780 100644 --- a/styles/style.css +++ b/styles/style.css @@ -25,7 +25,6 @@ body { /* border-radius: 30px; */ background-color: #00111c; padding-right: 20px; - } .header > div { display: flex; @@ -90,9 +89,10 @@ body { font-size: 16px; } -#name{ +#name { color: white; } + .home .IO-area .input .input-body > h2 { margin-top: 20px; text-align: center; @@ -123,13 +123,14 @@ body { border-radius: 0.4rem; } -.IO-area{ +.IO-area { display: flex; flex-direction: row; align-items: center; justify-content: space-between; padding: 0px 40px; } + .run { display: block; margin: 0 auto 0 auto; @@ -138,7 +139,9 @@ body { border-radius: 8px; font-size: 15px; padding: 10px; + cursor: pointer; } + .home .IO-area .output > h2 { margin-top: 20px; text-align: center; @@ -193,8 +196,9 @@ body { .output textarea::-webkit-scrollbar { width: 0.4rem; } - .output textarea::-webkit-scrollbar-thumb { background-color: rgb(239, 123, 142); border-radius: 0.4rem; -}/*# sourceMappingURL=style.css.map */ \ No newline at end of file +} + +/*# sourceMappingURL=style.css.map */ \ No newline at end of file diff --git a/styles/style.css.map b/styles/style.css.map index 90f2d2d..7446049 100644 --- a/styles/style.css.map +++ b/styles/style.css.map @@ -1 +1 @@ -{"version":3,"sources":["style.scss","style.css"],"names":[],"mappings":"AAAA;EACI,WAAA;EACA,YAAA;EAEA,sBAAA;EACA,qBAAA;EACA,uBAAA;ACAJ;;ADIA;EACI,0BAAA;EACA,oFAAA;ACDJ;;ADIA;EACI,WAAA;EACA,aAAA;EACA,aAAA;EACA,8BAAA;EACA,mBAAA;EACA,gBAAA;EACA,oBAAA;ACDJ;ADKI;EACI,aAAA;EACA,mBAAA;EACA,kBAAA;ACHR;ADKQ;EACI,YAAA;EACA,WAAA;EACA,kBAAA;ACHZ;ADMQ;EACI,eAAA;EACA,cAAA;EACA,iCAAA;ACJZ;ADQI;EACI,UAAA;EACA,aAAA;EACA,yBAAA;ACNR;ADQQ;EACI,YAAA;EACA,sBAAA;ACNZ;;ADWA;EACI,YAAA;EACA,YAAA;EAEA,mBAAA;EACA,gBAAA;EAEA,aAAA;EACA,2BAAA;EACA,mBAAA;EACA,cAAA;ACVJ;ADaI;EACI,YAAA;EACA,WAAA;EACA,YAAA;EACA,mBAAA;EACA,gBAAA;ACXR;ADcI;EACI,WAAA;EACA,YAAA;EACA,yBAAA;EACA,mBAAA;ACZR;ADeY;EACI,iBAAA;EACA,kBAAA;ACbhB;ADegB;EAEI,YAAA;EACA,YAAA;EACA,YAAA;EACA,WAAA;EACA,mBAAA;EACA,YAAA;EACA,aAAA;EACA,kBAAA;EACA,yBAAA;EACA,eAAA;ACdpB;ADmBgB;EACI,gBAAA;EACA,kBAAA;EACA,YAAA;EACA,uDAAA;EACA,eAAA;ACjBpB;ADoBgB;EACI,YAAA;EACA,aAAA;EACA,kBAAA;EACA,yBAAA;EACA,iBAAA;EACA,iBAAA;EACA,iBAAA;EACA,kBAAA;EACA,YAAA;EACA,6BAAA;EACA,cAAA;EACA,iBAAA;EACA,kBAAA;AClBpB;ADqBgB;EACI,aAAA;ACnBpB;ADsBgB;EAEI,oCAAA;EACA,qBAAA;ACrBpB;ADwBgB;EACI,cAAA;EACA,qBAAA;EACA,gCAAA;EACA,mBAAA;EACA,kBAAA;EACA,eAAA;EACA,aAAA;ACtBpB;AD4BY;EACI,gBAAA;EACA,kBAAA;EACA,YAAA;EACA,uDAAA;EACA,eAAA;AC1BhB;AD6BY;EACI,YAAA;EACA,aAAA;EACA,kBAAA;EACA,yBAAA;EACA,iBAAA;EACA,iBAAA;EACA,iBAAA;EACA,kBAAA;EACA,YAAA;EACA,6BAAA;EACA,cAAA;EACA,iBAAA;EACA,kBAAA;AC3BhB;;ADiCA;EAEI,yBAAA;EACA,aAAA;EACA,sBAAA;EACA,mBAAA;EACA,iCAAA;EACA,YAAA;EACA,UAAA;EACA,kBAAA;EACA,uBAAA;AC/BJ;ADkCQ;EACI,YAAA;EACA,eAAA;EACA,qBAAA;EACA,YAAA;EACA,gBAAA;AChCZ;ADsCQ;EACI,eAAA;EACA,YAAA;ACpCZ;;ADyCA;EACI,6BAAA;ACtCJ;;ADyCA;EACI,aAAA;ACtCJ;;ADyCA;EAEI,oCAAA;EACA,qBAAA;ACvCJ","file":"style.css"} \ No newline at end of file +{"version":3,"sources":["style.scss","style.css"],"names":[],"mappings":"AAAA;EACI,WAAA;EACA,YAAA;EACA,sBAAA;EACA,qBAAA;EACA,uBAAA;ACCJ;;ADEE;EACE,0BAAA;EACA,oFAAA;EACA,aAAA;EACA,WAAA;ACCJ;;ADEE;EACE,WAAA;EAEA,mBAAA;EACA,aAAA;EACA,8BAAA;EACA,mBAAA;EACA,gBAAA;EACA,oBAAA;EAEA,+BAAA;EACA,yBAAA;EACA,yBAAA;EACA,mBAAA;ACDJ;ADIM;EACE,aAAA;EACA,mBAAA;EACA,kBAAA;ACFR;ADKU;EACE,YAAA;EACA,WAAA;EACA,kBAAA;ACHZ;ADMU;EACE,eAAA;EACA,cAAA;EACA,iCAAA;ACJZ;ADSM;EACE,UAAA;EACA,aAAA;EACA,yBAAA;ACPR;ADSQ;EACE,YAAA;EACA,sBAAA;ACPV;;ADaE;EACE,kBAAA;EACA,WAAA;EAEA,yBAAA;EACA,gBAAA;EACA,aAAA;EACA,sBAAA;EAEA,iCAAA;EACA,yBAAA;EACA,cAAA;ACZJ;ADcI;EACE,YAAA;EAEA,iBAAA;EACA,YAAA;EAEA,yBAAA;EACA,gBAAA;ACdN;ADiBI;EACE,iBAAA;EACA,kBAAA;EACA,yBAAA;EAEA,yBAAA;AChBN;;ADoBE;EACE,YAAA;EACA,YAAA;EACA,YAAA;EACA,WAAA;EAEA,yBAAA;EACA,YAAA;EACA,aAAA;EACA,kBAAA;EACA,yBAAA;EACA,eAAA;AClBJ;;ADqBE;EACE,YAAA;AClBJ;;ADuBM;EACE,gBAAA;EACA,kBAAA;EACA,YAAA;EACA,uDAAA;EACA,eAAA;ACpBR;ADuBM;EACE,YAAA;EACA,aAAA;EACA,kBAAA;EACA,yBAAA;EACA,iBAAA;EACA,iBAAA;EACA,iBAAA;EACA,kBAAA;EACA,YAAA;EACA,6BAAA;EACA,cAAA;EACA,iBAAA;EACA,kBAAA;ACrBR;AD0BM;EACE,aAAA;ACxBR;AD2BM;EACE,oCAAA;EACA,qBAAA;ACzBR;;AD8BE;EACE,aAAA;EACA,mBAAA;EACA,mBAAA;EACA,8BAAA;EACA,iBAAA;AC3BJ;;AD8BE;EACE,cAAA;EACA,qBAAA;EACA,gCAAA;EACA,mBAAA;EACA,kBAAA;EACA,eAAA;EACA,aAAA;EACA,eAAA;AC3BJ;;AD+BI;EACE,gBAAA;EACA,kBAAA;EACA,YAAA;EACA,uDAAA;EACA,eAAA;AC5BN;AD+BI;EACE,YAAA;EACA,aAAA;EACA,kBAAA;EACA,yBAAA;EACA,iBAAA;EACA,iBAAA;EACA,iBAAA;EACA,kBAAA;EACA,YAAA;EACA,6BAAA;EACA,cAAA;EACA,iBAAA;EACA,kBAAA;AC7BN;;ADiCE;EACE,+BAAA;EACA,aAAA;EACA,sBAAA;EACA,mBAAA;EACA,iCAAA;EACA,YAAA;EACA,WAAA;EAEA,wBAAA;EACA,uBAAA;AC/BJ;ADiCI;EACE,kBAAA;EACA,eAAA;EACA,qBAAA;EACA,YAAA;EACA,gBAAA;AC/BN;ADkCI;EACE,eAAA;EACA,YAAA;AChCN;;ADoCE;EACE,6BAAA;EACA,WAAA;ACjCJ;;ADqCI;EACE,aAAA;AClCN;ADqCI;EACE,oCAAA;EACA,qBAAA;ACnCN","file":"style.css"} \ No newline at end of file diff --git a/styles/style.scss b/styles/style.scss index ef32df3..c806dc2 100644 --- a/styles/style.scss +++ b/styles/style.scss @@ -1,222 +1,242 @@ * { margin: 0px; padding: 0px; - // font-family: "Roboto", sans-serif; box-sizing: border-box; text-decoration: none; scroll-behavior: smooth; - -} - -body { + } + + body { background-size: 300% 300%; background-image: linear-gradient(45deg, rgb(147, 33, 147), pink, rgb(161, 44, 245)); -} - -.header { + height: 100vh; width: 100%; - padding: 1rem; + } + + .header { + width: 100%; + + /* padding: 1rem; */ display: flex; justify-content: space-between; align-items: center; position: sticky; transition: top 0.3s; - // top: 0%; - // z-index: 10; - - >div { + + /* border: 2px solid #000000; */ + /* border-radius: 30px; */ + background-color: #00111c; + padding-right: 20px; + + > { + div { display: flex; align-items: center; padding-left: 1rem; - - >img { + + > { + img { height: 2rem; width: 2rem; border-radius: 50%; - } - - >h2 { + } + + h2 { padding: 0.5rem; font-size: 200; - font-family: 'Roboto', sans-serif; + font-family: "Roboto", sans-serif; + } } - } - - >main { + } + + main { width: 70%; display: flex; justify-content: flex-end; - - >a { - margin: 1rem; - color: rgb(44, 44, 44); + + > a { + margin: 1rem; + color: rgb(44, 44, 44); } + } } -} - -.home { - width: 150vh; - height: 90vh; - // background-color: #494c5f; - border-radius: 1rem; + } + + .home { + /* width: 150vh; */ + height: 90%; + + /* border-radius: 1rem; */ overflow: hidden; - display: flex; - justify-content: flex-start; - align-items: center; + flex-direction: column; + + /* justify-content: flex-start; */ + /* align-items: center; */ margin: 0 auto; - // grid-template-columns: repeat(2, 1fr); - + .editor { - padding: 5px; - width: 75vh; - height: 90vh; - border-radius: 1rem; - overflow: hidden; + padding: 5px; + + /* width: 75vh; */ + height: 65vh; + + /* border-radius: 1rem; */ + overflow: hidden; } - + .IO-area { - width: 75vh; - height: 90vh; - background-color: #5c616d; - border-radius: 1rem; - - .input { - .input-navbar { - margin-left: auto; - margin-right: auto; - - >select { - - margin: 15px; - width: 140px; - height: 40px; - border: 0px; - border-radius: 10px; - color: white; - outline: none; - text-align: center; - background-color: #282a36; - font-size: 16px; - } - } - - .input-body { - >h2 { - margin-top: 20px; - text-align: center; - color: white; - font-family: "Lucida Console", "Courier New", monospace; - font-size: 30px; - } - - >textarea { - width: 500px; - height: 150px; - padding-left: 10px; - background-color: #282a36; - margin: 2vh 2.5vh; - font-size: 1.1rem; - border: 2px solid; - border-radius: 5px; - color: white; - font-family: 'JetBrains Mono'; - display: block; - margin-left: auto; - margin-right: auto; - } - - textarea::-webkit-scrollbar { - width: .4rem; - } - - textarea::-webkit-scrollbar-thumb { - - background-color: rgb(239, 123, 142); - border-radius: .4rem; - } - - >button { - display: block; - margin: 0 auto 0 auto; - background-color: rgb(8, 238, 8); - border-color: green; - border-radius: 8px; - font-size: 15px; - padding: 10px; - } - } - } - - .output { - >h2 { - margin-top: 20px; - text-align: center; - color: white; - font-family: "Lucida Console", "Courier New", monospace; - font-size: 30px; - } - - >textarea { - width: 500px; - height: 200px; - padding-left: 10px; - background-color: #282a36; - margin: 2vh 2.5vh; - font-size: 1.1rem; - border: 2px solid; - border-radius: 5px; - color: white; - font-family: 'JetBrains Mono'; - display: block; - margin-left: auto; - margin-right: auto; - } - } + /* width: 75vh; */ + /* height: 90vh; */ + background-color: #5c616d; + + /* border-radius: 1rem; */ + } + } + + .input-navbar > select { + margin: 15px; + width: 140px; + height: 40px; + border: 0px; + + /* border-radius: 10px; */ + color: white; + outline: none; + text-align: center; + background-color: #282a36; + font-size: 16px; + } + + #name { + color: white; + } + + .home .IO-area .input .input-body { + > { + h2 { + margin-top: 20px; + text-align: center; + color: white; + font-family: "Lucida Console", "Courier New", monospace; + font-size: 30px; + } + + textarea { + width: 500px; + height: 150px; + padding-left: 10px; + background-color: #282a36; + margin: 2vh 2.5vh; + font-size: 1.1rem; + border: 2px solid; + border-radius: 5px; + color: white; + font-family: "JetBrains Mono"; + display: block; + margin-left: auto; + margin-right: auto; + } + } + + textarea { + &::-webkit-scrollbar { + width: 0.4rem; + } + + &::-webkit-scrollbar-thumb { + background-color: rgb(239, 123, 142); + border-radius: 0.4rem; + } + } + } + + .IO-area { + display: flex; + flex-direction: row; + align-items: center; + justify-content: space-between; + padding: 0px 40px; + } + + .run { + display: block; + margin: 0 auto 0 auto; + background-color: rgb(8, 238, 8); + border-color: green; + border-radius: 8px; + font-size: 15px; + padding: 10px; + cursor: pointer; + } + + .home .IO-area .output > { + h2 { + margin-top: 20px; + text-align: center; + color: white; + font-family: "Lucida Console", "Courier New", monospace; + font-size: 30px; } -} - -.footer { - // margin: auto; - margin: 5px auto 5px auto; + + textarea { + width: 500px; + height: 150px; + padding-left: 10px; + background-color: #282a36; + margin: 2vh 2.5vh; + font-size: 1.1rem; + border: 2px solid; + border-radius: 5px; + color: white; + font-family: "JetBrains Mono"; + display: block; + margin-left: auto; + margin-right: auto; + } + } + + .footer { + /* margin: 5px auto 5px auto; */ display: flex; flex-direction: column; align-items: center; background-color: rgb(57, 51, 51); - height: 5rem; - width: 60%; - border-radius: 5px; + height: 100%; + width: 100%; + + /* border-radius: 5px; */ justify-content: center; - - .row { - >a { - margin: 10px; - font-size: 20px; - text-decoration: none; - color: white; - transition: 0.5s; - } - + + .row > a { + /* margin: 10px; */ + font-size: 20px; + text-decoration: none; + color: white; + transition: 0.5s; } - - .last { - >p { - margin-top: 5px; - color: white; - } + + .last > p { + margin-top: 5px; + color: white; + } + } + + .editor { + font-family: "JetBrains Mono"; + width: 100%; + } + + .output textarea { + &::-webkit-scrollbar { + width: 0.4rem; + } + + &::-webkit-scrollbar-thumb { + background-color: rgb(239, 123, 142); + border-radius: 0.4rem; } -} - -.editor { - font-family: 'JetBrains Mono'; -} - -.output textarea::-webkit-scrollbar { - width: .4rem; -} - -.output textarea::-webkit-scrollbar-thumb { - - background-color: rgb(239, 123, 142); - border-radius: .4rem; -} \ No newline at end of file + } + + /*# sourceMappingURL=style.css.map */ + \ No newline at end of file