Smoother responsive site stats page

This commit is contained in:
nottnottloop 2024-08-15 23:06:05 +01:00
parent 3d58817927
commit ebd37a3cb0
2 changed files with 58 additions and 9 deletions

View file

@ -1118,10 +1118,26 @@ a.tag:hover {
color: #999;
}
.interior .header-Outro .profile-info {
padding-left: 35px;
h2 {
padding-right: 10px;
}
.actions {
padding-bottom: 10px;
}
@media (max-device-width:480px), screen and (max-width:800px) {
margin-top: 70px;
text-align: center;
padding: 10px 0 15px 0;
h2 {
margin-top: 0;
}
.actions {
padding-bottom: 0;
}
}
}
.interior .header-Outro .actions {
@ -1134,34 +1150,67 @@ a.tag:hover {
}
}
.interior .header-Outro .col.col-50.signup-Area.site-display-preview-wrapper {
.interior .header-Outro {
@media (max-device-width:480px), screen and (max-width:800px) {
padding: 0 7%;
}
}
.signup-Area.site-display-preview-wrapper {
@media (max-device-width:480px), screen and (max-width:800px) {
padding: 0 5%;
}
}
.website-thumbnail-wrapper {
padding: 20px;
}
.interior .header-Outro .site-display-preview {
@media (max-device-width:480px), screen and (max-width:800px) {
margin: 0 auto 5px;
}
}
.interior .header-Outro .site-info-row {
.interior .header-Outro {
@media (max-device-width:480px), screen and (max-width:800px) {
padding: 20px 0%;
}
}
.site-profile-big-container {
padding-bottom: 0 !important;
}
.site-info-row {
display: flex;
padding: 20px 3% 20px 0;
padding-bottom: 0;
fieldset{
padding: 20px;
background: linear-gradient(to top, #394650 0%, 60%, hsl(206, 32%, 30%) 100%);
border-radius: 4px 4px 0 0;
box-shadow: 1px 2px 12px 2px rgba(0, 0, 0, 0.15);
-webkit-box-shadow: 1px 2px 12px 2px rgba(0, 0, 0, 0.15);
}
@media (max-device-width:480px), screen and (max-width:800px) {
padding: 20px 3% 0 3%;
display: block;
}
}
.interior .header-Outro .stats {
margin-bottom: 1.3em;
float: left;
width: 100%;
margin-top: 1.9em;
display: flex;
@media (max-device-width:480px), screen and (max-width:800px) {
text-align: center;
margin-top: 0.5em;
display: flex;
justify-content: center;
}
}

View file

@ -1,4 +1,4 @@
<div class="header-Outro with-site-image">
<div class="header-Outro with-site-image site-profile-big-container">
<% if flash.keys.length > 0 %>
<div class="row content">
<div class="alert txt-Center">
@ -9,14 +9,14 @@
</div>
<% end %>
<div class="row content site-info-row">
<div class="col col-50 signup-Area site-display-preview-wrapper large">
<div class="signup-Form site-display-preview">
<fieldset class="content">
<div class="signup-Area site-display-preview-wrapper">
<div class="site-display-preview">
<fieldset class="website-thumbnail-wrapper">
<a href="<%= site.uri %>" class="screenshot" style="background-image:url(<%= site.screenshot_url('index.html', '540x405') %>);"></a>
</fieldset>
</div>
</div>
<div class="col col-50 profile-info">
<div class="profile-info">
<h2 class="eps title-with-badge"><span><%= site.title %></span> <% if site.supporter? %><a href="/supporter" class="supporter-badge" title="Neocities Supporter"></a> <% end %></h2>
<p class="site-url"><a href="<%= site.uri %>"><%= site.host %></a></p>
<% follow_count = site.follows_dataset.count %>