add images back and break bottom cards

closebracket-solution
Kieran Coldron 2021-08-30 20:22:23 +01:00
parent 2790448e1f
commit cd23f778db
16 changed files with 116 additions and 1016 deletions

View File

@ -0,0 +1 @@
[{"fe4e1305":"1"},{"cachedAt":1630279364994,"type":"2"},"json"]

View File

@ -0,0 +1 @@
[{"login":"sbrl","id":9929737,"node_id":"MDQ6VXNlcjk5Mjk3Mzc=","avatar_url":"https://avatars.githubusercontent.com/u/9929737?v=4","gravatar_id":"","url":"https://api.github.com/users/sbrl","html_url":"https://github.com/sbrl","followers_url":"https://api.github.com/users/sbrl/followers","following_url":"https://api.github.com/users/sbrl/following{/other_user}","gists_url":"https://api.github.com/users/sbrl/gists{/gist_id}","starred_url":"https://api.github.com/users/sbrl/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/sbrl/subscriptions","organizations_url":"https://api.github.com/users/sbrl/orgs","repos_url":"https://api.github.com/users/sbrl/repos","events_url":"https://api.github.com/users/sbrl/events{/privacy}","received_events_url":"https://api.github.com/users/sbrl/received_events","type":"User","site_admin":false,"contributions":29},{"login":"Epictek","id":1466270,"node_id":"MDQ6VXNlcjE0NjYyNzA=","avatar_url":"https://avatars.githubusercontent.com/u/1466270?v=4","gravatar_id":"","url":"https://api.github.com/users/Epictek","html_url":"https://github.com/Epictek","followers_url":"https://api.github.com/users/Epictek/followers","following_url":"https://api.github.com/users/Epictek/following{/other_user}","gists_url":"https://api.github.com/users/Epictek/gists{/gist_id}","starred_url":"https://api.github.com/users/Epictek/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/Epictek/subscriptions","organizations_url":"https://api.github.com/users/Epictek/orgs","repos_url":"https://api.github.com/users/Epictek/repos","events_url":"https://api.github.com/users/Epictek/events{/privacy}","received_events_url":"https://api.github.com/users/Epictek/received_events","type":"User","site_admin":false,"contributions":22},{"login":"dependabot[bot]","id":49699333,"node_id":"MDM6Qm90NDk2OTkzMzM=","avatar_url":"https://avatars.githubusercontent.com/in/29110?v=4","gravatar_id":"","url":"https://api.github.com/users/dependabot%5Bbot%5D","html_url":"https://github.com/apps/dependabot","followers_url":"https://api.github.com/users/dependabot%5Bbot%5D/followers","following_url":"https://api.github.com/users/dependabot%5Bbot%5D/following{/other_user}","gists_url":"https://api.github.com/users/dependabot%5Bbot%5D/gists{/gist_id}","starred_url":"https://api.github.com/users/dependabot%5Bbot%5D/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/dependabot%5Bbot%5D/subscriptions","organizations_url":"https://api.github.com/users/dependabot%5Bbot%5D/orgs","repos_url":"https://api.github.com/users/dependabot%5Bbot%5D/repos","events_url":"https://api.github.com/users/dependabot%5Bbot%5D/events{/privacy}","received_events_url":"https://api.github.com/users/dependabot%5Bbot%5D/received_events","type":"Bot","site_admin":false,"contributions":3}]

View File

@ -10,6 +10,7 @@ module.exports = config => {
config.addPassthroughCopy('internal/css') config.addPassthroughCopy('internal/css')
config.addPassthroughCopy('internal/js') config.addPassthroughCopy('internal/js')
config.addPassthroughCopy('internal/img') config.addPassthroughCopy('internal/img')
config.addPassthroughCopy('internal/img')
config.addPassthroughCopy('favicon.png') config.addPassthroughCopy('favicon.png')
config.addPassthroughCopy('favicon.svg') config.addPassthroughCopy('favicon.svg')

26
css/tailwind.scss Normal file
View File

@ -0,0 +1,26 @@
@tailwind base;
@tailwind components;
@tailwind utilities;
@layer components {
.btn-cta {
@apply inline-block pb-1 pt-2 pl-2 pr-2 mr-2 bg-primary hover:ring-white rounded ring-2 ring-black text-white;
}
.bg-project {
background-image: url("/img/project-bg.png");
background-size: 70vw;
background-position: -30vw;
background-repeat: no-repeat;
}
.bg-alumni {
background-image: url("/img/alumni-bg.jpg");
background-size: 70vw;
background-position: center;
background-repeat: no-repeat;
}
.social-icons .icon-link:hover {
color: #fe6431;
}
}

View File

@ -1,923 +0,0 @@
@tailwind base;
@tailwind components;
@tailwind utilities;
@layer components {
.btn-cta {
@apply inline-block pb-1 pt-2 pl-2 pr-2 mr-2 bg-primary hover:ring-white rounded ring-2 ring-black text-white;
}
}
/* Non Tailwind CSS Below */
/*
.bg-secondary {
background:#525252
}
.bg-grey {
background:#4e5b71
}
.bg-white {
background:#F3F6FB
}
.bg-discord {
background: #5865F2;
}
.bg-project {
background-image: url("/assets/img/project-bg.png");
background-size: 70vw;
background-position: -30vw;
background-repeat: no-repeat;
}
.bg-alumni {
background-image: url("/assets/img/alumni-bg.jpg");
background-size: 70vw;
background-position: center;
background-repeat: no-repeat;
}
.color-primary {
color:#240d09
}
.color-secondary {
color:#fe6431
}
.color-grey {
color:#4e5b71
}
.color-white {
color:#F3F6FB
}
.font-base,
.font-heading {
font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,sans-serif
}
.box-block {
display:block
}
.box-inline-block {
display:inline-block
}
.box-flex {
display:flex
}
.box-grid {
display:grid
}
.box-hidden {
display:none
}
.mt-300 {
margin-top:.8rem
}
.mt-400 {
margin-top:1rem
}
.mt-500 {
margin-top:1.25rem
}
.mt-600 {
margin-top:1.56rem
}
.mt-700 {
margin-top:1.95rem
}
.mt-800 {
margin-top:2.44rem
}
.mt-900 {
margin-top:3.05rem
}
.mt-1000 {
margin-top:3.81rem
}
.mt-1100 {
margin-top:4.76rem
}
.mb-300 {
margin-bottom:.8rem
}
.mb-400 {
margin-bottom:1rem
}
.mb-500 {
margin-bottom:1.25rem
}
.mb-600 {
margin-bottom:1.56rem
}
.mb-700 {
margin-bottom:1.95rem
}
.mb-800 {
margin-bottom:2.44rem
}
.mb-900 {
margin-bottom:3.05rem
}
.mb-1000 {
margin-bottom:3.81rem
}
.mb-1100 {
margin-bottom:4.76rem
}
.ml-300 {
margin-left:.8rem
}
.ml-400 {
margin-left:1rem
}
.ml-500 {
margin-left:1.25rem
}
.ml-600 {
margin-left:1.56rem
}
.ml-700 {
margin-left:1.95rem
}
.ml-800 {
margin-left:2.44rem
}
.ml-900 {
margin-left:3.05rem
}
.ml-1000 {
margin-left:3.81rem
}
.ml-1100 {
margin-left:4.76rem
}
.mr-300 {
margin-right:.8rem
}
.mr-400 {
margin-right:1rem
}
.mr-500 {
margin-right:1.25rem
}
.mr-600 {
margin-right:1.56rem
}
.mr-700 {
margin-right:1.95rem
}
.mr-800 {
margin-right:2.44rem
}
.mr-900 {
margin-right:3.05rem
}
.mr-1000 {
margin-right:3.81rem
}
.mr-1100 {
margin-right:4.76rem
}
.pt-300 {
padding-top:.8rem
}
.pt-400 {
padding-top:1rem
}
.pt-500 {
padding-top:1.25rem
}
.pt-600 {
padding-top:1.56rem
}
.pt-700 {
padding-top:1.95rem
}
.pt-800 {
padding-top:2.44rem
}
.pt-900 {
padding-top:3.05rem
}
.pt-1000 {
padding-top:3.81rem
}
.pt-1100 {
padding-top:4.76rem
}
.pb-300 {
padding-bottom:.8rem
}
.pb-400 {
padding-bottom:1rem
}
.pb-500 {
padding-bottom:1.25rem
}
.pb-600 {
padding-bottom:1.56rem
}
.pb-700 {
padding-bottom:1.95rem
}
.pb-800 {
padding-bottom:2.44rem
}
.pb-900 {
padding-bottom:3.05rem
}
.pb-1000 {
padding-bottom:3.81rem
}
.pb-1100 {
padding-bottom:4.76rem
}
.pl-300 {
padding-left:.8rem
}
.pl-400 {
padding-left:1rem
}
.pl-500 {
padding-left:1.25rem
}
.pl-600 {
padding-left:1.56rem
}
.pl-700 {
padding-left:1.95rem
}
.pl-800 {
padding-left:2.44rem
}
.pl-900 {
padding-left:3.05rem
}
.pl-1000 {
padding-left:3.81rem
}
.pl-1100 {
padding-left:4.76rem
}
.pr-300 {
padding-right:.8rem
}
.pr-400 {
padding-right:1rem
}
.pr-500 {
padding-right:1.25rem
}
.pr-600 {
padding-right:1.56rem
}
.pr-700 {
padding-right:1.95rem
}
.pr-800 {
padding-right:2.44rem
}
.pr-900 {
padding-right:3.05rem
}
.pr-1000 {
padding-right:3.81rem
}
.pr-1100 {
padding-right:4.76rem
}
.text-300 {
font-size:.8rem
}
.text-400 {
font-size:1rem
}
.text-500 {
font-size:1.25rem
}
.text-600 {
font-size:1.56rem
}
.text-700 {
font-size:1.95rem
}
.text-800 {
font-size:2.44rem
}
.text-900 {
font-size:3.05rem
}
.text-1000 {
font-size:3.81rem
}
.text-1100 {
font-size:4.76rem
}
.leading-tight {
line-height:1.1
}
.leading-normal {
line-height:1.6
}
.leading-loose {
line-height:2
}
.weight-thin {
font-weight:300
}
.weight-regular {
font-weight:400
}
.weight-bold {
font-weight:700
}
.width-full {
width:100%
}
.width-screen {
width:100vw
}
.width-half {
width:50%
}
.width-quarter {
width:25%
}
.width-third {
width:33.3333333333%
}
.height-full {
height:100%
}
.height-screen {
height:100vh
}
.length-compact {
max-width:25ch
}
.length-optimal {
max-width:75ch
}
.z-20 {
z-index:20
}
@media screen and (min-width:22.5em) {
.mobileL\:box-block {
display:block
}
.mobileL\:box-inline-block {
display:inline-block
}
.mobileL\:box-flex {
display:flex
}
.mobileL\:box-grid {
display:grid
}
.mobileL\:box-hidden {
display:none
}
.mobileL\:width-full {
width:100%
}
.mobileL\:width-screen {
width:100vw
}
.mobileL\:width-half {
width:50%
}
.mobileL\:width-quarter {
width:25%
}
.mobileL\:width-third {
width:33.3333333333%
}
}
@media screen and (min-width:40em) {
.mobileXL\:box-block {
display:block
}
.mobileXL\:box-inline-block {
display:inline-block
}
.mobileXL\:box-flex {
display:flex
}
.mobileXL\:box-grid {
display:grid
}
.mobileXL\:box-hidden {
display:none
}
.mobileXL\:width-full {
width:100%
}
.mobileXL\:width-screen {
width:100vw
}
.mobileXL\:width-half {
width:50%
}
.mobileXL\:width-quarter {
width:25%
}
.mobileXL\:width-third {
width:33.3333333333%
}
}
@media screen and (min-width:48em) {
.tablet\:box-block {
display:block
}
.tablet\:box-inline-block {
display:inline-block
}
.tablet\:box-flex {
display:flex
}
.tablet\:box-grid {
display:grid
}
.tablet\:box-hidden {
display:none
}
.tablet\:width-full {
width:100%
}
.tablet\:width-screen {
width:100vw
}
.tablet\:width-half {
width:50%
}
.tablet\:width-quarter {
width:25%
}
.tablet\:width-third {
width:33.3333333333%
}
}
@media screen and (min-width:64em) {
.laptop\:box-block {
display:block
}
.laptop\:box-inline-block {
display:inline-block
}
.laptop\:box-flex {
display:flex
}
.laptop\:box-grid {
display:grid
}
.laptop\:box-hidden {
display:none
}
.laptop\:width-full {
width:100%
}
.laptop\:width-screen {
width:100vw
}
.laptop\:width-half {
width:50%
}
.laptop\:width-quarter {
width:25%
}
.laptop\:width-third {
width:33.3333333333%
}
}
@media screen and (min-width:80em) {
.desktop\:box-block {
display:block
}
.desktop\:box-inline-block {
display:inline-block
}
.desktop\:box-flex {
display:flex
}
.desktop\:box-grid {
display:grid
}
.desktop\:box-hidden {
display:none
}
.desktop\:width-full {
width:100%
}
.desktop\:width-screen {
width:100vw
}
.desktop\:width-half {
width:50%
}
.desktop\:width-quarter {
width:25%
}
.desktop\:width-third {
width:33.3333333333%
}
}
@media screen and (min-width:90em) {
.desktopL\:box-block {
display:block
}
.desktopL\:box-inline-block {
display:inline-block
}
.desktopL\:box-flex {
display:flex
}
.desktopL\:box-grid {
display:grid
}
.desktopL\:box-hidden {
display:none
}
.desktopL\:width-full {
width:100%
}
.desktopL\:width-screen {
width:100vw
}
.desktopL\:width-half {
width:50%
}
.desktopL\:width-quarter {
width:25%
}
.desktopL\:width-third {
width:33.3333333333%
}
}
@media screen and (min-width:120em) {
.desktopXL\:box-block {
display:block
}
.desktopXL\:box-inline-block {
display:inline-block
}
.desktopXL\:box-flex {
display:flex
}
.desktopXL\:box-grid {
display:grid
}
.desktopXL\:box-hidden {
display:none
}
.desktopXL\:width-full {
width:100%
}
.desktopXL\:width-screen {
width:100vw
}
.desktopXL\:width-half {
width:50%
}
.desktopXL\:width-quarter {
width:25%
}
.desktopXL\:width-third {
width:33.3333333333%
}
}
:root {
--max-width:80rem;
--gap:1.56rem;
--base-font-size:1rem;
--ratio:1.1;
--text-300:calc(var(--base-font-size)/var(--ratio)/var(--ratio));
--text-400:calc(var(--text-300)*var(--ratio));
--text-500:calc(var(--text-400)*var(--ratio)*var(--ratio));
--text-600:calc(var(--text-500)*var(--ratio));
--text-700:calc(var(--text-600)*var(--ratio));
--text-800:calc(var(--text-700)*var(--ratio));
--text-900:calc(var(--text-800)*var(--ratio));
--text-1000:calc(var(--text-900)*var(--ratio));
--text-1100:calc(var(--text-1000)*var(--ratio));
--border-radius:.25rem;
--border-size:.15rem;
--transition-duration:.25s;
--transition-timing:ease-out
}
@media (min-width:48em) {
:root {
--ratio:1.2
}
}
@media (min-width:64em) {
:root {
--ratio:1.25
}
}
.inner {
width:100%;
margin:0 auto;
max-width:var(--max-width);
padding-left:1.56rem;
padding-right:1.56rem
}
.flow>*+* {
margin-top:var(--gap)
}
@media (min-width:48em) {
.flow>*+* {
--gap:1.95rem
}
}
[data-src] {
opacity:0
}
.loaded {
opacity:1;
transition:opacity var(--transition-duration) var(--transition-timing)
}
.sr-only {
position:absolute;
width:1px;
height:1px;
padding:0;
margin:-1px;
overflow:hidden;
clip:rect(0,0,0,0);
white-space:nowrap;
border-width:0
}
*,
:after,
:before {
box-sizing:border-box
}
html {
min-height:100%;
scroll-behavior:smooth
}
body {
overflow-x:hidden;
text-rendering:optimizeLegibility;
-webkit-font-smoothing:antialiased
}
blockquote,
body,
dd,
dl,
figure,
h1,
h2,
h3,
h4,
ol,
p,
ul {
margin:0
}
img {
display:block;
max-width:100%;
height:auto
}
button,
input,
select,
textarea {
font:inherit
}
@media (prefers-reduced-motion:reduce) {
* {
-webkit-animation-duration:NaNs!important;
animation-duration:NaNs!important;
-webkit-animation-iteration-count:1!important;
animation-iteration-count:1!important;
transition-duration:NaNs!important;
scroll-behavior:auto!important
}
}
ol[class],
ul[class] {
list-style:none;
padding:0
}
body {
font-size:var(--text-500)
}
h1,
h2,
h3 {
line-height:1.1;
letter-spacing:-.01rem
}
h1 {
--gap:1.95rem;
font-size:var(--text-900);
margin:0 0 var(--gap)
}
h2 {
font-size:var(--text-800)
}
h3 {
font-size:var(--text-700)
}
.content {
word-wrap:break-word
}
.sub-heading {
font-size:var(--text-700);
line-height:1.5
}
a {
text-decoration: none;
color: #fe6431;
transition:color var(--transition-duration) var(--transition-timing)
}
a:hover{
text-decoration: none;
color: #240d09;
}
a:not([class]) {
color:#F3F6FB;
padding-bottom:.1rem;
-webkit-text-decoration-skip:ink;
text-decoration-skip-ink:auto
}
a:not([class]):hover {
color: #240d09;
}
:focus {
outline:1px solid #24e0d0;
outline-offset:.25rem
}
.wrapper {
min-height:100vh;
flex-direction:column;
background-attachment:fixed;
}
@media (min-width:40em) {
.wrapper {
padding-bottom:0
}
}
.logo {
--logo-size:1.25rem;
font-size:var(--logo-size);
margin:0 auto
}
@media (min-width:40em) {
.logo {
--logo-size:1.56rem;
margin:0 auto 0 0
}
}
@media (min-width:40em) {
.header-inner {
align-items:center;
justify-content:space-between;
}
}
.nav .link {
color: #240d09;
height:3.05rem;
line-height:3.05rem
}
.nav .link.active,
.nav .link:hover {
color: #fe6431;
}
.nav .link-button {
border-radius:var(--border-radius);
transition:background-color var(--transition-duration) var(--transition-timing)
}
.nav .link-button:hover {
background:#525252;
color: #fe6431;
}
.nav .link-calltoaction {
border-radius:var(--border-radius);
transition:background-color var(--transition-duration) var(--transition-timing)
}
.nav .link-calltoaction:hover {
background:#525252;
color: #F3F6FB;
}
.mobile-nav {
--transition-duration:.3s;
position:fixed;
top:0;
left:0;
overflow-y:auto;
transform:translate3d(-100%,0,0);
transition:transform var(--transition-duration) cubic-bezier(.77,0,.175,1);
transition-delay:.1s;
will-change:transform
}
.mobile-nav.menu-visible {
transform:translateZ(0)
}
.mobile-nav .link {
--gap:.25rem;
padding:var(--gap) 0
}
.mobile-nav .link.active,
.mobile-nav .link:hover {
color:#fe6431
}
.mobile-nav-toggle {
position:fixed;
bottom:0;
height:3.05rem;
align-items:center;
justify-content:center;
border:0;
outline:0
}
.mobile-nav-toggle .mobile-nav-icon {
flex-direction:column
}
.mobile-nav-toggle .icon-line {
--transition-duration:.2s;
--transition-timing:cubic-bezier(0,0,.2,1);
height:2px;
width:1.25rem;
transform-origin:7px 1px;
transition:transform var(--transition-duration) var(--transition-timing),opacity var(--transition-duration) var(--transition-timing)
}
.mobile-nav-toggle .icon-line:not(:last-child) {
margin-bottom:.25rem
}
.mobile-nav-toggle.expanded .icon-line {
margin:0
}
.mobile-nav-toggle.expanded .icon-line:first-child {
transform:rotate(45deg)
}
.mobile-nav-toggle.expanded .icon-line:nth-child(2) {
opacity:0
}
.mobile-nav-toggle.expanded .icon-line:last-child {
transform:rotate(-45deg)
}
.main {
flex-direction:column;
flex:1
}
.main:focus {
outline:0
}
.page-header {
--gap:2.44rem;
margin-bottom:var(--gap)
}
@media (min-width:48em) {
.page-header {
--gap:3.05rem
}
}
.footer-inner {
align-items:center;
justify-content:space-between
}
.button {
display:inline-block;
background-color:#fe6431;
border:0;
border-radius:var(--border-radius);
color:#525252;
padding:.8rem 1.25rem;
transition:background-color var(--transition-duration) var(--transition-timing);
font-weight:700
}
.button:hover {
background:#fe6431
}
.pagination {
--gap:3.81rem
}
.pagination .items {
justify-content:space-between;
padding:0
}
.input,
.textarea {
border:0;
border-radius:var(--border-radius);
padding:0 .5rem
}
.input {
height:2.44rem
}
.textarea {
height:4.76rem
}
.social-icons .icon-link:hover {
color:#fe6431
}
.social-icons .icon {
--social-icon-size:1.25rem;
width:var(--social-icon-size);
height:var(--social-icon-size)
}
*/

View File

@ -19,7 +19,7 @@
</p> </p>
</div> </div>
<div class="row-span-1 col-span-1"> <div class="row-span-1 col-span-1">
<img class="w-40" src="../assets/img/uoh-logo.png"/> <img class="w-40" src="../img/uoh-logo.png"/>
</div> </div>
</div> </div>
</div> </div>

View File

@ -1,6 +1,6 @@
<div class="container flex mx-auto h-24 mb-20 mt-2"> <div class="container flex mx-auto h-24 mb-20 mt-2">
<div class="flex-none"> <div class="flex-none">
<a href="/"><img src="/assets/img/logo.png" class="logo float-left w-64"></a> <a href="/"><img src="/img/logo.png" class="logo float-left w-64"></a>
</div> </div>
<div class="flex-1 flex justify-end"> <div class="flex-1 flex justify-end">

View File

@ -13,37 +13,37 @@ title: Alumni
<div class="container mx-auto h-full m-16 p-6 w-screen"> <div class="container mx-auto h-full m-16 p-6 w-screen">
<div class="grid grid-rows-1 grid-flow-col"> <div class="grid grid-rows-1 grid-flow-col">
<div class="row-span-1 col-start-1"> <div class="row-span-1 col-start-1">
<img class="rounded-sm w-48 items-center" src="/assets/img/epictek.jpg" /> <img class="rounded-sm w-48 items-center" src="/img/epictek.jpg" />
<h4 class="p-2 text-gray-400 font-medium leading-relaxed">epictek</h4> <h4 class="p-2 text-gray-400 font-medium leading-relaxed">epictek</h4>
</div> </div>
<div class="row-span-1 col-start-2"> <div class="row-span-1 col-start-2">
<img class="rounded-2xl w-48 items-center" src="/assets/img/logo.jpg" /> <img class="rounded-2xl w-48 items-center" src="/img/logo.jpg" />
<h4 class="p-2 text-gray-400 font-medium leading-relaxed">shinsters</h4> <h4 class="p-2 text-gray-400 font-medium leading-relaxed">shinsters</h4>
</div> </div>
<div class="row-span-1 col-start-3"> <div class="row-span-1 col-start-3">
<img class="rounded-2xl w-48 items-center" src="/assets/img/logo.jpg" /> <img class="rounded-2xl w-48 items-center" src="/img/logo.jpg" />
<h4 class="p-2 text-gray-400 font-medium leading-relaxed">sleepyxuras</h4> <h4 class="p-2 text-gray-400 font-medium leading-relaxed">sleepyxuras</h4>
</div> </div>
<div class="row-span-1 col-start-4"> <div class="row-span-1 col-start-4">
<img class="rounded-2xl w-48 items-center" src="/assets/img/closebracket.jpg" /> <img class="rounded-2xl w-48 items-center" src="/img/closebracket.jpg" />
<h4 class="p-2 text-gray-400 font-medium leading-relaxed">closebracket</h4> <h4 class="p-2 text-gray-400 font-medium leading-relaxed">closebracket</h4>
</div> </div>
</div> </div>
<div class="grid grid-rows-1 grid-flow-col"> <div class="grid grid-rows-1 grid-flow-col">
<div class="row-span-1 col-start-1"> <div class="row-span-1 col-start-1">
<img class="rounded-2xl w-48 items-center" src="/assets/img/logo.jpg" /> <img class="rounded-2xl w-48 items-center" src="/img/logo.jpg" />
<h4 class="p-2 text-gray-400 font-medium leading-relaxed">?????</h4> <h4 class="p-2 text-gray-400 font-medium leading-relaxed">?????</h4>
</div> </div>
<div class="row-span-1 col-start-2"> <div class="row-span-1 col-start-2">
<img class="rounded-2xl w-48 items-center" src="/assets/img/logo.jpg" /> <img class="rounded-2xl w-48 items-center" src="/img/logo.jpg" />
<h4 class="p-2 text-gray-400 font-medium leading-relaxed">?????</h4> <h4 class="p-2 text-gray-400 font-medium leading-relaxed">?????</h4>
</div> </div>
<div class="row-span-1 col-start-3"> <div class="row-span-1 col-start-3">
<img class="rounded-2xl w-48 items-center" src="/assets/img/logo.jpg" /> <img class="rounded-2xl w-48 items-center" src="/img/logo.jpg" />
<h4 class="p-2 text-gray-400 font-medium leading-relaxed">?????</h4> <h4 class="p-2 text-gray-400 font-medium leading-relaxed">?????</h4>
</div> </div>
<div class="row-span-1 col-start-4"> <div class="row-span-1 col-start-4">
<img class="rounded-2xl w-48 items-center" src="/assets/img/logo.jpg" /> <img class="rounded-2xl w-48 items-center" src="/img/logo.jpg" />
<h4 class="p-2 text-gray-400 font-medium leading-relaxed">?????</h4> <h4 class="p-2 text-gray-400 font-medium leading-relaxed">?????</h4>
</div> </div>
</div> </div>

BIN
internal/img/alumni-bg.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 71 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 145 KiB

BIN
internal/img/lab.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 375 KiB

BIN
internal/img/logo.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 31 KiB

BIN
internal/img/project-bg.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 50 KiB

BIN
internal/img/uoh-logo.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 21 KiB

View File

@ -3,95 +3,88 @@ layout: layouts/default
title: Freeside title: Freeside
--- ---
<section class="landing mx-auto container mx-auto h-full w-screen grid grid-rows-1 grid-flow-col gap-2">
<section class="landing mx-auto container mx-auto h-full w-screen grid grid-rows-1 grid-flow-col gap-2"> <div class="grid grid-cols-4 gap-4">
<div class="grid grid-cols-4 gap-4"> <div class="col-span-4 md:col-span-2">
<div class="col-span-4 md:col-span-2"> <h1 class="text-8xl font-bold overflow-ellipsis">Linux @ Hull.</h1>
<h1 class="text-8xl font-bold overflow-ellipsis">Linux @ Hull.</h1> <h5 class="tracking-wide leading-loose">Freeside is the student run and maintained linux cluster within
<h5 class="tracking-wide leading-loose">Freeside is the student run and maintained linux cluster within
the the
University Of Hull Computer Science Department providing Linux administration experience, mentoring University Of Hull Computer Science Department providing Linux administration experience, mentoring
and and
technical advice alongside other peer-led support. It is completely <b>free</b> to all students to technical advice alongside other peer-led support. It is completely <b>free</b> to all students to
join, join,
irrespective of degree pathway.</h5> irrespective of degree pathway.</h5>
</div>
<div class="col-span-4 md:col-span-2">
<img class="rounded pull-right shadow-2xl" src="/assets/img/lab.jpg" />
</div>
</div> </div>
</section> <div class="col-span-4 md:col-span-2">
<div class="container mx-auto h-full m-16 p-6 "> <img class="rounded-3xl pull-right shadow-2xl" src="/img/lab.jpg"/>
<div class="">
<div class="">
<h3>Connect with us</h3>
<ol class="flex gap-10 m-5">
<li><a class="" href="https://github.com/FreesideHull"><img height="64" width="64"
src="https://cdn.jsdelivr.net/npm/simple-icons@v5/icons/github.svg" /></a></li>
<li><a class="" href="https://gitlab.freeside.co.uk/"><img height="64" width="64"
src="https://cdn.jsdelivr.net/npm/simple-icons@v5/icons/gitlab.svg" /></a></li>
<li><a class="icon-link" href="https://discord.gg/qAZ8dAp"><img height="64" width="64"
src="https://cdn.jsdelivr.net/npm/simple-icons@v5/icons/discord.svg" /></a></li>
<li><a class="icon-link" href="http://forums.freeside.co.uk/"><img height="64" width="64"
src="https://cdn.jsdelivr.net/npm/simple-icons@v5/icons/discourse.svg" /></a></li>
<li><a class="icon-link" href="https://www.twitter.com/FreesideHull"><img height="64" width="64"
src="https://cdn.jsdelivr.net/npm/simple-icons@v5/icons/twitter.svg" /></a></li>
<li><a class="icon-link" href="https://www.facebook.com/FreesideHull"><img height="64" width="64"
src="https://cdn.jsdelivr.net/npm/simple-icons@v5/icons/facebook.svg" /></a></li>
</ol>
</div>
<div class=" inline-block" aria-label="Primary">
<button
class="btn-cta inline-block"><a
href="https://discord.gg/qAZ8dAp"> Join our Discord </a></button>
<button
class="bg-discord text-white btn-cta inline-block"><a
href="https://profiles.freeside.co.uk/join"> Create Freeside Account </a></button>
</div>
</div>
</div> </div>
</div> </div>
<div class="container mx-auto h-full grid grid-cols-1 md:grid-cols-3"> </section>
<div class="col-span-1"> <div class="container mx-auto h-full m-16 p-6 flex">
<div class="bg-alumni rounded-xl p-10 w-3/4"> <div class="flex-1">
<h2 class="text-gray text-bold">Alumni Network</h2> <h3>Connect with us</h3>
<p>Our community is made up of like-minded life-time members including many distinguished alumni <ol class="flex gap-10 m-5">
whom continue to support students.</p> <li>
<br> <a class="icon-link" href="https://github.com/freesidehull"><img height="64" width="64"
<div class=" box-hidden mobileXL:box-block"> src="https://cdn.jsdelivr.net/npm/simple-icons@v5/icons/github.svg"/></a>
</li>
<li>
<a class="icon-link" href="https://gitlab.freeside.co.uk/"><img height="64" width="64"
src="https://cdn.jsdelivr.net/npm/simple-icons@v5/icons/gitlab.svg"/></a>
</li>
<li>
<a class="icon-link" href="https://discord.gg/qaz8dap"><img height="64" width="64"
src="https://cdn.jsdelivr.net/npm/simple-icons@v5/icons/discord.svg"/></a>
</li>
<li>
<a class="icon-link" href="http://forums.freeside.co.uk/"><img height="64" width="64"
src="https://cdn.jsdelivr.net/npm/simple-icons@v5/icons/discourse.svg"/></a>
</li>
<li>
<a class="icon-link" href="https://www.twitter.com/freesidehull"><img height="64" width="64"
src="https://cdn.jsdelivr.net/npm/simple-icons@v5/icons/twitter.svg"/></a>
</li>
<li>
<a class="icon-link" href="https://www.facebook.com/freesidehull"><img height="64" width="64"
src="https://cdn.jsdelivr.net/npm/simple-icons@v5/icons/facebook.svg"/></a>
</li>
<button </ol>
class="btn-cta"><a
href="/alumnus"> View Alumni </a></button>
</div>
</div>
</div>
<div class="col-span-1">
<div class="rounded-xl bg-project p-10 w-3/4">
<h2 class="text-white text-bold">Hands-on Projects</h2>
<p class="text-white">Get involved with hands-on Linux administration or contribute to open-source
coding projects.</p>
<br>
<div class=" box-hidden mobileXL:box-block">
<button
class="btn-cta"><a
href="https://github.com/FreesideHull"> Get involved </a></button>
</div>
</div>
</div>
<div class="col-span-1">
<div class="rounded-xl bg-primary p-10 w-3/4">
<h2 class="text-gray text-bold">Free Resources</h2>
<p>Take your learning to the next level with our Free Student Resources List featuring over 130
contributions in multiple areas of Computer Science.</p>
<br>
<div class=" box-hidden mobileXL:box-block">
<button
class="btn-cta "><a
href="https://github.com/FreesideHull/StudentResources"> View List </a></button>
</div>
</div>
</div> </div>
</div> <div class="flex-0" aria-label="primary">
<button class="btn-cta inline-block">
<ahref="https://discord.gg/qaz8dap"> Join our Discord </a>
</button>
<button class="bg-discord text-white btn-cta inline-block">
<a href="https://profiles.freeside.co.uk/join"> Create Freeside Account </a>
</button>
</div>
</div>
</div>
<div class="container mx-auto h-full grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
<div class="col-span-1 bg-alumni rounded-xl p-10 ">
<h2 class="text-gray text-bold">Alumni Network</h2>
<p>Our community is made up of like-minded life-time members including many distinguished alumni
whom continue to support students.</p>
<br>
<button class="btn-cta">
<a href="/alumnus"> View Alumni </a>
</button>
</div>
<div class="col-span-1 rounded-xl bg-project p-10">
<h2 class="text-white text-bold">Hands-on Projects</h2>
<p class="text-white">Get involved with hands-on Linux administration or contribute to open-source coding projects.</p>
<br>
<button class="btn-cta">
<a href="https://github.com/freesidehull"> Get involved </a>
</button>
</div>
<div class="col-span-1 rounded-xl bg-primary p-10 w-3/4">
<h2 class="text-gray text-bold">Free Resources</h2>
<p>Take your learning to the next level with our Free Student Resources List featuring over 130 contributions in multiple areas of Computer Science.</p>
<br>
<button class="btn-cta ">
<a href="https://github.com/freesidehull/studentresources"> View List </a>
</button>
</div>
</div>

View File

@ -17,10 +17,11 @@
"devDependencies": { "devDependencies": {
"@11ty/eleventy": "^0.12.1", "@11ty/eleventy": "^0.12.1",
"@11ty/eleventy-img": "^0.9.0", "@11ty/eleventy-img": "^0.9.0",
"@types/simple-icons": "^5.8.0" "@types/simple-icons": "^5.8.0",
"cross-env": "^7.0.3"
}, },
"scripts": { "scripts": {
"tailwind:process": "npx postcss internal/_includes/css/tailwind.scss --o public/assets/css/main.css --watch", "tailwind:process": "cross-env TAILWIND_MODE=watch postcss css/tailwind.scss --o public/assets/css/main.css --watch",
"start": "concurrently \"npm run tailwind:process\" \"npm run serve\"", "start": "concurrently \"npm run tailwind:process\" \"npm run serve\"",
"serve": "npx eleventy --serve" "serve": "npx eleventy --serve"
} }