SciPost Code Repository

Skip to content
Snippets Groups Projects
Commit e932d1dd authored by Jorran de Wit's avatar Jorran de Wit
Browse files

Unify (button) styles over the platform

parent f8e0d539
No related branches found
No related tags found
No related merge requests found
...@@ -26,7 +26,7 @@ ...@@ -26,7 +26,7 @@
<h2 class="card-title">Search SciPost Commentaries:</h2> <h2 class="card-title">Search SciPost Commentaries:</h2>
<form action="{% url 'commentaries:commentaries' %}" class="small" method="get"> <form action="{% url 'commentaries:commentaries' %}" class="small" method="get">
{{ form|bootstrap:'4,8,sm' }} {{ form|bootstrap:'4,8,sm' }}
<input class="btn btn-sm btn-secondary" type="submit"/> <input class="btn btn-sm btn-secondary" type="submit" value="Search"/>
</form> </form>
</div> </div>
</div> </div>
......
...@@ -8,6 +8,11 @@ ...@@ -8,6 +8,11 @@
$base-border-radius: 2px; $base-border-radius: 2px;
$border-radius: 2px; $border-radius: 2px;
// Alert
//
$alert-padding-y: 0;
$alert-padding-x: 0.75rem;
// Grid // Grid
// //
$grid-gutter-width: 20px; $grid-gutter-width: 20px;
...@@ -69,6 +74,9 @@ $breadcrumb-divider-color: $scipost-orange; ...@@ -69,6 +74,9 @@ $breadcrumb-divider-color: $scipost-orange;
$input-btn-padding-x: .5rem; $input-btn-padding-x: .5rem;
$input-btn-padding-y: .25rem; $input-btn-padding-y: .25rem;
$input-btn-padding-y-sm: .15rem; $input-btn-padding-y-sm: .15rem;
$input-border-radius-sm: $base-border-radius;
$input-border-radius: $base-border-radius;
$input-border-radius-lg: $base-border-radius;
$btn-transition: none; $btn-transition: none;
$input-height: calc(1.5rem + 2px); $input-height: calc(1.5rem + 2px);
......
...@@ -4,6 +4,7 @@ ...@@ -4,6 +4,7 @@
position: relative; position: relative;
clear: both; clear: both;
float: left; float: left;
min-width: 20%;
form &, form &,
.form & { .form & {
...@@ -17,10 +18,12 @@ ...@@ -17,10 +18,12 @@
.alert-dismissable, // The misspelled .alert-dismissable was deprecated in 3.2.0. .alert-dismissable, // The misspelled .alert-dismissable was deprecated in 3.2.0.
.alert-dismissible { .alert-dismissible {
// Adjust close link position // Adjust close link position
.close { .close {
position: absolute; position: absolute;
top: 0; top: 0;
right: 0; right: 0;
} height: 100%;
cursor: pointer;
}
} }
...@@ -5,12 +5,30 @@ ...@@ -5,12 +5,30 @@
.btn { .btn {
cursor: pointer; cursor: pointer;
font-family: inherit; font-family: inherit;
&:focus,
&.focus {
box-shadow: 0 0 0 3px rgba(104, 133, 195, 0.3);
}
} }
.btn-secondary { .btn-secondary {
color: $scipost-darkblue; color: $scipost-darkblue;
background-color: $white; background-color: $white;
border-color: $gray-600; border-color: $gray-600;
&:hover,
&.hover {
color: $scipost-darkblue;
background-color: #ddd;
border-color: $gray-600;
}
&:active,
&.active {
background-color: #d4d4d4;
border-color: $gray-600;
}
} }
.category-group, .category-group,
......
...@@ -54,28 +54,27 @@ input[type="file"] { ...@@ -54,28 +54,27 @@ input[type="file"] {
.search-nav-form { .search-nav-form {
input { input {
// border-top-right-radius: 0;
// border-bottom-right-radius: 0;
margin-right: 0 !important; margin-right: 0 !important;
outline: 0;
line-height: 1.75;
}
input[name="q"] {
border-right: 0; border-right: 0;
// border-color: #ddd;
min-width: 200px; min-width: 200px;
border-radius: $base-border-radius 0 0 $base-border-radius;
} }
> * { input[type="submit"] {
border-color: #ddd !important; background: #f4f4f4;
outline: 0; border-radius: 0 $base-border-radius $base-border-radius 0;
line-height: 1.75;
&:hover { &:hover {
border-color: #ccc !important; background: #ddd;
} }
} }
button:hover {
background-color: #f0f0f0;
}
} }
// Formset // Formset
// //
.delete-form-group { .delete-form-group {
......
...@@ -53,14 +53,6 @@ ...@@ -53,14 +53,6 @@
display: flex !important; display: flex !important;
width: 100%; width: 100%;
} }
.form-inline {
min-width: 280px;
.form-control {
width: auto !important;
}
}
} }
.navbar-brand { .navbar-brand {
......
...@@ -50,8 +50,8 @@ ...@@ -50,8 +50,8 @@
</ul> </ul>
<form action="{% url 'scipost:search' %}" method="get" class="form-inline search-nav-form"> <form action="{% url 'scipost:search' %}" method="get" class="form-inline search-nav-form">
<input class="form-control mr-2 mb-0" id="id_q" maxlength="100" name="q" type="text" required="required" value="{{search_query}}"> <input class="form-control" id="id_q" maxlength="100" name="q" type="text" required="required" value="{{search_query}}">
<button class="btn btn-outline-secondary text-muted" type="submit">Search</button> <input class="btn btn-secondary" type="submit" value="Search">
</form> </form>
</div> </div>
</nav> </nav>
...@@ -58,7 +58,7 @@ $(document).ready(function(){ ...@@ -58,7 +58,7 @@ $(document).ready(function(){
<p> <p>
By clicking on Submit, you state that you have read and agree with the <a href="{% url 'journals:journals_terms_and_conditions' %}">SciPost Journals Terms and Conditions</a>, the <a href="{% url 'journals:journals_terms_and_conditions' %}#license_and_copyright_agreement">license and copyright agreement</a> and the <a href="{% url 'journals:journals_terms_and_conditions' %}#author_obligations">author obligations</a>. By clicking on Submit, you state that you have read and agree with the <a href="{% url 'journals:journals_terms_and_conditions' %}">SciPost Journals Terms and Conditions</a>, the <a href="{% url 'journals:journals_terms_and_conditions' %}#license_and_copyright_agreement">license and copyright agreement</a> and the <a href="{% url 'journals:journals_terms_and_conditions' %}#author_obligations">author obligations</a>.
</p> </p>
<input type="submit" class="btn btn-secondary" value="Submit manuscript"/> <input type="submit" class="btn btn-primary" value="Submit manuscript"/>
</form> </form>
{% endif %} {% endif %}
......
...@@ -26,7 +26,7 @@ ...@@ -26,7 +26,7 @@
<h2 class="card-title">Search SciPost Theses:</h2> <h2 class="card-title">Search SciPost Theses:</h2>
<form class="small" action="{% url 'theses:theses' %}" method="get"> <form class="small" action="{% url 'theses:theses' %}" method="get">
{{ form|bootstrap:'4,8,sm' }} {{ form|bootstrap:'4,8,sm' }}
<input class="btn btn-sm btn-secondary" type="submit" name="Submit" /> <input class="btn btn-sm btn-secondary" type="submit" value="Search" />
</form> </form>
</div> </div>
</div> </div>
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment