Skip to content
Extraits de code Groupes Projets
Vérifiée Valider 738c87ad rédigé par Sting's avatar Sting Validation de Kubat
Parcourir les fichiers

MISC: Moved styling to proper stylesheets

parent 0dd45af2
Aucune branche associée trouvée
Aucune étiquette associée trouvée
2 requêtes de fusion!3Dev kubat,!1Create basic lib
...@@ -4,27 +4,28 @@ ...@@ -4,27 +4,28 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Lektor App</title> <title>Lektor App</title>
<link rel="stylesheet" href="/bootstrap-4.5.2-dist/css/bootstrap.min.css" type="text/css"> <link rel="stylesheet" href="/bootstrap-4.5.2-dist/css/bootstrap.min.css" type="text/css">
<link rel="stylesheet" href="/css/public.css" type="text/css">
</head> </head>
<body style="overflow: hidden; height: 100vh;"> <body>
<div class="container-fluid" style="display: flex; flex-direction: column; height: 100%;"> <div id="mainFrame" class="container-fluid">
<div class="row" style="flex-grow: 1; min-height: 15vh;"> <div id="headerBar" class="row">
<div class="card text-center"> <div class="card text-center">
<h2> <h2>
Public interface Public interface
</h2> </h2>
</div> </div>
</div> </div>
<div class="row" style="flex-grow: 5; overflow: hidden; flex-basis: auto;"> <div id="panelWrapper" class="row">
<div class="col" style="overflow-y: scroll; height: 100%;"> <div id="mainList" class="col">
<% karas.forEach(function(kara){ %> <% karas.forEach(function(kara){ %>
<div class="card shadow" style="border-radius: 25px; margin-bottom: 10px; margin-top: 10px;"> <div class="card shadow karaCard" >
<div class="card-header" style="border-radius: 25px 25px 0 0;"> <div class="card-header karaCardHeader">
<h3> <h3>
<%- kara.source_name + " - " + kara.song_type + " - " + kara.song_name %> <%- kara.source_name + " - " + kara.song_type + " - " + kara.song_name %>
</h3> </h3>
</div> </div>
<div class="card-body"> <div class="card-body karaCardBody">
<h3> <h3>
<%- kara.author_name %><br/> <%- kara.author_name %><br/>
<%- kara.language %><br/> <%- kara.language %><br/>
......
...@@ -4,9 +4,11 @@ ...@@ -4,9 +4,11 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Lektor App</title> <title>Lektor App</title>
<!-- https://electronjs.org/docs/tutorial/security#csp-meta-tag --> <!-- https://electronjs.org/docs/tutorial/security#csp-meta-tag -->
<link rel="stylesheet" href="../style/bootstrap-4.5.2-dist/css/bootstrap.min.css">
<script src="../style/jquery/jquery-3.5.1.js"></script> <script src="../style/jquery/jquery-3.5.1.js"></script>
<script src="../style/bootstrap-4.5.2-dist/js/bootstrap.min.js"></script> <script src="../style/bootstrap-4.5.2-dist/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="../style/bootstrap-4.5.2-dist/css/bootstrap.min.css">
<link rel="stylesheet" href="../style/css/instance.css">
<script src="./main.js"></script> <script src="./main.js"></script>
<style> <style>
::-webkit-scrollbar { ::-webkit-scrollbar {
...@@ -14,27 +16,27 @@ ...@@ -14,27 +16,27 @@
} }
</style> </style>
</head> </head>
<body style="overflow: hidden; height: 100vh;"> <body>
<div class="container-fluid" style="height: 100%; display: flex; flex-direction: column; padding-bottom: 10px"> <div id="mainFrame" class="container-fluid">
<div class="row" style="flex-basis: auto; height: 150px;"> <div id="headerBar" class="row">
<div class="card" style="width: 100%;"> <div id="headerCard" class="card">
<div class="card-header text-center" style="-webkit-user-select: none; -webkit-app-region: drag;"> <div id="headerTitle" class="card-header text-center">
<h2 class="text-center"> <h2 class="text-center">
LektorApp Admin Interface LektorApp Admin Interface
</h2> </h2>
</div> </div>
<div class="card-body text-center"> <div id="headerBody" class="card-body text-center">
<button id="closeButton" type="button" class="btn btn-outline-primary"> <button id="closeButton" type="button" class="btn btn-outline-primary">
Quit LektorApp Quit LektorApp
</button> </button>
</div> </div>
</div> </div>
</div> </div>
<div class="row" style="width: 100%; margin-left: 0px; margin-right: 0px; flex-grow: 1; overflow: hidden; padding-top: 20px; padding-bottom: 20px;"> <div id="panelWrapper" class="row">
<div id="karaList" class="col" style="height: 100%; overflow-y: scroll;"> <div id="panelLeft" class="col panel">
</div> </div>
<div id="playingList" class="col" style="height: 100%; overflow-y: scroll;"> <div id="panelRight" class="col panel">
</div> </div>
</div> </div>
......
...@@ -20,6 +20,6 @@ function karaList(karas){ ...@@ -20,6 +20,6 @@ function karaList(karas){
} }
karaList += '<div class="card shadow" style="margin: 5px; border-radius: 10px; margin: 20px 0px 20px 0px;"><div class="card-body">' + kara.source_name + ' - ' + kara.song_name + '</div></div>'; karaList += '<div class="card shadow" style="margin: 5px; border-radius: 10px; margin: 20px 0px 20px 0px;"><div class="card-body">' + kara.source_name + ' - ' + kara.song_name + '</div></div>';
}); });
document.getElementById("karaList").innerHTML = karaList; document.getElementById("panelLeft").innerHTML = karaList;
document.getElementById("playingList").innerHTML = playingList; document.getElementById("panelRight").innerHTML = playingList;
} }
\ No newline at end of file
body{
overflow: hidden;
height: 100vh;
}
#mainFrame {
height: 100%;
display: flex;
flex-direction: column;
padding-bottom: 10px;
}
#headerBar{
flex-basis: auto;
height: 150px;
}
#headerCard{
width: 100%;
}
#headerTitle{
-webkit-user-select: none;
-webkit-app-region: drag;
}
#panelWrapper{
width: 100%;
margin-left: 0px;
margin-right: 0px;
flex-grow: 1;
overflow: hidden;
padding-top: 20px;
padding-bottom: 20px;
}
.panel{
height: 100%;
overflow-y: scroll;
}
body{
overflow: hidden;
height: 100vh;
}
#mainFrame{
display: flex;
flex-direction: column;
height: 100%;
}
#headerBar{
flex-grow: 1;
min-height: 15vh;
}
#panelWrapper{
flex-grow: 5;
overflow: hidden;
flex-basis: auto;
}
#mainList{
overflow-y: scroll;
height: 100%;
}
.karaCard{
border-radius: 25px;
margin-bottom: 10px;
margin-top: 10px;
}
.karaCardHeader{
border-radius: 25px 25px 0 0;
}
\ No newline at end of file
0% Chargement en cours ou .
You are about to add 0 people to the discussion. Proceed with caution.
Veuillez vous inscrire ou vous pour commenter