Skip to content

Commit 76db283

Browse files
author
Keith McDuffee
committed
Styling updates
1 parent 0fc7da4 commit 76db283

11 files changed

Lines changed: 423 additions & 76 deletions

File tree

‎404.html‎

Lines changed: 42 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -44,7 +44,8 @@
4444
<div class="container container--outer">
4545
<header class="header">
4646
<div class="container header__container">
47-
47+
<div class="header__top">
48+
4849
<div class="logo logo--mixed">
4950
<a class="logo__link" href="/" title="StackRef Whistle" rel="home">
5051
<div class="logo__item logo__imagebox">
@@ -55,9 +56,47 @@
5556
</div>
5657
</a>
5758
</div>
58-
<div class="divider"></div>
59+
60+
<div class="header__right">
61+
<div class="header__right-text">
62+
Try the StackRef beta for Free!
63+
</div>
64+
</div>
65+
66+
</div>
67+
68+
<nav class="menu">
69+
<button class="menu__btn" aria-haspopup="true" aria-expanded="false" tabindex="0">
70+
<span class="menu__btn-title" tabindex="-1">Menu</span>
71+
</button>
72+
<ul class="menu__list">
73+
<li class="menu__item">
74+
<a class="menu__link" href="https://stackref.com">
75+
76+
<span class="menu__text">StackRef Home</span>
77+
78+
</a>
79+
</li>
80+
<li class="menu__item">
81+
<a class="menu__link" href="https://beta.stackref.com">
82+
83+
<span class="menu__text">Free Beta</span>
84+
85+
</a>
86+
</li>
87+
<li class="menu__item">
88+
<a class="menu__link" href="https://docs.stackref.com">
89+
90+
<span class="menu__text">StackRef Docs</span>
91+
92+
</a>
93+
</li>
94+
</ul>
95+
</nav>
96+
5997
</div>
6098
</header>
99+
61100
<div class="wrapper flex">
62101
<div class="primary">
63102

@@ -165,5 +204,5 @@ <h4 class="widget-social__title widget__title">Social</h4>
165204
</footer>
166205
</div>
167206
<script async defer src="/js/menu.js"></script>
168-
<script src="/js/custom.js"></script></body>
207+
</body>
169208
</html>

‎categories/hackathons/index.html‎

Lines changed: 42 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -45,7 +45,8 @@
4545
<div class="container container--outer">
4646
<header class="header">
4747
<div class="container header__container">
48-
48+
<div class="header__top">
49+
4950
<div class="logo logo--mixed">
5051
<a class="logo__link" href="/" title="StackRef Whistle" rel="home">
5152
<div class="logo__item logo__imagebox">
@@ -56,9 +57,47 @@
5657
</div>
5758
</a>
5859
</div>
59-
<div class="divider"></div>
60+
61+
<div class="header__right">
62+
<div class="header__right-text">
63+
Try the StackRef beta for Free!
64+
</div>
65+
</div>
66+
67+
</div>
68+
69+
<nav class="menu">
70+
<button class="menu__btn" aria-haspopup="true" aria-expanded="false" tabindex="0">
71+
<span class="menu__btn-title" tabindex="-1">Menu</span>
72+
</button>
73+
<ul class="menu__list">
74+
<li class="menu__item">
75+
<a class="menu__link" href="https://stackref.com">
76+
77+
<span class="menu__text">StackRef Home</span>
78+
79+
</a>
80+
</li>
81+
<li class="menu__item">
82+
<a class="menu__link" href="https://beta.stackref.com">
83+
84+
<span class="menu__text">Free Beta</span>
85+
86+
</a>
87+
</li>
88+
<li class="menu__item">
89+
<a class="menu__link" href="https://docs.stackref.com">
90+
91+
<span class="menu__text">StackRef Docs</span>
92+
93+
</a>
94+
</li>
95+
</ul>
96+
</nav>
97+
6098
</div>
6199
</header>
100+
62101
<div class="wrapper flex">
63102
<div class="primary">
64103

@@ -192,5 +231,5 @@ <h4 class="widget-social__title widget__title">Social</h4>
192231
</footer>
193232
</div>
194233
<script async defer src="/js/menu.js"></script>
195-
<script src="/js/custom.js"></script></body>
234+
</body>
196235
</html>

‎categories/index.html‎

Lines changed: 42 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -45,7 +45,8 @@
4545
<div class="container container--outer">
4646
<header class="header">
4747
<div class="container header__container">
48-
48+
<div class="header__top">
49+
4950
<div class="logo logo--mixed">
5051
<a class="logo__link" href="/" title="StackRef Whistle" rel="home">
5152
<div class="logo__item logo__imagebox">
@@ -56,9 +57,47 @@
5657
</div>
5758
</a>
5859
</div>
59-
<div class="divider"></div>
60+
61+
<div class="header__right">
62+
<div class="header__right-text">
63+
Try the StackRef beta for Free!
64+
</div>
65+
</div>
66+
67+
</div>
68+
69+
<nav class="menu">
70+
<button class="menu__btn" aria-haspopup="true" aria-expanded="false" tabindex="0">
71+
<span class="menu__btn-title" tabindex="-1">Menu</span>
72+
</button>
73+
<ul class="menu__list">
74+
<li class="menu__item">
75+
<a class="menu__link" href="https://stackref.com">
76+
77+
<span class="menu__text">StackRef Home</span>
78+
79+
</a>
80+
</li>
81+
<li class="menu__item">
82+
<a class="menu__link" href="https://beta.stackref.com">
83+
84+
<span class="menu__text">Free Beta</span>
85+
86+
</a>
87+
</li>
88+
<li class="menu__item">
89+
<a class="menu__link" href="https://docs.stackref.com">
90+
91+
<span class="menu__text">StackRef Docs</span>
92+
93+
</a>
94+
</li>
95+
</ul>
96+
</nav>
97+
6098
</div>
6199
</header>
100+
62101
<div class="wrapper flex">
63102
<div class="primary">
64103

@@ -183,5 +222,5 @@ <h4 class="widget-social__title widget__title">Social</h4>
183222
</footer>
184223
</div>
185224
<script async defer src="/js/menu.js"></script>
186-
<script src="/js/custom.js"></script></body>
225+
</body>
187226
</html>

‎css/custom.css‎

Lines changed: 24 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -6,8 +6,13 @@ body {
66
background: #030A1E;
77
}
88

9-
.divider {
10-
background: #688eff;
9+
.header__top {
10+
display: flex;
11+
justify-content: space-between;
12+
}
13+
14+
.logo {
15+
display: inline-block;
1116
}
1217

1318
.logo__title {
@@ -18,27 +23,34 @@ body {
1823
color: #8FBDEF;
1924
}
2025

21-
.widget__link:hover {
26+
.header__right {
2227
background: #688eff;
28+
border: 5px solid #688eff;
29+
border-radius: 16px;
30+
display: inline-block;
31+
height: fit-content;
32+
width: fit-content;
33+
margin-top: 40px;
34+
align-self: center;
2335
}
2436

25-
.widget__title {
26-
border-bottom-color: #688eff;
27-
}
28-
29-
.widget-taglist__link:hover {
30-
background: #688eff;
37+
.header__right-text {
38+
display: flex;
3139
color: #ffffff;
40+
font-weight: bold;
41+
padding: 10px;
42+
text-align: center;
3243
}
3344

34-
.widget-social__link-icon {
35-
/*fill: #2d3541;*/
45+
@media screen and (max-width: 767px) {
46+
.header__right {
47+
display: none;
48+
}
3649
}
3750

3851
.btn {
3952
background: #030A1E;
4053
border-radius: 16px;
41-
/*color:#2d3541;*/
4254
}
4355

4456
.post__title a {
@@ -49,19 +61,3 @@ body {
4961
background: #ffffff;
5062
color: #688eff;
5163
}
52-
53-
.tags__badge {
54-
background: #688eff;
55-
}
56-
57-
.tags__item:hover {
58-
background: #ffffff;
59-
}
60-
61-
.tags__link:hover {
62-
background: #688eff;
63-
}
64-
65-
.meta a:hover {
66-
color: #688eff;
67-
}

0 commit comments

Comments
 (0)