You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
1 lines
14 KiB
1 lines
14 KiB
{"version":3,"sourceRoot":"","sources":["../../_sass/main.scss"],"names":[],"mappings":"AAkBA;AAEA;EACI;;;AAGJ;EACI;EACA;EACA;EACA;EACA,kBArBO;;;AAwBX;EACI;EACA;;;AAGJ;EACI;EACA;;;AAGJ;EACI;;;AAGJ;EACI;;;AAGJ;EACI;EACA;;;AAGJ;EACI;EACA;EACA;;;AAGJ;EACI;;;AAGJ;EACI,YAnDiB;;;AAsDrB;EACI;;;AAGJ;EACI;EACA;EACA;;;AAGJ;EACI,kBAzEW;;;AA4Ef;EACI,kBAjFS;;;AAoFb;EACI;EACA,OArFI;;;AAwFR;EACI;;;AAGJ;EACE;;;AAGF;EACI;EACA;EACA;;;AAIJ;EACI;EACA;;;AAIJ;AAEA;EACI;EACA;EAEA;EACA;EAEA;EACA;EAEA;EACA,kBAtHO;EAuHP;;AAEA;EACI;;AAGJ;EACI;EACA;EACA;EACA;EAEA;EACA;EAEA;EACA;EACA;;AAEA;EACI,aAlJL;EAmJK;EAEA;EACA;EAEA;;AAGJ;EACI;;AAGJ;EACI;EACA;EACA;EACA;EAEA,kBA9JD;EAgKC;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EAEA;EACA;;AAKR;EACI;;AAGJ;EACI;;;AAKZ;EACE,kBA5La;EA6Lb,OA5LS;;;AA+LX;EACI;;;AAGJ;AAEA;EACI;EACA;;;AAGJ;EACI;EACA;EACA;EAEA;EACA;;AAEA;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EAEA;EACA,OA/NG;EAgOH;EACA;EAEA;;;AAKR;EACI;IAAO;IAA4B;;EACnC;IAAK;IAA0B;;;AAGnC;AAEA;EACI;EACA;EACA;EACA;EAEA;EACA;EACA;EAEA;EACA;EACA;EAEA;;AAEA;EACI;EACA;EACA;EACA;EAEA;EACA;EACA;;AAGA;EACI;EACA;EACA;EACA,OA9QD;;AAiRH;EACI;EACA;EACA;EACA;;;AAKZ;AAEA;EACI;EACA;EACA;EACA;EAEA;EACA;EAEA,kBArSO;;AAuSP;EACI;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;;AAGJ;EACI;EACA;;AAGJ;EACI;EACA;;;AAIR;EACI;EACA;;;AAGJ;EACI;EACA;;AAEA;EACI;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;EAEA;;AAEA;EACI;EAEA;EACA;;AAGJ;EACI;EACA;EACA;EAIA;EACA;EACA;EACA;;AAEA;EACI;EAEA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;;AAGJ;EACI;EACA;EACA;;AAGJ;EACI;;AAGJ;EACI;EACA;EAEA;EAEA;EACA,OA1YT;EA2YS;EACA;;AAGJ;EACI;;AAGJ;EACI;;AAIR;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAMZ;EACI;;AAGJ;EACI;EACA;;AAEA;EACI;;AAEA;EACI;;;AAMhB;EACI,kBAlcO;;;AAscX;EACI;;AAEA;EACI;EACA;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;EAEA;EACA;;;AAIR;EACI;EACA;EACA;;AAEA;EACI;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;EAEA;EACA;;;AAIR;EACI;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;EAEA;EACA;EACA;;AAGJ;EACI;EACA;;AAGJ;EACI;;AAGJ;EACI;;AAGJ;EACI;;AAGJ;EACI;;AAGJ;EACC;;;AAKL;AACA;EACI;EACA;EACA;EACA;EACA,kBAljBS;EAmjBT,OA9iBO;EAgjBP;;AAEA;EACI;EACA;EACA;EACA;EAEA;EACA;EACA;;AAGA;EACI;EACA;EACA;;AAGJ;EACI,OAnkBD;EAokBC;EACA;;AAGJ;EACI;EACA;EACA;EACA;EACA,kBAnlBC;EAolBD;;AAGJ;EACI;;AAGJ;EACI;;AAGJ;EACI;;AAIR;EACI;EACA;EACA;EACA,OAlmBG;;;AAsmBX;EACI;EACA","sourcesContent":["\n$font: 'Montserrat', sans-serif;\n\n$illiniblue: #13294B;\n$blue1: #0455A4;\n$blue2: #1F4096;\n \n$illiniorange: #FF5F0F;\n$neutral1: #E8E9EA;\n$neutral2: #A5A8AA;\n$neutral3: #5E6669;\n\n\n$font-regular-color: black;\n$font-light-color: #1A1A1A;\n$font-lighter-color: #525252;\n\n\n/** Element Setup **/\n\nhtml {\n overflow-x: hidden;\n}\n\nhtml, body {\n width: 100%;\n height: 100%;\n margin: 0;\n padding: 0;\n background-color: $neutral1;\n}\n\nbody {\n display: flex;\n flex-direction: column;\n}\n\nh1, h2, h3, h4, h5, h6, a, li, span, p {\n font-family: 'Montserrat', sans-serif;\n z-index: 2;\n}\n\nh1 {\n font-weight: 800;\n}\n\nh2 {\n font-weight: 600;\n}\n\nh3 {\n font-weight: 600;\n text-decoration: underline;\n}\n\nh4 {\n font-weight: 400;\n font-style: italic;\n text-decoration: underline;\n}\n\nh5, h6 {\n font-variant: small-caps;\n}\n\nh6 {\n font-color: $font-lighter-color;\n}\n\nsvg {\n pointer-events: none;\n}\n\n.separator {\n width: 100%;\n height: 0.5em;\n z-index: 5;\n}\n\n.orange {\n background-color: $illiniorange;\n}\n\n.blue {\n background-color: $illiniblue;\n}\n\na {\n font-weight: 400;\n color: $blue1;\n}\n\na, a:hover, a:visited, a:active {\n text-decoration: none;\n}\n\n.clearScroll {\n scrollbar-width: none;\n}\n\n.clearScroll::-webkit-scrollbar {\n width: 10px;\n height: 5px;\n background-color: rgba(0,0,0,0.0);\n\n}\n\n.clearScroll::-webkit-scrollbar-thumb {\n background: rgba(0,0,0,0.15);\n border-radius: 50px;\n}\n\n\n/* Navigation */\n\nnav {\n position: sticky;\n top: 0;\n\n margin: 0;\n padding: 0;\n\n width: 100%;\n height: 4em;\n\n z-index: 10;\n background-color: $neutral1;\n box-shadow: 0 0.25rem 0.25rem rgba(0,0,0,0.5); \n\n a, a:hover, a:visited, a:active {\n color: inherit;\n }\n\n ul {\n width: 98%;\n margin: 0 auto 0 auto;\n padding: 0;\n height: 3.5em;\n\n display: flex;\n justify-content: space-between;\n\n overflow-x: auto;\n overflow-y: hidden;\n white-space: nowrap;\n\n #logo {\n font-family: $font;\n font-weight: 400;\n\n font-size: 1.5em;\n padding: 0.55em;\n\n float: left;\n }\n\n #navItems {\n margin-left: 3em;\n }\n\n li {\n width: 10em;\n height: 100%;\n display: inline-block;\n font-size: 1em;\n\n background-color: $neutral1;\n\n text-align: center;\n list-style-type: none;\n cursor: pointer;\n transition: background-color ease-in-out 0.1s;\n\n a {\n display: inline-block;\n padding: 1.1em 0 1.1em 0;\n width: 100%;\n\n font-weight: 400;\n font-variant: normal;\n }\n\n }\n\n li:hover {\n background-color: darken($neutral1, 5%);\n }\n\n li:active {\n background-color: darken($neutral1, 10%);\n }\n }\n}\n\n.current {\n background-color: $illiniorange;\n color: $neutral1;\n}\n\n.current:hover {\n background-color: darken($illiniorange, 5%);\n}\n\n/* Slideshow */\n\n#slideshowContainer {\n width: 100%;\n height: 30em;\n}\n\n#slideshow {\n position: relative;\n top: 0;\n left: 0;\n\n width: 100%;\n height: 30em;\n\n img {\n position: absolute;\n width: 100%;\n height: 100%;\n object-fit: cover;\n }\n\n span {\n position: absolute;\n top: 1em;\n right: 2%;\n\n background-color: rgba(0,0,0,0.8);\n color: $neutral1;\n font-weight: 200;\n z-order: 10;\n\n padding: 0.5em;\n }\n\n}\n\n@keyframes slideUp {\n from { transform: translateY(2em); opacity: 0}\n to { transform: translateY(0); opacity: 1}\n}\n\n/* Top Card */\n\n.topCard {\n position: absolute;\n top: 20em;\n left: 0;\n right: 0;\n\n width: 20em;\n height: 19em;\n margin: 0 auto 0 auto;\n\n text-align: center;\n z-index: 5;\n animation: slideUp 0.5s;\n \n filter: drop-shadow(0.25em 0.3em 0.4em rgba(0,0,0,0.8));\n\n div {\n height: 100%;\n padding: 2em;\n clip-path: polygon(0 0, 100% 0, 100% 70%, 50% 100%, 0 70%); \n background-color: rgba($illiniblue, 0.8);\n\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n\n\n h1 {\n margin: 0;\n font-weight: 100;\n font-size: 3.8em;\n color: $neutral1;\n }\n\n p {\n margin: 0 auto 4.5em 0;\n font-weight: 400;\n font-size: 1em;\n color: darken($neutral1, 10%);\n }\n }\n}\n\n/* Content */\n\n.content {\n width: 100%;\n margin: 0 auto 0 auto;\n position: relative;\n flex-grow: 1;\n\n left: 0;\n right: 0;\n\n background-color: $neutral1;\n\n h1, h2, h3, h4, h5, h6, p, a, img {\n animation: slideUp 0.5s;\n }\n\n svg {\n position: absolute;\n width: 100%;\n height: 10em;\n fill: rgba($blue1, 0.1);\n left: 0;\n z-index: 1;\n }\n\n .upAccent {\n top: 0;\n transform: translateY(-10em);\n }\n\n .downAccent {\n bottom: 0;\n transform: translateY(10em);\n }\n}\n\n#bannerContent > h1 {\n padding: 1em 2em 0 2em;\n text-align: center;\n}\n\n#bannerContent {\n padding-top: 6em !important;\n background-color: rgba($blue1, 0.1);\n\n .downCircle {\n position: absolute;\n fill: rgba($blue1, 0.1);\n left: 0;\n }\n\n .item {\n width: 100%;\n min-height: 25em;\n padding-top: 5em;\n padding-bottom: 5em;\n\n position: relative;\n\n .itemScroll {\n overflow-x: auto;\n\n position: relative;\n z-index: 2;\n }\n\n .itemScroll .itemInner {\n width: 100%;\n min-width: 60em;\n padding: 2em 0 2em 0;\n\n\n\n display: flex;\n flex-direction: row;\n justify-content: space-evenly;\n align-items: center;\n\n .description {\n width: 40%;\n\n height: 100%;\n display: flex;\n flex-direction: column;\n justify-content: center;\n text-align: left;\n white-space: normal;\n\n h2 {\n width: 100%;\n margin: 0;\n font-size: 2em;\n }\n\n p {\n width: 100%;\n font-size: 1.2em;\n margin: 0.5em 0 0.5em 0;\n }\n\n p:last-child {\n text-align:right;\n }\n\n a {\n margin-right: 1em;\n padding: 0.8em;\n\n font-size: 0.8em;\n\n background-color: lighten($blue2, 20%);\n color: $neutral1;\n border-radius: 13px;\n transition: background-color ease-in-out 0.1s;\n }\n\n a:hover {\n background-color: darken(lighten($blue2, 20%), 10%);\n }\n\n a:active {\n background-color: darken(lighten($blue2, 20%), 15%);\n }\n }\n\n .image {\n width: 20em;\n padding-bottom: 20em;\n position: relative;\n z-index: 20;\n }\n\n img {\n position: absolute;\n width: 100%;\n height: 100%;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n object-fit: cover;\n border-radius: 50%;\n border: 5px solid rgba($blue2, 30%);\n }\n\n }\n }\n\n .item:nth-child(2) .upAccent {\n transform: translateY(0);\n }\n\n .item:nth-child(odd) {\n padding-bottom: 2em;\n padding-top: 2em;\n\n .itemScroll {\n direction: rtl;\n\n h2, p {\n direction: ltr;\n }\n }\n }\n}\n\n#bannerContent > div:nth-child(even) {\n background-color: $neutral1;\n}\n\n\n#postContent {\n width: 100%;\n\n svg {\n width: 100%;\n height: 15em;\n top: 0;\n transform: translateY(0);\n z-index: 0;\n }\n\n > div {\n position: relative;\n max-width: 85em;\n padding: 0 4em 0 4em;\n margin: 4em auto 4em auto;\n z-index: 1;\n }\n\n img {\n display: block;\n margin: auto;\n padding: 1em;\n width:85%;\n\n background-color: rgba(0, 0, 0, 0.05);\n border-radius: 10px;\n }\n}\n\n.nonItems {\n position: relative;\n width: 100%;\n padding: 2em 0 2em 0;\n\n > div {\n margin: auto;\n padding: 0 4em 0 4em;\n max-width: 90em;\n }\n\n img {\n display: block;\n margin: auto;\n padding: 1em;\n width:85%;\n\n background-color: rgba(0, 0, 0, 0.05);\n border-radius: 10px;\n }\n}\n\n.smallItemList {\n display: flex;\n flex-wrap: wrap;\n justify-content: left;\n flex-grow: 1;\n align-items: center;\n\n h2, h3, h4, h5, h6 {\n font-size: 1.2em;\n font-weight: 600;\n text-decoration: none;\n margin: 0.5em 0 0 0;\n\n padding: 1em 0.5em 0em 0.5em;\n border-top: 3px solid rgba(0, 0, 0, 0.1);\n width: 100%;\n }\n\n p {\n margin: 0;\n padding: 0.5em;\n }\n\n .textCol {\n width: 60%;\n }\n \n .imgCol {\n width: 30%;\n }\n\n .textColsmallerimg {\n width: 70%;\n }\n \n .imgColsmallerimg {\n width: 20%;\n }\n \n img {\n \twidth: 100%;\n } \n}\n\n\n/* Footer */\nfooter {\n position: relative;\n bottom: 0;\n width: 100%;\n height: 15em;\n background-color: $illiniblue;\n color: $neutral1;\n\n font-size: 0.8em;\n \n #footer {\n margin: 0 auto 0 auto;\n height: 11.5em;\n width: 90%;\n border-bottom: 1px solid $neutral1;\n\n display: flex;\n flex-flow: column;\n justify-content: center;\n\n \n div {\n display: flex;\n flex-flow: row wrap;\n justify-content: center;\n }\n\n p {\n color: $neutral2;\n width: 100%;\n text-align: center;\n }\n \n a {\n margin: 0 0.5em 0 0.5em;\n padding: 0.5em;\n border-radius: 3px;\n border: 1px solid $neutral1;\n background-color: $illiniblue;\n transition: background-color ease-in-out 0.3s;\n }\n\n a, a:visited {\n color: inherit;\n }\n\n a:hover {\n background-color: lighten($illiniblue, 10%);\n }\n\n a:active {\n background-color: lighten($illiniblue, 15%);\n }\n }\n\n #author {\n width: 90%;\n margin: 1em auto 1em auto;\n text-align: right;\n color: $neutral2;\n }\n}\n\n.centerHeading {\n text-align: center;\n margin-bottom: -1em;\n}\n"],"file":"styles.css"} |