diff --git a/content/assets/css/bootstrap.scss b/content/assets/css/bootstrap.scss index 361b2f4..804674c 100644 --- a/content/assets/css/bootstrap.scss +++ b/content/assets/css/bootstrap.scss @@ -5,3 +5,5 @@ is_dynamic: false --- @import "bootstrap/bootstrap"; +@import "extra"; + diff --git a/content/assets/css/extra.scss b/content/assets/css/extra.scss new file mode 100644 index 0000000..0d6bb1d --- /dev/null +++ b/content/assets/css/extra.scss @@ -0,0 +1,52 @@ +/* Style all font awesome icons */ +.fa { + padding: 20px; + font-size: 30px; + width: 50px; + text-align: center; + text-decoration: none; +} + +/* Add a hover effect if you want */ +.fa:hover { + opacity: 0.7; +} + +/* Set a specific color for each brand */ + +/* Facebook */ +.fa-facebook { + background: #3B5998; + color: white; +} + +/* Twitter */ +.fa-twitter { + background: #55ACEE; + color: white; +} + +/* g+ */ +.fa-google-plus { + background: #d34836; + color: white; +} + +/* yt */ +.fa-youtube { + background: #ff0000; + color: white; +} + +/* linkedin */ +.fa-linkedin { + background: #0077B5; + color: white; +} + +/* reddit */ +.fa-reddit { + background: #FF5700; + color: white; +} + diff --git a/content/index.erb b/content/index.erb index 4c02c59..e771682 100644 --- a/content/index.erb +++ b/content/index.erb @@ -2,6 +2,7 @@ title: CentOS Project is_hidden: true --- +<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"> <script type="text/javascript" > $(document).ready(function () { $('#divRss').FeedEk({ @@ -54,6 +55,18 @@ $(document).ready(function () { hosting a Dojo at <a href="https://blog.centos.org/2018/05/cern-dojo-october-19th-2018/">CERN, in Meyrin, Switzerland</a>. The CFP is now open. </p> + +<br /> +<br /> + +<!-- See extra.scss for supporting CSS --> + <a href="https://www.facebook.com/groups/centosproject/"><i class="fa fa-facebook"></i></a> + <a href="https://twitter.com/centosproject"><i class="fa fa-twitter"></i></a> + <a href="https://google.com/+CentOS"><i class="fa fa-google-plus"></i></a> + <a href="https://youtube.com/TheCentOSProject"><i class="fa fa-youtube"></i></a> + <a href="https://www.linkedin.com/groups/22405"><i class="fa fa-linkedin"></i></a> + <a href="https://www.reddit.com/r/CentOS/"><i class="fa fa-reddit"></i></a> + </div> </div> @@ -77,5 +90,8 @@ $(document).ready(function () { </div> <br /> <p><a href="/sponsors/">If you value our work, please consider becoming a sponsor!</a></p> + + + </div> </div>